FLA – UX/UI Pattern Proposal v2: Process Navigation & Action Buttons
Updated: Summary panel contextual links · Grouped Actions dropdown · Priority indicator
Screen Draft A — Standard Mid-Step (with all 3 changes applied)
FLA – Antrag / Antragsdaten / Kreditnehmer — mid-step (AK1 rule) — v2 with changes
finnova. TESTSYSTEM
Antrag
FLA Testautomation User ▾
Antrag
Antragsdaten
Kreditnehmer
Sicherheiten
Weitere Finanzierungen
Finanzierung
Engagement
Tragbarkeit
Bewertung
Bewertung
Produkt Abschluss
Produkt
Übermittlung an QS
Credit Office
Qualitätssicherung
Back Office
Startseite › Antrag › Antragsdaten › Kreditnehmer
Weisskopf Senior AG 402.840
CHANGED
High
Prozess-Aktionen
AWB erstellen
Kreditvorlage generieren
Offerte erstellen
Verwaltung
Status-Historie anzeigen
Versionen vergleichen
Entscheide anzeigen
Dokumente
Dossier öffnen
Unterlagen verwalten
Export / Drucken
⚙
Regelwerk
📁
Dossier
📋
Pendenzen
📄
Offerte
🔔
Priorität
📦
Unterlagen
B + Pin
Kreditnehmer-Daten
Name
Vorname / Zusatz
Strasse / Nr.
PLZ / Ort
Land
Weitere Informationen
Anzahl Mitarbeiter
UID-Nummer
CHANGED
Zusammenfassung
402840/001/0001
Antrags-Nr.
Investitionen
Zweck
Neu
Geschäftsfall
● In Erfassung
Status
📊 Status-Historie 🔄 Versionen ⚖️ Entscheide 📋 Pendenzen 📝 Notizen 📁 Dossier
Antragstatus-Historie
In Erfassung
31.03.2026 · 14:23
Erstellt
31.03.2026 · 10:05
Screen Draft B — First Step of Module (AK2.1 rule — only "Weiter")
FLA – Antrag / Finanzierung / Engagement — FIRST STEP (no Zurück)
finnova.
Antrag
FLA Testautomation User ▾
Antrag
Antragsdaten
Kreditnehmer
Sicherheiten
Finanzierung
Engagement
Tragbarkeit
Startseite › Antrag › Finanzierung › Engagement
Weisskopf Senior AG402.840
Medium
Prozess-Aktionen
AWB erstellen
Kreditvorlage generieren
Verwaltung
Status-Historie anzeigen
Entscheide anzeigen
Dokumente
Dossier öffnen
Export / Drucken
⚙
Regelwerk
📁
Dossier
📋
Pendenzen
📄
Offerte
🔔
Priorität
+ Pin
Engagement-Daten
Kreditbetrag
Laufzeit
Zinssatz-Typ
← Kein Zurück (erster Step im Modul)
Zusammenfassung
402840/001/0001
Antrags-Nr.
● In Erfassung
Status
📊Status-Historie 🔄Versionen 📋Pendenzen 📁Dossier
Screen Draft C — Sub-page / Tab (AK3 rule — only "Zurück")
FLA – Sicherheitenart = Kontoguthaben (Sub-page, AK3: Zurück only)
finnova.
Antrag
FLA Testautomation User ▾
Antrag
Antragsdaten
Sicherheiten
Kontoguthaben
Startseite › Antrag › Antragsdaten › Sicherheiten › Kontoguthaben
Weisskopf Senior AG402.840
Low
Verwaltung
Status-Historie anzeigen
Dokumente
Dossier öffnen
Export / Drucken
⚙
Regelwerk
📁
Dossier
📋
Pendenzen
📄
Offerte
+ Pin
Sicherheitenart: Kontoguthaben
Kontonummer
Betrag (CHF)
Bemerkung
Zurück navigiert zur Sicherheiten-Übersicht (AK3)
Zusammenfassung
402840/001/0001
Antrags-Nr.
📊Status-Historie 📋Pendenzen 📁Dossier
Annotation Key + Rule Matrix (Updated)
Annotation Key (Updated v2)
A Aktionen ▾ (Grouped) — Dropdown now groups ALL actions: process actions (AWB, Kreditvorlage), management (Status-Historie, Versionen, Entscheide), and documents (Dossier, Unterlagen, Export). Sections separated by labels. Context-aware: sub-pages show fewer groups.
B Shortcut Strip — Unchanged. Pinnable quick-access shortcuts.
C Priority Badge — Shows High (red) / Medium (amber) / Low (grey) next to Aktionen button. Reflects current process priority. Visible at a glance without opening menus.
D Summary Contextual Links — Right panel now includes clickable link-buttons below the summary data: Status-Historie, Versionen, Entscheide, Pendenzen, Notizen, Dossier. Provides quick contextual navigation without leaving the page.
🔄 Changes from v1
1. Summary panel — Added contextual info link-buttons (Status-Historie, Versionen, Entscheide, Pendenzen, Notizen, Dossier)
2. Aktionen button — Now groups ALL additional actions (process + management + documents) in categorized dropdown
3. Priority badge — High/Medium/Low indicator shown next to Aktionen button
4. Footer simplified — Process actions (AWB, Kreditvorlage) moved from footer into Aktionen dropdown. Footer = pure navigation only.
BA Acceptance Criteria → Button Rule
RuleZurückWeiter
AK1 – Mid-step (Main pages)← ZurückWeiter →
AK2.1 – First step of modulenoneWeiter →
AK2.1 – Last step of module← Zurücknone
AK2.2 – Single-step Geschäftsfallnonenone
AK3 – Sub-page / Tab← Zurücknone
AK4 – GesamtpfandmatrixGesamtpfandmatrix schliessen
AK5 – Pop-upsnonenone
Button Style Guide — Design System Alignment (Updated)
Primary
#C8102E, white text
Use: next step
Ghost / Secondary
White fill, border #ccc
Use: previous step
High
Aktionen + Priority
Grouped dropdown
Use: all actions
📁
Dossier
Shortcut Chip
Red icon, border chip
Use: action shortcuts
📊Status-Historie
Summary Link
Panel contextual btn
Use: right-panel info
High Medium Low
Priority Badges
3 levels, color-coded
Use: next to Aktionen