Digu 03. Estilos de interfaz
1 recomendación1,168 vistas
Este documento discute diferentes estilos visuales para interfaces gráficas de usuario (GUI). Explica que el diseño visual de una interfaz permite crear una experiencia positiva para el usuario y transmitir la identidad del producto. Luego describe varios estilos visuales comunes como pixel art, 2.5D, 3D, holográfico, realista, minimalista, plano y Material Design. Cada estilo visual se caracteriza por su uso particular de elementos como fondos, bordes, sombras, texturas y colores. El documento concluye instando al diseñador a desarrollar
Digu 03. Estilos de interfaz
- 1. Diseño GUI Electivo Diseño de Interfaces Gráficas de Usuario ESCUELA DE DISEÑO Y MULTIMEDIA
- 3. GUI estilos visuales Al ser la interfaz el punto de contacto con el usuario debe poder transmitir la identidad e imagen visual del producto o la organización. La búsqueda de consistencia interna permite que el usuario perciba un sistema visual integrado, que le hace sentido y logra mayor claridad en la comunicación del mensaje. Un correcto diseño visual de la interfaz permite crear una experiencia positiva y agradable para el usuario (look & feel).
- 4. GUI estilos visuales La forma en que los aspectos visuales de la interfaz son presentados, no solo son aspectos estéticos, sino que también implica aspectos funcionales o simbólicos. Para lograr consistencia, las mismas convenciones y reglas deben ser aplicadas a todos los elementos que componen el sistema: - Los mismos tipos de elementos se muestran con características similares. - Aquellos con diferentes tipos de comportamiento o significado tienen su propia apariencia especial.
- 5. UI estilos visuales Bruno Munari, “¿Cómo nacen los objetos?”, 1981
- 6. UI estilos visuales PixelArt - Consisten en ir constituyendo las imágenes por medio de colores ilustrándolas pixel a pixel. - Uso de perspectiva isométrica y no isométrica.
- 9. UI estilos visuales 2½ D - Fondos fotográficos, texturas o gradientes - Bordes de marcos con volumen o sombra proyectada - Botones con apariencia de volumen mediante iluminación y brillos
- 14. UI estilos visuales 3D - Representación tridimensional del espacio interactivo. - Manipulación directa de elementos de la interfaz.
- 18. UI estilos visuales Holográfica - Visualización traslúcida de la información - Utilizado comúnmente para HUD (Heads-Up Display) - Puede tener aspecto 3D o 2D
- 25. UI estilos visuales Realista o Skeuomórfico - Texturas de materiales extraídos de la realidad - Adaptación Psicológica - Reconocimiento por experiencia. - Función emula lo analógico
- 32. UI estilos visuales Minimalismo - Simpleza - Fondos básicos - Tipografía clara - Reconocimiento intuitivo y sin esfuerzo. - Escaso ornamento - Uso de fotografías recortadas - Buena adaptación a dispositivos
- 38. UI estilos visuales Plano o Flat Design - Paleta de colores limitados - Fondos planos o con gradientes minimas - Tipografía simple - Grandes áreas de color - Gráfica de apariencia vectorial - Buena adaptación a dispositivos
- 44. UI estilos visuales Material Design - Está basado en objetos materiales. - Son piezas colocadas en un espacio (lugar) y con un tiempo (movimiento) determinado. - Es una filosofía de diseño donde la profundidad, las superficies, los bordes, las sombras y los colores juegan un papel principal.
- 48. EJERCICIO FINAL Desarrollar propuestas de Interfaz Gráfica de Usuario para una aplicación móvil, sitio web o videojuego. - Definir brevemente las características producto digital a diseñar y los conceptos comunicacionales, emocionales y estilos visuales a trabajar. - Definir pequeño UI Kit o Guía de Estilo de Diseño de Interfaz de Usuario - Generar propuestas de pantallas con distintas secciones del producto digital. - Definiciones y propuestas en un documento PDF - Trabajo individual ENTREGA 24.06.2016
- 49. AFFORDANCE definición Directrices Visuales Google Google Visual Assets Guidelines - Parte 1 Google Visual Assets Guidelines - Parte 2