Anzeige
Anzeige
Ratgeber

Wer braucht Trends? Das hier läuft wirklich im Design 2017

Ist dir schon mal aufgefallen, dass es Trends im Webdesign nur auf der eher mittelfristigen Ebene gibt? Was heute in ist, war es meist gestern schon. Aber was ist in?

4 Min.
Artikel merken
Anzeige
Anzeige

Das läuft wirklich im Design. (Foto: Shutterstock)

Trends im Webdesign sind langlebig

Es sind die meistgelesenen Beiträge in jedem Designmagazin – die Glaskugelblicke auf die Trends der Zukunft. Wenn man sie allerdings mal genauer liest und mit dem Wissen eines aktiven Designers betrachtet, dann fällt auf, dass die vermeintlichen Zukunftstrends selten wirklich neu sind. Oft handelt es sich um schon etablierte Techniken, die sich im besten Falle etwas stärker durchsetzen als bislang. Meist ist es schlicht das „Weiter so!” aus dem letzten Jahr.

Anzeige
Anzeige

Glaubst du nicht? Schau mal in diesen spontan ergoogelten Betrag auf Designrfix. Er behandelt die Trends des Jahres 2014 (!). Und was finden wir? Flat Design, Typografie, Long Scrolling, Mobile First, HTML5, designunterstützter Content, Minimalismus, Whitespace, Videos und Bilder als Hero-Elemente, Farben als Designelemente und Storytelling. Wo sind denn bloß die letzten zwei Jahre hin?

Andererseits ist das nicht weiter verwunderlich. Neue Trends mit echten Innovationen können sich ohnehin erst dann zeigen, wenn die Browserhersteller sich bequemen, bestimmte Features, meinetwegen auch mit Prefix, in ihre Seitenbetrachter zu implementieren. Der Flaschenhals unserer Innovationsmöglichkeiten ist stets der Browser, und wenn nicht der konkrete, dann doch die Vielfalt derer, die es zu unterstützen gilt.

Anzeige
Anzeige

Neue Trends, wenn man sie denn dann überhaupt so nennen will, zeigen sich eher im Detail. Ein paar der Trends, die sich praktisch ausschließlich an Details austoben, sind:

Anzeige
Anzeige

Mikrointeraktionen

Mikrointeraktionen sind die kleinen Bedienelemente, die dafür sorgen, dass etwas überhaupt erst funktioniert. Du drehst den Zündschlüssel um, um dein Auto zu starten. Dabei ist das Drehen des Zündschlüssels die Mikrointeraktion. Ohne das Drehen des Zündschlüssels würde dein Wagen nicht anspringen, wir dürfen also durchaus von einer sehr wichtigen Interaktion sprechen.

Lange Zeit kümmerten sich Webdesigner nur nachlässig um die Gestaltung dieser Elemente. Dann eröffnete Apple die Ära des Skeuomorphismus für die Gestaltung von Benutzeroberflächen. Da Skeuomorphismus darauf abzielt, Elemente aus dem realen Leben in die digitale Welt so zu übertragen, wie sie in echt auch aussehen, sind derartige Darstellungen zwar intuitiv zu bedienen – dennoch sind die Nachteile auf lange Sicht größer als dieser Vorteil.

Anzeige
Anzeige

Switch Animation | Eugene Cheporov

Detailgetreue Nachbildungen limitieren vor allem dein Designkonzept. Außerdem wirken diese Darstellungen schnell langweilig. Verwenden nun viele Designer derlei Elemente, wird das Design beliebig. Vor allem aber kannst du mit den Elementen von gestern nicht das UI der Zukunft erschaffen.

Wo wir gerade von beliebig sprechen: Seit einigen Jahren beobachten wir den Trend, dass sich Websites immer stärker ähneln. Es gab vor ein paar Jahren sogar eine breite Diskussion darüber, ob Webdesign nicht schon als tot zu bezeichnen ist.

Fluid Switch | Leo Zakour

Konstatieren wir, dass diese Annahme richtig ist, kommt gerade den Mikrointeraktionen steigende Bedeutung zu. Denn der komplette Umgang mit deinem Design aus Sicht des Besuchers passiert auf der Basis von vielen Mikrointeraktionen. Je besser diese gestaltet sind, desto flüssiger, nahtloser fühlt sich dein Designprodukt an.

Anzeige
Anzeige

Moderne Mikrointeraktionen sollten auf jeden Fall auch responsiv reagieren. Dazu verwendest du kleine Animationen, die zum einen erklären, was passiert und zum anderen Feedback geben, ob eine Interaktion erfolgreich war oder nicht.

Wir haben hier bei t3n einen Grundlagenartikel zu Mikrointeraktionen.

Funktionale Animationen

Funktionale Animationen unterstützen die Rezeption des eigentlichen Content. So könntest du etwa beim Scrollen einer langen Seite auf eine eingebettete Galerie in der Form hinweisen, dass sich diese beim Scrollen nach rechts und links ausklappt, also statt des mittigen Bildes alleine eine Reihe von drei Bildern zeigt. So wird der Nutzer ohne Umschweife und langes Nachdenken geleitet.

Anzeige
Anzeige

Funktionale Animationen sind aber auch schlicht solche, die über den Zustand eines Vorgangs informieren, etwa den Downloadfortschritt einer Datei oder das Eintreffen neuer E-Mails in deinem Posteingang.

Elastic Progress | Tympanus

Beim Einsatz funktionaler Animationen musst du darauf achten, dass du sie nicht zum Selbstzweck werden lässt. Dieser Wunsch ist verständlich, denn eine schicke Animation sieht nun mal schick aus. Wenn sie aber entbehrlich ist, weil sie den eigentlichen Vorgang nicht unterstützt, lass sie weg. Auch kleine, unnötige Verzögerungen nerven deine Besucher irgendwann.

Das Smashing Magazine hat hier einen Grundlagenartikel zum Thema.

Anzeige
Anzeige

Illustrationen

Wenn du es dir leisten kannst, dann solltest du auf jeden Fall auf diesen Trend setzen. Denn nach Hero-Images und Hero-Videos kommen die Hero-Illustrationen. Mit Illustrationen meine ich natürlich nicht solche, die du dir kostenlos aus einem Vektorgrafikportal ziehst, sondern tatsächlich handgezeichnete, die zu deinem übrigen Design und insbesondere zum Thema der Seite passen. So wie dieses hier:

Mehr zum Thema:

Mehr zu diesem Thema
Fast fertig!

Bitte klicke auf den Link in der Bestätigungsmail, um deine Anmeldung abzuschließen.

Du willst noch weitere Infos zum Newsletter? Jetzt mehr erfahren

Anzeige
Anzeige
2 Kommentare
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

grep

@DieterPetereit

Trend ist und bleibt, was gefällt, sich durchsetzt, bewährt, die großen Tonangeber wie z. B. Google hervorbringen, leider.

Minimalismus, Simplifikation, KISS-Prinzip oder ‚weniger ist mehr‘: Google hält die Aufmachung seiner Suchmaschine schlicht und funktional – man muss sich auf die tatsächlich wichtigen Dinge fokussieren können …, den Webseitenbesucher nicht überfordern sondern steuern.

Ciao, Sascha.

Antworten
Toby O. Rink

Hm,

also die Animated Gif Animation oben ist ja recht nett, aber mit fast 400 KB untragbar, vor allem für mobile Dienste. Da werden die Anwender schnell oder Oberkrise bekommen.
Für mich ein NO GO.

Ansonsten gilt, dass es Design-Klassiker von früher bis heute geschafft haben, aktuell zu bleiben. Weniger ist mehr ist ein großes Thema, und mit dem Weniger noch eine zielgerichtete Kommunikation und Darstellung in der Anwendung. Mehr braucht kein Mensch und überlastet letztlich nicht nur die Anwender, sondern auch die Systeme.

Antworten

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

Bitte schalte deinen Adblocker für t3n.de aus!
Hallo und herzlich willkommen bei t3n!

Bitte schalte deinen Adblocker für t3n.de aus, um diesen Artikel zu lesen.

Wir sind ein unabhängiger Publisher mit einem Team von mehr als 75 fantastischen Menschen, aber ohne riesigen Konzern im Rücken. Banner und ähnliche Werbemittel sind für unsere Finanzierung sehr wichtig.

Schon jetzt und im Namen der gesamten t3n-Crew: vielen Dank für deine Unterstützung! 🙌

Deine t3n-Crew

Anleitung zur Deaktivierung
Artikel merken

Bitte melde dich an, um diesen Artikel in deiner persönlichen Merkliste auf t3n zu speichern.

Jetzt registrieren und merken

Du hast schon einen t3n-Account? Hier anmelden

oder
Auf Mastodon teilen

Gib die URL deiner Mastodon-Instanz ein, um den Artikel zu teilen.

Anzeige
Anzeige