UI kit y Sistema de diseño, ¿Son lo mismo?

UI kit y sistema de diseño pueden parecerse en algunos aspectos pero definitivamente no son lo mismo. Esto lo aclaro en la primera línea del post puesto que he visto a muchos profesionales hablar del UI Kit como sistemas de diseño cuando en verdad no lo son. En este post hablaremos de que se trata cada uno y sus diferencias.

UI KIT

Los UI KIT son un conjunto de componentes que se utilizan en una interfaz de usuario. Es una herramienta muy útil cuando queremos construir interfaces consistentes y mantener una coherencia visual entre todos los elementos de una página. Dentro de los UI KIT se encuentran ítems como: Tipografía, colores, elementos de formulario, espaciado, componentes como botones, cards, entre otros. Sirven como guía para agilizar los procesos de diseño y construcción de páginas.

A continuación te dejo una parte de un ui kit que diseñé para un proyecto que estoy pronto a subir:

Sistemas de diseño

Los sistemas de diseño son más complejos que los UI kits. Es como un “manual de marca” de la compañía en temas de interfaces. También es una guía para los diseñadores y desarrolladores, sin embargo tiene mas consideraciones que solo los componentes. Por ejemplo se fundamenta el porque se utilizan de cierta manera y en que casos deben usarse de tal o cual forma los componentes, colores, etc. Muchos también utilizan fragmentos de código para que los desarrolladores acudan para construir la interfaz.

A continuación de dejo algunos ejemplos de Sistemas de diseño:

IBM -> https://www.ibm.com/design/language/

Atlassian -> https://atlassian.design

Mailchimp -> https://ux.mailchimp.com/

En definitiva podríamos decir que el UI KIT es una versión muy resumida del sistema de diseño. Contiene sólo los componentes que te mencioné anteriormente u otros, sin embargo no se justifica el porqué ni se fundamenta como en un sistema de diseño. Además en los UI KIT no se incluye fragmentos de código para los desarrolladores y en los sistemas de diseño generalmente si. Los sistemas de diseño son ecosistemas mucho mas complejos y demoran tiempo en diseñar e implementar puesto que se presenta la filosofía, principios de diseño, estrategia y otros.

En definitiva, no son lo mismo.