← Zurück zu Team für plattformübergreifende mobile Apps
Entdecke, wie der Skill hilft
Mobile Navigation gestalten
Macht mobile Wege durch klare Hierarchie, natives Zurückverhalten und erkennbare Gestenalternativen verständlich.
mobile-navigation-interaction
Teammitglieder mit diesem Skill
Wann ist der Skill hilfreich?
Nutze dies bei Orientierungsverlust zwischen Tabs, Ansichten und modalen Aufgaben.
Wobei hilft er dir?
- Wählt Navigationsmuster passend zur Aufgabenhierarchie.
- Definiert System-Zurück, Abbruch und Verlaufswiederherstellung.
- Bietet sichtbare Gestenalternativen und unmittelbare Rückmeldung.
Das könntest du fragen
Plane verschachtelte Einstellungen mit vorhersehbaren Zielen für Android-Zurück, iOS-Gesten und Abbrechen. Öffne ein verschachteltes Bearbeitungs-Sheet, ändere Daten und brich über alle Eingabewege ab. Definiere Datenverbleib und erhaltene Elternansicht eindeutig.
Ausführliche Dokumentation
Hier findest du die ursprüngliche Anleitung, Beispiele und Prüfschritte des Skills in ihrer Originalsprache.
Weniger anzeigen
Mobile Navigation & Interaction
Structure mobile navigation so users always know where they are, how to go back, and what every tap or gesture will do.
1. Navigation patterns and hierarchy
- Top-level destinations: use a bottom tab bar (3–5 destinations) for peer sections the user switches between frequently; preserve each tab's scroll position and navigation stack independently.
- Drill-down flows: use hierarchical stack navigation for detail views and sequential steps so the user can always retrace their path.
- Modals and bottom sheets: reserve modals and sheets for self-contained subtasks, pickers, filters or confirmations. Provide an explicit close/cancel button as well as swipe-to-dismiss, and warn before discarding unsaved edits.
- Deep links and notifications: define where a deep link or notification lands in the hierarchy and where the Back action takes the user afterward (never trap them on an orphan screen).
2. System back and predictable history
- Respect the iOS interactive edge-swipe back and the Android system back gesture/button on every screen.
- Never override system back behavior arbitrarily: closing an open sheet, dialog or search overlay comes first, then stepping back in the stack. After completing a checkout, auth flow or destructive action, clear transient steps from the back stack so pressing Back does not re-submit.
3. Gestures, discoverability and feedback
- Never hide the only way to perform an essential action behind an undiscoverable gesture (such as long-press, two-finger swipe or shake). Pair swipe actions (swipe-to-delete, swipe-to-archive) with a visible button, menu item or edit mode alternative.
- Give every interactive element immediate visual press feedback (
pressed/ ripple / highlight within 100 ms) and prevent accidental double taps while an action is in flight.
Before you finish
- Tab, stack and modal/sheet boundaries are clear and preserve user context.
- iOS edge-swipe, Android system back and deep-link back stacks behave predictably.
- Every gesture-driven action has a visible, accessible alternative and immediate press feedback.
Enthaltene Dateien 1
SKILL.md