Diagramando con Grilla para monitores y celulares

11

Transcript of Diagramando con Grilla para monitores y celulares

Page 1: Diagramando con Grilla para monitores y celulares
Page 2: Diagramando con Grilla para monitores y celulares

TEMARIO• Medidas• Diagramar usando Grilla• Estilos de capa• Transformar• Máscara de capa• Ejercicio N°2

Miércoles 19Agosto

2

Page 3: Diagramando con Grilla para monitores y celulares

MEDIDAS

Page 4: Diagramando con Grilla para monitores y celulares
Page 5: Diagramando con Grilla para monitores y celulares

iPhone 4 (4, 4S) 640 x 960Samsung Galaxy S III 720 x 1280iPhone 5 640 x 1136BlackBerry Curve 9320 320 x 240Galaxy S4 1920 x 1080LG Optimus L9 540 x 960Samsung Galaxy Note II 720 x 1280Google Nexus 4 by LG 768 x 1280Galaxy Nexus 720 x 1280Google Nexus 5 1920 x 1080Samsung Galaxy Note III 1920 x 1080

Page 6: Diagramando con Grilla para monitores y celulares

¿QUÉ TIENEN EN COMÚN TODOS ESTOS

NÚMEROS?240 – 320 – 480 – 640 – 720 –

1920

Page 7: Diagramando con Grilla para monitores y celulares

DIAGRAMAR USANDO GRILLA

Page 8: Diagramando con Grilla para monitores y celulares
Page 9: Diagramando con Grilla para monitores y celulares

Las grillas o rejillas nos permiten comprender como integramos los

elementos y definirlos teniendo en cuenta todos los formatos en los cuales será vista la página web.

La otra opción es contar con diseños diferentes para

computadora, Tablet y celular.

DIAGRAMAR USANDOGRILLA

Page 10: Diagramando con Grilla para monitores y celulares

1. Finalizar el boceto del home y definir los elementos que va a tener.

2. Conseguir las imágenes necesarias para la web. (se deben considerar dos propuestas para el banner principal)

3. Definir los textos.4. Realizar el ejercicio de

práctica.

EJERCICIO N°2

Presentación: Sábado 22Formato: Digital

Page 11: Diagramando con Grilla para monitores y celulares