Descripción general de los patrones
¿Qué son los patrones de Jutro?
Los patrones de Jutro son soluciones de prácticas recomendadas para problemas de diseño recurrentes (flujos, comportamientos o interacciones) dentro del mismo producto, familias de productos o productos distintos. Tenga en cuenta que estos son patrones exclusivamente de UX; proporcionan una guía de diseño documentada y no incluyen ningún código ni implementación.
Tienen estas características:
- Son reutilizables: El mismo patrón, con pocas o ninguna modificación, se puede aplicar a varias situaciones, lo que facilita la coherencia en todas las áreas de uso.
- Son extensibles: Los patrones están diseñados para un caso de uso común, son fáciles de probar y son adaptables o extensibles a otros casos de uso.
- Están bien documentados: Los patrones incluyen situaciones de uso bien documentadas, qué hacer y qué no hacer, y pautas precisas sobre cómo usar y crear patrones.
- Son prácticas recomendadas fáciles de crear: Utilice patrones existentes como plantillas para crear nuevos, lo que elimina la necesidad de crear desde cero. Los patrones existentes sirven como plantilla para diseñar y construir las prácticas recomendadas en accesibilidad, adaptabilidad, localización y análisis.
Los patrones de Jutro pueden ser de los siguientes dos tipos:
-
Patrones centrados en la industria de seguros de propiedad y accidentes: Patrones que resuelven problemas recurrentes específicos de la industria. Por ejemplo, agregar un conductor y flujos de pago.
-
Patrones de UX neutros para resolver problemas comunes de usabilidad: Patrones que resuelven problemas que son universales para cualquier elemento o flujo de la interfaz de usuario. Por ejemplo, validación, mensajería y plazos.
Diferencia entre patrones y componentes
Si no está familiarizado con los patrones, estos son algunos criterios que lo ayudarán a distinguir entre patrones y componentes:
| COMPONENTES | PATRONES | |
|---|---|---|
| ¿Qué son? | Elementos individuales definidos o los componentes fundamentales más básicos de una interfaz de usuario. | Combinaciones de componentes atómicos en un “trabajo por realizar”. |
| Tipos | Atómicos: componentes fundamentales más simples. Por ejemplo, botones. Moleculares: combinación de átomos. Por ejemplo, los calendarios. | Flujos de proceso: por ejemplo, el flujo “agregar un conductor”. Comportamientos: por ejemplo, estados deshabilitados. Interacciones: por ejemplo, flujos de búsqueda, plazos. |
| Uso | Combine diferentes componentes para crear un flujo o una página. | Están listos para usar (o se pueden personalizar) como flujo o parte de una página. |
| Casos de uso | Todos los casos de uso aprobados por Jutro. No proporcionamos diseños para casos extremos. | Están diseñados y desarrollados para casos de uso comunes y se adaptan para otros casos de uso. |
| Características de configuración base | Responsive, accesible, actualizable, seguridad, localización, i18n, análisis. | Responsive, accesible, actualizable, seguridad, localización, i18n, análisis. |
| Semejanzas | Biblioteca de componentes, documentación y paquetes de la biblioteca de componentes Figma. | Biblioteca de patrones y documentación Figma |
| Cuándo se deberían utilizar | Se puede utilizar solo según lo definido por el sistema y debe cumplir estrictamente con los diseños y las pautas de Jutro. | Se puede aplicar tal cual o utilizar la documentación como orientación para adaptarlo a los casos de uso, en lugar de respetar pautas estrictas. |
| Personalización | No se permiten modificaciones de diseño ni de implementación. | Están disponibles como paquetes iniciales y deben personalizarse para adaptarlos al caso de uso. |
| Evolución | Más lenta debido a la complejidad y la interdependencia implicadas en las pruebas. | Evolucionan a un ritmo mucho más rápido, ya que pueden someterse a pruebas como bloques individuales y modificarse en consecuencia. |
| Responsabilidad | Equipos UX de Jutro, Dev de Jutro, Documentación de Jutro | UX de Jutro, personalización de productos y patrones de consumo (las características OOTB se verán comprometidas en la personalización) |
| Colaboradores | UX de Jutro, UX de Productos | UX de Jutro proporciona un conjunto inicial. UX de Productos, BA, gerentes de producto, servicios digitales |