Actividad en Pencil prototype

Pencyl Prototype o Pencil Project es un software libre para crear prototipos visuales o wireframes de un proyecto, por ejemplo: una páginas web o una interfaz de usuario para aplicaciones.

Práctica 1 con la herramienta

Descargue de aquí el diseño básico que se va a trabajar.
Descargue de aquí las imágenes que necesitará y que debe instalar más adelante en la aplicación. Que las imágenes queden en una carpeta llamada Redes sociales.
Su trabajo debe quedar lo más parecido posible a la imagen que se les entregó. Si no alcanza a ver que dicen los textos, porque no están claros, digite unos similares y acordes (por favor, sin errores de ortografía y gramática).

• Comience guardando el documento para asignarle nombre y observe donde quedará ubicado ese nombre (Ctrl + S o desde el ícono del menú elegir Guardar)
• Asigne el fondo gris del diseño al documento en blanco en Pencil. Esto se hace en Propiedades, y de una vez puede darle el nombre a esa página. Asignemos como nombre index (clic derecho sobre Página sin título, abajo en la barra de estado y elija Propiedades). Cambie el nombre por Index y elija Fondo de color, para luego asignar un gris.
• Arrastre rectángulos y vaya conformando la estructura haciendo los cambios de color correspondientes (con la figura seleccionada, de clic en Propiedades para hacer los cambios de color en relleno y contorno). De igual forma trabaja con la herramienta de texto plano para el contenido.
• Para las imágenes es necesario crear una nueva colección de imágenes con las que necesitemos.

Cómo crear una nueva categoría de imágenes

• Primero se buscan las imágenes, para crear la colección e instalarla en el programa
• Las imágenes deben buscarse de acuerdo con las necesidades, lo más recomendable en este caso es que sean de 128 x 128.
• Se crea una carpeta con los iconos.
• Vamos a Pencil, menú Tool > Developer Tools > Stencil Generator…
• En la ventana que se abre se arrastran las imágenes seleccionadas de la carpeta al cuadro Select images, le damos un nombre a la colección, por ejemplo, Iconos Práctica 1 y se continúa; vuelve a pedir un nombre, se le da el mismo y clic en Finalizar. Ahora pide guardar un comprimido al cual le damos el mismo nombre y una buena ubicación. Yo aconsejo en la carpeta de Pencil.
• Ahora Menú > Tools > Manage Collections > Install from file… y damos la ruta del comprimido creado
• Cuando termine su diseño exporte a PNG y a PDF y envíe por correo.

Para: sistemasjdsm@gmail.com

Asunto: Práctica 1 con Pencil

Adjuntar los 2 archivos (.png y .pdf)

Fuentes de consulta:

Sitio web de descarga Versión 3.0.4 (a 20 de mayo):

http://pencil.evolus.vn/

Crear un boceto de una página web con Pencil Prototype

https://youtu.be/avz6L9Glgdo

Conceptos importantes en el diseño y estructura de una página web

Actividad de consulta

- Opciones efectivas de estructura y composición de una página web. ¿Cómo se recomienda estructurar una página web?

- ¿Qué características recomendables deben tener cada uno de los elementos que puede contener una página web?

- Analizar el significado de términos como: layout, sketch, mockups, wireframes, prototipos.

- Boceto a lápiz y en el cuaderno de su propuesta sobre el proyecto digital que se quiere crear, en este primer caso: la página web empresarial (utilice internet para ver ejemplos de páginas web relacionadas con su temática):

·         Donde pondremos los elementos más característicos como logos, nombre de la empresa, etc.

·         Dónde estará la zona de menús o de navegación y qué otras barras o zonas se tendrán

·         Cómo y dónde irá el contenido principal y otro tipo de contenidos

·         Dónde irá la zona para acceso o uso de las redes sociales

·         Qué otros servicios se quieren presentar en el proyecto

·         Qué irá en el pie de página

Fuente recomendada:

Artículo: Elementos que componen un sitio web

https://www.gradiweb.com/elementos-que-componen-la-estructura-de-un-sitio-web/

Trabajo Portafolio Producción en aplicativos multimedia

Descargar la guía del SENA dando clic Aquí.

Portada
Tema 1 - Diseño Multimedial - Glosario de términos
Tema 2 - Elementos del Diseño - Word carta (trabajo realizado en el primer período) y bocetos
Tema 3 - Tipos de fuentes y familias tipográficas - Creación de abecedario con fuente propia e Infografía sobre el tema (cada uno en hoja tamaño carta)
Tema 4 - Círculo cromático - Diseño propio donde se expliquen los colores primarios, secundarios, fríos, cálidos, adyacentes y complementarios (hojas tamaño carta)
Tema 5 - Espacios de la multimedia en la nube
Tema 6 - Imagen corporativa de una empresa: boceto del logotipo, imago tipo, iso tipo e iso logo (hoja tamaño carta con los diseños respectivos), membrete (hoja tamaño carta con encabezado y pie de página empresarial, tarjeta personal (hoja tamaño carta con diseño de impresión) y sobre.