Seminar Pencil Project – Wireframing für Produkt- und Fachkonzepte

Beschreibung

Wireframes übersetzen Anforderungen in sichtbare Struktur, ohne sich zu früh auf visuelle Details festzulegen. Das Seminar behandelt Nutzeraufgaben, Inhaltspriorität, Seitenraster, Navigation, Formulare, Listen, Datenzustände, Annotationen und Varianten. Low-Fidelity-Entwürfe werden schrittweise zu prüfbaren Mid-Fidelity-Wireframes verdichtet.

Inhaltsübersicht

• Lernziele und fachliche Einordnung
• Schrittweise Seminarinhalte
• Praxisübungen
• Zielgruppe und Voraussetzungen
• Didaktik und Arbeitsweise

Lernziele

• Anforderungen, Nutzeraufgaben und Geschäftsregeln in sichtbare UI-Strukturen übersetzen.
• Inhalte und Aktionen nach Aufgabe, Häufigkeit und Risiko priorisieren.
• Low-Fidelity-Wireframes schnell erstellen und in konsistente Mid-Fidelity-Varianten überführen.
• Formulare, Listen, Detailansichten und Systemzustände fachlich vollständig darstellen.
• Wireframes mit Annotationen, Annahmen und Reviewpunkten prüfbar dokumentieren.

Schrittweise Seminarinhalte

1. Anforderungen und Nutzeraufgaben

Schwerpunkt: Ziele, Rollen, Szenarien, Auslöser, Daten, Geschäftsregeln, Erfolg, Ausnahme, Häufigkeit und Risiko.

1. Nutzeraufgabe, Inhalt und Qualitätskriterien für „Anforderungen und Nutzeraufgaben“ anhand von Ziele, Rollen, Szenarien, Auslöser, Daten, Geschäftsregeln, Erfolg, Ausnahme, Häufigkeit und Risiko bestimmen.
2. Die benötigten Seiten, Shapes, Komponenten, Zustände und Verknüpfungen in Pencil Project strukturiert anlegen und konsistent benennen.
3. Eine realistische Variante umsetzen, alternative Zustände oder Bildschirmgrößen vergleichen und die Interaktion in einem vollständigen Testlauf prüfen.
4. Das Ergebnis anhand von Konsistenz, Vollständigkeit, Verständlichkeit und Übergabefähigkeit bewerten, korrigieren und als freigegebenen Arbeitsstand dokumentieren.

2. Inhaltsinventar und Priorisierung

Schwerpunkt: Informationen, Aktionen, Entscheidungshilfen, Pflichtinhalte, Sekundärinhalte, Gruppierung, Reihenfolge und progressive Offenlegung.

1. Nutzeraufgabe, Inhalt und Qualitätskriterien für „Inhaltsinventar und Priorisierung“ anhand von Informationen, Aktionen, Entscheidungshilfen, Pflichtinhalte, Sekundärinhalte, Gruppierung, Reihenfolge und progressive Offenlegung bestimmen.
2. Die benötigten Seiten, Shapes, Komponenten, Zustände und Verknüpfungen in Pencil Project strukturiert anlegen und konsistent benennen.
3. Eine realistische Variante umsetzen, alternative Zustände oder Bildschirmgrößen vergleichen und die Interaktion in einem vollständigen Testlauf prüfen.
4. Das Ergebnis anhand von Konsistenz, Vollständigkeit, Verständlichkeit und Übergabefähigkeit bewerten, korrigieren und als freigegebenen Arbeitsstand dokumentieren.

3. Low-Fidelity-Seitenstruktur

Schwerpunkt: grobe Bereiche, Seitenraster, Navigation, Inhalt, Aktion, Rückmeldung, Varianten, schnelle Skizze und Vergleich.

1. Nutzeraufgabe, Inhalt und Qualitätskriterien für „Low-Fidelity-Seitenstruktur“ anhand von grobe Bereiche, Seitenraster, Navigation, Inhalt, Aktion, Rückmeldung, Varianten, schnelle Skizze und Vergleich bestimmen.
2. Die benötigten Seiten, Shapes, Komponenten, Zustände und Verknüpfungen in Pencil Project strukturiert anlegen und konsistent benennen.
3. Eine realistische Variante umsetzen, alternative Zustände oder Bildschirmgrößen vergleichen und die Interaktion in einem vollständigen Testlauf prüfen.
4. Das Ergebnis anhand von Konsistenz, Vollständigkeit, Verständlichkeit und Übergabefähigkeit bewerten, korrigieren und als freigegebenen Arbeitsstand dokumentieren.

4. Formulare, Listen und Details

Schwerpunkt: Feldgruppen, Tabellen, Karten, Filter, Suche, Auswahl, Sammelaktionen, Detailbereiche, Dialoge und Hilfetexte.

1. Nutzeraufgabe, Inhalt und Qualitätskriterien für „Formulare, Listen und Details“ anhand von Feldgruppen, Tabellen, Karten, Filter, Suche, Auswahl, Sammelaktionen, Detailbereiche, Dialoge und Hilfetexte bestimmen.
2. Die benötigten Seiten, Shapes, Komponenten, Zustände und Verknüpfungen in Pencil Project strukturiert anlegen und konsistent benennen.
3. Eine realistische Variante umsetzen, alternative Zustände oder Bildschirmgrößen vergleichen und die Interaktion in einem vollständigen Testlauf prüfen.
4. Das Ergebnis anhand von Konsistenz, Vollständigkeit, Verständlichkeit und Übergabefähigkeit bewerten, korrigieren und als freigegebenen Arbeitsstand dokumentieren.

5. Daten-, Fehler- und Rollenvarianten

Schwerpunkt: leer, laden, Fehler, Konflikt, nicht berechtigt, Nur-Lese, unvollständig, freigegeben und archiviert.

1. Nutzeraufgabe, Inhalt und Qualitätskriterien für „Daten-, Fehler- und Rollenvarianten“ anhand von leer, laden, Fehler, Konflikt, nicht berechtigt, Nur-Lese, unvollständig, freigegeben und archiviert bestimmen.
2. Die benötigten Seiten, Shapes, Komponenten, Zustände und Verknüpfungen in Pencil Project strukturiert anlegen und konsistent benennen.
3. Eine realistische Variante umsetzen, alternative Zustände oder Bildschirmgrößen vergleichen und die Interaktion in einem vollständigen Testlauf prüfen.
4. Das Ergebnis anhand von Konsistenz, Vollständigkeit, Verständlichkeit und Übergabefähigkeit bewerten, korrigieren und als freigegebenen Arbeitsstand dokumentieren.

6. Mid-Fidelity-Ausarbeitung und Review

Schwerpunkt: Komponenten, Typografieannahmen, Abstände, realistische Inhalte, Annotationen, Akzeptanzkriterien, Walkthrough und Iteration.

1. Nutzeraufgabe, Inhalt und Qualitätskriterien für „Mid-Fidelity-Ausarbeitung und Review“ anhand von Komponenten, Typografieannahmen, Abstände, realistische Inhalte, Annotationen, Akzeptanzkriterien, Walkthrough und Iteration bestimmen.
2. Die benötigten Seiten, Shapes, Komponenten, Zustände und Verknüpfungen in Pencil Project strukturiert anlegen und konsistent benennen.
3. Eine realistische Variante umsetzen, alternative Zustände oder Bildschirmgrößen vergleichen und die Interaktion in einem vollständigen Testlauf prüfen.
4. Das Ergebnis anhand von Konsistenz, Vollständigkeit, Verständlichkeit und Übergabefähigkeit bewerten, korrigieren und als freigegebenen Arbeitsstand dokumentieren.

Praxisübungen

• Überführung eines Fachszenarios in Nutzeraufgaben und priorisierte Inhalte.
• Erstellung mehrerer Low-Fidelity-Varianten für dieselbe Kernseite.
• Ausarbeitung eines vollständigen Formular- oder Listenablaufs mit relevanten Zuständen.
• Durchführung eines fachlichen Reviews mit dokumentierter Entscheidung und Mid-Fidelity-Iteration.

Zielgruppe und Voraussetzungen

Zielgruppe: Product Owner, Business-Analysten, Fachkonzepter, UX-Designer, Entwickler und Projektteams.

Voraussetzungen: Ein vorhandenes oder vorbereitetes Produkt- beziehungsweise Fachszenario; keine fortgeschrittene Designpraxis erforderlich.

Didaktik und Arbeitsweise

Kurze Theorieblöcke, Demonstrationen und aufeinander aufbauende Übungen wechseln sich ab. Ein durchgehendes Beispieldokument wird mehrfach geprüft, korrigiert und in einen nachvollziehbaren Arbeitsstand überführt.