1 Iconos Definición Ventajas en el uso de iconos: Características:Diseño Gráfico de la IU – IMAGENES Iconos Definición Pequeña imagen gráfica que representa un objeto manipulable por el usuario. Ventajas en el uso de iconos: Requiere menos espacio que las palabras Más rápido de reconocer para el usuario En gral. significan lo mismo en varios idiomas Características: Extensión de archivo: GIF (el mejor) o PNG Tamaños más usados: 16x16, 24x24, 32x32, 48x48 px 1 1

2 Iconos - Características de una buena familiaDiseño Gráfico de la IU – IMAGENES Iconos - Características de una buena familia Simples y bien reconocibles No se sabe si la “E” es de “Eliminar” o “Editar” No se entienden y son muy complejos El texto dice “Subir Archivo” y la flecha está para abajo… 2 2

3 Iconos - Características de una buena familiaDiseño Gráfico de la IU – IMAGENES Iconos - Características de una buena familia Un icono puede estar formado como máximo por 3 elementos Estos 3 ejemplos están compuestos por más de 3 elementos. Son demasiado complejos, lo cual lleva a que cuando se achica el icono no se entienda 3 3

4 Iconos - Características de una buena familiaDiseño Gráfico de la IU – IMAGENES Iconos - Características de una buena familia Todos lo iconos están en la misma posición y dirección El icono de ayuda está en otra perspectiva El icono del sobre está rotado 4 4

5 Iconos - Características de una buena familiaDiseño Gráfico de la IU – IMAGENES Iconos - Características de una buena familia Usan la misma gama de colores Usan los mismos trazos Los iconos de este menú no comparten ni la gama de colores ni las mismas características en los trazos 5 5

6 Iconos – Buenos EjemplosDiseño Gráfico de la IU – IMAGENES Iconos – Buenos Ejemplos 6 6

7 Iconos – Buenos EjemplosDiseño Gráfico de la IU – IMAGENES Iconos – Buenos Ejemplos 7 7

8 Iconos - Buenos EjemplosDiseño Gráfico de la IU – IMAGENES Iconos - Buenos Ejemplos 8 8

9 Iconos – Buenos EjemplosDiseño Gráfico de la IU – IMAGENES Iconos – Buenos Ejemplos 9 9

10 Diseño Gráfico de la IU – IMAGENESIconos - Ejemplos 10 10

11 Diseño Gráfico de la IU – IMAGENESIconos – Ejemplo Uso 11 11

12 Iconos – Buenos EjemplosDiseño Gráfico de la IU – IMAGENES Iconos – Buenos Ejemplos 12 12

13 Iconos – Ejemplo UniversiaDiseño Gráfico de la IU – IMAGENES Iconos – Ejemplo Universia 13 13

14 Diseño Gráfico de la IU – IMAGENESIconos – Ejemplo de uso 14 14

15 Diseño Gráfico de la IU – IMAGENESIconos – Ejemplo de uso 15 15

16 Diseño Gráfico de la IU – IMAGENESIconos – Ejemplo de uso 16 16

17 Diseño Gráfico de la IU – IMAGENESIconos – Ejemplo de uso 17 17

18 Diseño Gráfico de la IU – IMAGENESIconos – Ejemplo de uso 18 18

19 Diseño Gráfico de la IU – IMAGENESIconos – Ejemplo de uso 19 19

20 Diseño Gráfico de la IU – IMAGENESIconos – Ejemplo de uso 20 20