12. Creación del boceto a lápiz de una web

<< 11. Generar los contenidos                            13. Creación de la plantilla en PSD >>

 

Ya tenemos la idea que hemos hecho en los guiones gráficos (Writemaps), tenemos el sitio y ahora tenemos que ordenar los elementos.

Es como si tuviéramos los planos, el solar y ahora buscamos los materiales de construcción (piedras, tejas, puertas…), aquí es donde se puede edificar un chalet (de piedra con ventanales forjados de hierro, con domótica y piscina), una casa de campo (con establos, árboles y huerto) o bien se puede hacer una cabaña de cartones. Ahora vamos a empezar a crear una web en Photoshop.

Para un diseño mas rápido y a la vez más fácil podría complementarse más adelante con Fireworks o directamente en Photoshop. Lo primero es dibujar en un papel la estructura de nuestra web. Utilizamos las pautas impresas adjuntas con estos apuntes para crear el boceto de nuestra página de inicio y del resto de páginas.

Dibujaremos un boceto como la muestra que es el que está basado el diseño que vamos a seguir durante el curso, también esta muestra nos va a servir como referencia a la hora de crear los sectores. Y más adelante para crear la plantilla de DW.

En la siguiente página tenemos una pauta basada en un documento de Photoshop de 1024 x 650 px con una cuadrícula de 25 px para hacer el boceto.

papel y web

papel y web

Crear las carpetas del curso

C: … / Cursos / Curso_Dreamweaver /  Curso_Final. Contiene los archivos finalizados que vamos a necesitar para completar las prácticas de curso.

C: … / Cursos / Curso_Dreamweaver /  Mi_Sitio. Es donde realizaremos las prácticas.

Si es necesario crea las carpetas que necesites. Es muy importante mantener la estructura de carpetas que recomendamos en estos apuntes, para seguir el curso sin perdidas de tiempo adicionales.

Envia un comentario

Debes ser Conectado Para publicar un comentario.