Cylvan Online Shop

Ein E-Commerce-Erlebnis bei dem Design, die Nähe zur Natur und eine nachhaltige Produktion im Vordergrund steht.

Cylvan ist ein nachhaltiges Modelabel für Männer, welches Design mit hochwertigen Materialien kombiniert und in einem fairen Produktionsprozess verarbeitet.

Ich habe bei diesem Projekt die E-Commerce-Strategie, das UX/UI-Design und die Content-Richtung für den Online Shop erstellt.

Projekt Details

Arbeit: E-Commerce Fashion Store Strategie und Konzept, UI/UX Design, Umsetzung
Werkzeug: Sketch, Shopify
Jahr: 2018
Vorschau: cylvan.de
Cylvan Online Shop Homepage Screenshot on an iMac Pro

Hintergrund

Cylvan vereint Design, Mode und digitales Know-how

Dieses Projekt ist für mich nicht einfach nur ein Auftrag. Es verkörpert meine Denkweise, meinen Gründungsgeist und den Willen, als Designer auch Dinge zu erschaffen, die sich positiv auf die Welt auswirken.

Deshalb habe ich Cylvan 2018 zusammen mit einem meiner besten Freunde gegründet.

In diesem Projekt steckt nicht nur mein Wissen und meine Erfahrung der vergangenen Jahre. Es ist auch ein Herzensprojekt, welches mich antreibt und mir die Möglichkeit gibt, Werte, die ich persönlich vertrete, mit meinem Beruf zu verbinden.

Cylvan Website Produktseite angeschnitten in einem iPad

Wann hast du das letzte mal in einem Online-Shop etwas gekauft?

Hast du dabei bewusst auf das Design geachtet? Vermutlich nicht. Denn gutes Design verlangt keine Aufmerksamkeit von dir. Es ist Design, an das man nicht denken muss. Design, das einfach funktioniert.

Jetzt denke anders herum mal an das letzte Mal, bei dem du einen E-Commerce Shop frustriert verlassen hast oder nur schwer den Warenkorb erreichen konntest. Dabei drängte sich das Layout vermutlich schon negativ in den Vordergrund, weil schlechtes Design einfach offensichtlich ist. Es stiftet Verwirrung und kostet den Händler im schlimmsten Fall einen frustrierten Kunden und ein nicht verkauftes Produkt.

Das Design eines Online Shops muss die Produkte scheinen lassen und dem Seitenbesucher helfen, seinen Einkauf so reibungslos und einfach wie möglich zu gestalten.

Cylvan Online Shop Screenshot on an iPhone

Bei einem Online Shop geht es um mehr als nur das Aussehen der Website. Sie muss funktionieren, den Kunden übersichtlich von einem Ort zum nächsten bringen und dabei die Geschichte der Marke erzählen.

Dafür musste ich eine Stimmung hervorheben, die eine Verbindung zwischen dem Käufer und Cylvan aufbaut. Jeder Bereich musste die Werte von Cylvan und auch die Idee dahinter klar und verständlich kommunizieren.

Zudem musste deutlich werden, dass wir hier etwas Besonderes und Neues aufbauen wollen. Es ist nicht einfach nur ein weiterer Online Shop. Es ist eine Marke, für die Design, die Natur und der nachhaltige Produktionsprozess eine zentrale Rolle spielt.

Cylvan Website Über uns Seite

Storytelling

Ein „digital first” Ansatz für das Branding

Der primäre Verbindungspunkt zwischen der Marke Cylvan und ihren Kunden ist das Erlebnis, welches die Seitenbesucher auf der Website haben. Somit wurde die Seite zum Ausgangspunkt um eine starke Identität aufzubauen.

Der eCommerce Shop sollte Persönlichkeit, Transparenz und unsere Meinungen authentisch übertragen. Das Ziel ist es eine Plattform zu schaffen, auf der es neben dem Verkauf von Kleidung auch um die Aufklärung von einer nachhaltigen Modeproduktion geht. Dafür integrierte ich einen „Journal” Bereich, der in Zukunft wöchentlich um weitere Themen erweitert werden kann. Zudem ist er gleichzeitig ein Ansatz, um längerfristig neue Kunden über Suchmaschinen zu generieren (SEO).

Cylvan Mode Label Website Homepage
Screenshot Cylvan Mode Label Website Über uns Seite

Sich auf das Kundenerlebnis von eCommerce konzentrieren

Jedes Cylvan Kleidungsstück hat seine eigene Geschichte und jede Geschichte wird mit detaillierten Informationen und Kontext lebendig.

Cylvan ist ein junges Unternehmen, das neue Wege gehen will. Es wird nicht in Massen produziert, sondern in limitierten Auflagen, die exklusiv und persönlich sind.

Genau das erlaubte mir, die Produkt- und Detailseiten individuell erscheinen zu lassen und nicht jede Seite gleich aufzubauen. Ein Privileg, das sich heutzutage fast kein Online Shop mehr leisten kann.

Durch dieses Konzept entstanden verschiedene Design-Ideen, wie die Mode zukünftig im Online Shop präsentiert werden sollte.

Cylvan Website Layout Richtungen

Ein reibungsloser Kaufprozess

Ein Produkt zu kaufen sollte einfach und nicht zeitaufwendig sein. Deshalb habe ich mich bei der Anbindung an ein Content Management Systems (CMS) von Anfang an auf Shopify konzentriert. Es ermöglicht nicht nur die einfache Einbindung von neuen Produkten, sondern auch einen extrem reibungslosen Kaufprozess, den ich persönlich auch schon als UX-Designer bei vielen anderen Shops geschätzt habe.

Schon im Voraus zu wissen, auf welches System das Layout am Ende übertragen wird, hat mir persönlich geholfen, schneller Entscheidungen zu treffen und nicht alle Elemente von Grund auf neu durchdenken zu müssen. Einige wichtige Grundfunktionen waren schon optimal durchdacht und mussten in erster Linie an das Erscheinungsbild von Cylvan angepasst werden.

Maßgeschneidert für den mobilen Einsatz

Die gesamte Website ist responsive gestaltet und passt sich der Benutzeroberfläche von Mobile-, Tablet- und Desktop-Geräten an. Mein Ziel war es, ein optimales Browsererlebnis zu bieten und gleichzeitig die wichtigsten Funktionen und Inhalte der Website unabhängig vom Formfaktor zu erhalten.

Die Navigation wurde speziell für Mobile überarbeitet, das Produkt-Filtersystem vereinfacht und Karussellklicks durch Streichbewegungen ersetzt. Mit diesem mobilen Ansatz konnte ich das Einkaufserlebnis zusätzlich optimieren.

Cylvan Website Layout in einem iPhone Mockup
Cylvan Website Navigation Layout in einem iPhone Mockup
Hemd Produkt-Slideshow
Cylvan Website Layout in einem iPhone Mockup
Cylvan Website Navigation Layout in einem iPhone Mockup

Während ich das Konzept und allgemein die Strategie der Marke gestaltet habe, hat sich gleichzeitig auch das Erscheinungsbild geformt, welches Cylvan über die eigene Website hinaus auch auf anderen Kanälen repräsentieren sollte. Dabei stand in jedem Design-Ansatz von Anfang an die näher zur Umwelt und der nachhaltige Gedanke mit der Natur zu arbeiten und nicht gegen sie, im Mittelpunkt.

Cylvan Mode Verpackungs-Design

Learnings

Da der Online Shop zu einem meiner persönlichen Nebenprojekte gehört, kann ich alles, was ich bis jetzt und auch in Zukunft damit lernen werde, in neue Kundenaufträge mit einfließen lassen. Dabei geht es nicht nur um Design. Es geht um Marketing-Strategien, den Online-Verkauf von Produkten, Social Media Anzeigen, Organisation von Vertrieb und Einkauf, die Optimierung von Produktionsprozessen, Geschäftsführung etc. 
Alles Erfahrungen, von denen ich glaube, dass sie mich in Zukunft extrem von anderen Designern abheben werden und wertvoll für jeden Kundenauftrag sind.

Vorschau: www.cylvan.de

Interessiert an einer Zusammenarbeit?

Projektanfrage senden