_2025_BBVA_SISTEMA DE DISEÑO

_2025_BBVA_SISTEMA DE DISEÑO

_2025_BBVA_SISTEMA DE DISEÑO

Patrón de Motion

Patrón de Motion

Patrón de Motion

Reglas creadas para la normalización de las animaciones de elemento del sistema de diseño de BBVA.

Reglas creadas para la normalización de las animaciones de elemento del sistema de diseño de BBVA.

Reglas creadas para la normalización de las animaciones de elemento del sistema de diseño de BBVA.

RETO

RETO

RETO

Establecer unas guías para la creación y estandarización de las animaciones de componentes e interacciones del sistema de diseño.

Establecer unas guías para la creación y estandarización de las animaciones de componentes e interacciones del sistema de diseño.

Establecer unas guías para la creación y estandarización de las animaciones de componentes e interacciones del sistema de diseño.

MI ROL

MI ROL

MI ROL

Diseñador UX/UI

Diseñador UX/UI

Diseñador UX/UI

EMPECEMOS POR LA BASE

EMPECEMOS POR LA BASE

EMPECEMOS POR LA BASE

El patrón de Motion del sistema de diseño de BBVA es la guía para el uso de la animación en sus productos digitales. Aquí se encuentran los fundamentos en los que se basa este patrón, como su personalidad, principios y propiedades de animación.

El objetivo principal es ayudar a mantener una experiencia de usuario coherente en todos los canales mediante patrones de animación establecidos que ayudarán a los diseñadores a tomar decisiones claras.

El patrón de Motion del sistema de diseño de BBVA es la guía para el uso de la animación en sus productos digitales. Aquí se encuentran los fundamentos en los que se basa este patrón, como su personalidad, principios y propiedades de animación.

El objetivo principal es ayudar a mantener una experiencia de usuario coherente en todos los canales mediante patrones de animación establecidos que ayudarán a los diseñadores a tomar decisiones claras.

El patrón de Motion del sistema de diseño de BBVA es la guía para el uso de la animación en sus productos digitales. Aquí se encuentran los fundamentos en los que se basa este patrón, como su personalidad, principios y propiedades de animación.

El objetivo principal es ayudar a mantener una experiencia de usuario coherente en todos los canales mediante patrones de animación establecidos que ayudarán a los diseñadores a tomar decisiones claras.

PROCESO DE TRABAJO

PROCESO DE TRABAJO

PROCESO DE TRABAJO

El proceso de creación del patrón de animación comenzó con una investigación exhaustiva de las tendencias actuales en animación de interfaces, así como un análisis de las necesidades específicas del sistema de diseño del BBVA.

Con esta base, definimos los objetivos del patrón, buscando garantizar coherencia y mejorar la usabilidad.

El proceso de creación del patrón de animación comenzó con una investigación exhaustiva de las tendencias actuales en animación de interfaces, así como un análisis de las necesidades específicas del sistema de diseño del BBVA.

Con esta base, definimos los objetivos del patrón, buscando garantizar coherencia y mejorar la usabilidad.

El proceso de creación del patrón de animación comenzó con una investigación exhaustiva de las tendencias actuales en animación de interfaces, así como un análisis de las necesidades específicas del sistema de diseño del BBVA.

Con esta base, definimos los objetivos del patrón, buscando garantizar coherencia y mejorar la usabilidad.

Además de su funcionalidad, el patrón de animación también refleja una personalidad que transmite cercanía y dinamismo, alineándose con los valores de la marca.

Desde el inicio, se buscó que las animaciones no solo mejoraran la usabilidad, sino que también aportaran un toque distintivo y humano, creando una experiencia más memorable para el usuario.

Además de su funcionalidad, el patrón de animación también refleja una personalidad que transmite cercanía y dinamismo, alineándose con los valores de la marca.

Desde el inicio, se buscó que las animaciones no solo mejoraran la usabilidad, sino que también aportaran un toque distintivo y humano, creando una experiencia más memorable para el usuario.

Además de su funcionalidad, el patrón de animación también refleja una personalidad que transmite cercanía y dinamismo, alineándose con los valores de la marca.

Desde el inicio, se buscó que las animaciones no solo mejoraran la usabilidad, sino que también aportaran un toque distintivo y humano, creando una experiencia más memorable para el usuario.

Más tarde pasamos a la fase de diseño y prototipado, creando interacciones que fueron validadas y ajustadas en iteraciones. Se trabajó estrechamente con el equipo de desarrollo para implementar el patrón, asegurando su futura correcta integración y consistencia en los productos digitales.

Más tarde pasamos a la fase de diseño y prototipado, creando interacciones que fueron validadas y ajustadas en iteraciones. Se trabajó estrechamente con el equipo de desarrollo para implementar el patrón, asegurando su futura correcta integración y consistencia en los productos digitales.

Más tarde pasamos a la fase de diseño y prototipado, creando interacciones que fueron validadas y ajustadas en iteraciones. Se trabajó estrechamente con el equipo de desarrollo para implementar el patrón, asegurando su futura correcta integración y consistencia en los productos digitales.

La accesibilidad fue un pilar fundamental en el desarrollo de este patrón de animación.

Desde el principio, se consideraron las necesidades de todos los usuarios, asegurándonos de que las animaciones no generaran distracciones ni dificultaran la navegación, siendo sutiles sin parpadeos y proporcionando unos controles para pausar las animaciones largas.

La accesibilidad fue un pilar fundamental en el desarrollo de este patrón de animación.

Desde el principio, se consideraron las necesidades de todos los usuarios, asegurándonos de que las animaciones no generaran distracciones ni dificultaran la navegación, siendo sutiles sin parpadeos y proporcionando unos controles para pausar las animaciones largas.

La accesibilidad fue un pilar fundamental en el desarrollo de este patrón de animación.

Desde el principio, se consideraron las necesidades de todos los usuarios, asegurándonos de que las animaciones no generaran distracciones ni dificultaran la navegación, siendo sutiles sin parpadeos y proporcionando unos controles para pausar las animaciones largas.

ESTABLECIENDO LAS REGLAS PARA LO QUE VENDRÁ

ESTABLECIENDO LAS REGLAS PARA LO QUE VENDRÁ

ESTABLECIENDO LAS REGLAS PARA LO QUE VENDRÁ

Este patrón de animación ha marcado un antes y un después en la estandarización de las animaciones dentro del sistema de diseño del BBVA.

Gracias a este trabajo, se han establecido las bases que permitirán desarrollar futuras microinteracciones, haciendo que los productos digitales sean más atractivos y mejoren la experiencia del usuario. Este avance representa un paso clave hacia un diseño más coherente y dinámico.

Este patrón de animación ha marcado un antes y un después en la estandarización de las animaciones dentro del sistema de diseño del BBVA.

Gracias a este trabajo, se han establecido las bases que permitirán desarrollar futuras microinteracciones, haciendo que los productos digitales sean más atractivos y mejoren la experiencia del usuario. Este avance representa un paso clave hacia un diseño más coherente y dinámico.

Este patrón de animación ha marcado un antes y un después en la estandarización de las animaciones dentro del sistema de diseño del BBVA.

Gracias a este trabajo, se han establecido las bases que permitirán desarrollar futuras microinteracciones, haciendo que los productos digitales sean más atractivos y mejoren la experiencia del usuario. Este avance representa un paso clave hacia un diseño más coherente y dinámico.