Shasha isn’t just a streaming platform: it’s where Arab storytelling finds its screen.
An Arabic-first OTT streaming experience across mobile, smart TV and web, designed right-to-left from the first wireframe for audiences across the Middle East.
Benchmarking
Understanding the Arabic cultural media landscape
Before drawing a single screen, we examined the world’s leading OTT platforms, analysing features, UX patterns, visual systems and cross-device compatibility. The goal: map what fails, extract what works, and find the exact gaps where Shasha could lead.
RTL is a foundation, not a feature
Every competitor treats Arabic as a localisation layer added on top of an English product. Layouts, spacing logic and reading flow are designed LTR-first; Arabic is an afterthought. Shasha had the opportunity to reverse this entirely.
TV UX is a discipline of its own
No competitor invests meaningfully in the 10-foot experience. Mobile patterns are copy-pasted onto TV screens: focus states are invisible, type is unreadable from a distance, and D-pad navigation is broken. TV was universally the weakest touchpoint.
Discovery is broken everywhere
Across the platforms studied, content rails lack hierarchy, paid vs. free states are poorly communicated, and geo-blocking offers no feedback. Users are abandoned mid-journey with no clear path forward. This became one of Shasha’s clearest design opportunities.
Discovery highlights
- 4+
- Competitor platforms analysed
- 100
- Screens designed
- 3
- Platforms built from one system
Platforms studied
A close look at the streaming giants
We audited each platform across mobile, TV and web, noting UX patterns, information architecture, RTL handling and visual language quality, then distilled the signals into themes.
Netflix
Disney+
Apple TV+
Prime Video
StarzPlay
Mobile app
Designing for thumb-first, scroll-native discovery
The mobile app was built around content-first bottom navigation, cinematic hero cards and a live broadcast rail. Arabic RTL was designed first; English LTR was adapted from it, not the reverse.
Content-first navigation
Bottom tab navigation keeps core actions reachable with one thumb. The UI disappears behind the content: a dark background ensures thumbnails and artwork are always the focal point.
Live and real-time states
The live badge (مباشر) is a persistent urgency signal surfaced at the top of every session. Paid vs. free content is clearly badged at card level, no surprises, no interruption to the browsing flow.
Player as a first-class experience
Skip intro, skip credits and fast-forward are one-tap controls, not buried in menus. Chromecast and AirPlay handoff states are integrated directly into the player UI.
Smart TV
The 10-foot experience
TV UX operates by completely different rules. Text must be legible from three metres. Navigation must work with a D-pad. Focus states become the primary interaction signal. We designed across Samsung TV, LG TV, Apple TV and Android TV from a single visual system.
Cinematic hero, minimal chrome
The hero is full-bleed artwork with minimal UI overlay, the show does the selling. A season and episode sidebar gives persistent context so users always know where they are in the content hierarchy.
D-pad-first interaction model
Every interaction was designed for a remote control, not a touchscreen. Focus rings are visible on both dark and light artwork. Free vs. paid badges appear per episode, no subscription surprises mid-binge.
Four platforms, one visual system
Samsung, LG, Apple TV and Android TV each have different technical constraints and store guidelines, yet all share the same Shasha identity, spacing system and component logic. Picture-in-picture is supported across all variants.
Design system
A visual identity rooted in Arabic culture
From benchmarking emerged a clear direction: bold, editorial and culturally grounded. Shasha’s design system uses a distinctive accent to cut through the visual noise of the Arabic media landscape, memorable, legible on every screen size, and RTL-native from the ground up.
Editorial homepage
A full-bleed cinematic hero makes content the first and only impression on load. Hover-state card previews let users discover more without leaving the browsing context.
Transparent geo and access states
Geo-blocking is communicated with clear, helpful empty states: users always understand why content isn’t available and what their options are. Subtitle, language and quality controls are reachable within two interactions in the player.
One Shasha, everywhere
Watchlist, profiles and viewing history sync across mobile, TV and web in real time. Start on a phone, continue on the TV, the experience picks up exactly where it left off.
The approach
Three platforms. One cohesive product.
Each surface required its own design logic, but one identity tied them together. Here’s how we thought before we drew anything.
