← Zurück zu Team für plattformübergreifende mobile Apps

Skill · Version 1.0.0

Mobiles Design übergeben

Übersetzt mobile Designentscheidungen in umsetzbare Bildschirmabläufe, Zustandsregeln und beobachtbare Abnahmekriterien.

mobile-design-handoff

Teammitglieder mit diesem Skill

Entdecke, wie der Skill hilft

Wann ist der Skill hilfreich?

Nutze dies, wenn Entwickler mehr als statische Entwürfe benötigen.

Wobei hilft er dir?

  • Dokumentiert Einstiegspunkte, Rücknavigation und Komponentenhierarchie.
  • Spezifiziert Eingaben, sichere Bildschirmbereiche und Plattformunterschiede.
  • Ergänzt Ausnahmen, Zustandsmatrizen und ungeprüfte Annahmen.

Das könntest du fragen

Bereite Buchungsübergabe mit Benachrichtigungseinstieg, Abbruch, Tastaturverhalten und konkreten Abnahmeprüfungen vor. Beschreibe dieselbe Buchung aus Benachrichtigung und Kalender. Entwickler kennen das gewünschte Zurück-Ziel und die Wiederaufnahme nach abgewiesener Speicherung.

Ausführliche Dokumentation

Hier findest du die ursprüngliche Anleitung, Beispiele und Prüfschritte des Skills in ihrer Originalsprache.

Details…Weniger anzeigen

Design Handoff & State Specification

Deliver complete, unambiguous mobile specifications so the mobile developer can implement every screen, interaction, state and edge case without guessing.

1. The standard handoff structure

Structure every mobile design specification and handoff in this order:

  1. User goal & context: who the user is, the trigger/situation, and the measurable outcome of the flow.
  2. Screen flow & navigation map: entry points (tabs, deep links, notifications), screen sequence, modal vs push transitions, and back/cancel behavior.
  3. Screens & component hierarchy: layout structure, reusable vs new components, design tokens, safe-area behavior and responsive rules across phone/tablet sizes.
  4. Interactions & inputs: tap actions, gestures (plus visible alternatives), keyboard types, return-key actions, focus progression and haptic/visual feedback.
  5. Complete state matrix & exceptions:
    • Loading: initial skeleton/spinner, pull-to-refresh, and in-flight button/submission states.
    • Empty: first-time empty state vs zero-results search/filter state, with the next action.
    • Populated & edge content: single item, many items (pagination/infinite scroll), long text, missing optional fields or images.
    • Error & offline: field validation errors, server errors, network loss/timeout, stale cached data indicator, and retry/recovery actions.
    • Interrupted & resumed: behavior when backgrounded, rotated or reopened mid-task.
  6. Platform differences (iOS vs Android): where the two platforms share product logic and where navigation bars, sheets, pickers, permissions or back gestures follow native platform conventions.
  7. Testable acceptance criteria: concrete, observable checks for the developer and reviewer/tester, plus an explicit list of any unverified assumptions or simulated prototype limits.

Before you finish

  • Handoff follows: user goal -> screen flow -> components -> interactions -> states & exceptions -> platform differences -> acceptance criteria.
  • Loading, empty, populated, long-content, offline, error and interrupted states are all specified.
  • No critical interaction or edge case is left for the developer to invent during coding.

Enthaltene Dateien 1

  • SKILL.md