Verschwommene Bilder im Webdesign: So funktionieren sie
Es ist eine unbestreitbare Tatsache: Die Verwendung unscharfer Bilder ist 2015 eine Trendtechnik im Webdesign. Es scheint, als ob überall, wo man hinschaut, ein Element der Unschärfe vorhanden ist.
Dies ist jedoch keine Lösung für einige Ihrer Fotoprobleme. Es ist eine eigenständige Technik, die Übung erfordert, um sie zu perfektionieren, und Liebe zum Detail, um sie richtig zu machen. Überlegen Sie sich also, bevor Sie sich auf den Trend konzentrieren, welche Optionen für die Verwendung unscharfer Bilder gelten, um zu entscheiden, ob diese für Sie geeignet sind und wie Sie diese Technik in Ihren Projekten optimal nutzen können.
Verschwommene Fotos liegen im Trend
Wir könnten ganze Seiten der Anzahl der Websites widmen, indem wir unscharfe Bilder verwenden. Der Trend ist momentan eine große Sache.
Dies ist das erste, was Sie berücksichtigen müssen, wenn Sie mit einer Idee fortfahren, die unscharfe Bilder enthält.
- Möchten Sie Teil des Trends sein?
- Können Sie den Trend auf eine Weise verwenden, die sich ein wenig von anderen Websites unterscheidet?
- Ist es dein Stil oder etwas zu überstrapaziert für deinen Geschmack?
- Werden Sie mit dem Site-Design einverstanden sein, nachdem der Trend seinen Lauf genommen hat? Oder brauchen Sie eine Neugestaltung?
Es ist absolut nichts Falsches daran, etwas zu kreieren, das im Trend liegt. Aber es ist eine Entscheidung, die Sie von Anfang an berücksichtigen sollten. Das Erstellen einer Website mit unscharfen Bildern kann - abhängig von Ihrem bevorzugten Stil und Ihrer Verwendung - zeitaufwändig sein. Wenn Sie keine Erfahrung mit Fotobearbeitungssoftware haben, sind möglicherweise zusätzliche Schulungen erforderlich.
Unschärfe ist eine Technik für gute Bilder
Dies ist möglicherweise der wichtigste Satz, den Sie lesen, wenn Sie über unscharfe Bilder nachdenken. Es funktioniert nur, wenn Sie zunächst gute Bilder haben. Unschärfe ist keine Möglichkeit, ein schlechtes Bild zu „reparieren“.
Anders gesagt. Wenn Sie ein verschwommenes Foto erhalten und aufgefordert werden, daraus eine Website zu erstellen, liegt dies nicht im Trend. Das ist ein schlechtes Foto. Wenn das Ihre Situation ist, ist dies nicht die Technik für Sie. (Vielleicht möchten Sie darüber nachdenken, ein Kunstelement mit Typografie zu erstellen oder nach Archivbildern zu suchen.)
Wenn Sie jedoch ein schönes Bild haben, aus dem Sie ein paar Kilometer mehr herausholen oder auf eine neue Weise verwenden möchten, ist die unscharfe Technik eine Möglichkeit. Es gibt mehrere Möglichkeiten, über Unschärfe nachzudenken (wir werden uns unten auf jede konzentrieren), aber der erste Schritt besteht darin, zu verstehen, wie die Unschärfe tatsächlich erzeugt wird. Adobe hat ein hübsches Tutorial, mit dem Sie in Photoshop beginnen können.
Verwischen Sie das gesamte Bild
Eines der Dinge, die zum unscharfen Bildtrend beigetragen haben, ist ein anderer Trend: die Verwendung von Helden-Headern. Designer setzen die Techniken zusammen, um unscharfe Bilder im Vollbildstil als dominierende visuelle Elemente auf den Zielseiten von Websites zu erstellen.
Die Website für Trellis Farm verwendet ein ikonisches Bild einer Farm, um Ihnen einen Eindruck von der Website zu vermitteln. Für zusätzliches Interesse ist das Foto schwarzweiß - um dieses altmodische Gefühl zu vermitteln - und mit einer großartigen Schrift überlagert, um Ihre Aufmerksamkeit zu erregen. Die Schriftrolle setzt dieses Gefühl fort, während der Mischung Farbe hinzugefügt wird. Die Unschärfe ist schön, weil Sie wissen, was auf dem Bild zu sehen ist, und sie hilft dem Benutzer, sich auf den Text und die nächsten Aktionen auf dem Bildschirm zu konzentrieren.
Warum es funktioniert:
- Ein unscharfer Hintergrund kann den Fokus auf Ebenen über dem Bild richten, z. B. Text. Stellen Sie einfach sicher, dass Sie eine wirkungsvolle Schriftart auswählen.
- Es kann neues Interesse an einem Bild wecken, das Sie regelmäßig verwenden, z. B. ein Standard-Markenfoto.
- Es kann mit fast jeder Art von Inhalten in fast jedem Farbschema für eine universelle Anziehungskraft verwendet werden.
Hintergründe und geschichtete Bilder
Unschärfe ist keine Vollbildtechnik. Bestimmte Teile eines Bildes können für den Aufprall unscharf werden. Während es üblicher ist, unscharfe Hintergründe mit einem scharfen Vordergrundfokus zu sehen, verfolgen einige Designer den umgekehrten Ansatz für eine neue Option mit einem unscharfen Vordergrund mit einem fokussierten Hintergrund.
Die Agentur Anchour verwendet auf ihrer Zielseite Unschärfe in Fotos. Die im Bild verwendete Technik kann Teil der eigentlichen Fotografie sein oder Sie können den gleichen Effekt in einer Fotobearbeitungssoftware erzielen. Der Trick beim Erstellen dieses Unschärfestils besteht darin, dass Sie nicht erkennen können, dass er „erstellt“ wurde, und dass er natürlich aussehen sollte, als ob das Foto auf diese Weise aufgenommen worden wäre. (In der Fotobearbeitungssoftware können Sie dies mit dem Gaußschen Unschärfe-Werkzeug mit kleinen, inkrementellen Anpassungen erreichen.)
Warum es funktioniert:
- Unschärfe erzeugt visuellen Kontrast und kann das geschäftige Gefühl eines Bildes abschwächen.
- Es ändert die Perspektive des Bildes und die Sicht des Benutzers auf das Bild.
- Es fügt einem Bild eine Dimension hinzu, die sich für ein fast 3D-Rendering ansonsten flach anfühlt.
Dramatische Unschärfe für abstrakte Kunst
Wenn Sie ein Hintergrundbild für Ihre Website benötigen, aber ein Muster oder eine Farbe finden, die den Trick macht, kann ein Foto mit einer dramatischen Unschärfe die perfekte Lösung sein. Betrachten Sie eine dramatische Unschärfe als etwas, das den Fotoinhalt auf einen Blick nicht erkennbar macht und das Foto möglicherweise völlig unkenntlich macht.
Dies ist eine beliebte Option für Websites, die ein digitales Projekt mit einem abstrakten unscharfen Fotohintergrund hinter einem Telefon starten oder bewerben, das das Produkt zeigt. Piction verwendet dasselbe Bild im Hintergrund und im Telefon mit unterschiedlichen Zoom- und Unschärfestufen für ein auffälliges Design.
Warum es funktioniert:
- Konzentriert sich auf das vorgestellte Produkt.
- Erstellt einen benutzerdefinierten Hintergrund, anstatt ein Muster zu verwenden, das sich möglicherweise auf anderen Websites befindet.
- Gibt dem Designer die Kontrolle über Farbe und Gefühl, wenn es darum geht, wie die abstrakte Unschärfe von Schärfe über weiche Farben und Formen bis hin zur Lesbarkeit des Hintergrundbilds und zur Verbindung mit der Marke funktioniert.
Subtile Unschärfe für jedes Bild
Ein geringer Grad an Unschärfe kann auch bei vielen anderen Arten von Fotos verwendet werden und muss nicht nur für ein Vollbild verwendet werden. Designer können einem Bild, das einen kleinen Fokus im Vordergrund benötigt, einen Hauch von Unschärfe hinzufügen, damit Benutzer die richtigen Teile eines Bildes betrachten, ein Logo stilisieren oder einfach ein komplexeres Bild erstellen können.
Das Zeo-Logo verwendet eine subtile, aber schöne Unschärfe im runden Design. Die Unschärfe zwingt Sie dazu, das Logo aufgrund der interessanten Form und Kante einer Seite des Logos im Vergleich zur Schärfe der anderen Seite genauer zu betrachten. Die Technik wird weiter betont, da das gesamte Website-Design an anderen Stellen Unschärfe verwendet, z. B. im Hintergrund des dominanten Bildes auf der Zielseite.
Warum es funktioniert:
- Kleine Unschärfen können überraschen.
- Es fokussiert auf bestimmte Teile eines Fotos mit visuellem Fokus. (Schauen Sie sich einige der Promos auf der Zeo-Website an, um andere Möglichkeiten der subtilen Unschärfe für den Fotofokus zu finden.)
- Es kann Ihnen den richtigen Kontrast geben, um andere Elemente in einem Bildabschnitt, z. B. Text, zu überlagern, genauso wie eine Vollbildunschärfe mit einem Heldenkopf funktionieren kann.
Verwenden Sie es auch für Videos
Sie können den Unschärfetrend auch mit einem anderen heißen Designelement kombinieren - Video. Sie können es wie bei jeder anderen Bildtechnik verwenden. Es funktioniert auf die gleiche Weise (obwohl die Bearbeitungswerkzeuge und -prozesse etwas unterschiedlich sind).
Level 2 Design verwendet Blau und einen Bildschirmeffekt, um einem Vollbildvideo Interesse hinzuzufügen. (Aktualisieren Sie den Browser auf unscharfe Videos.) Der Effekt macht Spaß und ist frisch und funktioniert mit Videos, die ein Gefühl der alten Schule haben sollen. Die schnellen Video-Loops sind gut lesbar und aufmerksamkeitsstark.
Fazit
Es gibt viele Möglichkeiten, Unschärfe effektiv für Webdesign-Projekte einzusetzen. Das Geheimnis - wenn es wirklich eines gibt - besteht darin, einen unscharfen Effekt zu erzeugen, der sich nahtlos in den Rest des Designs einfügt. Und Sie können das fast tun, indem Sie über extreme Unschärfe nachdenken.
Verwenden Sie viel Unschärfe für eine hohe Wirkung und ein abstraktes Gefühl. Verwenden Sie eine minimale Unschärfe, um einen subtilen Kontrast zu erzeugen und den Fokus festzulegen. Testen Sie es wie bei jedem Design vor dem Start an einigen Benutzern und sehen Sie, was sie denken. Bemerken sie die Unschärfe? (Die meisten Nicht-Designer werden nicht wirklich darüber nachdenken.)