Download - Internet World Business

TOOLS & TECHNIK
30 Internet World BUSINESS
24. Juni 2013 13/13
WEBDESIGN
Flach wie ein Brett
Der 3-D-Effekt hat ausgedient: Die moderne Website ist flach, klar und schnörkellos. Das ist schick – und problematisch
D
Drei Interpretationen
von Flat Design:
Google+, iOS 7 und
Windows Phone
er Frust steht der Dame
ins Gesicht geschrieben.
„Wie komme ich denn von hier
aus
wieder zurück auf diese Kacheloberfläche?
Ich finde keinen ,Schließen‘-Button“,
fragt sie den Leiter des Usability-Labors
ity-Labors
ratlos und fährt suchend mit der Maus
über die ungewohnte Windows-8-Oberfläche.
„Muss ich jetzt wirklich den Computer
ausschalten und wieder hochfahren,
damit ich einfach zurück auf den Startbildschirm
komme?“ Der Mitarbeiter der
Agentur Usability.de notiert gewissenhaft
in seinem Testbogen, dass die Nutzerin
frustriert ist– und sie ist bei Weitem nicht
die einzige der Testgruppe aus Windowserfahrenen
Nutzern, die Probleme mit
Microsofts neuer PC-Oberfläche hat. Wobei
sich die meisten Probanden einig sind:
Schick ist es schon, dieses flache Design.
Kacheloptik als Trendsetter
Flat Design heißt der neue Trend, den
Microsoft mit der neuen Kacheloberfläche
von Windows Phone setzte und mit
Windows 8 für den PC weiterdenkt. „Flat
Design bedeutet: Besinnung auf das Wesentliche“,
erklärt Julia Schnitzer, Studienleiterin
an der Mediadesign Hochschule in
Berlin: „keine Schlagschatten, keine
Glanzlichter, keine Farbverläufe, kein
3-D-Effekt, dafür klare Konturen und
reine Farben“. Das abstrakte Flat Design
setzt sich deutlich vom bisherigen Design-
Trend ab, den einst Apple mit dem iPhone
vorgab: Beim sogenannten „Skeuomorphismus“
(altgriechisch: Gestalt) ging es
darum, die reale Welt mit digitalen Mitteln
so genau wie möglich abzubilden. Deshalb
sah die iPhone-Uhr aus wie direkt von
einem Bahnsteig abgeschraubt und der
Kalender mit dem Blättereffekt wirkte wie
in Leder gebundenes Papier.
Alles unnötiger Schnickschnack, sagen
dagegen die Flat Designer der Avantgarde,
die zuletzt arg über das angestaubte Aussehen
von iOS lästerten: Ästhetisches Design
sei reduziert, benötige klare Farben und
Geometrie. Mit der neuen Version seines
Betriebssystems, das im Herbst veröffentlicht
werden soll, schließt sich Apple zumindest
teilweise dem neuen Design-Trend
an: iOS 7 präsentiert sich verschlankt, setzt
auf eine klare, hervorstechende Typo grafie
und abtrakte Icons. Die jüngst präsentierte
Beta des Betriebssystems wird aber wohl
so nicht in den Handel gehen. „Ich denke,
Apple wird iOS 7 bis zum Herbst noch
optimieren“, meint Schnitzer. „Vor allem
die aktuelle Prinzessin-Lillifee-Farbgebung
könnte nicht nur männlichen Nutzern
zu verspielt sein. Außerdem konnte
sich Apple immer noch nicht von den
reichlich angestaubten Farbverläufen tren-
nen, hier wird sicherlich beziehungsweise
hoffentlich noch etwas passieren.“
Klares Design ohne Schnörkel
Flat Design ist nicht nur den Großen der
Branche vorbehalten: Auch Online Shops,
Agentur-Seiten und Marketingportale setzen
zunehmend auf das klare Design ohne
Schnörkel (Beispiele siehe Kasten unten).
Text-Links, große Inhaltsflächen und Bilder,
mehr Weißflächen, serifenlose Schriftarten,
ein deutlich erkennbarer Rasteraufbau
– die visuelle Sprache des Flat Designs
ist auf den ersten Blick zu erkennen. „Websites
können durch Flat Design viel aufgeräumter
und zielführender wirken“, meint
Oliver Kasparik, Senior Art Director bei
der Multimedia-Agentur Denkwerk. „Zudem
gilt ,flat‘ jetzt als schick und trendy,
weil die Bedienung der Geräte möglichst
einfach wirken soll und auch einfacher
geworden ist.“ Flat Design dürfe aber nicht
dazu führen, bestimmte Nutzergruppen
auszuschließen. „Abstrakte Gestaltung ist
auch anfällig für Fehlinterpretation“, so
Kaspariks Befürchtung. Womit wir wieder
beim anfangs beschriebenen Usability-
Test von Windows 8 wären; die geschilderte
Szene ist da sicher nur ein Problem
von vielen. „Wir haben gesehen, dass User
bei Flat Design oft klickbare Elemente
nicht als solche erkennen oder Inhaltsflächen
aufgrund ihrer Gestaltung für Werbe-
Banner halten“, so Thomas Bartel, Gründer
von Usability.de. „Aus Usability-Sicht
ist jeder krasse Design-Wechsel, wie er mit
Flat Design praktiziert wird, natürlich
zunächst einmal ein Problem.“ Wer also
auf den Design-Zug aufspringen und seine
Website modern und flach haben will, sollte
auch an die Nutzer denken, warnt Kasparik.
„Websites sollten immer gebrauchstauglich
bleiben“, betont der Denkwerk-
Designer und mahnt die Anwendung der
OSIT-Regel (Orientation, Selection, Information,
Transaction) an. „Man könnte anfangs
einen ,Nearly Flat Design‘-Ansatz
verfolgen, um die Nutzer nicht komplett
zu verwirren.“ Sehr feine Konturen um
klickfähige Elemente, schwache Kontraste
im Hintergrund, bei Berührung aufklappende
Kontextmenüs, schmale Pfeile oder
ähnlich einfache Icons auf klickbaren Flächen
– mehr brauchen PC-affine Nutzer
nicht, um das neue Flat Design zu durchschauen
und bedienen zu können. Dann
klappt’s auch beim Usability-Test – und
Website-Betreiber und User können das
Design ohne Frust genießen. il
■
Merkmale von Flat Design
■ Aufbau im Raster- / Kachelsystem
■ Geometrische Formen, klare Linien
■ „Flache“ Gestaltung ohne Verläufe,
Schatten oder Lichteffekte
■ Hervorstechende Typografie
■ Wenige, sehr einfach designte Icons
Bei Nixon.de ist das Rastermuster
klar erkennbar
Klare Typografie statt dicker
Buttons zeichnen den Shopping-Club
Monoqi aus
Der Fahrradkonfigurator von Myownbike.de:
Aufgeräumt und trotzdem leicht zu bedienen
Nudeln pur: Auf der „Cappello’s Gluten
Free“-Website zeigen einfache Pfeile,
welche Flächen geklickt werden sollen