¿Aprender a diseñar una interfaz de usuario requiere aprender a programar?

Como diseñador de UI profesional, no solo necesita comprender el flujo de trabajo de todo el producto en el diseño de la interfaz de UI y el diseño de interacción, sino que también debe comprender el flujo de trabajo completo de todo el producto, desde la solicitud hasta el lanzamiento del producto. .

La siguiente es la distribución del trabajo y el proceso de cada departamento de productos de Internet:

Como puede ver en la imagen, un producto de Internet debe ser manejado por diferentes departamentos, desde la planificación hasta El marketing online final comparte sus responsabilidades y cada departamento se subdivide en cada tipo de trabajo según la división de puestos. Por lo tanto, el proceso de desarrollo de un producto de Internet no puede ser completado por una sola persona o departamentos individuales. de un completo esfuerzo de equipo. Solo cuando departamentos y departamentos, puestos y puestos cooperen entre sí se podrán completar los proyectos de manera excelente y eficiente.

Generalmente, las empresas de Internet se dividirán en varios departamentos:

1 Departamento de producto (gerente de producto, especialista de producto)

2. ), diseñador de interacción, ingeniero de front-end)

3 Departamento de I+D (ingeniero de arquitectura, desarrollo de programas)

4. 5. Departamento de marketing (ventas, canales, relaciones públicas, marca)

6. Departamento de operación (atención al cliente, operación y mantenimiento)

Las responsabilidades laborales de cada departamento son las siguientes:

Departamento de Producto: Responsable de la investigación de productos, la planificación del plan de producto, el diseño de prototipos de producto y el acoplamiento del desarrollo de tecnología, pudiendo posteriormente acoplarse con el departamento de operaciones.

Departamento de Diseño: Responsable del diseño visual del producto, diseño de interacción y maquetación front-end. Algunas empresas dividirán el área de front-end en el departamento de desarrollo. La razón es que el trabajo de front-end es el mismo que el desarrollo del programa, es decir, la codificación, y el departamento de diseño es exclusivamente responsable del diseño visual. Pero esta afirmación en realidad no es correcta. Aunque la implementación del código front-end y el desarrollo del programa back-end son codificación, las tecnologías utilizadas son diferentes y las funciones y efectos logrados también son diferentes, por lo que los ingenieros de front-end se dividen en diseño. El departamento será más razonable.

Departamento de I+D: diseño de arquitectura de producto, diseño de bases de datos, diseño de codificación front-end y back-end, posterior operación y mantenimiento, seguridad de red.

Departamento de pruebas: prueba errores en el programa, escribe planes de prueba, casos de prueba, informes de prueba y otros documentos, y optimiza el proceso.

Departamento de marketing: planificación estratégica de producto, planificación y organización de actividades promocionales, planificación de marca y construcción de imagen de marca, actividades de publicidad y promoción de mercado y actividades de relaciones públicas.

Departamento de operación: optimización y promoción SEO/SEM, planificación de la actividad de la plataforma (online y offline), publicidad, gestión de relaciones con los clientes, análisis de datos.

Las divisiones de trabajo del departamento de diseño generalmente incluyen diseñadores de UI, diseñadores de interacción e ingenieros de front-end. En las pequeñas empresas, las divisiones de trabajo están incompletas y el trabajo de los diseñadores de interacción (procesos de interacción, estructuras alámbricas de interacción e interactivos). Se eliminarán los efectos). ) se entrega al personal del producto para que lo complete. El siguiente es un resumen de los procesos en los que los diseñadores de UI participan y deben completar:

Clasificación y análisis de requisitos

Ocurre antes del desarrollo de productos, con productos APP. Por ejemplo, realizaremos investigaciones y análisis de mercado y de usuarios: posicionamiento de mercado (posicionamiento de usuarios, posicionamiento de productos, posicionamiento de tecnología), análisis de la demanda del mercado (análisis del grupo de clientes objetivo, análisis de la competencia). ). En la reunión inicial de análisis de requisitos del producto, participarán diseñadores de UI e ingenieros técnicos. En este proceso, los diseñadores de UI comprenden el posicionamiento claro del usuario, el posicionamiento del producto y el análisis de la competencia para prepararse para la recopilación de materiales y el control de estilo posteriores.

En este proceso, las necesidades del producto se determinarán en función de las necesidades reales refinadas del usuario. El gerente de producto traducirá word, ppt, jpg, etc. en función de la información relevante de la comunicación al lenguaje lógico más simple. Es producir un mapa cerebral de función de producto o una lista de funciones.

Mapa mental de funciones del producto:

Lista de funciones del producto:

Todos comenzaron a discutir el proceso de experiencia del usuario, dibujando el proceso en la pizarra mientras agregaban elementos aproximados de la interfaz de usuario. . Luego, el gerente de producto hará una versión dibujada a mano de la estructura alámbrica en papel.

En esta etapa, los gerentes de producto, los diseñadores de UI y los ingenieros técnicos tendrán muchas discusiones juntas, y las discusiones principales serán sobre los procesos y las funciones principales. Por lo tanto, los guiones gráficos dibujados a mano son los más rápidos, convenientes y fáciles de modificar. . Este enlace necesita finalizar el flujo de usuario, el proceso del usuario y sus pasos clave. Cada paso es una interfaz principal. Luego, el gerente de producto dibuja una versión en papel de un prototipo interactivo de baja fidelidad (puede tomar prestadas plantillas y herramientas profesionales)

En segundo lugar, estructuras alámbricas de interfaz clave (pueden no tener funciones interactivas)

Preliminar Después de clasificar los requisitos funcionales del producto, el gerente de producto continúa realizando el seguimiento, comunicándose repetidamente, seleccionando varios pasos clave y representativos en el proceso de usuario determinado y elabora una estructura alámbrica refinada 1:1. Este paso implica determinar los elementos de la interfaz de usuario y el diseño en interfaces clave, así como el diseño general y el estilo de composición.

3. Diseño visual de la interfaz clave

En este enlace, el diseñador de la interfaz de usuario realizará el diseño visual general de la interfaz clave, probará diferentes estilos y combinaciones de colores, utilizará elementos de la interfaz de usuario y Finalmente determine el estilo de diseño visual del producto.

4. Todos los wireframes de la interfaz (con funciones interactivas)

El gerente de producto completa el diseño 1:1 y la confirmación de todos los wireframes de la interfaz con interacción y procesos.

Estructura alámbrica de la interfaz (agregue explicaciones y descripciones para funciones interactivas).

Diagrama de flujo de la estructura alámbrica

5. Todos los diseños visuales de la interfaz

UI. El diseñador genera los dibujos de diseño visual de todas las interfaces y los confirma.

6. Anotación y corte de la interfaz

1. Después de confirmar todos los borradores visuales de la interfaz, primero anote cada interfaz y entregue la imagen anotada al ingeniero de front-end.

Anotar imágenes (Pixel Chef, Blue Lake y otro software)

2. Corta las imágenes en la interfaz y entrégalas al ingeniero de front-end.

>Cortar la carpeta de imágenes

Cortar el archivo de imagen

En este punto, el flujo de trabajo de la interfaz de usuario se completa. Sin embargo, en proyectos reales, muchos enlaces son un proceso iterativo que requiere modificaciones y cambios constantes. optimización, incluido todo el proceso Después del desarrollo, los diseñadores de UI también deberán coordinar los ajustes, por lo que el trabajo de los diseñadores de UI no es solo completar el diseño visual de la interfaz simple, sino que también incluye el posicionamiento del usuario, el dibujo de estructura alámbrica, la combinación de procesos y Implementación de interacción, y este último incluye el diseño de interfaz de usuario. Los diseñadores de UI deben participar en muchos aspectos. Solo comprendiendo el proyecto desde múltiples perspectivas y comprendiendo los procesos de trabajo de cada puesto podemos crear productos que satisfagan la demanda del mercado y las necesidades de los usuarios.