FEEDER

Tecnología de vanguardia para el análisis del comportamiento de los usuarios.

 

Identidad Visual / UX / UI / Diseño Visual

 
 
 

IDENTIDAD VISUAL

Logotipo

Para la identidad visual de Feeder, tecnología de vanguardia para analizar el comportamiento del usuario midiendo sus reacciones y emociones a través de tecnología de reconocimiento facial, planteé en un inicio varias líneas conceptuales, cada cual diferente pero con la intención en todos ellas de significar las bases de la plataforma (convirtiéndose por tanto en requerimientos).

Por un lado, la reacción de un usuario a un contenido audiovisual que le es enviado; por el otro, mostrar el reconocimiento facial, de las emociones, que es la base para el análisis de dicha reacción.

Además, el hecho que pudiese transmitir connotaciones positivas, de afabilidad, confianza, etc. era especialmente interesante, dado que los temas vinculados con el reconocimiento facial y emocional (por tratarse de un tema novedoso y con aspectos complejos inherentes al mismo) hoy en día todavía generan cierta controversia, aunque es cierto que cada vez menos.

 
 
 

Planteado esto, el siguiente paso era ver cómo se podían juntar los requerimientos citados en un único concepto visual. En relación al “flow”, es decir, la forma de funcionar de la propia plataforma, el proceso, el usuario recibe un contenido audiovisual y envía su reacción a dicho contenido de vuelta, y esto se produce mediante el reconocimiento facial de las emociones del usuario.

Para mostrar dicho reconocimiento facial en la que se basa Feeder, la solución más obvia fue la utilización de una cara, pero en este caso, casi a nivel simbólico, y que a la vez reflejase aspectos positivos (la opción más evidente, que estuviese riendo o sonriendo)

Después de numerosas iteraciones, decidí usar el propio proceso como base de la estructura. Así, los usuarios (representados como círculos) tomarían el papel de los ojos en la hipotética cara y la línea de la reacción, haciéndola curva, podía asemejarse a una sonrisa.

De este modo, el funcionamiento de Feeder estaba implícito en la figura, teníamos la representación de la cara a nivel básico y, además, con las connotaciones comentadas de positividad.

Seguidamente, se optó por rotar el logotipo 45º, con la idea de que la flecha más recta y directa (la que implica el envío del contenido al usuario) tuviese también concordancia con la propia física, debido a que sigue la lógica de la gravedad, ya que estaría “cayendo”, pero manteniendo el entendimiento de que se reflejaba una cara.

Una vez definido esto, la siguiente fase en el diseño sería crear el propio “armazón” de la figura, que englobase la estructura y el “flow” comentados, y que fuese visualmente atractiva y comunicativa.

Conformada esta base, el trabajo se centró, por un lado, en los aspectos visuales: proporciones, ratios, tamaños, sombras, etc. Por el otro, las tipografías y estructuras en vertical y horizontal y, finalmente, generar todo el lenguaje visual, que estuviese alineado con lo que se quería transmitir con el logotipo: colores vibrantes, formas dinámicas, rotundidad, confianza…

De esta manera, el resultado obtenido es tanto un logotipo como una identidad visual que transmiten todos los valores, ideas y conceptos requeridos, fácilmente reproducibles en diferentes ámbitos y con un lenguaje visual que refuerza el mensaje que se trata de proyectar.

Además, cabe señalar que como el propio “flow” está integrado de manera implícita en el logotipo, nos permite crear animaciones de este tipo, en las que se muestra la base de funcionamiento de la plataforma.



FEEDER METRICS: DASHBOARD

Conceptualización y diseño desde 0.

FEEDER APP

Conceptualización y diseño desde 0.

WEBSITE

En relación al website, la idea lógicamente era mantener la transversalidad en relación a la identidad y al diseño visual ya creados.

A nivel de mensaje y contenido, el foco estaría en Feeder Metrics, la plataforma/dashboard de gestión y visualización del análisis emocional que proporciona Feeder.

En relación a la parte superior de la web, la correspondiente al “header”, la dividí en dos niveles, mostrando el superior y dejando el segundo oculto en primera instancia: de este modo, nada más llegar a la web, el usuario vería la imagen de una chica que, sorprendida, mira un contenido en su teléfono y, a continuación, aparece el lema de Feeder, “Dont’ act, React”.

Cuando el usuario navega hacia abajo, vinculamos la emoción mostrada por parte de la chica pero no al contenido que está viendo, si no a lo que es Feeder. Para ello introducimos un efecto “parallax” y mediante el lenguaje visual de Feeder, mostramos un paisaje que, por un lado, tiene aires futuristas, para representar que Feeder es “el futuro en el reconocimiento facial en marketing” y, por el otro, tiene un horizonte en el que se pierde la vista, representado el enorme y nuevo campo de posibilidades que se ofrece (con el guiño de que las montañas están creadas mediante las gráficas propias de la herramienta).

A lo largo de toda la web, la idea fue utilizar los recursos de las animaciones, “parallax”, y elementos gráficos en puntos concretos y específicos, siempre con la intención de enfatizar el mensaje transmitido vinculado a cada sección, y para aumentar la fuerza comunicativa. Por otro lado, las partes relativas a los textos serían extremadamente claras, minimalistas y con gran espacio negativo, para facilitar la lectura de los mismas como objetivo principal y, como secundario, funcionar como contrapeso y equilibrio a los colores vibrantes y a las formas energéticas propias de la identidad visual Feeder.