Pautas de diseño de Android

Antes de hablar sobre las especificaciones de diseño de Android, echemos un vistazo a algunas preguntas:

*¿Cuáles son las especificaciones?

*¿Cuál es el propósito de la especificación?

*¿Cómo regular?

¿Qué es una norma?

Norma: se refiere a un estándar que se establece o se acuerda explícitamente. U operar de acuerdo con los requisitos de las normas y especificaciones para hacer que un determinado comportamiento o actividad cumpla o supere los estándares especificados.

En otras palabras, la especificación hace que un determinado comportamiento (como el desarrollo de proyectos, los componentes de la biblioteca de componentes, etc.) cumpla con el estándar mediante la formulación de algunas regulaciones y restricciones (como el tamaño de fuente, el tamaño de la interfaz, el tamaño del icono). , etc.).

La formulación del pliego de condiciones tiene como finalidad asegurar la unidad y racionalidad del diseño. Las especificaciones mantienen la unidad del proyecto, no el diseño personal del diseñador. Piénselo, en una empresa, además del diseño, hay gerentes de producto al frente, programadores detrás y todo lo que usted crea debe entregarse a ellos. El gerente de producto analiza si su diseño refleja sus necesidades (si el contenido del diseño incluye el contenido discutido en la etapa anterior), el programador le solicita varios recortes (iconos, componentes, diseño, espaciado, tamaño de fuente, etc.) y Si el usuario mira su diseño (color, rango de tamaño de los iconos, etc.), si el diseñador no tiene ningún estándar y diseña cosas basándose en su propia "imaginación desenfrenada", causará muchos problemas. Por ejemplo, cortar estándares de dibujo, si solo usted puede entender su nombre, entonces no se lo envíe al programador ~ porque si se lo envía, él no puede encontrar cuál es cuál y dónde debe estar el ícono. metido. El diseño que realiza es para proyectos de empresa y servicio al cliente, por lo que lo que diseña debe satisfacer las necesidades de otras posiciones del proyecto (gerentes de producto, programadores) y ajustarse a los hábitos de uso de los usuarios. Por lo tanto, las especificaciones son acuerdos realizados en el equipo con el fin de maximizar los beneficios y la eficiencia del proyecto.

Aunque las diferentes especificaciones tienen contenidos diferentes, en realidad contienen contenidos similares, que generalmente incluyen diseño, color, íconos, componentes y fuentes. A continuación, echemos un vistazo a las especificaciones de diseño comunes en Android. Creo que después de estudiarlas, tendrá muy claras las especificaciones de diseño en proyectos futuros. Una vez completado el diseño de un producto, crear especificaciones de diseño también es una forma de resumir el proyecto. Capaz de prestar atención a las regulaciones y ser capaz de formular regulaciones.

Al diseñar una aplicación, primero estableceremos el tamaño del lienzo, que por supuesto se basa en el tamaño de la interfaz de Android. Hay tantos teléfonos Android que no es necesario recordarlos todos. Simplemente recuerde uno o dos y comprenda la relación de conversión entre ellos.

En la actualidad, los tamaños principales en Android son principalmente @1.5x, @2x y @3x. Recuerde que los siguientes tres son suficientes.

@1.5x 480x854 /540x960

@2x ? (Este es el tamaño de interfaz que uso con más frecuencia)

@3x ? p>Pruébalo, ¿qué es @1x?

Además de conocer el tamaño de la interfaz, también necesita conocer la altura de la barra de estado, la barra de navegación y la barra de menú, y establecer las líneas de referencia correspondientes durante el diseño.

Se recomienda utilizar el tamaño 720 × 1280. Este tamaño se muestra perfectamente en 720 × 1280, el tamaño del archivo de imagen después del corte también es moderado y el consumo de memoria de la aplicación no será demasiado alto.

En realidad, hay muchas cosas a las que prestar atención en términos de especificaciones de íconos, como el tamaño del ícono, el diseño del ícono y las especificaciones de corte del ícono. Aquí nos centraremos en el tamaño del ícono y se discutirán las especificaciones del diseño del ícono. más tarde.

En el sistema Android, se utiliza Google Siyuan en chino y Roboto en inglés. La fuente de origen es una fuente no serif. Adobe llama a Source Han Sans y Google llama a Source Han Sans CJK. La fuente de origen contiene 7 pesos propios, es decir, 7 fuentes de diferentes grosores.

En cuanto a las fuentes, puedes elegir otras fuentes durante el proceso de diseño, pero debes prestar atención a si las fuentes que utilizas son propicias para la lectura del usuario y cómodas.

En cuanto al tamaño de fuente, es necesario unificarlo durante el proceso de diseño de la interfaz. Por ejemplo, todo el texto debe tener el mismo tamaño y todos los títulos deben tener el mismo tamaño.

Los diferentes estilos de tamaños de fuente dan a las personas diferentes sensaciones. Debemos aprender a utilizarlos con flexibilidad. La unidad de texto de Android es sp, y el siguiente texto está estandarizado según la ampliación @1x.

En Android, dp se usa generalmente para marcar distancias y sp se usa para marcar texto y la relación de conversión entre ellos. es:

1dp = (pantalla ppi/160) px

Si no conoces la unidad, puedes ir al artículo anterior para aprender sobre px pt sp dp ppi.

Los entregables de diseño requeridos para el desarrollo de Android deben incluir al menos: diagramas de interfaz de usuario de alta fidelidad, anotaciones e imágenes recortadas

Este es el último y más importante punto, porque las imágenes que cortar Debe entregarse al programador. Si el programa que escribe no puede lograr el efecto que desea, puede ser porque no puede entender las especificaciones que le dio ~

1. El tamaño de la imagen cortada. debe ser el doble de Número

2. Las imágenes de un solo píxel tendrán bordes borrosos

3. Los nombres deben estar estandarizados

Básicamente, las imágenes recortadas de la aplicación se puede dividir en las siguientes categorías: Categorías principales: fondo, botón, ícono, imagen, fotografía, ícono de TabBar, etc.

La convención de nomenclatura general puede ser:

Prefijo: propósito del componente de ubicación

Sufijo: estado

Por ejemplo, use btn-xxx Nombre .png. Los botones de la aplicación tienen cuatro atributos: normal, resaltado con clic, deshabilitado y seleccionado.

Pero si no busca el refinamiento y la integridad, simplemente cree un archivo de imagen de botón de atributo general. Si es un estado de clic (resaltado), se puede nombrar: btn-cancel-hightlight.png Indica el icono cuando se hace clic en el botón cancelar.

Incluso si no lo nombras de acuerdo con estándares muy estrictos, al menos puede hacerle saber al programador que el ícono que estás usando es el ícono usado en esa situación. Esto requiere una buena comunicación entre el diseñador. y el programador, lo cual es conveniente para el desarrollo de todo el equipo para mejorar la eficiencia del desarrollo del equipo.