Mobiles Design lässt mich vertikal skizzieren. Und ich glaube nicht, dass es nur ich ist.
Ich sehe immer mehr Sites auf Plattformen, die mehr vertikale Komponenten in ihr Gesamtdesign integrieren. Vergessen Sie? Über der Schriftrolle? lass uns darüber sprechen, vertikal zu gehen.
Horizontales vs. vertikales Design
Seit langem konzentriert sich das Website-Design auf ein ziemlich unterschiedliches Bild "über der Bildlaufleiste". Mentalität. Für das Design für Tablets und mobile Geräte müssen Sie Ihre Standardausrichtung ändern. Alle gut konzipierten mobilen Websites auf der Außenseite haben einen großen Einfluss auf Designprojekte, sowohl online als auch gedruckt.
Viele der gleichen Grundprinzipien gelten unabhängig davon, ob Sie horizontal oder vertikal arbeiten. Saubere Typografie, eine starke Farbpalette und Bilder sowie die Gesamtorganisation sind wichtig.
Das Design in einem vertikalen Raum ist jedoch kein neues Konzept. Printdesigner machen das schon seit Jahren - betrachten Sie Zeitungen und Zeitschriften als klassische Beispiele. Neu ist die nahezu unbegrenzte vertikale Möglichkeit. In vertikalen Webprojekten können Sie die Tiefe beliebig erweitern (obwohl dies nicht immer empfohlen wird).
Erstellen Sie einen vertikalen Raum
Manchmal besteht die erste Herausforderung darin, einen für Ihr Projekt geeigneten vertikalen Raum zu schaffen. Dies geschieht fast standardmäßig, wenn Sie an einem Projekt arbeiten, das ein mobiles Gegenstück umfasst. Wie sieht es aber mit der Website selbst aus? (Dies wird in der aktuellen Browserumgebung niemals eine durchgehend vertikale Form haben.)
Wenn Sie über einen Blog oder eine Website mit einer Seitenleiste verfügen, ist der Arbeitsbereich möglicherweise bereits vertikaler, als Sie denken. Betonen Sie diese Form mit anderen vertikalen Teilen, z. B. einem starken Auf- und Abwärtsbild oder einem kurzen Textblock, der vertikal liest.
Eine weitere Option besteht darin, den Raum über die Bildlaufleiste hinaus zu vergrößern. Erstellen Sie Cascading-Bildschirme. die von oben nach unten navigiert werden. Dies ist ein Konzept, das für einige Zeit missbilligt wurde, aber es gewinnt wieder an Boden, weil die Benutzer "umgeschult" wurden. durch eine Website scrollen dank der Fülle von mobilen und Tablet-Anwendungen, die genau so funktionieren.
Sie können Ihr Design auch in mehreren vertikalen Räumen planen, indem Sie ein Raster mit mehreren breiten Spalten erstellen. In dieser Konfiguration hat jede Spalte einen bestimmten Zweck (sehr ähnlich einer Seitenleiste), der einen vertikalen Arbeitsbereich erstellt. Sie können einen vertikalen Arbeitsbereich mit einer Spalte erstellen, indem Sie die Pixelbreite Ihres Arbeitsbereichs verringern und den Rest mit einem Hintergrundbild füllen.
Der Schlüssel ist nicht, es zu erzwingen. Manchmal ist es Ihnen nicht möglich, einen vertikalen Raum zu schaffen. Wenn Sie nicht in einer vollständig vertikalen Ausrichtung entwerfen können, sollten Sie einige vertikale Designelemente wie Navigationsleisten oder Bilder in Ihrem Gesamtdesign verwenden.
Vertikale Elemente verwenden
Bei der Planung eines vertikalen Entwurfs geht es manchmal um mehr als nur um den gesamten Raum. Erwägen Sie die Verwendung vertikaler Elemente in einem horizontalen Raum, um ein Auf und Ab-Gefühl zu erzeugen. Experimentieren Sie mit vertikalen Fotos oder großen, dünnen Textblöcken. Aber erzwinge es nicht erneut. Diese Tools sind nur wirksam, wenn sie mit Ihren Inhalten arbeiten (nicht dagegen).
Erstellen Sie statische Elemente wie Navigationsleisten oder Logos auch vertikal. Denken Sie daran, diese Elemente so zu strukturieren, dass sie nutzbar bleiben. Navigationsleisten funktionieren am besten für ein scrollendes Layout, wenn sie nicht zu tief sind und sich mit der Seite bewegen, während Benutzer navigieren. (Sie möchten nicht, dass Benutzer frustriert werden, wenn sie versuchen, Dinge zu finden.)
Sie können auch Farbe verwenden, um Ihre Site vertikaler zu gestalten. Denken Sie an den Hintergrund - vertikale Streifen können einen "größeren" hinzufügen. fühlen, wenn sie hinter anderen Objekten platziert werden.
Vertikales Design in Aktion
Druckdesign verlässt sich seit Hunderten von Jahren auf eine vertikale Leinwand. Einige der bekanntesten Publikationen - The New York Times, USA Today, Vogue und People - haben Formate, die größer als breit sind.
Aber damit endet es nicht. Filmposter sind eines der bekanntesten Beispiele für vertikal ausgerichtete Designprojekte.
Immer mehr Visitenkarten werden, obwohl sie meistens horizontal gedruckt werden, in einem vertikalen Format angezeigt. Warum? Weil es sie unter den Hunderten von anderen im Stapel hervorhebt. Gleiches gilt für andere gedruckte Werbematerialien wie Magnete und Aufkleber. Bei Druckprojekten kann die Entscheidung, eine vertikale Ausrichtung zu verwenden, wenn die meisten anderen horizontal arbeiten, dem Projekt wirklich etwas Pop und Flair verleihen.
Vertikale Überlegungen
? Vertikale Layouts können in der Eile schwer und schwer zu navigieren werden.?Vertikale Layouts können in der Eile schwer und schwer zu navigieren sein. Achten Sie beim Entwerfen in einem vertikalen Raum darauf, Kopfzeilen und Navigationswerkzeugen genügend Gewicht zu verleihen, damit der Benutzer (oder Leser) nicht den Überblick verliert.
Wenn Sie ein vertikales Format verwenden, sollten Sie in Betracht ziehen, den Text um einige Punkte zu vergrößern (und mit zusätzlichen Zeilenabständen), und Sie möchten wahrscheinlich Navigationsgeräte (Bildlaufleisten oder Beschreibungen) einschließen, die dem Benutzer durch die Website folgen.
Seien Sie auch vorsichtig mit dem horizontalen Raum in der vertikalen Anordnung. Widerstehen Sie der Versuchung, einen horizontalen Stil in einen anderen Raum zu bringen; es wird wahrscheinlich zu kurz kommen. Sie möchten andere Elemente nicht zusammenmischen, nur um sie in einen engeren Raum einpassen zu können. Suchen Sie nach Möglichkeiten, Elemente neu anzuordnen oder zu stapeln, damit der Arbeitsbereich nicht überfüllt erscheint.
Vertikale Liebe
Hier sind einige Websites, die das vertikale Konzept verwenden und ausführen.
aktivieren Sie
Die Site ist vertikal aufgebaut und hilft Ihnen beim Navigieren, indem Sie die Bildlaufleiste zum Öffnen verwenden. die Flasche und der Rest der Website. (Das wird niemals alt.)
Enviro-Häuser
Diese Navigationsleiste oben auf dieser vertikal basierten Site wird so angepasst, dass Sie immer das perfekte Bild auf Ihrem Computerbildschirm sehen.
Lotta Nieminen
Diese Site verwendet vertikale Spalten, um die Form festzulegen.Durch das Mischen von Rechtecken können Sie sich durch die Seite bewegen.
100% reines Neuseeland
Wenn Sie auf dieser Seite nach unten scrollen, wird ein Videoeffekt erstellt, mit dem Sie mehr von Neuseeland sehen können.
Fazit
Ich liebe das Wiederaufleben und die Betonung, die mobile Konzepte auf vertikal ausgerichtete Projekte haben. Veränderte Benutzerumgebungen und das Auftreten von Responsive Design beeinflussen diesen Trend ebenfalls.
Insgesamt unterscheidet sich das vertikale Gestalten nicht wirklich von seinem horizontalen Pendant. Es mag am Anfang etwas ungewohnt sein, aber durch die Verwendung der gleichen Werkzeuge und Konzepte, die sich auf gutes Design in einem horizontalen Schema beziehen, können Sie große vertikale Projekte erstellen. Wenn Sie sich Sorgen um das Ergebnis machen, beginnen Sie klein und entwickeln Sie einige vertikale Teile, die in ein Projekt integriert werden sollen, bevor Sie vollständig vertikal gehen. Sie finden vielleicht nur, wie sehr Sie die neue Ansicht genießen!
Bildquellen: Illyissimo, Food SenseSimon Collison und Spigot Design.