Navigationsmuster für eine mobile App wählen: Tab-Bar, Drawer oder anderes
Vergleiche Tab-Bar, Navigation Drawer, obere Tabs und weitere Muster für deine App, mit begründeter Empfehlung, Bereichsstruktur, iOS- und Android-Konventionen und Validierungsplan. Entwickelt für ChatGPT, Claude, Gemini und Microsoft Copilot. Er enthält 6 anpassbare Variablen und lässt sich kostenlos mit einem Klick kopieren.
Fortgeschritten · Text · Redaktionelle Prüfung ausstehend
Prompt
Handle als Interaction Designer mit Schwerpunkt auf nativen und plattformübergreifenden Mobile-Apps.
Kontext:
- App: {{app}}
- Plattform: {{plattform}}
- Aktuelle Bereiche oder Ziele: {{bereiche}}
- Hauptaufgaben und ihre Häufigkeit: {{aufgaben}}
- Nutzer: {{nutzer}}
- Aktuelles Navigationsproblem (falls vorhanden): {{problem}}
Liefergegenstände:
1. Inventar der Ziele, gruppiert nach Häufigkeit und Wichtigkeit, mit Angabe, welche auf oberster Ebene stehen und welche in anderen Bereichen oder im Profil liegen können.
2. Vergleichstabelle der Muster (untere Tab-Bar, Navigation Drawer, obere Tabs, Hub-and-Spoke, Floating Action Button, kontextuelle Navigation): Vor- und Nachteile sowie Eignung für diese App von 1 bis 5.
3. Abschließende Empfehlung mit konkreter Struktur: welche Ziele in die Leiste kommen (max. 5), vorgeschlagene Icons und Labels, was mit den übrigen passiert und welcher Screen zuerst öffnet.
4. Plattformkonventionen: Verhalten von Zurück-Taste oder -Geste, Zustand jedes Tabs beibehalten, Deep Links und Benachrichtigungen, die einen Bereich öffnen.
5. Textbeschreibung des Navigations-Wireframes auf dem Startscreen und auf einem Detailscreen.
6. Grenzfälle: Benachrichtigungs-Badges, geöffnete Tastatur, Querformat und Tablets.
7. Barrierefreiheit: Textlabels zu den Icons, Touch-Flächen von 44 pt / 48 dp, logische Reihenfolge für Screenreader und angesagter Auswahlzustand.
8. Validierungsplan: Tree Test oder First-Click-Test mit 5-8 Aufgaben und Erfolgskennzahlen.
Einschränkungen:
- Erfinde keine Analysedaten; wenn du Daten brauchst, verwende [AUSFÜLLEN: echte Nutzungsdaten].
- Begründe die Empfehlung mit Nutzeraufgaben, nicht mit Trends.
- Fehlen wichtige Angaben zur Nutzungshäufigkeit, frage mich vor der Empfehlung.
Format: Vergleichstabelle, Empfehlung mit Struktur als Liste, Text-Wireframe und Validierungsplan.So verwenden Sie ihn
- Liste alle aktuellen Bereiche und die häufigsten Aufgaben auf. 2. Besprich die Vergleichstabelle im Team und wähle eine Struktur. 3. Validiere sie mit einem Tree Test, bevor du in High Fidelity gestaltest.
Anwendungsbeispiel
App: Essenslieferung · Plattform: beide · Bereiche: Start, Suche, Bestellungen, Favoriten, Gutscheine, Profil, Hilfe · Problem: niemand findet die Gutscheine.
Beispielergebnis
Muster im Vergleich
| Muster | Vorteile | Nachteile | Eignung (1-5) |
|---|---|---|---|
| Tab-Leiste unten | Immer sichtbar, mit dem Daumen erreichbar | Max. 5 Ziele | 5 |
| Seitenmenü | Viele Ziele möglich | Versteckt Wichtiges (das aktuelle Gutschein-Problem) | 2 |
| Tabs oben | Gut für gleichrangige Ansichten | Weit weg vom Daumen | 2 |
| Floating Action Button | Hebt eine Aktion hervor | Keine einzelne dominante Aktion | 1 |
Empfehlung
Eine untere Leiste mit 4 Zielen, begründet durch die Aufgabenhäufigkeit:
- Start (Haus): Essen bestellen, wöchentlich.
- Suche (Lupe): alternativer Einstieg zum Bestellen.
- Bestellungen (Beleg): Verfolgung bei jeder Bestellung; Badge für die laufende Bestellung.
- Profil (Person): Favoriten, Hilfe und Einstellungen darin.
Gutscheine: kein eigener Tab (monatliche Nutzung), aber sichtbar in der Warenkorb-Übersicht und als Karte auf Start – genau dort, wo man sie braucht. Die App öffnet auf Start.
Validierung
First-Click-Test mit 6 Aufgaben, z. B. „Du hast einen Rabattcode – wo würdest du ihn einlösen?". Erfolg: ≥ [AUSFÜLLEN: Schwellenwert] richtige erste Klicks…
Wichtige Fakten
- Kategorie
- UI/UX-Design · Mobile Oberflächen
- Ausgabetyp
- Text
- Niveau
- Fortgeschritten
- Entwickelt für
- ChatGPT, Claude, Gemini und Microsoft Copilot
- Verifiziert in
- Redaktionelle Prüfung ausstehend
- Variablen
- App, Plattform, Aktuelle Bereiche, Aufgaben und Häufigkeit, Nutzer und Aktuelles Problem
- Sprache
- Deutsch
- Preis
- Kostenlos, ohne Anmeldung
- Aktualisiert
- 07.11.2026
Häufig gestellte Fragen
Wie viele Tabs verträgt eine untere Navigationsleiste?
Drei bis fünf. Bei mehr als fünf werden die Ziele schwer zu treffen und zu verstehen; sekundäre Bereiche sollten gruppiert oder ins Profil verschoben werden.
Ist das Hamburger-Menü grundsätzlich schlecht?
Nicht immer, aber es versteckt Ziele und senkt meist deren Auffindbarkeit. Es eignet sich vor allem für selten genutzte Bereiche oder Apps mit vielen gleich wichtigen Zielen.
Wofür ist dieser Prompt gedacht?
Vergleiche Tab-Bar, Navigation Drawer, obere Tabs und weitere Muster für deine App, mit begründeter Empfehlung, Bereichsstruktur, iOS- und Android-Konventionen und Validierungsplan.
Mit welchen KI-Tools funktioniert er?
Er ist für ChatGPT, Claude, Gemini und Microsoft Copilot entwickelt. Wir haben ihn in diesen Tools noch nicht überprüft, daher können die Ergebnisse variieren.
Wie passe ich den Prompt an?
Klicken Sie auf „Anpassen“ und füllen Sie die Variablen aus (App, Plattform, Aktuelle Bereiche, Aufgaben und Häufigkeit, Nutzer und Aktuelles Problem). Der Text wird sofort aktualisiert und lässt sich anschließend mit einem Klick kopieren. Die Werte werden nur in Ihrem Browser gespeichert.
Brauche ich Erfahrung, um ihn zu verwenden?
Er ist für Fortgeschrittene: Es hilft, das Thema zu kennen, um guten Kontext zu liefern und das Ergebnis kritisch zu prüfen.
Ist dieser Prompt kostenlos?
Ja. Jeder Prompt von HomeCasa Prompts ist kostenlos, ohne Anmeldung und ohne Abonnement. Sie können ihn auch in beruflichen Projekten verwenden.
Kann ich der KI-Ausgabe vertrauen?
Betrachten Sie sie als hochwertigen Entwurf: Prüfen Sie Daten, Zahlen und wichtige Aussagen immer, bevor Sie etwas veröffentlichen oder Entscheidungen treffen.