El nuevo concepto de producto de Google
La traducción china de "materia" es "materia", que representa la composición de la materia. Si se coloca en el diseño de sistemas de telefonía móvil, esta palabra se puede asociar fácilmente con el diseño de estilo de interfaz de los sistemas de telefonía móvil, como imitación y estilo plano. Sin embargo, esta vez, el diseño material de Google no es un estilo de diseño de interfaz del sistema. El diseño de materiales es en realidad un lenguaje de diseño simple, que incluye el estilo de la interfaz del sistema, la interacción, la interfaz de usuario, etc. Además, para Google, Material Design tiene una misión muy grande, que es crear un lenguaje de diseño unificado en todos los dispositivos, como teléfonos móviles, computadoras de escritorio, dispositivos portátiles, etc. Hoy, siga los pasos del editor y eche un vistazo al nuevo concepto de diseño de Google Material Design.
Estilo de interfaz del sistema
“Distintivo, vívido y reflexivo” son las palabras más apropiadas para el diseño de estilo de interfaz de Material design. Material design proporciona un nuevo lenguaje visual para Android. En el procesamiento de elementos básicos, aprendemos del diseño de impresión tradicional, diseño de fuentes, sistema de cuadrícula, espacio, proporción, combinación de colores, aplicación de imágenes, etc. Sobre la base de estos diseños, podemos construir una jerarquía visual, un significado visual y un enfoque visual. La cuidadosa selección de colores, imágenes, fuentes proporcionales y espaciado se esfuerza por crear una interfaz de usuario vívida que haga que la nueva interfaz del sistema sea tan hermosa.
En términos de selección de colores, el principio del diseño de materiales es "audaz, gráfico y significativo". En el diseño de materiales, la combinación de colores de la interfaz de usuario aboga por un color principal y un color complementario. En las áreas más grandes, el color es de 500 tonos del color principal, y en las áreas más pequeñas, como la barra de estado, el color es más oscuro. Esta inteligente combinación de colores hace que la aplicación parezca muy atrevida, llena de color y resalta el contenido.
Material design concede gran importancia al diseño de la interfaz. Como todos sabemos, un buen diseño hará que la interfaz luzca muy refrescante y ordenada. Para hacer un buen trabajo de composición tipográfica, una "línea de base" es absolutamente esencial. El documento oficial de Google "Márgenes de tipografía de diseño de materiales" menciona la ubicación de las líneas de base. En la imagen a continuación podemos ver que Material Design coloca la primera línea de base a 16 dp de distancia y la segunda línea de base alineada con el elemento de texto a 72 dp de distancia del borde izquierdo. Esta regla de alineación hace que la interfaz parezca fresca y tenga el ritmo de lectura del diseño tipográfico. Permite a los usuarios leer información rápidamente y está más en línea con los principios de Gestalt.
En general, el diseño de materiales ha traído una reforma a Android. El estilo de la interfaz y el diseño del sistema han cambiado mucho, y el estilo del propio sistema Android ha ido emergiendo gradualmente. Finalmente, algunas personas dirán que el sistema Android nativo es feo.
Diseño de interacción agradable
El diseño de interacción de Material Design adopta una interacción receptiva, que puede actualizar una aplicación desde simplemente mostrar la información solicitada por el usuario a una que puede ser herramientas más intensas y específicas. para interactuar con los usuarios. A continuación, elegimos algunos gráficos dinámicos simples para ver el diseño de interacción único de Material Design.
Las dos imágenes de arriba muestran respuestas superficiales en interacciones receptivas. Cuando el usuario hace clic en la pantalla, el sistema dibujará inmediatamente un gráfico visual en el punto de contacto interactivo para que el usuario lo perciba. Por ejemplo, en la imagen de arriba, cuando el usuario toca la pantalla, usa el micrófono o escribe en el teclado, aparecerá un efecto visual similar a la difusión de tinta.
La interacción clic-flotación en la interacción responsiva que se muestra en las dos imágenes de arriba indica que cuando se activa un elemento de tarjeta o elemento desmontable, debe flotar para indicar que está activo.
Notas de ejercicio
De la introducción anterior, el diseño de materiales se ve muy hermoso. A continuación, veamos una aplicación basada en Material Design: la bandeja de entrada. Muestra plenamente el diseño del material. Lleno de capas, colores llamativos y animaciones intuitivas.