Shafaq · App de métro et de bus bilingue, en arabe et en anglais

Aller au contenu
This site is also available in English.Switch to English
ENMe contacter (LinkedIn, nouvel onglet)
Projet concept2026App mobileBilingue AR et EN, RTLDesign system

Shafaq

Shafaq : App de métro et de bus bilingue, en arabe et en anglais. Métro et bus, dans les deux sens de lecture.

Rôle
Product Designer, projet personnel
Plateformes
App mobile iOS (393 x 852), en anglais (LTR) et en arabe (RTL)
Offre illustrée
App mobile bilingue, design system LTR et RTL en 2 modes (Night et Day)
Outils
Figma, workflow assisté par l’IA
Deux écrans mobiles « Ways home » : la ligne 1 en pause, un trajet rapide et un trajet sans marches, en anglais à gauche et en arabe à droite.

01 Contexte

Riyad a ouvert un métro de 6 lignes et 85 stations entre décembre 2024 et janvier 2025, et 41,6 % de la population du royaume n’est pas saoudienne. Les usagers lisent l’arabe, l’anglais ou les deux.

02 Le problème

Quand une ligne s’arrête à l’heure de pointe, l’usager doit reconstruire son trajet seul.

03 Ma réponse

L’app recalcule et propose deux trajets : le plus rapide et un trajet sans marches, chacun avec l’heure d’arrivée et les minutes en plus. Le trajet sans marches indique les ascenseurs en service et l’heure de leur vérification.

Un appui long sur la pastille EN, ع change de langue et inverse la mise en page sur place. Les composants ont des variantes LTR et RTL et une collection Locale : l’ordre et les flèches s’inversent, les heures, les prix et les cartes restent tels quels.

Deux écrans mobiles « Ways home » : la ligne 1 en pause, un trajet rapide et un trajet sans marches, en anglais à gauche et en arabe à droite.
01La ligne 1 est à l’arrêt : deux trajets pour rentrer, en anglais et en arabe.
Deux écrans mobiles du trajet sans marches avec la frise des étapes et l’état des ascenseurs, en anglais et en arabe.
02Trajet sans marches : chaque correspondance a un ascenseur en service, vérifié à l’heure près.
Trois écrans mobiles en anglais : accueil avec l’alerte ligne 1, départs en direct et recharge de la carte de transport.
03Accueil, départs en direct et recharge de la carte, avec le symbole officiel du riyal.
Planche du design system sur les règles de lecture de droite à gauche : flèches, ordre, heures, prix et cartes.
04Règles RTL : ce qui s’inverse et ce qui reste sur chaque écran.

04 Livrables

Recherche documentaire, wireframes LTR et RTL, design system (152 variables, 23 jeux de composants dont 16 en LTR et RTL), 15 écrans en anglais et en arabe, prototype de 4 parcours et 67 liens, motion du changement de langue.

152variables
210composants
15écrans
67liens de prototype

Chiffres comptés par script dans le fichier Figma.

05 Transparence

  • ClientAucun. Projet personnel, données d’exemple.
  • RechercheRecherche documentaire uniquement (ENR, SPA, GASTAT, Siemens Mobility, SAMA), lue le 13 octobre 2026. Les 3 personas sont des hypothèses. Shafaq est une marque fictive et les textes arabes doivent être relus par un locuteur natif.
  • Test utilisateurPlan de test écrit, non mené.
  • AccessibilitéRatios de contraste calculés par script à partir des variables, dans les 2 modes. Cibles d’au moins 44 pt, états écrits en mots, trajet sans marches toujours proposé. Aucune déclaration de conformité.
  • MéthodeConçu dans Figma avec un workflow assisté par l’IA, dirigé et relu par le designer.
Tous les projets

Projet suivant

Qirtas

Une facture, deux langues, écrite une seule fois.