Findest du jemals, dass ein bestimmtes Designelement immer wieder auftaucht? Selbst die winzigen Details, die etwas unbedeutend aussehen, können Indikatoren für Designtrends sein. Das gilt besonders für die Elemente in der Zusammenfassung dieses Monats.

Jeder dieser Trends - weiße Ränder, die ein Webdesign bilden, Cinemagramme und winzige Ladeanimationen - sind scheinbar einfache Details, die das visuelle Erlebnis für die Benutzer verbessern.

Hier ist, was in diesem Monat im Design Trend ist:

1) Weiße Ränder

Weitere Webdesigns verwenden weiße Ränder oder Rahmen um den Umfang des Designs im Webbrowser. Es ist eine neue Wendung einer alten Idee, wenn mehr Webseiten zu bestimmten Größen gebaut wurden und das Framing für seltsame Browserbreiten verwendet wurde.

Es ist etwas, das verblasste, als mehr Designer sich für reaktionsschnelle Designs in voller Breite entschieden.

Der neue Twist mit Framing ist interessant und eine gute Möglichkeit, eine Leinwand für das Design zu erstellen. Die meisten Websites, die diesen Trend verwenden, enthalten eine weiße, aber nicht obligatorische Kante um das Design herum. Es ist ein paar Pixel breit und wird üblicherweise um drei oder vier Seiten des Designs platziert. (Einige entscheiden sich dafür, den Rahmen vom unteren Rand des Designs zu entfernen, um das Scrollen zu unterstützen.)

Das Schöne an der weißen Kante ist, dass das Design sauber ist mit weißen Linien, die dazu beitragen können, den Fokus auf starke Farbauswahl zu lenken, das Auge vom Rand des Bildschirms auf andere Lichtelemente (wie Textfelder oder Handlungsaufforderungen) zu lenken und Kanten können dabei helfen, einen Hintergrund-Canvas für Parallax-Scrolling oder andere animierte Effekte zu erstellen.

Camden Town Brauerei macht das außergewöhnlich gut. Der weiße Rahmen füllt zwischen Elementen des Designs, um Tiefe und Fokus für den Benutzer zu schaffen. Die weiße Trennung trennt jeden neuen Inhaltsabschnitt auf dem Bildschirm und trägt zur Gesamtorganisation des Designs bei. (Außerdem heben weiße Akzente die starke rote und schwarze Farbpalette hervor, damit die Kombination nicht zu überwältigend wirkt.)

Brauerei
Hang
Claraluna

2) Cinemagramme

Cinemagramme sind Fotos mit einem Element der Bewegung in ihnen. Es kann alles sein, von einem Foto einer Person, die ihre Augen blinzelt, bis zu der subtilen Wolkenbewegung am Himmel, wo sich sonst nichts bewegt. Während die häufigsten Nutzungen des Designtrends immer noch in Werbung und sozialen Medien zu finden sind, beginnen Webdesigner diese "Live-Foto" -Technik ebenfalls zu integrieren.

Es funktioniert, weil Benutzer von Bewegung fasziniert sind. Es ist effektiv für viele der gleichen Gründe, Video ist eine gute Option, um die Aufmerksamkeit eines Benutzers zu ergreifen. Bewegung und Handlung sind fesselnd. Es ist interessant. Es fühlt sich echt an.

Wenn es darum geht, mit Cinemagraphs zu arbeiten, ist der Bonus, dass Sie ein Design mit Bewegung erstellen können, aber ohne die hohe Produktion eines Videoprojekts.

Der Trick, Cinemagramme zu machen, besteht darin, die Bewegung in der Realität zu verankern. Auch wenn die Szene eher eingebildet ist, wie z Einfarbiges Paris Für die Bewegung auf dem Bildschirm sollten die Gesetze der Physik gelten. Wasser sollte stromabwärts fließen, zum Beispiel sollte die Schwerkraft eine Kraft dafür sein, wie Bewegung auftritt.

Die Bewegung muss auch einfach und subtil sein. Zu viel Bewegung und ein Video könnte eine bessere Option sein. Was Benutzer in einen Cinemagraph hineinzieht, ist das Element der Überraschung. Was wie ein Standfoto in einem Heldenbild aussieht, hat tatsächlich etwas in sich. Dieses kleine Divot wird dazu beitragen, Leute einzubeziehen, sie mit dem Design länger beschäftigt zu halten und hoffentlich zu einer Website-Konvertierung zu führen.

Kinografen
Monoparis
Glanzevon

3) Winzig geladene Animationen

Ladezeiten sind eine große Sache. Sie können jedoch nicht immer die Geschwindigkeit des Netzwerks berücksichtigen, auf dem sich ein Benutzer befindet. Hier können winzige Ladeanimationen eine große Sache werden.

Was beim kleinen Ladeanimationstrend anders ist, ist, dass es manchmal so aussieht, dass man es manchmal nicht sieht. In jedem Fall hat das Designteam besonders darauf geachtet, dass jeder Nutzer mit positiven Erfahrungen auf die Website kommt.

Diese winzigen Animationen sind an der Tatsache erkennbar, dass sie nicht wirklich Teil der Nutzererfahrung sind, die auf das gesamte Website-Ziel zutrifft. Sie sind ein einfaches, kleines Element, das Ihre Aufmerksamkeit für eine schnelle Sekunde erregt, während das primäre Website-Design serviert wird.

Das coole an dem Trend ist, dass diese winzigen Ladeanimationen wirklich winzig sind, von der Größe des Visuellen bis hin zur Action auf dem Bildschirm, es gibt nicht viel zu sehen, aber was dort ist, ist absolut reizvoll.

Hier sind drei großartige Beispiele:

  1. Hannah Purmorts Ladeanimation ist ein einzelner Bewegungsstrich in der entgegengesetzten Farbkombination des Hauptbildschirms. Der Strich wird auch im Scroll-Effekt durch das Design übertragen.
  2. Susa Ventures verfügt über ein kleines Symbol mit einer kleinen Ladebalken. Dieser nimmt Ihre Aufmerksamkeit auf sich, denn der winzige Gorilla ist visuell interessant und macht Sie neugierig auf den Inhalt der Website.
  3. FPG verwendet eine Skizze, die scheinbar auf dem Bildschirm gezeichnet wird, während der Rest der Homepage geladen wird. Der einzige Hinweis darauf, dass es sich tatsächlich um eine Ladeanimation handelt, ist, dass der Rest des Bildschirms viel komplizierter ist, sobald er mit laufendem Video und noch mehr Skizzen geladen ist. Der Effekt ist nahtlos und ist fast beendet, bevor der Benutzer erkennt, dass er begonnen hat.
Hannah
Susa
fpg

Fazit

Details stehen im Mittelpunkt jedes guten Designs. Es ist wichtig, daran zu denken, dass es wichtig ist, Dinge zu entwerfen (und zu berücksichtigen), die nicht von jedem Benutzer bemerkt werden. So verbindet sich jeder dieser Trends - durch kleine Designelemente, die nicht Teil der Gesamtästhetik sind.

Diese winzigen Elemente können die Website für einen Benutzer wirklich einzigartig machen. Es könnte das Element der Freude sein, das jemanden zu deinem Design zurückbringt. Details können das Unterscheidungsmerkmal zwischen Erfolg und Misserfolg sein.

Welche Trends liebst du gerade (oder hasst)? Ich würde gerne einige der Websites sehen, die Sie fasziniert sind. Schreibe mir einen Link auf Twitter ; Ich würde gerne von dir hören.