Clase 7: Sistemas de Diseño y Frameworks

Sistemas de Diseño

Permiten establecer los principios de diseño y argumentos que se utilizaran el desarrollo front-end del proyecto. Se establecen patrones y una serie de elementos con el fin de reutilizarlos. Se caracteriza por su modularidad que permite crear unidades mínimas hasta elementos más completos, estableciendo reglas que ayudan al trabajo el equipo.

Algunos ejemplos:

• IBM Design Lenguage
• Material Design --} Es un sistema de diseño que propone google para construir el diseño de interfaces. Parte de su propuesta es la profundidad de los elementos. Cuenta con librerías para diferentes frameworks.

Frameworks

Su razón de ser es que se puedan descargar la liberías y usarlas en nuestros proyectos, para partir con una base de código. Algunos ejemplos son:

• Bootstrap
• Foundation

Ventajas del uso de Frameworks:

• El framework permite avanzar rápido en el proyecto al copiar la hoja de estilo.
• Asegura la compatilibidad entre lenguajes de código.
• Trabaja con buenas prácticas de código.
• Son modulares, por lo que permiten utilizar ciertos aspectos y extender sus estilos.

Desventajas del uso de Frameworks:

• Como ya tienen una propuesta de diseño (entregan una visión de diseño) toma más trabajo variar en eso.
• Poco control de lo que sucede en la interfaz.
• Puede definir estilos innecesarios para nuestro proyecto.

Tipos de Frameworks y ejemplos

• Frameworks de base --} Normalize.css - Resetea las cosas que no queremos en el diseño, como el margen por ejemplo, neutralizando cómo se ven los elementos para que haya un estilo base.
• Livianos --} Pure.css
• Propósito general --} Bootstrap
• Especializado --} Tufte CSS - Suele utilizarse en artículos académicos en sitios en inglés.
• Utilitario --} Tailwind