step-by-step

Visualisierung und Erläuterung eines Ablaufs

Zweck

Manche Prozesse sind Aufwendig und benötigen detailierte Erklärungen. Das step-by-step Pattern soll dem Leser den Ablauf verständlicher machen, indem es durch Icons, Illustrationen und Beschreibungstexten die Reihenfolge der Schritte verständlich macht.

step-by-step

Zweck (kurz)

Visualisierung und Erläuterung eines Ablaufs

Zweck

Manche Prozesse sind Aufwendig und benötigen detailierte Erklärungen. Das step-by-step Pattern soll dem Leser den Ablauf verständlicher machen, indem es durch Icons, Illustrationen und Beschreibungstexten die Reihenfolge der Schritte verständlich macht.

Felder

  1. Hintergrundfarbe (optional)
  2. Überschrift
  3. Einleitungstext
  4. Icon
  5. Feature
  6. Beschreibung

Dos

  • Achte für eine ausgewogene Darstellung darauf, dass alle Schritte ungefähr die gleiche Textlänge haben
  • Verwende ausschließlich Icons aus unserem Icon-Set
  • Ideal sind 3 bis 4 Schritte

Don'ts

  • Achte darauf, dass der Einleitungstext nicht länger als die Liste der Schritte wird

[id:16]