Most Arabic apps don't fail because of bad visuals. They fail because they feel translated: an English product with the layout flipped and the copy swapped. Users notice in seconds. After 7+ years of designing Arabic and bilingual apps for startups across MENA, this is the checklist I run through before any RTL design goes to development.
Layout and direction
1. Mirror the layout, not everything in it
Navigation, lists, progress steps and back buttons should flip. But media controls, clocks, charts with a time axis, phone numbers and brand logos should not. Make a short "do not mirror" list per project and hand it to developers with the designs.
2. Mirror directional icons only
Arrows, chevrons, "reply" and "send" icons point in the reading direction, so they flip. A search magnifier, a checkmark, a camera or a heart has no direction, so it stays the same. Flipping everything is the most common RTL mistake I see in reviews.
3. Design with logical spacing
Think in "start" and "end" instead of "left" and "right". If a card has 24px padding on the left in English, it needs 24px on the right in Arabic. Building your components with start/end values in Figma (and margin-inline-start in CSS) makes the mirrored version almost free.
4. Check gestures and swipe actions
Swipe-to-delete, carousels and onboarding pagers all have a direction. In RTL, "next" is a swipe to the right. Test these in a prototype, not just on static screens.
Typography
5. Pick a real Arabic typeface
A Latin font with a fallback Arabic font gives you mismatched weights and baselines. Choose a family designed for Arabic (or a true bilingual family) and test every weight you plan to use.
6. Give Arabic more line height
Arabic letters have taller ascenders and deeper descenders, plus diacritics. Body text that looks fine at 1.4 line height in English often needs 1.6–1.8 in Arabic to avoid clipped dots and cramped lines.
7. Don't use letter-spacing or fake italics
Arabic is a connected script. Letter-spacing breaks the joins, and slanted "italic" Arabic looks broken. Use weight and color for emphasis instead.
8. Plan for text length changes
Arabic copy can be shorter or longer than English depending on the phrase. Buttons and tabs need room to grow, so avoid fixed widths that only fit the English label.
Content and data
9. Decide on numerals early
Western (123) or Eastern Arabic (١٢٣) numerals? Both are used across the region. Pick one per market, keep it consistent, and make sure prices, dates and phone numbers follow the same rule.
10. Handle mixed-direction text
Product names, emails, URLs and code inside Arabic sentences are left-to-right. Design and test real examples like "طلبك رقم #A-2041 جاهز" so you see how the text engine reorders them before users do.
11. Localize dates, currency and forms
Currency symbols, date formats, the Hijri calendar where relevant, and name fields (many users have more than first and last name) are part of the design, not an afterthought for developers.
Validation
12. Test with native readers on real devices
Run at least one quick usability session with native Arabic speakers on a real phone. Five users in thirty minutes each will catch tone, wording and flow issues that no checklist can.
See it in real projects
You can see these rules applied in apps I designed for Arabic-first markets, like Qarib food delivery, Waddini ride hailing and the Almenasa Arabic analytics dashboard.