Entwicklung & Design

Flat Design im E-Commerce: 25 Beispiele für moderne Online-Shops

Flat Design ist schlicht, funktional und der Webdesign-Trend des Jahres – auch im E-Commerce. Im Rahmen dieses Artikels sprechen wir über die Probleme der schonenden Gestaltung, geben Tipps zur optimalen Umsetzung und liefern insgesamt 25 Beispiele für Flat Design im E-Commerce.

Flat Design entspricht der Rückbesinnung auf das Wesentliche, ganz im Sinne altbekannter Prinzipien wie „Form follows function“. Auch im E-Commerce hat der Webdesigntrend Fuß gefasst. Vor allem kleinere und exklusive Onlineshops präsentieren ihre Waren im schlichten Gewand. Große Player wie TUI.com haben hingegen Probleme, den Ansatz ganzheitlich umzusetzen. Woran das liegt, erklärt Manuel Ressel von der Web Arts AG in seinem Beitrag „Webdesign-Trend Flat Design und Stolpersteine im E-Commerce“.

Flat Design im E-Commerce: Probleme der schlichten Gestaltung

Der größte Nachteil des Webdesigntrends ist eine direkte Folge der schlichten Gestaltung. „Aus unzähligen Nutzertests lässt sich immer wieder ableiten: Das Gehirn ist faul“, so Manuel Ressel im Gespräch mit t3n.de. Es entscheide bestimmte Situationen auf Basis bisheriger Erfahrungen. „Beim Flat Design ist es häufig so, dass Interaktionselemente wie Buttons und Eingabefelder schlecht erkennbar sind, weil sie typische Erkennungsmerkmale nicht aufgreifen. Dies erhöht den kognitiven Aufwand des Nutzers. Er muss die Interaktionselemente neu erlernen.“ Eine mögliche Folge: Sinkende Klickraten, Verkäufe und Umsätze.

X-Doria setzt nicht nur auf ein schlichtes Design, auch Parallax Scrolling kommt zum Einsatz.

X-Doria setzt nicht nur auf ein schlichtes Design, auch Parallax Scrolling kommt zum Einsatz.

Flat Design nutzen vor allem kleine Onlineshops mit Fokus auf edlen, exklusiven Produkten. Ressel erklärt diese Tatsache wie folgt: „Das Entfernen von Gestaltungselementen und die Beschränkung auf das Wesentliche sind ein Zeichen von Effizienz, Stärke und Macht. Durch den geringeren Einsatz von unwichtigen Gestaltungselementen bekommen zudem die einzelnen Elemente mehr Raum und Freiheit. Die Distanz der einzelnen Elemente ist höher und vermittelt damit auch eine Distanz zum Nutzer. Das Produkt wirkt dadurch hochwertiger und exklusiver – allerdings auch teurer.“ Große Versandhändler müssten hingegen darauf achten, ihre „preissensible Stammkundschaft“ nicht zu vergraulen. Entgegen aktueller Trends arbeiten sie deshalb weiter mit Stilmitteln wie Farbverläufen, Glanzeffekten und Schatten.

Flat Design: Was sollten Onlinehändler beachten?

Ob der Wechsel zu einem schlichten Design für Onlinehändler lohnt, lässt sich nicht pauschalisieren. „Zunächst stellt sich die Frage, ob ein Flat Design die richtige Wirkung auf den jeweiligen Shop und die jeweilige Zielgruppe hat“, erklärt Ressel. „Nicht jeder Designtrend passt zu jedem Shop – es muss authentisch bleiben und die gewünschte Wirkung unterstützen.“ Und genau hier liegt das Problem: Wer blindlings neuen Trends nachläuft, formt kein klares Bild der eigenen Marke. Hinzukommt die oben angesprochene Unlust unseres Gehirns, neue Situationen zu interpretieren. Gerade Onlineshops profitieren ungemein von erlernten Elementen, wie dem Symbolbild eines Einkaufswagens (Warenkorb) oder eines Briefes (Newsletter/ E-Mail). Eine Neugestaltung des Onlineshops sollte auf solche Elemente setzen, um neue Nutzer in bekannten Gefilden abzuholen. Hier helfen auch ganz simple Zeichen, wie Manuel Ressel betont. Schon einfache Pfeile können Wunder wirken.

25 Beispiele für Flat Design im E-Commerce

Beispiele für schicke Onlineshops im reduzierten Look findet man zuhauf. Um einen Eindruck der vielfältigen Möglichkeiten zu vermitteln, haben wir eine Reihe dieser Onlineshops zusammengefasst.

Kennt ihr weitere Beispiele für Flat Design im E-Commerce?

1 von 25

Weiterführende Links

Copyright des Vorschaubildes: © kebay – Fotolia.com

Bitte beachte unsere Community-Richtlinien

Wir freuen uns über kontroverse Diskussionen, die gerne auch mal hitzig geführt werden dürfen. Beleidigende, grob anstößige, rassistische und strafrechtlich relevante Äußerungen und Beiträge tolerieren wir nicht. Bitte achte darauf, dass du keine Texte veröffentlichst, für die du keine ausdrückliche Erlaubnis des Urhebers hast. Ebenfalls nicht erlaubt ist der Missbrauch der Webangebote unter t3n.de als Werbeplattform. Die Nennung von Produktnamen, Herstellern, Dienstleistern und Websites ist nur dann zulässig, wenn damit nicht vorrangig der Zweck der Werbung verfolgt wird. Wir behalten uns vor, Beiträge, die diese Regeln verletzen, zu löschen und Accounts zeitweilig oder auf Dauer zu sperren.

Trotz all dieser notwendigen Regeln: Diskutiere kontrovers, sage anderen deine Meinung, trage mit weiterführenden Informationen zum Wissensaustausch bei, aber bleibe dabei fair und respektiere die Meinung anderer. Wir wünschen Dir viel Spaß mit den Webangeboten von t3n und freuen uns auf spannende Beiträge.

Dein t3n-Team

8 Kommentare
Philipp
Philipp

Bitte mal Links zu den Foto packen. Ich habe nicht viel Lust mir die Shops alle per Hand rauszusuchen.

Antworten
Benny
Benny

Hier habe ich noch eine schöne Zusammenstellung von schönen Designs. Sind auch einige schöne „flat“ Shops dabei ….

http://www.creativebumps.com/2013/03/ecommerce-website-template/

Schöne Grüße,
Benny

Antworten
chillma
chillma

frage mich warum das alles als flat bezeichnet wird. Früher nannte man das minimalismus. heute ist alles flat sobald keine effekte (verläufe, shadows etc.) dabei sind.

Antworten
K_Pliester
K_Pliester

@Chillma:

Flat ist mehr so die Richtung – unauffällig, mit Farben und Kacheln. Minimalistisch ist mehr so das Schwarz/Weiß + Grau. Für Typografie etc. …

Zumindest sehe ich das so :)

Antworten
feenhaar
feenhaar

ich finde brands4friends.de ist „flat“, also flach und übersichtlich gestaltet und reduziert sich auf das Wesentliche, was ja Flat-Design auch ausmacht.

;-) LG Susangeli

Antworten

Melde dich mit deinem t3n Account an oder fülle die unteren Felder aus.