Si está empezando a crear su propio sistema de diseño, un poco de inspiración visual puede ser de gran ayuda, así que te invito a quedarte y ver el siguiente video.
Es por eso que en este post, hemos reunido los 10 mejores sistemas de diseño de marcas de fama mundial.
Definición ¿Qué es un sistema de diseño?
Un sistema de diseño ayuda a todos en su negocio a mantener la consistencia de la marca.
Es una colección de pautas que explican cómo deben utilizarse los activos de su marca en la comunicación diaria y en los esfuerzos de marketing.
Cómo crear un sistema de diseño web
Un sistema de diseño generalmente consiste en directrices generales de marca, uso de color, tono de marca y voz, tipografía, patrones y cualquier otro elemento visual que ayude a transmitir los principios de su marca.
Ejemplos de sistemas de diseño web
Utilícelos como inspiración y como material de aprendizaje para ayudarle a crear un sistema de diseño cohesivo para su propio negocio y marca.
01. Material Design system
Material es un moderno sistema de diseño desarrollado por Google.
El sistema de diseño en sí mismo es un tesoro de guías útiles y herramientas útiles que pueden ser utilizadas por los desarrolladores de aplicaciones para diseñar una aplicación que se adhiera al estilo Material, así como cualquier otra persona que quiera crear un diseño moderno y de moda.
Encontrará un selector de paleta de colores, pautas de tipografía, mejores prácticas de diseño de iconos, la capacidad de crear un tema de material oscuro y mucho más.
02. Fluent design system
El sistema de diseño Fluent fue desarrollado por Microsoft y su objetivo es crear simplicidad y coherencia a través de sistemas de
diseño abierto desarrollados para todas las plataformas.
Se centra en unir los fundamentos del diseño basado en principios, la innovación tecnológica y las necesidades de los clientes.
El sistema se basa en cinco componentes clave: luz, profundidad, movimiento, material y escala.
También presenta directrices para el desarrollo de aplicaciones para dispositivos Windows, Android e iOS.
https://www.microsoft.com/design/fluent/#/
03. Shopify Polaris design system
Shopify Polaris fue desarrollado para que todos los comerciantes de Shopify pudieran disfrutar de una gran experiencia y beneficiarse de un hermoso diseño de tienda.
Este sistema de diseño tiene directrices para crear cada parte de la experiencia Shopify; desde las pantallas de administración hasta la experiencia del producto y varias aplicaciones para Shopify.
Cubre el contenido, los componentes, el diseño y las pautas de los patrones.
También encontrará enlaces útiles a herramientas de terceros que pueden servirle de inspiración o ayudarle a aprender a diseñar eficazmente para Shopify.
04. Mailchimp design system
Mailchimp siempre es citado como uno de los mejores ejemplos para una detallada guía de voz y tono de marca de la compañía, pero también tienen un sistema de diseño bastante completo que se centra en una biblioteca de patrones.
Usted puede encontrar pautas detalladas para los colores, botones, mensajes de alerta, y todos los demás aspectos de su plataforma de marketing.
Además, las directrices tienen muchos ejemplos y explicaciones que desglosan los conceptos más importantes.
https://ux.mailchimp.com/patterns/color
05. Atlassian design system
Atlassian es una compañía de software australiana mejor conocida por su aplicación de seguimiento de problemas, Jira.
Su sistema de diseño no sólo describe cómo utilizar su logotipo, los colores de su marca, las fuentes y otros elementos de diseño, sino que también deja que su personalidad de marca brille a través de ellos.
Con nombres de colores como Dragon’s Blood y Herky Jerky, es fácil ver por qué describen su estilo como audaz, optimista y práctico con un guiño.
06. Apple design system
El sistema de diseño de Apple está pensado para facilitar el diseño de aplicaciones y el conjunto de productos de Apple, pero hay mucho que aprender y admirar en su guía de estilo.
Para empezar, puedes descargar los iconos SF que complementan la fuente del sistema para los dispositivos de Apple.
También encontrará directrices e instrucciones para el diseño de UX, para hacer más accesibles las aplicaciones y los accesorios.
https://developer.apple.com/design/
07. IBM Design Language
El principio rector del sistema de diseño de IBM es la creación de bonos.
Su sistema de diseño va más allá de documentar sus directrices de estilo y el uso de los activos de la marca; también comparten su filosofía, así como una galería llena de ejemplos de su sistema de diseño en acción.
El sistema de diseño en sí mismo cubre colores, tipografía, logotipos, iconos, pictogramas, fotografía y movimiento.
https://www.ibm.com/design/language/
08. AirBnB design system
AirBnB comparte una visión global de su sistema de diseño a través de una serie de artículos que profundizan en las decisiones que hay detrás de cada elección de diseño, así como ejemplos prácticos de aplicación y lecciones aprendidas de ello.
La característica principal de su lenguaje de diseño es que cada componente puede vivir por sí solo como una entidad separada e incluso evolucionar más, a la vez que forma parte de una unidad cohesiva más grande, comparando su sistema de diseño con un organismo vivo y respiratorio.
https://airbnb.design/building-a-visual-language/
09. Uber design system
Uber describe su marca como una marca nueva y audaz, y su sistema de diseño hace un excelente trabajo al retratar esos principios.
El sistema de diseño cubre la totalidad de los visuales de su marca, desde el uso del logotipo hasta el color, la composición e incluso la fotografía y el movimiento.
El sistema de diseño de Uber gira en torno a la elegante simplicidad y la sutil recreación de la famosa U siempre que sea posible.
10. Lightning Design System
Por último, Salesforce desarrolló el Lightning Design System como una forma de mantener todo unificado y de fácil acceso para cualquiera que diseñe para la plataforma.
En lugar de centrarse en los píxeles, el sistema de diseño se centra en la lógica de la aplicación, la experiencia del usuario, las interacciones y los flujos.
Encontrará directrices y ejemplos detallados que cubren no sólo las directrices de diseño, sino también los problemas de accesibilidad y los planos de los componentes.
https://www.lightningdesignsystem.com/
¿Buscas profesionales?
Publicar proyecto
(GRATIS)
Sin compromiso ni registros • Profesionales destacados
¿Buscas clientes?
Suscribirse
(GRATIS)
100% Gratis • Sin cuotas ni comisiones
