Ein neues Corporate Design für Webflow

Alles auf neu

Das 10-jährige Jubiläum hat Webflow nun zum Anlass genommen, das visuelle Erscheinungsbild aufzufrischen und sich mit einer neuen Wort-Bildmarke samt neuen Farben und neuen Schriften zu schmücken. Die alte schwungvolle Wortmarke, basierend auf der Schrift »Lato«, hat nun ausgedient. Sie weicht einer neuen W-Bildmarke, bestehend aus drei einfachen geometrischen Formen, die ihrerseits HTML, CSS und JavaScript symbolisieren, die drei Basissprachen des Webs für Struktur, Styling und Interaktion. Ergänzt wird die Bildmarke mit dem Webflow-Schriftzug, gesetzt in der neuen Hausschrift »Webflow Visual Sans«.

Die Bildmarke

Ich bin ein großer Freund reduzierter Signets aus einfachen grafischen Elementen. Nicht zuletzt deshalb gefällt mir die neue Bildmarke sehr. Damit kann Webflow auch ohne die dazu gestellte Wortmarke nun eigenständiger auftreten, vor allem auf Social-Media-Kanälen. Das alte w, einfach der Wortmarke entnommen, wirkte dagegen immer etwas blass und verloren. Mir gefällt auch, dass Webflow sich noch einmal klar zu den Säulen des Webs bekennt und diese stärkt. Nebenbei bemerkt ein wichtiger Grund, warum ich mich für Webflow als Werkzeug entschieden habe, weil genau das hier am konsequentesten umgesetzt wird im Vergleich zu Framer, Squarespace oder gar Wix. Nun wurde das schön in der Bildmarke manifestiert.

Zwei Dinge stören mich allerdings (ein wenig): Zwischen dem Quadrat und dem geneigten Rechteck wirkt der Viertelkreisbogen leicht zerbeult. Von unten mit kreisrundem Schwung gestartet, endet die Form nach oben hin eckig. Zugunsten zweier gleichmäßiger negativer Dreiecke im oberen Teil wurde die Rundung aufgegeben. Das ist nachvollziehbar, allerdings wirkt die Form dadurch etwas unentschlossen und inkonsequent.

Als zweites finde ich schade, dass die Bildmarke in kleinen Größen ziemlich zusammenläuft, gut zu erkennen ist das am App-Icon im Designer. Hier wäre eine spezielle Version für kleine Größen das Tüpfelchen auf dem i gewesen, ähnlich, wie man es von optischen Schriftgrößen kennt, Stichwort »Ink Traps«.

Die Wortmarke

Bei der Wortmarke, gesetzt in der hauseigenen geometrischen Sans Serif, scheint der aktuelle Trend zu greifen, dass das Erwachsenwerden einer Marke in einer ruhigen (um nicht zu sagen langweiligen) Serifenlosen münden sollte. Die wilden Anfangsjahre sind vorbei, nun muss etwas Gesetzteres her. Wir kennen das aus der Mode, aber auch aus der Technikwelt. In diesem konkreten Fall passt es für mich allerdings sehr gut. Bild- und Wortmarke ergänzen sich prima, weil der Schriftzug sich gegenüber der Bildmarke sehr zurücknimmt. Da er vermutlich auch nie ohne Bildmarke auftreten wird, kann er auch gerne schlicht und nüchtern ausfallen.

Typografie

Die neue Hausschrift kommt in zwei optischen Größen, der »WF Visual Sans« für Überschriften und der »WF Visual Sans Text« für kleinere Schriftgrößen. Die Überschriften-Variante erinnert mich stark an die ITC Avant Garde, extrem reduziert und geometrisch angelegt. Sie ist konstruiert aus einfachsten Formen, und setzt fort, was in der Bildmarke begonnen wurde. Die Überschriften setzen sich kraftvoll und klar in Szene und strotzen vor Selbstbewusstsein. Leider wirken sie im Blog-Bereich etwas zu klotzig, hier ist auch der Größenunterschied zwischen Überschriften und Text ziemlich groß.

Die Text-Schrift ähnelt sehr stark der Inter (die übrigens im Webflow Designer zum Einsatz kommt). In den kleineren Schriftgrößen wird die Geometrie zugunsten der Leserlichkeit und Unterscheidbarkeit der Buchstaben zurückgenommen: C, G und e sind offener und zusammen mit dem O wesentlich schmaler, das kleine a ist zweistöckig, das kleine t bekommt ein Füßchen. Das ist gut und richtig, aber das typographische Gesamtbild ist für meinen Geschmack dann doch etwas zu nüchtern und hölzern, gut erkennbar vor allem im Blog. Hier fehlt es mir etwas an Pep und Charakter. Vergleicht das mal mit dem Figma-Blog oder Gumroad-Blog, die das beide wesentlich interessanter hinbekommen.

Bislang gibt es seitens Webflow wenig Informationen zu den neuen Schriften. Im Copyright der Schriftdateien ist Kyle Benson, Principal Brand Designer von Webflow, vermerkt. Ihr kennt ihn vielleicht von seiner Type Foundry Very Cool Studio. Ob er die Schriften komplett neu gezeichnet oder bestehende abgewandelt hat, lässt sich nicht sagen. Mir kommen beide optische Größen jedenfalls sehr vertraut vor, daher vermute ich eher letzteres. Die Schriften wirken konsequent und solide, für ein Corporate Font fehlen mir allerdings ein paar Eigenheiten, die die Schrift unverwechselbar machen.

Die Farben

Ich war ein großer Fan des bisherigen Webflow-Blau, das dezent in Richtung Lila ging. Das war eine willkommene Abwechslung vom Einheitsbrei-Mittelblau, das  unter anderem durch Bootstrap so überstrapaziert wurde. Jetzt ist man wieder genau in diese Richtung gegangen, nur etwas frischer und gesättigter. Ich verstehe diesen Schritt nicht, war doch die Farbe bislang ein starkes Wiedererkennungsmerkmal. Das neue Blau wirkt etwas kälter, es ist einfach nur anders, aber ich sehe nicht, warum es besser sein sollte. Die Reduktion auf weniger Farben und die Abkehr von wilden Verläufen begrüße ich hingehen, weil das Gesamtbild dadurch ruhiger wird.

Gesamteindruck

Nach zehn Jahren am Markt ist Webflow erwachsen geworden und möchte dies im neuen Erscheinungsbild verdeutlichen. Mit eigenständiger Bildmarke und reduzierter Wortmarke macht es einen hochwertigen und professionellen Eindruck. Gepaart mit klarer Typografie, reduzierten Farben und starken Schwarz-Weiß-Kontrasten setzt Webflow ein knackiges, selbstbewusstes Statement an die Community, aber auch an die Konkurrenz. Vor allem gegenüber Framer, die ähnlich flippig wie Figma und Gumroad daherkommen, setzt sich Webflow ab und wirkt wesentlich reifer.

Trotzdem fehlt mir ein wenig die Wärme und das Menschliche in diesem Design. Das Blau und die harten Schwarz-Weiß-Kontraste wirken zusammen mit der geometrischen Schrift bisweilen technisch unterkühlt. Hier wären ein paar auflockernde Elemente wünschenswert, die für Abwechslung sorgen, ein wenig den Ernst rausnehmen und für einen freundlicheren Charakter sorgen.

Zusammen mit den vielen neuen vorgestellten Funktionen ist es dennoch ein Schritt in die richtige Richtung und lässt in eine solide Zukunft blicken.

‍