La última línea de negocio en la que trabajé para el fondo de inversión NextChance Invest fue Billionhands. Para este proyecto, se nos pidió, basándonos en un manual de marca previamente creado, desarrollar la identidad de marca y el diseño del producto.
Billionhands es una plataforma interactiva donde los usuarios pueden votar por distintos candidatos que compiten en diversas categorías. Lo que hace único a este producto tecnológico es el uso de herramientas de inteligencia artificial, que permiten a los usuarios crear sus propios rankings de manera personalizada.
De este modo, la plataforma puede generar, a partir de un prompt específico, un ranking sobre un tema concreto en cuestión de segundos. Además, uno de sus principales atractivos es la posibilidad de crear rankings personalizados en los que puedan participar personas cercanas al creador.
Otro aspecto clave en el desarrollo de este producto tecnológico es que también funcione como una plataforma de consumo de contenido en video. Estos videos, generados por IA, están directamente relacionados con los rankings creados. Por ello, como requisito, el producto debía tener una estética y una experiencia de usuario similares a las de plataformas como Instagram o TikTok.
Proyecto
Construcción de marca y diseño de producto
Cliente
Billionhands
¿Qué hice?
Diseño producto y gráfico.
Identidad de marca
Logotipo
Tomando como base el logotipo anterior y manteniendo el mismo nombre, realizamos un ajuste tipográfico. La versión original utilizaba la tipografía ‘Nunito’, de estilo rounded. Además, el isotipo presentaba un punto de fuga incorrecto en su composición y variaciones en su construcción que parecían arbitrarias. Por ello, decidimos replantearlo, asegurándonos respetar su esencia y colores en todo momento.
Colores
En cuanto al uso del color, establecimos el coral original de la marca como color semántico y lo contrastamos con un azul oscuro. Este juego de contrastes está presente a lo largo de todo el producto. La elección del azul oscuro fué clave, ya que la interfaz iba a estar diseñada integramente en dark mode, lo que le daba a este color un papel fundamental. No queríamos limitarnos al negro, ya que buscábamos una identidad visual distintiva. A partir de estos colores, desarrollamos sus respectivas tramas para integrarlas en el diseño del producto.
Tipografía
En cuanto al uso tipográfico, como mencioné antes, decidimos hacer un cambio, reemplazando la tipografía ‘Nunito’ por ‘Satoshi’. Este cambio apuesta por la elegancia y la legibilidad, al presentar un trazo más definido y una mayor versatilidad. Optamos por una tipografía Sans Serif, ya que suele ser la elección más acertada para textos, garantizando así un uso más eficiente y coherente de la tipografía dentro de la interfaz.
Ajuste del isotipo
El ajuste del isotipo de marca era un trabajo que de alguna forma se hacia necesario. Como comentaba previamente, este contaba con elementos arbitrarios que lo complejizaban y que por tanto había que pulir. Por otro lado, el punto de fuga en el centro de la palma hacia que los dedos quedasen más dispersos y por tanto la mano se percibiese menos realista. Haciendo un estudio exaustivo acerca de que elementos debía abordar, dispuse un nuevo layout sobre el que trabajé y con el que logré ajustar dicho isotipo hasta conseguir el resultado esperado.
Billionhands 1.0
Introducción
Billionhands es una plataforma de rankings en línea donde los usuarios pueden crear sus propias tier lists con ayuda de la inteligencia artificial. Esto les permite fomentar la participación social en torno a un tema específico.
Al utilizar IA para la generación de contenido, se puede considerar un producto tecnológico. La propuesta inicial del producto se basa en el planteamiento de una landing page, la cual hace uso de imagen estática y contenido estructurado, permitiendo a los usuarios interactuar socialmente. Por ello hablamos de una experiencia de usuario cuya perspectiva apunta hacia lo tradicional.
Funcionamiento
La interfaz se centra en la búsqueda de contenido, pero va más allá de ofrecer un simple resultado: permite a los usuarios crear sus propios rankings cuando estos no existen en la plataforma, fomentando así la generación de contenido.
La barra de búsqueda es el eje central del producto, por lo que en la home page se destaca con elementos visualmente atractivos, tales como un contorno dinámico y colores degradados. La disposición del contenido sigue una línea similar a la de plataformas como ChatGPT, Gemini y Grok.
Rankings
Los rankings sugeridos por la plataforma cuentan con candidatos preseleccionados en base a su relevancia. Estos se encuentran dispuestos en forma de lista, acompañados por un botón de voto. Otra particularidad es la actualización de los mismos en vivo. Conforme los candidatos van consiguiendo votos, la lista va actualizándose, por ello, la posición que ocupan dichos candidatos depende unica y exclusivamente de los usuarios de la plataforma.
Añadir item
Una funcionalidad adicional basada en IA es la incorporación de nuevos participantes a los rankings. Cuando el usuario ingresa un prompt en el campo de texto, la aplicación sugiere opciones tanto en función de la búsqueda como de posibles candidatos que podrían añadirse al ranking. Esto permite al usuario ampliarlo de forma sencilla. Además, si la inteligencia artificial no encuentra el candidato adecuado, se ofrece la opción de agregar contenido de forma manual.
Local Guides
Con el tiempo, se identificó la necesidad de moderar la creación de contenido de la plataforma. Por ello, se propuso un plan de Local Guides para garantizar el buen funcionamiento tanto de la aplicación como de la comunidad de Billionhands.
El desarrollo del perfil de Local Guide permite a estos usuarios moderar los rankings a cambio de beneficios tales como descuentos exclusivos en productos. Para ello, se implementó un sistema de niveles e insignias que, según el progreso del usuario, otorgan acceso a herramientas específicas de moderación.
Reviews
Por otro lado, era fundamental mantener el enfoque social de la aplicación. Por ello, se consideró necesario crear un foro de debate donde los usuarios pudieran compartir opiniones sobre los ítems que formarían parte de los rankings. Para fomentar esta interacción, se implementó un sistema de comentarios que permite a los usuarios dejar reseñas y participar activamente en la comunidad.
Un cambio de rumbo
Tras varias reuniones para definir el rumbo del producto, se identificó que se estaba utilizando una gran cantidad de contenido audiovisual sin aprovecharlo al máximo. Por ello, se propuso transformar Billionhands en una plataforma de consumo de contenido, organizada en rankings donde los usuarios pudieran votar, comentar y dejar valoraciones. De este modo, la aplicación evolucionó hacia un formato similar al de plataformas como TikTok e Instagram, con el objetivo adicional de proporcionar información relevante sobre los ítems de cada ranking.
Billionhands 2.0
A diferencia de la versión anterior, este nuevo enfoque del producto incorpora diversas pantallas basadas en video, donde los usuarios pueden encontrar ítems en este formato y votar sobre los mismos.
Se trata de una plataforma interconectada, diseñada para que la experiencia de navegación evolucione de forma orgánica: al comenzar con un topic específico, el usuario puede terminar explorando rankings completamente distintos.
Campaña de lanzamiento
Al mismo tiempo, dentro del proyecto Billionhands, se desarrolló la idea para la campaña de lanzamiento de la marca. El concepto central era transmitir que, por un lado, cada persona tiene una opinión personal sobre un tema, mientras que, por otro, existe una perspectiva objetiva representada por Billionhands.
Con esta idea, se busca posicionar a Billionhands como una plataforma para contrastar datos e información, al mismo tiempo que se motiva a los usuarios a participar en ella. Para esta campaña, trabajé en las animaciones de las piezas creativas planteadas, las cuales presento a continuación.
