HomeCasa Choose a mobile app navigation pattern: tab bar, drawer or other
Compare tab bars, navigation drawers, top tabs and other patterns for your app, with a justified recommendation, section structure, iOS and Android conventions and a validation plan. Designed for ChatGPT, Claude, Gemini and Microsoft Copilot. It includes 6 customizable variables and you can copy it for free in one click.
Intermediate · Text · Pending editorial review
Prompt
Act as an interaction designer specializing in native and cross-platform mobile apps.
Context:
- App: {{app}}
- Platform: {{platform}}
- Current sections or destinations: {{sections}}
- Main tasks and their frequency: {{tasks}}
- Users: {{users}}
- Current navigation problem (if any): {{problem}}
Deliverables:
1. An inventory of destinations grouped by frequency and importance, showing which are top level and which can live inside other sections or the profile.
2. A comparison table of patterns (bottom tab bar, navigation drawer, top tabs, hub-and-spoke, floating action button, contextual navigation): pros, cons and fit for this app from 1 to 5.
3. A final recommendation with the concrete structure: which destinations go in the bar (max 5), proposed icons and labels, what happens to the rest and which screen opens first.
4. Platform conventions: back button or gesture behavior, preserving each tab's state, deep links and notifications that open a section.
5. A text description of the navigation wireframe on the home screen and on a detail screen.
6. Edge cases: notification badges, open keyboard, landscape orientation and tablets.
7. Accessibility: text labels alongside icons, 44 pt / 48 dp touch targets, logical screen reader order and an announced selected state.
8. Validation plan: a tree test or first-click test with 5-8 tasks and success metrics.
Constraints:
- Do not invent analytics; if you need data, use [FILL IN: real usage data].
- Justify the recommendation with user tasks, not trends.
- If key data on usage frequency is missing, ask me before recommending.
Format: comparison table, recommendation with the structure as a list, text wireframe and validation plan.How to use it
- List every current section and the most frequent tasks. 2. Review the comparison table with your team and pick a structure. 3. Validate it with a tree test before moving to high fidelity.
Usage example
App: food delivery · Platform: both · Sections: home, search, orders, favorites, coupons, profile, help · Problem: nobody finds the coupons.
Sample output
Pattern comparison
| Pattern | Pros | Cons | Fit (1-5) |
|---|---|---|---|
| Bottom tab bar | Always visible, within thumb reach | Max 5 destinations | 5 |
| Navigation drawer | Fits many destinations | Hides what matters (today's coupon problem) | 2 |
| Top tabs | Good for sibling views | Far from the thumb | 2 |
| Floating action button | Highlights one action | No single dominant action | 1 |
Recommendation
A bottom bar with 4 destinations, justified by task frequency:
- Home (house): ordering food, a weekly task.
- Search (magnifier): an alternative starting point for ordering.
- Orders (receipt): tracking happens on every order; badge for the active order.
- Profile (person): favorites, help and settings live inside.
Coupons: no tab of their own (monthly use), but shown in the cart summary and as a card on Home, right where they're needed. The app opens on Home.
Validation
A first-click test with 6 tasks, e.g., "You have a discount code; where would you use it?". Success: ≥ [FILL IN: threshold] correct first clicks…
Key facts
- Category
- UI/UX design · Mobile interfaces
- Output type
- Text
- Level
- Intermediate
- Designed for
- ChatGPT, Claude, Gemini and Microsoft Copilot
- Verified in
- Pending editorial verification
- Variables
- App, Platform, Current sections, Tasks and frequency, Users and Current problem
- Language
- English
- Price
- Free, no sign-up
- Updated
- Nov 7, 2026
Frequently asked questions
How many tabs can a bottom navigation bar have?
Three to five. Beyond five, destinations become hard to tap and to understand, so group or move secondary sections into the profile.
Is the hamburger menu a bad idea?
Not always, but it hides destinations and usually lowers discoverability. It works best for infrequent sections or apps with many equally important destinations.
What is this prompt for?
Compare tab bars, navigation drawers, top tabs and other patterns for your app, with a justified recommendation, section structure, iOS and Android conventions and a validation plan.
Which AI tools does it work with?
It is designed for ChatGPT, Claude, Gemini and Microsoft Copilot. We have not verified it in these tools yet, so results may vary between them.
How do I customize the prompt?
Click “Customize” and fill in the variables (App, Platform, Current sections, Tasks and frequency, Users and Current problem). The text updates instantly and you can then copy it in one click. Values are stored only in your browser.
Do I need experience to use it?
It is intermediate: it helps to know the topic so you can provide good context and review the result critically.
Is this prompt free?
Yes. Every HomeCasa Prompts prompt is free, with no sign-up or subscription. You can also use them in professional projects.
Can I trust the AI output?
Treat it as a high-quality draft: always check data, figures and important claims before publishing or making decisions.