Diseño de Botones Durante los Años: La Línea de Tiempo de Dribbble

View all articles

Botones. Con ellos, finalizamos las compras en Internet, iniciamos sesión en nuestra aplicación bancaria y enviamos formularios completos con nuestra información más personal. El diseño web está creciendo a un ritmo increíble, y los estilos parecen cambiar de un mes a otro. En solo unos años, hemos pasado de los enlaces de texto al esqueuomorfismo a un diseño plano. La navegación es uno de los elementos más importantes del diseño web, y el botón de llamada a la acción (o call to action) es su herramienta más sólida.

En este artículo, rastrearé ocho años de historial de diseño de botones web basado en Dribbble.

La Línea de Tiempo de Botones en Dribbble

En 2009, se creó Dribbble: una plataforma para diseñadores de todo el mundo que compartió pequeñas piezas de sus proyectos actuales. Usando Dribbble, podemos seguir la historia de las tendencias y el diseño de los botones en los últimos ocho años. He pasado por algunos miles de disparos de Dribbble para crear una línea de tiempo interactiva de estilos de botones:

Haz clic en el botón de arriba para navegar por la línea de tiempo de Dribbble.

2009

En este año, Internet cumple 40 años, y los primeros “disparos” aparecen en Dribbble. El diseño de los botones está dominado por la escala de grises. Los degradados delicados, las esquinas redondeadas y las sombras aparecen en casi todos los diseños de los botones. Esta estética se refiere a los botones del sistema nativo.

Diseño de botones del 2009

Wojciech Dobry,  Dan Cederholm, Josh Bryant, Dribbble, Sarah Parmenter, Matthew Smith

2010

El año en que se crea Instagram. La forma de los botones no cambia drásticamente, pero hay muchos más colores, más detalles (como sombras interiores) y muchas más tipografías decorativas.

Diseño de botones del 2010

Wojciech Dobry, Morgan Allan Knutson, Troy Bergland, Claudiu Cioba, Liam McKay, Jared Christensen

2011

CSS3 estrena ese año, y el número de usuarios de Internet crece a mil millones. El esquemorfismo todavía reina, y muchos diseñadores están desarrollando este estilo de una manera muy creativa. No puede encontrar ninguna regla para aplicar sombras o iluminación aquí, pero puede estar seguro de que todos estos elementos están presentes en cada proyecto.

Diseño de botones del 2011

Wojciech Dobry, Julien Renvoye, Claudiu Cioba, Meagan Fisher, Josh Hemsley,Jonathan Moreira

2012

El declive y la forma final de esquemorfismo, y el comienzo tímido del diseño plano. Este año es, con diferencia, la forma más desarrollada de skeuomorphism, donde algunos diseñadores han alcanzado el nivel maestro en este estilo, mientras que otros han comenzado a buscar algo nuevo.

Diseño de botones del 2012

Wojciech Dobry, Eduardo Santos, Mike | Creative Mints, Maykel Loomans, Ian Collins,Dawid Liberadzki

2013

En este año, Apple definitivamente se mueve desde el esquemorfismo, lanzando iOS7. Sin dudas, este año es el comienzo de la tendencia que continúa hoy — el diseño plano. Casi todos los diseñadores de Dribbble, en un momento, abandonan cualquier intento de dar una tercera dimensión a su aplicación o botones web y deciden desaparecer.

Diseño de botones del 2013

Wojciech Dobry, Cosmin Capitanu, Eddie Lobanovskiy, Jonathan Moreira, Riki Tanone

2014

Google lanza Material Design. Sin embargo, muchos diseñadores no siguen este estilo por completo. Este es un año bastante interesante, porque de repente todo el mundo comienza a usar el estilo del botón fantasma o botones planos. Aparecen en la mayoría de los disparos en Dribbble. Dos fronteras Pixel con colores vibrantes — eso es 2014.

Diseño de botones del 2014

Wojciech Dobry, Eric Hoffman, Ramil Derogongun,Mason Yarnell, Colin Garven, Bill S Kenney

2015

Solo unos meses después de escuchar el anuncio de Material Design por Google, los diseñadores UI se enamoran de esta guía. La superficie plana del botón con una sombra delicada debajo indica el impacto significativo de Material Design en las tendencias actuales. Mira cuántas personas aplican este estilo a sus proyectos.

Diseño de botones del 2015

Wojciech Dobry, Victor Erixon, Leo Leung, George Vasyagin, Hoang Nguyen, Joshua Krohn

2016

Los diseñadores se aburren, por lo que nuevos elementos para mezclar con Material y Diseño Plano. Los gradientes aparecen en la superficie de los botones, no para enfatizar la tercera dimensión sino para enfatizar el material del botón en sí. El botón gana sombras de color y comienza a brillar.

Diseño de botones del 2016

Wojciech Dobry, Anastasiia Andriichuk, Gleb Kuznetsov✈, Ghani Pradita, Kristofor, Ben Mingo

2017

Tengo mucha curiosidad de cómo veré este año en otros ocho años. En lo que va de año es, por un lado, un año de minimalismo y diseño plano. Por otro lado, todavía estamos buscando nuevas formas. Estamos en una etapa en la que no somos tecnológicamente limitados; estamos limitados sólo por los marcos de tendencias y moda.

Diseño de botones del 2017

Ben Cline, Anton Aheichanka, Vera Voishvilo , George Vasyagin, Ghani Pradita

¿Qué sigue?

¿Cuánto tiempo seguirán evolucionando los estilos de los botones? No lo sé. Solo sé que lo harán. Los motivos de la evolución pueden variar: el cambio tecnológico, la creciente conciencia del diseñador, el aburrimiento.

No se puede negar que los botones están esperando otro cambio. ¿Tal vez este cambio será su muerte? Con gestos, interacciones intuitivas, AR, VR e interfaces de sonido, ¿aún necesitaremos los botones en los que hemos trabajado durante años?

About the author

Wojciech Dobry, Poland
member since November 1, 2016
Wojciech is a product designer with 6 years of professional experience in the design field. He's educated as an architect-engineer. Wojciech is responsible and has worked on web product design through information architecture to the user interface all the while keeping mindful of business goals. [click to continue...]
Hiring? Meet the Top 10 Freelance UI Designers for Hire in November 2017

Comments

comments powered by Disqus
Subscribe
Free email updates
Get the latest content first.
No spam. Just great design posts.
Free email updates
Get the latest content first.
Thank you for subscribing!
Check your inbox to confirm subscription. You'll start receiving posts after you confirm.
Trending articles
Relevant Technologies
About the author
Wojciech Dobry
Designer
Wojciech is a product designer with 6 years of professional experience in the design field. He's educated as an architect-engineer. Wojciech is responsible and has worked on web product design through information architecture to the user interface all the while keeping mindful of business goals.