Webdesign im neuen Jahrzehnt

Quo vadis Internet?

Nichts hat die letzte Dekade so derart geprägt wie das Internet. Anfang der 2000er kommerzialisiert, ist es die letzte Dekade förmlich explodiert. Mit dem Iphone feierte es den Einzug in die Hosentasche, heute finden wir es in Armbanduhren,  Autos und Kühlschränken. Was Design betrifft, bringt das natürlich neue Herausforderungen mit sich. Interaktionskonzepte haben sich die letzten 10 Jahre grundlegend verändert, Regeln wurden aufgestellt, gebrochen und für obsolet erklärt, um Platz zu schaffen für neue Regeln. Insgesamt muss man aber sagen, dass Webdesign, oder besser gesagt digitales Design heute freier, wilder und spannender als je zuvor ist. Websites und Apps werden heute mehr als je zuvor genutzt um über gezielte Emotionalisierung Kunden zu gewinnen und zu binden. Im folgenden ersten Teil betrachten wir 3 Design-Konzepte, die 2020 und darüber hinaus einen bleibenden Eindruck hinterlassen werden.

Header Videos

für garantierten Wow-Effekt

Große Headerbilder sind im modernen Webdesign bereits seit einigen Jahren Standard. Richtig interessant wird es dann wenn etwas Bewegung ins Spiel kommt. Seit einiger Zeit werden immer mehr großflächige Videos anstatt dem statischen Bild eingesetzt. Aufgrund der gestiegenen Bandbreiten ist das heute im Gegensatz zu früher problemlos möglich. Diese Entwicklung wird in der Form weitergehen. Weiter steigende Bandbreiten - Stichwort 5G - wird großflächige Videos in hohen Auflösungen und Frame-Raten möglich machen. 

Was gibt es bei Headervideos zu beachten?

Videos an sich sind meist aufwändiger zu produzieren als bloße Fotografie, deswegen muss im Vorhinein ein durchdachtes Konzept erarbeitet werden. Oft will man dennoch Textinhalte über das Video platzieren, für die Videoproduktion muss das bedacht werden. Die Licht- und Farbstimmung muss natürlich auch mit dem Corporate Design harmonieren. Richtig gemacht sorgt ein Headervideo für ordentlich Emotion und ganz sicher für einen bleibenden Eindruck.

Tipp: Für kleine Budgets gibt es auch Videos bei Stockfoto-Anbietern wie Shutterstock oder pexels.com, wobei letztere sogar Videos gratis anbietet. Die Qualität der Videos schwankt sehr stark, mit etwas Geduld und Glück kann man vorübergehen gute Ergebnisse erreichen. 

Asymmetrische Layouts

Think outside the Box

Seit das Web mobil wurde und mit dem Iphone auch responsive Webdesign zum Buzzword Nummer 1 wurde, werden Websites großteils in sogenannten Grid-Layouts gestaltet. Jeder kennt es. Oben ein großes Headerbild und der restliche Content teilt sich auf, auf 2-Spalter, 3-Spalter usw. Dieses Spalten-Denken ist auch heute noch eine sehr saubere und effiziente Lösung für Websites. In letzter Zeit sieht man aber immer wieder Websites, die ganz radikal aus diesem Raster ausbrechen. Mitunter führt das zu großartigen Ergebnissen. Ein sehr schönes Beispiel für ein asymmetrische Design wäre z.B. Urban's Place.

Die Herausforderungen von asymmetrischem Design

Asymmetrisches Design stellt weit höhere Ansprüche an den Designer, was sich meist auch im Budget niederschlägt. Das bekannte Grid-Layout gibt klar die Richtung vor und ein ausgeglichenes, gutes Layout ist recht einfach zu erreichen. Bei einem asymmetrischen Design braucht es besonderes Fingerspitzengefühl, damit das Design nicht aus dem Gleichgewicht gerät. Vor allem ein Gefühl für Harmonie & Balance ist gefordert, um ein perfektes Ergebnis zu erreichen, denn alles, was aus der Reihe tanzt, braucht auch einen passenden Gegenpol.

Parallax Scrolling

Content in Bewegung

Parallaxes Scrollen ist momentan einer der heißesten Design-Trends im Internet. Dabei verschieben sich beim Scrollen die Elemente auf verschiedenen Ebenen unterschiedlich schnell oder sogar in unterschiedliche Richtungen. Das sorgt für eine unglaubliche Dynamik und sieht irre cool aus. Diese Art des dynamischen Contents birgt allerdings so einige Herausforderungen an Design und Technik. Übertreibt man es, leidet die User Experience und Content wird schwer zu konsumieren. Außerdem setzt unter Umständen auch ein Ruckeln ein, weil der Browser damit überfordert ist. Deshalb ist beim parallax Scrolling Zurückhaltung oberstes Gebot.

Mehr Infos: Wir verwenden für unsere Projekte die Greensock Animation API, wo es einige beeindruckende Websites zu entdecken gibt.


Kommentare

Keine Kommentare

Kommentar schreiben

* Diese Felder sind erforderlich