En este artículo voy a ver qué se necesita para pasar del diseñador de iconos a icon pro. Observaré cómo comenzó el diseño de íconos, dónde está hoy y dónde estará en el futuro, además de compartir algunos consejos prácticos..
Hace poco más de seis meses comencé mi nuevo trabajo en el que me pidieron que extendiera un conjunto de iconos existentes. Genial, pensé, puedo hacer íconos, después de todo, los he creado cientos de veces antes. Luego, cuando vi el conjunto de iconos existentes, me sorprendió bastante. Eran los diseños más simples y, de hecho, me pareció un gran desafío hacer algo tan simple. Estaba acostumbrado a pasar muchas horas en los íconos que solía crear. Parecía extraño que solo hubiera dedicado diez minutos a estos íconos para terminarlos..
Esto me lleva a pensar en una gran cantidad de preguntas relacionadas con íconos como "qué hace que un ícono sea bueno" y "¿cuánto tiempo debería dedicarse a un ícono?". Voy a compartir algunas de las respuestas con usted a continuación. He hablado con algunos de los mejores diseñadores de íconos para conocer su proceso. También veremos cómo comenzó el diseño de íconos, dónde está hoy y (más importante) dónde estará en el futuro. Así que quédate conmigo, hazte una taza de té y feliz diseñando gente.!
Entonces, ¿de dónde vienen estas pequeñas obras maestras gráficas? Todo comenzó en 1973, cuando las computadoras eran poco más que sistemas basados en DOS donde los usuarios navegaban a su alrededor usando comandos. Este fue un momento en que el diseño gráfico en las computadoras no existía. Ciertamente no hubo movimiento de su dedo o gestos de deslizar para operarlo.
Como puede imaginar, esta no era la forma más fácil de sortear su máquina, y una compañía relativamente conocida en los Estados Unidos llamada Xerox estaba ocupada trabajando arduamente para intentar solucionar este problema. Ese mismo año lanzaron 'The Xerox Alto', que se convirtió en la primera computadora en la historia en operar con una interfaz gráfica de usuario (GUI para abreviar). No fue hasta un par de años más tarde, cuando un tal Sr. Steve Jobs y su socio en el crimen, Steve Wozniak, tomaron las ideas desarrolladas por Xerox y las convirtieron en el primer sistema operativo disponible comercialmente en el mundo para usar una GUI. Se llamaba la Macintosh. Señoras y señores nació el icono.!
Los primeros íconos que aparecieron fueron cortesía de Apple en la Macintosh..Ciertamente fue una revolución para la computación. Los directorios ahora tenían una representación gráfica que aparecía como carpetas, los archivos parecían blocs de notas, relojes y calculadoras también aparecieron.
Un ícono de computadora es un pictograma que se muestra en la pantalla de una computadora y se usa para navegar por un sistema de computadora o dispositivo móvil.
Estos son algunos de los principios de diseño más importantes al crear íconos.
Este es posiblemente uno de los aspectos más importantes en el diseño de iconos. Por encima de todo, los íconos deben ser simples, claros y concisos. En la mayoría de los casos, debe crear un icono dentro de una cantidad limitada de espacio. Debe poder representar su producto, su servicio o acción de manera clara y precisa..
Los iconos a menudo funcionan mejor cuando funcionan bien solo en blanco y negro. Una vez que tenga esto clavado, puede pasar a agregar color y renderizar a sus iconos.En algunos casos, puede ser una buena idea usar un solo objeto, o un solo carácter, por ejemplo. Este método generalmente funciona aunque a veces se necesita otro objeto. Más de dos objetos y me acerco con precaución ya que esto a veces puede parecer poco claro y puede disuadir el enfoque del icono. Si se encuentra en esta situación, intente eliminar los objetos hasta que su mensaje sea evidente..
Un icono representa una acción que un usuario realizará.
Si se te asigna la tarea de crear un conjunto de íconos, tendrán que tener alguna forma de coherencia en todo momento. Esto puede venir en forma de paletas de colores, formas y objetos específicos. La consistencia también debe estar presente en toda la aplicación general. ¿Qué sucede cuando su usuario hace clic en el icono? ¿La pantalla a la que están dirigidos tiene un estilo similar a su icono? Si la respuesta es "no", es posible que deba redireccionar algunas de sus decisiones: los usuarios a menudo establecen un vínculo entre los dos eventos al hacer clic en un icono y la siguiente pantalla en la que aparecen. Si rompe esta convención, existe un riesgo mucho mayor de romper la confianza de los usuarios..
¿Qué tipo de persona será más probable que haga clic en el icono? ¿El icono está dirigido a niños de cinco o sesenta y cinco años? ¿Es para usuarios en China o usuarios en Inglaterra? Si está creando un ícono relacionado con los alimentos, entonces no sería útil usar los palillos como cubiertos si está dirigido al mercado inglés. Tendrá que pensar en esto y asegurarse de que su objetivo demográfico pueda relacionarse bien con su diseño.
Ahora más que nunca, tus íconos deben destacar entre la multitud. Con las tiendas de aplicaciones apareciendo todo el tiempo en una variedad de dispositivos, desde teléfonos inteligentes hasta televisores inteligentes.
Estos iconos de Ramotion y George Gliddon muestran las cualidades de los buenos iconos que destacan.Si su icono es para una aplicación, a menudo será el primer punto de contacto para él. Es tu escaparate al mundo. Las personas son finalmente influenciadas por el diseño. Es posible que tengas la mejor aplicación del mundo, pero las personas se apagarán si tu ícono no las activa. Piénsalo, ¿realmente entrarías en una tienda que se veía tan mal como el infierno desde afuera? Es el mismo principio; no muchas personas darán el siguiente paso para obtener más información acerca de su aplicación o tomar el próximo llamado a la acción.
Ok lo admito El arte digital fue mi primer contacto con el mundo del arte. Photoshop fue mi cuaderno de dibujo y el ratón mi lápiz. Nunca antes había considerado dibujar cosas; después de todo, siempre había sido una basura en el dibujo a mano alzada durante la escuela. No fue hasta mis años universitarios cuando le expliqué esto a uno de mis profesores que ella se volvió hacia mí y me dijo: "Aaron dibujando es tu amigo". Luego procedió a explicarme cómo no necesitas ser el mejor ilustrador del mundo para dibujar.
Dibujar sus iconos primero a menudo puede servir como un punto de partida decente para su diseño final.Hacer bocetos no se trata de crear una representación realista de lo que realmente puedes ver, sino que es más un método para crear la base de una idea, inspiración, concepto o visión. Desde ese día, siempre llevo conmigo un bloc de bocetos y, con mayor frecuencia, no bosquejo mis diseños para íconos. Esto realmente puede ser invaluable y puede ahorrar una gran cantidad de tiempo. Le ayuda a obtener la base de su ícono y, a menudo, puede servir como un punto de partida decente para su diseño final.
Me las arreglé para tomar unos minutos con el talentoso diseñador de íconos Alex Volkov y le hice un par de preguntas con respecto al diseño de íconos..
Iconos creados por Alex Volkov. Estos demuestran el progreso que se ha logrado a lo largo de los años en términos de diseño de iconos..El factor más importante es encontrar el estilo más expresivo para retratar el ícono, que corresponderá a la tarea más obvia y con qué eficacia desempeñará su función. Por encima de todo el icono debe ser hermoso..
Depende de la tarea del icono, la idea y el estilo seleccionado. Puede llevar de dos a dieciséis horas. Ese es el tiempo que me llevaría crear el ícono, mientras que el tiempo para buscar ideas y aprobación con el cliente varía y, a veces, puede llevar mucho más tiempo que la implementación..
Aquí hay algunos consejos y sugerencias que deberían ayudar a que los diseños de sus iconos pasen del nivel uno al nivel experto. Por supuesto, como con todo diseño, cuanto más lo intentes, más errores cometerás. Pero mientras más errores cometas, mejor te volverás.
Si desea agregar realismo a sus íconos, entonces es muy importante entender desde qué dirección la luz se ilumina. Necesitas poder visualizar (en tu cabeza) una luz imaginaria que brilla en el ícono. La imagen de abajo demuestra esto.
Esta imagen exagerada demuestra nuestra fuente de luz y cómo caería en el icono. A partir de esto, podemos determinar dónde deben estar los resaltes y las sombras..Al visualizar esto, podemos agregar resaltes y sombras al icono, ya que caerían en el mundo real..
Al crear íconos, la atención al detalle es muy importante: resplandores, sombras, reflejos, reflejos, propiedades de los materiales. Mira el mundo que te rodea y piensa cómo se vería en la vida real. La interacción y el comportamiento con la luz y los materiales circundantes es importante. La luz a menudo puede caer de manera diferente en diversas condiciones climáticas. Por ejemplo, la luz no viajará de la misma manera a través de una habitación vacía como lo haría en una habitación llena de humo. Cuando tomamos en consideración estos factores no solo podemos crear una forma de ícono, podemos crear íconos con ciertos estados de ánimo y sentimientos..
Con la introducción de los teléfonos inteligentes (especialmente el iPhone), las tabletas y las aplicaciones en la escena, los íconos han pasado por una revolución. Los iconos nunca se han visto tan pulidos, tan reales, tan llenos de profundidad, color e intensidad..
Esta imagen muestra los diferentes tamaños de diferentes iconos de aplicaciones.El iPhone establece limitaciones y pautas sobre cómo se pueden mostrar los íconos de las aplicaciones en su pantalla táctil. Evidentemente, tienen que caber dentro de una caja de 57 x 57 píxeles (114 x 114 píxeles de alta resolución). Estas limitaciones encienden la imaginación de las comunidades de diseño y, como resultado de esto, ahora tenemos todo tipo de iconos extraños y maravillosos que se han basado en la limitación del marcador de posición del icono cuadrado del iPhone..
Algunas limitaciones de los íconos han creado un nuevo estilo de diseño de íconos como estos por Livie Leontidis, Ramotion y Jackie Tran Anh.Al observar el camino que los íconos han tomado anteriormente, podemos intentar predecir cómo serán los íconos en el futuro y qué forma pueden tomar. Por supuesto, el futuro de los íconos depende en gran medida, no solo de los principios básicos del buen diseño de íconos, sino también de las herramientas que se utilizan para crear esos íconos. Por ejemplo, para cada nueva característica que se agrega al software como Photoshop, esto podría potencialmente ayudar a dar forma al futuro de los íconos. Sin embargo, los principios básicos de un buen diseño de iconos siguen siendo los mismos. Rob Janoff, una persona que quizás sepa más que otros sobre el buen diseño icónico, es Rob Janoff. Rob diseñó el logo de Apple en los años 70. Me las arreglé para captar un chat rápido de Skype con Rob que me dijo que pensaba que era un buen ícono.
Lo que suelo buscar es la sencillez y la elegancia. Con el advenimiento de la tecnología hay representaciones de iconos cada vez más complicadas. Que son agradables a la vista pero a veces la técnica es sustituida por un concepto. Cuando las cosas son muy simples son más fáciles de recordar. - Rob Janoff
Para comprender también el futuro de los íconos, debemos mirar las plataformas en las que se utilizan. En una entrevista reciente se le preguntó a Bill Gates qué esperaba con más ganas con respecto al futuro de Internet. Respondió:
Las conexiones a Internet súper rápidas y las mejoras en hardware harán posible una red mundial que nos brinda información en 3D Bill Gates
Esto podría dar una idea del futuro de los iconos. Quizás podrían alejarse de los objetos planos 2d y convertirse en parte del mundo que nos rodea. Los íconos podrían potencialmente convertirse en manijas que tiramos, diales que giramos y objetos que presionamos.
Los iconos del futuro serán mejores, más profesionales e interesantes. Los diseñadores ya están intentando hacer hermosos diseños llamativos y se espera que esta tendencia continúe..
Acompañando a este artículo hay un .PSD para que lo descargues y lo uses en tus proyectos, lo modifiques o simplemente para que lo veas. La razón para incluir este diseño es presentarle algunas técnicas que se utilizan en la tercera parte del diseño de iconos; representación.
El primer paso debe ser recopilar todas sus ideas, echar un vistazo a Internet y a los objetos que ve a su alrededor, intentar obtener algo de inspiración (esto siempre ayuda). La segunda es esbozar algunas ideas y asegurarse de que la llamada a la acción o el mensaje que está tratando de representar sea claro, conciso y evidente. La tercera parte es el render. Esta es la parte donde empiezas a agregar color, sombreado e iluminación. En mi opinión, es la parte más emocionante ya que es cuando nuestros iconos realmente comienzan a cobrar vida..
Eche un vistazo a la PSD y debería poder ver cómo se construye el icono.
No hay duda de que los íconos se han regenerado totalmente en los últimos años, y quién hubiera pensado que los diseñadores dedicarían tanto tiempo y esfuerzo a algo que puede ser tan pequeño como 16x16px!
Sin embargo, son estos iconos los que nos ayudan a navegar por nuestros dispositivos más fácilmente y, en última instancia, a enriquecer nuestras vidas día tras día. ¿Te imaginas lo frustrante que sería la vida si regresáramos a los 70 y tuviéramos que navegar usando las instrucciones de comando? Sería una pesadilla. Afortunadamente, las cosas han progresado desde entonces y es nuestro trabajo como diseñadores empujar los límites cuando se trata de íconos; Deberíamos adoptar las tecnologías que tenemos a nuestro alrededor hoy para poder producir íconos como nunca antes se han producido. Si recién está comenzando con el diseño de iconos o aún es un icono virgen, este es un buen momento para saltar y saber que ahora está armado con el conocimiento fundamental de este artículo, que lo ubicará en el camino correcto. para crear tus propias obras maestras de iconos.
Hasta la próxima, feliz diseñando peeps.!