Hoy vamos a adaptar los elementos de nuestro wireframe al último salto de pantalla que nos queda: el dispositivo móvil con 689px de ancho.
Recordemos que no es una medida dogmática, sino una referencia que podéis definir un poco más estrecha si lo consideráis. Nuestro diseño, a partir de este salto para abajo, se verá del modo que lo empecemos a definir ahora.
Escalaremos algunos elementos y aquí sí, el menú pasará a ser hamburguesa. La visualización de menú cuando lo despleguemos lo definiremos en la última clase.
Ya hemos visto la importancia de como algunas composiciones de dos columnas pasan a ser de una, como la cabecera de nuestra web y como la estructura de tres columnas no se podía mantener y hemos tenido que colocar un elemento debajo del otro como es el caso del pricing.
Así pues, ya tenemos nuestra web esquematizada con nuestro wireframe, ahora vamos a hacer realidad esta estructura con el diseño real donde tomaremos las decisiones finales que podrán alterar e incluso contradecir nuestro wireframe, recordemos que este debe estar a nuestro servicio y al del diseño, y no al revés. ¡Vamos a ello!
Como siempre, si tenéis cualquier duda o pregunta, podéis mandarla a través del formulario de soporte. ¡Nos vemos en la siguiente lección! :)
Todos los capítulos de este curso:
- Curso de diseño responsive #1. Introducción
- Curso de diseño responsive #2. Tips de diseño responsive
- Curso de diseño responsive #3. Mesas de trabajo y guías
- Curso de diseño responsive #4.Wireframe web de escritorio
- Curso de diseño responsive #5.Wireframe Web Tablet
- Curso de diseño responsive #6. Wireframe Web Móvil
- Curso de diseño responsive #7. Diseño Web de Escritorio
- Curso de diseño responsive #8. Adaptación Tablet
- Curso de diseño responsive #9. Adaptación móvil
- Curso de diseño responsive #10. Repaso final y menús