Besma Lola Khalfa
← All work

Yassir, SEFAR, 2022–2023. Design system, RTL, cross-team

One design language, two writing directions

Four products, four UI kits, a rebrand on the way and two writing directions. I worked on SEFAR with 19 designers, engineering and brand.

When
2022–2023
Team
19 designers, engineering, brand
My role
Product Design Manager, Mobility & B2B
What I did
Owned the iconography guidelines; contributed to colour, typography and reviews
Impact
4 squads, 24 countries, left-to-right and right-to-left
Overview of the SEFAR design system.

Context

Rider, Driver, Delivery and B2B had grown separately, each with its own kit and its own workarounds. Every decision had to hold on mobile and web, in light and dark, in French, English and Arabic.

  • Teams were solving the same problems in parallel.
  • The brand was changing under everyone's feet.
  • Arabic was too often treated as a translation, not a layout.

Share what has to be shared, keep local what is local, and decide it together.

Decisions

Write icon rules that go beyond the 24px frame

Guidelines for 16, 24 and 32px: stroke, live area, corner radius, optical alignment, filled and outline versions, states, naming.

WhySame frame, four products, and the icons still looked like they came from four companies.

Same frame, different perceived weight. Construction studies.
Same frame, different perceived weight. Construction studies.

Tokens that survive a rebrand and a change of script

Status colours that stay readable in dense ops screens and dark mode. An Arabic type scale with its own hierarchy, baseline and rhythm.

WhyA font with the right glyphs isn't an Arabic interface.

Shared foundations and component structure.
Shared foundations and component structure.

Every review starts from a real product problem

Weekly component reviews and cross-squad workshops, tested by engineering and brand before anything entered the system.

WhyA component nobody needs is a museum piece.

Try it

Most of my products ship in Arabic too. Flip this screen to see what has to mirror, and what must not.

The layout, the arrows and the progress bar mirror. The numbers and the play button don't. A play button pointing left reads as rewind.

Your trip

Step 2 of 3

PaymentCard
Amount1 250 DZD
Voice message
Confirm

Result

  • Shared foundations used across four squads.
  • Iconography rules adopted in the system.
  • A review ritual that kept the system tied to shipping.

This was a team effort with 19 designers. I owned the iconography and contributed to the rest. I'm not claiming any speed or efficiency number.

Hiring a lead or a design manager?

Remote in Europe or MENA, or hybrid from Marseille. Tell me about the product and what's stuck. I read everything.

[email protected]