Heute betrachten wir eines der einfachsten möglichen Gestaltungselemente: eine Linie. Wir werden lernen, wie man Linien richtig benützt und was bei der Implementierung zu vermeiden ist.
Wenn Sie einem Design ein paar einfache Linien hinzufügen, kann ein sonst langweiliges Design mit Struktur und grafischem Flair versehen werden. Es ist ein unkomplizierter Trick, der bei effektiver Anwendung dem Design eine Ebene Finish verleiht.
# 1: Verwenden Sie eine Unterstreichung
Wir beginnen mit dem grundlegendsten Trick im Typografie-Spielbuch: einer Unterstreichung. Eine unterstrichene Überschrift fühlt sich gewichtiger an und sorgt für eine klarere Trennung zwischen Kopf und Körper. Denken Sie daran, dass dies notwendigerweise positive oder negative Eigenschaften sind, jedoch neutraler sind. Sie müssen entscheiden, wann ihre Präsenz gut oder schlecht ist, basierend auf dem gewünschten Look.
Beachten Sie, dass die Linie nicht nur als Trennzeichen zwischen den beiden Elementen fungiert, sondern auch zur Definition der Spaltenbreite beiträgt.
Eine Sache, die mich mit Unterstreichungen stört, ist das visuelle Chaos, das erzeugt wird, wenn Sie Buchstaben haben, die einen Abstieg enthalten, der in die Zeile stürzt. Es gibt keine offizielle Regel dagegen, aber ich finde, dass es etwas zu ablenkend ist und das Interesse des Betrachters an alle falschen Stellen lenkt.
Wie gehen wir dieses Problem an? Die einfachste Möglichkeit ist natürlich, die Verwendung von Unterläufen und Unterstreichungen zu vermeiden, aber das ist für meinen Geschmack etwas zu einschränkend. Stattdessen erstelle ich die Unterstreichung manuell, indem ich eine Linie zeichnete (anstatt einfach auf die Unterstreichungsschaltfläche zu klicken) und dann die Teile der Linie ausblenden, die in meine Abseilflächen stürzen.
Wie Sie im obigen Beispiel sehen können, ist dies viel angenehmer als das vorige Beispiel und weist eine wesentlich geringere visuelle Komplexität auf. Wenn Sie das kleine Stück einer gestrandeten Linie nach der letzten? G? Sie können die Unterstreichung am letzten Abstieg einfach anhalten (nur anwendbar, wenn der letzte Buchstabe einen Abstieg enthält).
Erweitere es
Beachten Sie, dass eine Unterstreichung nicht an die Breite des Textes angepasst werden muss. Manchmal gibt es eine interessante Aussage, um die Unterstreichung über die gesamte Seite oder sogar außerhalb der Seite zu erweitern.
Wenn Sie die Unterstreichung verlängern, sollten Sie darüber nachdenken, wie Sie mit der Linie im negativen Bereich Spaß haben können. Sie können es etwas verwirren, in eine Form biegen, was Sie wollen!
Der unten stehende Designer schloss die erweiterte Unterstreichung mit einem Punkt ab. Dadurch fühlt es sich mit jedem Inhalt auf der rechten Seite verbunden an und fügt der einfachen Linie ein schönes, aber subtiles Interesse hinzu.
# 2: Brechen Sie die Linie auf
Fallen Sie nicht in die Falle, immer eine durchgezogene Linie zu zeichnen. Sie können Bindestriche, Punkte, Dreiecke, Sterne und alles, was Sie sich vorstellen können, verwenden, um die gewünschte Linie zu erstellen, und es wird immer noch das gleiche Ziel erreicht.
Sehen Sie sich an, wie dieser Designer ein gepunktetes Leinen verwendet hat, das sich in der Mitte der Überschrift befindet, um einen klaren Abschnitt zu erzeugen. Obwohl der Text hier mittig ausgerichtet ist, fühlt sich das Design als gerechtfertigt an, da die Linien die visuellen Grenzen der Überschrift funktional bis zum linken und rechten Rand der Spalte erweitern.
# 3: Flankiere den Typ
Wenn Sie sich für ein formales Thema entscheiden, kann das Wiederholen der Unterstreichung oben in Ihrer Überschrift ein Druckgefühl im alten Stil erzeugen. Ich denke immer an einen Zeitungskopf, wenn ich diesen Stil sehe.
Wenn Sie das Gefühl der Formalität reduzieren möchten, stapeln Sie die Linien auf unterschiedliche Weise, sodass sie weniger strukturiert wirken. Dies ist auch ein praktischer Effekt, um ein Bewegungsgefühl auf einer statischen Seite zu erzeugen.
# 4: Gehen Sie vertikal
Bisher haben wir uns auf horizontale Linien konzentriert, aber vertikale Linien können verwendet werden, um ein wirklich kreatives grafisches Interesse in ein Design einzufügen. Der Designer unten hat die vertikalen Linien in der Schrift übertrieben, und das aus keinem wirklichen Grund, außer der Tatsache, dass er ziemlich cool aussieht und ein schönes, zusammenhängendes Thema bildet, das auf dem Rest der Seite aufbaut.
Eine etwas traditionellere Verwendung einer vertikalen Linie wäre natürlich die Trennung von zwei Inhaltsspalten. Dies kann in Verbindung mit dem Typ oder mit Bildern verwendet werden und ermöglicht es Ihnen, viel Platz zwischen Ihren Spalten einzugeben, ohne eine lästige Lücke zu verursachen.
# 5: Gehe diagonal
Wenn Sie wirklich wollen, dass Ihre Seite verrückt aussieht, neigen Sie Ihren Inhalt diagonal. Dies gibt in der Regel den Eindruck eines jungen, aufregenden Designs, das Regeln bricht und Grenzen überschreitet.
Das Kippen von Inhalten kann ein bisschen zufällig aussehen, aber wenn Sie die Linien im Bildmaterial verlängern, wirken sie absichtlich und steigern den Effekt. Seien Sie nicht schüchtern, drehen Sie die Drehung wirklich und strecken Sie diese Linien so weit, dass Sie eine Aussage treffen.
Der Diagonaleffekt eignet sich besonders für retro-inspirierte Designs wie die oben genannten.
# 6: Go Nuts
Hier sollte ich Ihnen sagen, dass Sie es ruhig angehen sollen. Eine oder zwei einfache Linien können Ihrem Design viel hinzufügen, und wenn Sie den Effekt zu weit gehen, kann dies Ihren ästhetischen Reiz aufheben. In den richtigen Händen kann eine Kombination der obigen Tipps jedoch zu einem wirklich scharfen Endprodukt führen.
Das unten gezeigte Design von David Fooks verwendet eine Tonne Linienarbeit. Er kombiniert gepunktete Linien, durchgezogene Linien, gerade Linien, gekrümmte Linien, Umrandungen und gerade Linien mit einem Diamanten am Ende, alles in diesem kleinen Bereich. Der Gesamteffekt ist nicht unübersichtlich oder hässlich, sondern ist eher klassisch und schön!
Mein Rat ist, einfach vorsichtig zu sein. Wie jedes Gestaltungselement können Linien zum Guten oder Bösen verwendet werden. Verwenden Sie bei Bedarf Zurückhaltung, und achten Sie immer auf Ihr Design mit und ohne die hinzugefügten Linien, um sicherzustellen, dass Sie dem Design tatsächlich einen Mehrwert verleihen.
Inspiration
Sehen Sie sich diese großartigen Einsatzmöglichkeiten von Liniengrafiken im Webdesign an, um einige Ideen zu erhalten, wie Sie diese in Ihr nächstes Design integrieren können.
CarbonAds
Für die Aufzeichnung
Evan Eckard
Cool und der Guide
Der Ananas-Dieb
DesignSwap
Wohnwagen
Fazit
Ziel dieser Diskussion war es, Sie zu ermutigen, einen zweiten Blick auf unseren alten Freund der Linie zu werfen und sorgfältig zu überlegen, wo Sie Linien verwenden können, um Ihre Entwürfe entweder ästhetisch, strukturell oder beides zu verstärken.
Wenn Sie ein Design haben, das einfache Linien stark verwendet, hinterlassen Sie einen Kommentar mit einem Link, damit wir ihn überprüfen können! Teilen Sie uns auch mit, was Sie von den obigen Beispielen halten.