Please enable JavaScript.
Coggle requires JavaScript to display documents.
MATERIAL DESIGN -Luis Armando Garrido- - Coggle Diagram
MATERIAL DESIGN
-Luis Armando Garrido-
¿QUÉ ES?
Material Design es un sistema de diseño creado y respaldado por diseñadores y desarrolladores de Google. Material.io incluye orientación detallada de UX e implementaciones de componentes de UI para Android, Flutter y la Web. Esta incluye:
-Fundamentos de UX
-Código fuente abierto
-Tutoriales, estudios de casos y noticias
Secciones de Material Design:
Foundations & customization: Accesibilidad, diseño, estados de interacción, tokens de diseño y más
Styles: Sistemas para aplicar color, tipografía, íconos, movimiento y forma.
Components: Elementos de interfaz de usuario personalizables, desde menús hasta botones y cuadros de diálogo
SECCIÓN HOME
NOTICIAS Y LANZAMIENTOS
Figma Design kit:
Biblioteca de componentes de figma
Guía en pantalla grande:
Guia de tamaños
Diseño de materiales en Google I/O
ACTUALIZACIONES (Ejemplos)
M3 para Jetpack Compose
Se usa para crear una aplicación Android M3 completa
Creador de temas de materiales:
Genera combinaciones de colores
RECURSOS
Blog de Material: noticias, tutoriales e inspiración del equipo de Material
Kit de diseño Figma: estilos y componentes personalizables para ayudarte a diseñar con Material 3
Empieza: guías, vídeos y herramientas para empezar a construir con Material
Desarrollar: código y documentación para desarrolladores para Android, Flutter y la Web
FOUNDATIONS: Los fundamentos constituyen la base de cualquier excelente interfaz de usuario, desde estándares de accesibilidad hasta patrones esenciales para el diseño y la interacción.
ACCESSIBLE DESIGN: El diseño accesible hace que los productos sean utilizables para personas con todo tipo de capacidades. La sección incluye:
-Básicos de Accesibilidad
-Patrones
-Diseño a la Implementación
CONTENT DESIGN: La redacción de UX y el diseño de información hacen que las UI sean fáciles de usar
El texto alternativo: describe el significado y el contexto de las imágenes para los usuarios de lectores de pantalla.
La escritura global es más fácil de leer, comprender y traducir. Esta guía es para todo el inglés americano localizado.
Guía de estilo: el texto de la interfaz de usuario debe ser comprensible para cualquier persona, en cualquier lugar
MATERIAL PERSONALIZADO: crea productos de marca únicos con patrones familiares e interacciones accesibles
DESIGN TOKENS: Los tokens de diseño son los componentes básicos de todos los elementos de la interfaz de usuario. Los mismos tokens se utilizan en diseños, herramientas y código.
INTERACTIONS
Gestures: Los gestos son todas las formas en que las personas interactúan con los elementos de la interfaz de usuario mediante el tacto.
Imputs: Las entradas son dispositivos que proporcionan control interactivo de una aplicación. Las entradas comunes incluyen un mouse, teclado o panel táctil.
La selección permite a los usuarios elegir elementos específicos sobre los que actuar
Estados
Los estados muestran el estado de interacción de un componente o elemento de la interfaz de usuario
LAYOUTS: es la disposición visual de los elementos en la pantalla
STYLES: Los estilos son los aspectos visuales de una interfaz de usuario que le dan una apariencia distinta.
COLOR: El color se utiliza para expresar estilo y comunicar significado.
ELEVATION:
La elevación es la distancia relativa entre dos superficies a lo largo del eje z. Todas las superficies y componentes tienen valores de elevación.
ICONS: Los iconos son pequeños símbolos de acciones u otros elementos.
MOTION: el movimiento hace que la interfaz de usuario sea expresiva y fácil de usar.
SHAPE: La forma puede dirigir la atención, comunicar el estado y expresar la marca.
TYPOGRAPHY:
La tipografía ayuda a que la escritura sea legible y hermosa