Tatweer Education · Design System

Elevating every day,
from brand to product

Tatweer Education está construyendo una marca capaz de representar de forma integrada todo su ecosistema y su contribución al futuro de la educación en Arabia Saudí. Nuestro reto compartido es llevar esa ambición al entorno digital.

FutureBrand × MRMTribal

Descubrir el proyecto

01 / MRMTribal + Equipo

De la estrategia de marca al producto digital

Somos el equipo especializado en producto y experiencia digital que trabajará junto a FutureBrand y Tatweer para trasladar la nueva identidad a un Sistema de Diseño útil, coherente y escalable.

FutureBrand ha definido la estrategia y la identidad de Tatweer Education. Nuestro papel es convertir esa dirección en principios, reglas, foundations, componentes y patrones aplicables a productos digitales.

Estrategia y diseño de producto digital
Creación y evolución de Sistemas de Diseño
Traducción de marca a entornos digitales
Arquitecturas escalables
Accesibilidad y responsive
Conexión entre diseño, producto y tecnología

El equipo MRMTribal

Tres perfiles complementarios, una misma responsabilidad compartida sobre la calidad del sistema.

Daniel Llorente

Brand & Design Experience Director

Aporta dirección estratégica, experiencia en branding y visión sobre cómo trasladar una marca a experiencias y productos digitales.

Cristina Álamo

Project Lead & Design System Architect

Lidera el proyecto, la metodología, el alcance y la arquitectura del Sistema de Diseño, coordinando diseño, producto y tecnología.

Celia López

Product Designer

Trabaja en la adaptación de la identidad al entorno digital y en la definición de principios visuales, foundations, componentes y comportamientos.

02 / El reto

De identidad visual a infraestructura digital.

Traducir Elevating Everyday a un Design System escalable que dé servicio a la master brand y sus tres submarcas, funcione en árabe e inglés (LTR y RTL) y establezca una base accesible, responsive y reutilizable para futuros productos digitales.

Ambición compartida

Definir cómo vive la nueva marca en producto digital.

No buscamos

Una librería genérica desconectada de usos reales.

El sistema conecta

Marca → reglas → foundations → componentes → patterns → producto.

Criterio de éxito

Un sistema usable, documentado y preparado para crecer.

03 / Enfoque

Un sistema conectado con la realidad del producto

Marca, ecosistema digital, necesidades de negocio y realidad técnica se contemplan como partes de una misma definición.

El beneficiario como referencia

Las interfaces deben ayudar a las personas a avanzar con claridad y mantener al beneficiario en el centro de la experiencia.

La marca traducida a decisiones digitales

Servicio, progreso, cercanía, rigor e integración se traducirán en jerarquía, composición, interacción, accesibilidad y comportamiento.

Un sistema bilingüe desde su definición

Árabe e inglés, RTL y LTR, se contemplarán desde la estructura inicial y se validarán con los interlocutores adecuados.

Aplicación en producto

Una selección de pantallas permitirá comprobar cómo funcionan juntos foundations, componentes y patrones.

Una arquitectura integrada

Una base común y una lógica controlada de variación darán cabida a las diferentes marcas sin fragmentación ni uniformidad forzada.

Un lenguaje compartido con desarrollo

Tokens, nomenclatura, propiedades, estados y organización se contrastarán con el equipo técnico. La entrega termina en Figma; buscamos decisiones comprensibles y trazables.

04 / AI-friendly

Un sistema más claro para las personas y más fácil de interpretar por la IA

Aplicaremos una mentalidad AI-friendly a la propia definición y documentación del sistema.

Lenguaje semántico

Nombres que describen función y propósito, no solo apariencia.

Arquitectura predecible

Relaciones consistentes entre foundations, componentes, variantes y patrones.

Componentes con intención

Qué necesidad resuelven, cuándo se usan y cuáles son sus límites.

Reglas explícitas

Principios y criterios que hacen las decisiones comprensibles.

Contexto de uso

Ejemplos, estados, restricciones y relaciones con producto.

Contenido estructurado

Conocimiento fácil de buscar, recuperar y reutilizar.

05 / Alcance

Alcance de esta primera versión

Una base completa y operativa, documentada en Figma y preparada para evolucionar.

FoundationsComponentesMódulosAplicación

Scope del proyecto

Principios de diseño digital.
Adaptación digital de color, tipografía e iconografía.
Foundations y arquitectura de tokens.
Arquitectura integrada para Tatweer Education y sus marcas.
Estados, propiedades y variantes de los componentes.
Criterios para árabe e inglés y contextos RTL/LTR.
Accesibilidad y responsive.
Librería de componentes (45 aprox. hasta cerrar backlog final).
Librería de módulos (10 aprox. hasta cerrar backlog final).
Documentación semántica y funcional.
Aplicación en 5 pantallas representativas.
Formación para equipos internos de diseño y preparación del handoff.

Nuevas oportunidades

Ampliación de módulos y patrones.
UX Writing aplicado a producto.
Canal app.
Ampliación representativa en productos menos representativos fuera del canal web.
Soporte y mantenimiento posterior.
Ilustración y motion avanzado.

06 / Roadmap

Un proceso progresivo para comprender, definir, construir y escalar

Del 14 de septiembre al 15 de diciembre, con fases que se solapan y validaciones en los momentos adecuados.

14 sep. — principios de oct.

Alignment & Discovery

Scope y criterios de éxito
Auditoría del ecosistema actual
Inmersión estratégica de marca con FutureBrands
Research de usuarios y competidores
Alineación y modelo de colaboración
Análisis técnico y de arquitectura

Finales de sep. — mediados de oct.

Definición Digital

Principios de diseño y línea gráfica
Set up y arquitectura de la librería
Contrato de tokens y namings con desarrollo
Arquitectura de foundations y tokens
Arquitectura multi-brand
Listado de componentes, módulos y pantallas

Octubre — noviembre

Construcción del Sistema

Construcción de librerías
Setp up de Variables y estilos
Documentación de uso
Documentación de accesibilidad

Finales de nov. — 15 dic.

Escala y Hand off

Review de documentación final
QA
Puesta en práctica de las librerías
Onboarding a equipos internos
Transferencia

07 / Colaboración

Marca, producto y tecnología avanzan en paralelo

MRMTribal conecta y orquesta las tres disciplinas para convertirlas en una única dirección de trabajo.

Tecnología

Producto

Marca

Diaria

Coordinación interna

Dailies MRMTribal para anticipar dependencias y mantener alineado al equipo.

Semanal

PMO

Avance, hitos, dependencias, riesgos y decisiones necesarias.