Diseño de home page e-commerce de venta de bicicletas. 
Últimamente he estado aprendiendo los conceptos básicos de diseño web, y la herramienta Webflow me ha permitido diseñar una página sin conocimientos de código. 
Es una herramienta muy intuitiva y con una curva de aprendizaje bastante rápida. Resulta útil para la construcción visual de webs, permite llevar tus ideas de diseño a la realidad de una Web en formato responsive y genera el código automáticamente. Me parece que es una gran herramienta, con una curva de aprendizaje bastante rápida.
Mi primer diseño Web HTML + CSS + JS #nocode
Corría el año 2003 cuando diseñé mi última página Web, con DreamWeaver. Últimamente he estado recordando los conceptos básicos de diseño web, y la herramienta Webflow me ha permitido diseñar una página sin necesitar muchos conocimientos de código.
He surfeado entre la curiosidad, el aprendizaje por descubrimiento, un curso de iniciación a Webflow de coronel.design y los tutoriales de la propia herramienta llamada WebFlow University. Ahí empieza todo, con tutoriales de 5 minutos fáciles de encontrar y siempre a punto.
WebFlow es una herramienta muy intuitiva y útil para la construcción visual de webs, que permite llevar tus ideas de diseño a la realidad de una Web en formato responsive y genera el código automáticamente. Me parece que es una gran herramienta, con una curva de aprendizaje bastante rápida.


From scratch to Web
Este proyecto surge de la conveniencia de generar una web acorde con la App que diseñé en el mes de julio, Bikey App, para un e-commerce de venta de bicicletas, componentes y accesorios para la bici y el ciclista. De la necesidad de plantearme retos de diseño y seguir aprendiendo a hacer cosas por primera vez.
Inicialmente, diseñé una Home Page rápida en papel, muy básica.
Estructuré toda la información que quería incluir (arquitectura de información) y en sucesivas iteraciones añadí contenido a las secciones de la página y a los menús. Hice hasta un pequeño card sorting para ver cómo organizaba los menús, y decidir también el naming de cada elemento de navegación.
Estructuré a continuación la distribución de los elementos en la página, y posteriormente realicé mi primer boceto visual con Sketch.

Back to Top