The Big Picture

Design Analyse

Von Oben nach Unten, von Aussen nach Innen und von Gross nach Klein.

Wir müssen lernen ein Referenzdesign (Sketch, Illustrator, Handskizze etc.) richtig zu analysieren um die Verschachtelungen, das Boxmodell, die Positionierung sowie die Display-Settings daraus abzuleiten.

Sei es für uns oder fürs Design-Handoff.

Dabei analysieren wir das Design von Aussen nach Innen, also von den grossen Verhältnissen und Abhängigkeiten zu den kleinen.

Wir nutzen unser Wissen über die Webseiten Anatomie und ihren Atomen, Molekülen und Organe.

Zudem versuchen wir die Seite von Oben nach Unten zu lesen um die Ordnung und Hierarchie besser zu verstehen.

Anders als in Layout-Programmen müssen wir lernen die «Parent-Child» Abhängigkeiten zu lesen. Damit können wir vom Parent zum Child die Layout-Parameter definieren.

Eine schematische Darstellung einer Inhaltsbox. Links als Design, rechts als Wireframe. Im Wireframe wird das Design analysiert und die Umsetzung geplant.
© Webdesign Essentials

Tipp

Mir hilft es, mein fertiges Design mit einer Handskizze in seine Bausteine zu zerlegen. Dabei nutze ich ganz grobe Kästchenskizzen um die Verschachtelung und Abhängigkeiten besser zu verstehen und zu kennzeichnen.

Vertiefe dich ins ganze Kapitel

Responsive Design