root/Fretboard-Trainer
1
0
Fork 0
Code Issues 6 Pull requests Projects Releases Packages Wiki Activity Actions

UI: Layout-Architektur an HIG anpassen (8pt-Raster, Safe Areas, iPad Landscape) #1

New issue
Closed
opened 2026-05-03 14:41:15 +02:00 by root · 0 comments
root commented 2026-05-03 14:41:15 +02:00
Owner
Copy link

Beschreibung

Die Layout-Architektur muss an die Apple Human Interface Guidelines angepasst werden — speziell für iPad Landscape.

Konkretes User-Feedback

  1. iOS: Noten-Buttons zu weit auseinander — nehmen zu viel Platz auf dem Bildschirm ein. → Kompakteres 2×6 Grid statt 1×12 Reihe.
  2. Prompt-Text zu platzraubend — "What note is at E4?" ist zu lang. → Kompakter Badge/Overlay mit nur "E4" oder "Find: C#".
  3. iOS: Modus-Wechsel nicht sichtbar — das Segmented Control ist vermutlich off-screen oder verdeckt. → In Toolbar verschieben (immer sichtbar).

HIG-Anforderungen (siehe wiki/reference/hig-layout.md)

  • 8pt-Raster-System für alle Abstände
  • 20pt-Margins auf iPad (Regular Width)
  • Controls an den Seiten, Hauptinhalt zentriert
  • Safe Areas respektieren (Notch, Home Indicator)
  • Layout muss mit Dynamic Type skalieren (bis 312%)
  • 44×44pt Minimum-Tap-Targets

Umsetzungsplan

Siehe plan.md (OpenCode Implementation Plan):

  • Phase 1: Prompts + Buttons kompakt machen
  • Phase 2: Layout-Neustrukturierung (Toolbar, HStack-Layout)
  • Phase 3: HIG-Nachbesserungen Fretboard (Toggle-Größe, @ScaledMetric)

Akzeptanzkriterien

  • 8pt-Raster in allen Views konsistent
  • Fretboard zentriert, Controls (String-Toggles, Mode, Assistance) an den Seiten
  • Modus-Wechsel auf iOS immer erreichbar (Toolbar)
  • Prompt als kompakter Badge, nicht als Fließtext
  • Note-Buttons passen auf iOS-Landscape-Bildschirm
  • Safe-Area-Insets korrekt (iPad Landscape)
  • Layout bricht nicht bei großem Dynamic Type
  • Mindestens 20pt Padding an allen Rändern

Relevante Wiki-Seiten

  • wiki/reference/hig-layout.md
  • wiki/reference/hig-typography.md
  • wiki/reference/hig-gestures.md
  • wiki/architecture/app-architecture.md
## Beschreibung Die Layout-Architektur muss an die Apple Human Interface Guidelines angepasst werden — speziell für iPad Landscape. ## Konkretes User-Feedback 1. **iOS: Noten-Buttons zu weit auseinander** — nehmen zu viel Platz auf dem Bildschirm ein. → Kompakteres 2×6 Grid statt 1×12 Reihe. 2. **Prompt-Text zu platzraubend** — "What note is at E4?" ist zu lang. → Kompakter Badge/Overlay mit nur "E4" oder "Find: C#". 3. **iOS: Modus-Wechsel nicht sichtbar** — das Segmented Control ist vermutlich off-screen oder verdeckt. → In Toolbar verschieben (immer sichtbar). ## HIG-Anforderungen (siehe wiki/reference/hig-layout.md) - 8pt-Raster-System für alle Abstände - 20pt-Margins auf iPad (Regular Width) - Controls an den Seiten, Hauptinhalt zentriert - Safe Areas respektieren (Notch, Home Indicator) - Layout muss mit Dynamic Type skalieren (bis 312%) - 44×44pt Minimum-Tap-Targets ## Umsetzungsplan Siehe `plan.md` (OpenCode Implementation Plan): - Phase 1: Prompts + Buttons kompakt machen - Phase 2: Layout-Neustrukturierung (Toolbar, HStack-Layout) - Phase 3: HIG-Nachbesserungen Fretboard (Toggle-Größe, @ScaledMetric) ## Akzeptanzkriterien - [ ] 8pt-Raster in allen Views konsistent - [ ] Fretboard zentriert, Controls (String-Toggles, Mode, Assistance) an den Seiten - [ ] Modus-Wechsel auf iOS immer erreichbar (Toolbar) - [ ] Prompt als kompakter Badge, nicht als Fließtext - [ ] Note-Buttons passen auf iOS-Landscape-Bildschirm - [ ] Safe-Area-Insets korrekt (iPad Landscape) - [ ] Layout bricht nicht bei großem Dynamic Type - [ ] Mindestens 20pt Padding an allen Rändern ## Relevante Wiki-Seiten - wiki/reference/hig-layout.md - wiki/reference/hig-typography.md - wiki/reference/hig-gestures.md - wiki/architecture/app-architecture.md
root closed this issue 2026-05-03 15:26:21 +02:00
Sign in to join this conversation.
No Branch/Tag specified
Branches Tags
main
No results found.
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
root/Fretboard-Trainer#1
No description provided.