TEMAS MES DE NOVIEMBRE

 TEMAS DE PRÁCTICA






"MockUp 1 - Desktop-First"


Descripción: Este es el primer taller que hicimos de Responsive Web Design, se trató de un Mockup bastante sencillo ya que había poco texto (solo en el menú de navegación y un párrafo), el resto consto de solo imágenes. Este taller se hizo de dos maneras, primero la Desktop y luego la Mobile. 



Al tener casi en su totalidad solo imágenes, fue bastante fácil hacer este taller. Solo era saber organizar las imágenes y solo había una pantalla donde se veía un cambio, la más pequeña.





"MockUp 1 - Mobile-First"


Descripción: Como dije anteriormente, la única pantalla donde se veía un cambio significativo era en la más pequeña, ya que como se puede ver en la imagen de desktop, las imágenes van divididas en bloques y organizadas en fila, pero en la más pequeña todo pasa a estar en columna, es decir, las imágenes debajo de otras. Lo cual fue de hecho bastante fácil ya que lo pude ordenar con una sola etiqueta. Obviamente al ser Mobile-First tuve que reorganizar todo el código para que la pantalla pequeña sea ahora la principal.




Con este taller se terminó lo que se tenia que hacer con el MockUp, este taller fue mas que nada para practicar con los media queries, ya que se nos dio desde un principio todo como por ejemplo el diseño o que cada sección en realidad es una imagen. Pero con el siguiente pusimos en practica todo lo aprendido.




"MockUp 2 - Desktop-First"


Descripción: Para este taller se nos dio otro Mockup pero a la vez se nos dio mas complejidad y mas creatividad, podríamos modificar la temática del Mockup (aunque no los colores) pero también ya las secciones las teníamos que hacer nosotros. Así que decidí hacerla de Subway ya que como los colores eran verdes y grises quedaba bastante bien.




Aunque otras ventajas es que casi no había imágenes y que pudimos escoger las 3 resoluciones que quisiéramos. Si es cierto que fue un poco más complicado que el anterior pero fue divertido poder tener más libertad creativa.





"MockUp 2 - Mobile-First"

Descripción: En este mockup se hizo prácticamente lo mismo que con el anterior, pasarlo de desktop a mobile. Y en mi opinión fue mucho más fácil puesto que lo organice mejor y eso me facilito a simplemente reorganizarlo todo. 


Nuevamente fue cuestión de poner en la pantalla más pequeña todo en columna y guala, todo se quedo en su sitio. Con este taller vimos lo 90% básico que se debería saber sobre el diseño responsive, pero falta un detallito. El menú de navegación.

Comentarios

Entradas más populares de este blog

TEMAS MES DE OCTUBRE

TEMA DE DICIEMBRE