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).
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):
Crear un boceto de una página web con Pencil Prototype
https://youtu.be/avz6L9Glgdo
