Super-App UI Breakdown: How Careem, Gojek & Grab Design the Home Screen

The Hardest Home Screen in Consumer Mobile

A single-purpose app has it easy. Spotify shows you music. Uber shows you a map. But a super-app has to put six to twelve different services — rides, food, payments, groceries, bills, rewards — onto one home screen and still make a user feel oriented within five seconds of opening it.

Get it wrong and the home screen reads as a cluttered launcher. Get it right and it feels like a personal concierge. The teams that have solved this best operate in the two regions where super-apps actually won: MENA and Southeast Asia. We pulled three of them from our library — Careem, Gojek, and Grab — and broke down how each lays out that critical first screen.

The Super-App Home Screen Problem

Every super-app home screen is a negotiation between two opposing forces:

• Contextual vs. exhaustive. Should the home screen show everything the app can do (discoverability) or what this user needs right now (focus)? Lean too exhaustive and it's a wall of icons; too contextual and users can't find services they don't use daily.
• Feature discovery without overwhelm. A new service only earns revenue if users find it. But every promoted service competes with the core action (usually a ride or a meal) for the same scarce real estate.
• One layout, many markets. These apps span dozens of countries, languages, and network conditions. The same home screen has to work in Arabic right-to-left, on a budget Android phone, and on a flagship iPhone.

Each app below resolves these tensions differently — and that's exactly what makes them worth studying.

1. Careem (MENA) — Simplicity Inside Complexity

Careem started as ride-hailing and grew into a regional super-app for the Middle East. Its design signature is restraint: even as services multiplied, the home screen stays calm.

Service grid, prioritized: Careem leads with a tidy grid of service tiles — clear icons, short labels, and a deliberate ordering that puts the highest-intent actions (ride, then food/delivery) first. It resists the temptation to surface every service at once, using progressive disclosure for the long tail.

RTL as a first-class citizen: Because Careem serves Arabic-speaking markets, its entire layout system has to mirror cleanly for right-to-left reading — navigation, icons, progress indicators, and text alignment all flip. This is one of the best real-world references for designing an RTL-ready layout, not as an afterthought but baked into the grid.

Trust on the transport flow: Like all the best ride apps, Careem layers trust signals — driver identity, vehicle details, live tracking — into the booking flow rather than burying them.

Takeaway for designers: Progressive disclosure is what lets a multi-service app stay calm. Show the few things most users want, and make the rest one tap away. If you serve RTL markets, study Careem's mirroring on the navigation and profile pattern pages.

2. Gojek (Indonesia / SEA) — The Grid-Heavy Approach

Gojek takes the opposite philosophy to Careem: it embraces density. Its home screen is famous for a wall of service icons — GoRide, GoFood, GoPay, GoSend and many more — and it makes that density work.

The 12+ service grid: Gojek treats its service grid as the hero, not a secondary menu. The ordering and grouping do heavy lifting: the most-used services sit in the top rows, with a clear visual system so users can pattern-match an icon rather than read every label.

Wallet at the top: GoPay balance lives near the top of the screen, treating payments as the connective tissue between every other service. That's a deliberate hierarchy choice — the wallet is what makes a collection of services feel like one app.

Promo banners and discovery: Gojek uses prominent promo banners to drive cross-service discovery (order food, get a payment cashback) without crowding the core grid. It's a careful balance between conversion and clutter.

Designing for low-bandwidth markets: Built for a market with huge device and network diversity, Gojek's UI favors fast-loading, legible, icon-led layouts over heavy imagery — a useful reminder that performance is design.

Takeaway for designers: Density isn't automatically bad — unstructured density is. Gojek proves a 12-icon grid can feel navigable if ordering, grouping, and a consistent icon system carry the weight. See more grid and menu approaches on the navigation page.

3. Grab (SEA) — The Most Polished Execution

Grab is arguably the most refined of the three. Operating across Southeast Asia, it has iterated its home screen and navigation more than almost any consumer app in the region.

Tab bar that evolved: Grab's bottom navigation has matured over many versions into a clear split between core verticals — transport, food, finance, and rewards. The tab bar anchors the app while the home screen handles contextual promotion, a combination that scales gracefully as services grow.

Service categorization: Rather than one flat grid, Grab groups services into recognizable categories (move, eat, pay), which lowers the cognitive cost of finding the right one. Categorization is what lets Grab add services without the home screen collapsing into noise.

Rewards as navigation: GrabRewards isn't tucked in a settings menu — loyalty is surfaced as a first-class element, turning points and tiers into a reason to keep returning. Using rewards as a navigational and retention surface is a pattern most apps under-use.

Micro-interactions: Grab invests in small animations on service taps and transitions, which makes a dense app feel responsive and premium rather than utilitarian.

Takeaway for designers: A stable tab bar plus a contextual home screen is the most scalable super-app pattern — the tabs give permanence, the home gives flexibility. Study Grab's structure on the navigation and pricing pages.

Side-by-Side: Three Home Screens Compared

5 Patterns Worth Stealing

These generalize well beyond ride-hailing — any app with multiple modes or services can use them:

1. Progressive disclosure (Careem). Show the few highest-intent actions; make the long tail one tap away. It's the antidote to launcher-screen clutter.
2. An RTL-ready layout system (Careem). If you might ever serve right-to-left markets, design the mirroring in from the start instead of retrofitting it.
3. Structured density (Gojek). A dense grid is fine if ordering, grouping, and a consistent icon system make it scannable. Performance-first UI is part of that.
4. Stable tabs + contextual home (Grab). Anchor the app with a tab bar of core verticals, and let the home screen flex with promotions and context.
5. Rewards as a navigation surface (Grab). Treat loyalty as a first-class, returnable destination — not something buried in settings.

The shared lesson across all three: a super-app home screen is an exercise in hierarchy, not inventory. The winners aren't the apps that show the most services — they're the ones that make the right service obvious in five seconds.

See These Screens for Yourself

The best way to absorb these patterns is to study the real screens side by side. Browse the available flow sequences for Careem, Gojek, and Grab on Gummble, or explore the navigation and dashboard pattern collections to compare how dozens of apps structure complex home screens.

See also: Mobile dashboard design examples · iOS vs Android UI design comparison · Settings screen design examples

---

Want more design inspiration? Browse 1,500+ apps on Gummble — across shipped iOS, Android, and web products.