Haben Sie heutzutage etwas anderes an der durchschnittlichen Website bemerkt? Die Gestaltung von Websites hat sich bereits vor wenigen Jahren geändert. Und viele nennen diese Änderung das Kommen von Web 3.0 - eine neue Ära des Webdesigns.
Im Großen und Ganzen dreht sich in Web 3.0 alles um Daten und deren Verwaltung. Wir leben in einem Zeitalter der Information, und mit zunehmendem Datenvolumen wächst auch die Notwendigkeit, diese zu verwalten.
Sie haben davon gehört Blockchain vorher und die Phrase Dezentrales Web.
Und Sie werden auch von Leuten gehört haben, die es wollen Unternehmen wie Google die Macht nehmenund sogar Facebook - das hatte ein angemessener Anteil an Datenschutzproblemen in den letzten Jahren.
Was ist mit künstlicher Intelligenz (KI) und Maschinelles lernen (ML)?
Dies sind alles echte Technologien, die in der einen oder anderen Form in das moderne Web integriert werden. Das Ziel ist einfach: Benutzererfahrungen zu personalisieren und das Web zugänglicher zu machen.
Und doch…
This post is about none of those technologies
Obwohl ich verstehe, dass alle oben genannten Techniker für die heutige Zeit außerordentlich relevant sind, liegt mein Fokus für diesen Beitrag auf 3.0 Web Design.
Mit anderen Worten, wie haben sich Websites in den letzten fünf Jahren verändert und wie verändert sich das Website-Design mit Web 3.0?
So sah das Web einst aus:
Und Mitte der 2000er Jahre begann das Aufkommen von Web 2.0 - das ungefähr so aussah:
Dies ist jedoch nichts im Vergleich zu dem, was wir in den Web 3.0-Designs sehen:
Die neue Ära des Webdesigns betont makellose Präzision, wirkungsvolle Farbschemata und die Hinzufügung neuer Designelemente, die das Gesamtdesign ergänzen.
Also, wie sind wir hierher gekommen und was müssen Sie wissen?
What is Web Design 3.0: Your questions answered
In diesem Abschnitt werde ich mich auf folgende Fragen konzentrieren:
- Wie unterscheiden sich Web 3.0-Websites von den Vorjahren?
- Warum verwenden Designer so viele Formen und andere Designelemente?
- Halten die Seitenersteller mit den Trends Schritt?
Nachdem diese Fragen beantwortet wurden, werfen wir einen Blick auf die neuesten Design-Tools und einige Plattformen, auf denen Sie Design-Inspiration finden können.
Fahren wir also mit der ersten Frage fort.
# 1: Wie unterscheiden sich Web 3.0-Websites von den Vorjahren?
Ich würde sagen, dass die wichtigste Veränderung in den letzten Jahren das Hinzufügen kreativer Elemente ist.
Designer werden immer komfortabler mit der Verwendung von Hintergrundelementen wie Formen und Kurven, um einen bestimmten Design-Navigationspfad festzulegen.
Bei richtiger Anwendung Formen und Blobs kann dabei helfen, wertvolle Inhalte hervorzuheben und gleichzeitig eine angenehme Benutzeroberfläche bereitzustellen.
Darüber hinaus werden Web 3.0-Designs verwendet viel mehr Abbildungen und visuelle Inhalte insgesamt. Nicht nur, um Seiten zu bereichern, sondern häufig, um ein bestimmtes Produkt oder eine bestimmte Ursache zu veranschaulichen.
Sobald Sie ein solches Design sehen, wissen Sie, dass das jeweilige Unternehmen harte Arbeit geleistet hat, um die Benutzererfahrung angenehm zu gestalten.
In späten 2018, MailChimp hat seine gesamte Website umbenanntund eines der Dinge, die sie einführen wollten, war die Verwendung von Illustrationen.
Hier sind die drei wichtigsten Gründe, warum Sie die Verwendung von Abbildungen in Betracht ziehen sollten:
In erster Linie erregen Illustrationen die Aufmerksamkeit der Besucher wie nichts anderes, aber das ist nebensächlich.
- Komplex in einfach verwandeln. Traditionell verlassen sich Webdesigner auf Schlagzeilen, um ihr Produkt zu erklären. Heutzutage können Illustrationen die meiste harte Arbeit für Sie erledigen. Sie können ein komplettes Illustrationsset um Ihre Produkte und deren Funktionen entwerfen. Visuelles Lernen ist schließlich eine Sache!
- Markenzeichen. Der von Ihnen verwendete Illustrationsstil kann dazu beitragen, ein positives Markenimage zu fördern. Abbildungen können unterschiedliche Markenwerte, Stärken und Qualitäten zeigen. Nicht etwas, das Sie allein mit Copywriting darstellen könnten.
- Visueller Charakter. Jede Marke ist anders. Und mit Visuals können Sie eine Identität darstellen, die Sie von den anderen unterscheidet.
Dies gilt auch für Dinge wie Symbole und Animationen. Beide erfordern etwas mehr individuelle Arbeit - vorzugsweise von einem Grafikdesigner -, aber die Belohnungen sind da!
Und die drittwichtigste Änderung ist Typografie.
Die Schrift ist immer ein großer Teil jedes Designs geblieben. Und wenn Sie nicht überzeugt sind, habe ich Sie aufgefordert, die Schriftarten auf Ihrer Website in etwas völlig Zufälliges zu ändern.
Der Unterschied dazu gute Typografie macht ist enorm. Und seitdem Web 3.0-Websites in den Mainstream aufgenommen wurden, ist auch die Vielfalt der Schriftarten gestiegen.
Sie könnten mit einem einfachen Webdesign nur für die Art von Schriftarten durchkommen, die Sie verwenden. Ich empfehle Lesezeichen Typewolf.
Diese Seite ist eine Goldmine für alles, was mit Typografie und Schriften zu tun hat. Jeremiah Shoaf leitet es. Er hat seine Website seit vielen Jahren gepflegt und hat Tausende von verschiedenen Einträgen auf seiner Website.
Außerdem schreibt er Leitfäden und pflegt regelmäßig sein Verzeichnis „Site of the Day“. Wenn ich an einem neuen Projekt arbeite, ist Typewolf eine der ersten Websites, die ich besuche.
Durch das Erlernen der Typografie und ihrer Auswirkungen auf das Webdesign sparen Sie eine Menge Zeit, wenn es darum geht, dass sich das Design professionell anfühlt.
# 2: Warum verwenden Designer so viele Formen und andere Designelemente?
Es sind nicht nur Websites, die von Fachleuten entworfen wurden, die diesen neuen Trend nutzen. Die meisten moderne WordPress-Themes und Frameworks sind auch darauf ausgelegt, diese Trends umzusetzen.
Aber warum Formen und wie profitieren sie von einem Website-Design? Die beiden Hauptfaktoren sind Ästhetik funktioniert Minimalism. Formen und andere geometrische Elemente tragen dazu bei, das gesamte Design zusammenzuführen und sicherzustellen reibungsloser Ablauf und konsistente Benutzererfahrung.
Traditionell werden Abschnitte nur mit einzelnen Farben und manchmal ohne Farbe unterteilt.
In diesem Beispiel können Sie sehen, wie die Verwendung einfacher Illustrationen dieses minimalistische Design bereichert und Hintergrundmuster unterstützt. Dies trägt wiederum dazu bei, die Lesbarkeit der Hauptnavigationselemente zu verbessern.
Sie können auch unterstützende Hintergrundelemente verwenden, um wichtige Inhalte hervorzuheben, z.
Alles in allem ist es eine Mischung aus Beständigkeit und kreativem Denken. Eine Hintergrundform, wie oben gezeigt, kann helfen Implementieren Sie die Farbpsychologie, um die Benutzererfahrung weiter zu verbessern.
Später in diesem Beitrag werden wir uns die beliebtesten Inspirationsseiten für Webdesign ansehen. Hier sehen Sie verschiedene Techniken zum Implementieren geometrischer Formen im Webdesign.
# 3: Halten die Seitenersteller mit den Trends Schritt?
Es sind nicht nur Seitenersteller wie Visual Composer und Elementor das hilft dir, bessere Zielseiten zu erstellen. Marken mögen Squarespace, Webfluss und Weblium machen auch bedeutende Fortschritte im Bereich des Website-Builders. Alle diese Designtools folgen den neuesten Trends im Webdesign.
Elementor, das mehr als 25 Millionen Downloads verzeichnet hat, entwickelt seine Komponentenbibliothek ständig weiter, um Elemente aufzunehmen, die das moderne Web ausmachen. Und Weblium verwendet KI, um unerfahrenen Webmastern zu helfen, visuell beeindruckende Websites zu erstellen.
Das Beste daran ist, dass Sie nie eine einzige Codezeile schreiben müssen. Moderne Seitenersteller bieten Gitterbasierte Layouts ohne alle technischen Details.
Sie können neue Zeilen und Abschnitte erstellen und die Größe einzelner Komponenten mithilfe von Drag & Drop-Werkzeugen ändern. Sie können dies auch ganz vermeiden und vorgefertigte Vorlagen verwenden.
Unnötig zu sagen, Das Erlernen von HTML und CSS wird nach wie vor dringend empfohlen wie Lernen von Vektorgrafiken und allgemeinem Grafikdesign. Seitenersteller sind anfällig für Ineffizienzen, die nur behoben werden können, wenn sie mit Code verschmutzt werden.
Web 3.0 Design Tools: The current trends
In früheren Tagen wurden Websites basierend auf Drahtgittern und Skizzen erstellt, die Sie auf einem Blatt Papier entwerfen mussten. Photoshop hat dazu beigetragen, dies ein wenig zu mildern, aber sicherlich nicht bis zu den Tools, die wir heutzutage haben.
Moderne Designtools konzentrieren sich speziell auf die Idee, Websites und mobile Apps zu entwerfen. Dies öffnet die Tür zu pixelgenauem Design mit der Möglichkeit, einige Ihrer Designs als vorgefertigte Websites zu exportieren.
Sobald Sie ein benutzerdefiniertes Design haben, können Sie sich entweder darauf konzentrieren, es selbst zu codieren oder Seitenersteller zu verwenden, um eine nahezu perfekte Kopie dieses Designs zu erhalten.
Hier sind die Tools, die den Unterschied ausmachen.
# 1: Skizze
Skizze ist ein einzigartiges Designtool für Mac OS und wohl eines der besten digitalen Designtools auf dem Markt. Obwohl es auf ein bestimmtes Betriebssystem beschränkt ist.
Eines der Dinge, die Sketch so beliebt und begehrt machen, ist die Tatsache, dass es so ziemlich alles bietet, was Sie für digitales Design benötigen. Dazu gehören das Entwerfen von Websites, mobilen Anwendungen, Vektorgrafiken sowie Prototyping und externe Plugins für zusätzliche Funktionen .
Persönlich ist eines der Dinge, die ich an Sketch wirklich liebe, dass es eine wirklich robuste Software ist. Es geht darum, andere Optionen auf dem Markt zu prüfen. Sketch veranschaulicht den Standard einer professionell erstellten Software.
Was das Webdesign angeht, ist eines der aufregenden Merkmale von Sketch, dass es zur Unterstützung des Website-Designs entwickelt wurde. Sie können also Raster erstellen, mehrere Ebenen erstellen und vieles mehr.
In vielerlei Hinsicht ist es wie in Photoshop, nur für das Webdesign. Es enthält keine durchschnittlichen Funktionen zum Bearbeiten von Fotos, bietet jedoch alles, was Sie zum Bearbeiten Ihrer Vektorgrafiken, zum Einfügen von Bildern, zum Verwalten von Schriftarten, zum Verwalten von Seitengrößen, zum Erstellen zusätzlicher Raster usw. benötigen.
Wenn Sie sich heute moderne Websites ansehen, insbesondere von einigen der großen Marken, dann wurde die Website in 99% der Fälle mit Sketch gestaltet, sodass sie unter professionellen Designern sehr bekannt ist.
Und wenn Sie ein Neuling sind und lernen möchten, dann schauen Sie sich das an Online Kurs.
# 2: Wahnsinn
Wie bereits erwähnt, wurde Sketch ausschließlich für MacOS entwickelt. Glücklicherweise, Icons8 hat es sich zur Aufgabe gemacht, eine Alternative für Windows-Benutzer zu schaffen. Und das Beste daran ist, es ist völlig kostenlos.
Wahnsinn ist ein Windows-basiertes Vektorbearbeitungswerkzeug, das viel Inspiration von Sketch übernommen hat. Es ist als einzelne Vektorbearbeitungssoftware voll funktionsfähig, unterstützt jedoch auch Skizzendateien.
Wenn Sie also mit Sketch erstellte Projekte herunterladen, können Sie diese mit Lunacy verwenden. Last but not least wird Lunacy von der Community unterstützt. Das heißt, Sie können Funktionen anfordern und darüber abstimmen, die von anderen eingereicht wurden.
Alles im Namen einer einfacheren und einfacheren Gestaltung von Websites.
# 3: Figma
Das letzte große Webdesign-Tool ist Figma. Figma ist übrigens auch ein enger Konkurrent von Sketch. Und es ist völlig kostenlos zu benutzen. Es wurde für den Browser entwickelt, verfügt jedoch auch über eine Desktop-Anwendung.
Da Figma kostenlos ist und viele Funktionen bietet, ist es auch eine App, die ich selbst am häufigsten benutze. Die Benutzeroberfläche fühlt sich natürlich an, ohne Overhead. Alle Schaltflächen und Funktionen sind so gestaltet, dass Sie nahtlos benutzerdefinierte Designs erstellen können.
Als Randnotiz verwende ich Figma auch gern für jede Art von allgemeiner Vektorarbeit. Ob es um das Erstellen von Anführungszeichen, neuen Schaltflächenstilen und so ziemlich allem anderen geht.
Web 3.0 Design Inspiration: Learn from the best
Sie müssen sich nicht anmelden UX-Kurs zum Lernen großartige Gestaltungsprinzipien. Alles, was Sie brauchen, ist der Zugriff auf einige ausgewählte Inspirationsseiten, und Sie werden schnell verstehen, was im Trend liegt.
Der folgende Abschnitt soll Ihnen helfen, die beste Design-Inspiration für alle anstehenden Web 3.0-Projekte zu finden.
Die Verwendung von Websites mit professionellen Designs kann Sie dazu ermutigen, in Zukunft bessere Designentscheidungen zu treffen.
# 1: Lapa-Ninja
Lapa Ninja muss eine meiner Lieblingsinspirationswebsites sein. Ich mag es in Bezug auf die Art der Websites, die es auflistet, und auch, wie es mit den neuesten Entwicklungen im Webdesign Schritt hält.
Und ehrlich gesagt gibt es wirklich keine andere Website, die das genauso macht. Darüber hinaus enthält seine Datenbank bereits mehr als 2000 Einträge. Sie müssen also nicht unbedingt warten, bis neue Designs hinzugefügt werden. Und eines der anderen Dinge, die ich an dieser speziellen Plattform wirklich mag, ist, dass Sie tatsächlich eine Website oder einzelne Websites und deren Designs nach Kategorien durchsuchen können.
Und es ist nicht nur Sie wissen, Blog oder Geschäft, sondern Sie können tatsächlich aus bestimmten Kategorien wie Portfolio, Gesundheit und verschiedenen Arten von Branchen wählen. So können Sie Ihre Suche wirklich eingrenzen.
Abgesehen davon ist es einfach zu durchsuchen und enthält das meiste, worüber wir in diesem speziellen Artikel gesprochen haben.
Wenn man sich die einzelnen Einträge ansieht, ist es wirklich einfach, die Änderungen zu erkennen, die derzeit im Webdesign auftreten.
Es ist also nur eine unschätzbare Ressource, die Sie von Zeit zu Zeit besuchen oder besuchen können, wenn Sie an einem Design festhalten oder etwas Neues entwerfen möchten.
# 2: OnePageLove
Eine einseitige Website ist im Wesentlichen eine Website ohne zusätzliche Seiten. Einige nennen es Zielseiten, aber die meisten Leute nennen es einseitige Websites. Sie sind viel häufiger als Sie denken. Und OnePageLove ist wahrscheinlich die beste Website, um eine angemessene Belichtung für solche Websites vorzunehmen.
Ähnlich wie bei Lapa Ninja können Sie Ihre Suche auf bestimmte Kategorien eingrenzen. Jede Auflistung enthält einen ganzseitigen Screenshot und einige Details zum Autor.
Ansonsten können Sie nach Ihren Wünschen navigieren und jede Website besuchen, die Ihre Aufmerksamkeit auf sich zieht. Ich kann mich nicht daran erinnern, wie oft ich mich von Websites gelistet habe, die von aufgelistet wurden OnePage Liebe. Es ist so gut!
# 3: Auszeichnungen
Last but not least haben wir Auszeichnungen. Möglicherweise die älteste laufende Website-Inspirationsseite der Welt. Und dennoch gelingt es, die Konsistenz von Jahr zu Jahr beizubehalten.
Die Idee hinter Awwwards ist, dass Leute Website-Designs einreichen und Mitglieder über ihre Favoriten abstimmen. Anschließend stimmt das Awwwards-Komitee individuell ab und entscheidet über einige ausgewählte Gewinner für einen bestimmten Zeitraum.
Wenn Sie ein Gewinner werden, können Sie Ihrer Website ein spezielles Abzeichen hinzufügen, das Ihr hervorragendes Designverständnis hervorhebt.
Und was die Inspiration betrifft, sind viele der auf dieser Website aufgeführten Designs äußerst exklusiv. Es ist ein Spielplatz für wirklich kreative und ehrgeizige Designer.
Es lohnt sich, einmal pro Woche ein Lesezeichen zu setzen und es erneut zu überprüfen.
Fazit: Wohin von hier aus?
Webdesign ist eine wettbewerbsfähige Branche. Und nicht, weil die Leute bessere Websites machen wollen als andere. Es ist in Bezug auf UI und UX am wettbewerbsfähigsten.
Wenn Sie einen neuen Weg finden, um die Aufmerksamkeit der Menschen auf sich zu ziehen, können Sie bessere Verkaufsergebnisse erzielen. Wenn Sie solide UX bereitstellen, werden Sie feststellen, dass die Nutzer häufiger auf Ihre Website zurückkehren.
Seit 2018 gibt es einen enormen Zustrom von Designs, die den visuellen Aspekt des Designs bevorzugen. Erwarten Sie daher viel mehr Änderungen und Ergänzungen in diesem Bereich.
