KipperDesign

Back to top

Der Auftrag

Der Kunde

Die Akaru GmbH ist eine B2B Firma mit schweizer Firmensitz. Sie ist auf Design, Entwicklung und Erzeugung von massgefertigten Einrichtungsgegenständen spezialisiert. Der Fokus liegt dabei auf Beleuchtung bzw. Beleuchtungslösungen.

Das Briefing

Die Webseite war als 2-Phasen Projekt geplant. In der ersten Phase ging es darum eine Webseite zu gestalten, welche 5 Produkte detailliert präsentiert. Ziel war es, mit Unterstützung der Webseite bei Vertriebsfirmen anklopfen zu können und detailierte und qualitativ hochwertig präsentierte Produkte vorweisen zu können. Sobald der Bekanntheitsgrad gestiegen ist und man einige Referenz-Kunden vorzuweisen hatte, wurde die Webseite in Phase 2 so umgestaltet, dass der Fokus auf vereinzelte Produkte entfernt und die Seite "allgemeiner" gestaltet wurde. Dies mit dem Hintergedanken dass man mit einer allgemeineren Seite, ohne Fokus auf bestimmte Produkte, ein breiteres Publikum erreicht.

Das Farbspektrum

Schwarz, Weiss, Orange (CI Farbe), Dunkelgrau
Keine Komplementärfarben

Die Schrift

Als Schrift wurde die von Akaru fürs CI verwendete Schrift Open Sans verwendet.

Übersicht Schrift Open Sans

Schriftart Open Sans von
Steve Matteson




Der Arbeits­prozess

Fotoshoot & Bildbearbeitung

An allererster Stelle, noch bevor mit den Texten oder Layout begonnen wurde, brauchten wir Bildmaterial. Und zwar professionelles. Während eines mehrstündigen Fotoshoots wurden die gewünschten Produkte also entsprechend professionell geschossen. Nachdem die Fotos anschliessend mit Photoshop fertig retuschiert wurden (gerade stellen, Farbanpassung, Fehlerretusche, Stromkabel entfernen, etc.) hatten wir das gewünschte Bildmaterial somit präsentations-bereit. Nachstehend ein paar der fertig bearbeitete Bilder.


Fotoshoot Lucus 1

Fotoshoot Lucus 2

Fotoshoot Marmor 1

Fotoshoot Marmor 2

Fotoshoot Nebula 1

Fotoshoot Nebula 2

Fotoshoot Stiria 1

Fotoshoot Stiria 2

Fotoshoot Wolkje 1

Fotoshoot Wolkje 2

Die Logos

Damit die Produkte "vollendeter" daher kamen, sollte zu jeder Produkte-Serie ein Logo bzw. Schriftzug entworfen werden. Die entworfenen Logos für "Lucus", "Marmor", "Nebula", "Stiria" und "Wolkje" sind allesamt auf das Produkt passent gestaltet worden. Lucus, das verbrannte Holz, sieht wie eine etwas verbrannte Schrift aus. Marmor sollte mit dem Marmor und den Gold-Kanten luxuriös erscheinen. Nebula entspricht mit seiner schwunghaften Ausführung dem galaktischen Gefühl der Lampe. Stiria ist, wie die Glasruten der Lampe, ebenfalls verwinkelt und triangularisch. Und Wolkje erscheint ähnlich frei schwebend wie die Lampe selbst auch.


Lucus mit Logo

Marmor mit Logo

Nebula mit Logo

Stiria mit Logo

Wolkje mit Logo

Attraktive Texte

Nachdem das Bildmaterial sehr gut gelungen ist und auch das Layout mittlerweile optimal gesetzt war, wurden als nächstes noch die passenden Texte benötigt. Da Akaru in ganz Europa tätig sein wird, und das Klientel sprachlich somit weit gefächert ist, wurde entschlossen die Texte auf englisch zu verfassen. Dank einer äusserst begabten Texterin hatten wir schlussendlich für all unsere Produkte die perfekt umschriebenen Texte. Da sich der Firmensitz Akarus in der Schweiz befindet, wurden die Texte anschliessend noch ins Deutsche übersetzt. Dies ist selbstverständlich auch für unsere Nachbarländer Deutschland und Österreich vorteilhaft.

Original-Layout: Landing Page & Produkte-Seiten

Landing Page

Das Layout wurde schlicht und übersichtlich gehalten. Gleich zu Anfang wird eins der Produkte in den Fokus gerückt und mit einer Call to Action auf die entsprechende Produkte-Seite verlinkt. Im unteren Bereich der Seite findet der Besucher zudem alle Infos über die Akaru GmbH, ein kleines Karussel um Produkte direkt auszuwählen zu können und abschliessend mehrere Möglichkeiten um Kontakt aufzunehmen.

Um beim Besucher ein visuell entspanntes Gefühl entstehen zu lassen, wurde das Design mit viel Leer-Raum gestaltet. Damit der Betrachter dennoch ein Gefühl der Unterteilung erhält, wurden die einzelnen Rubriken jeweils mit einem anders farbigen Balken unterteilt und die Titel mit einer dünnen Linie unterstrichen. Bilder und Icons wurden zudem gezielt so eingesetzt, dass die Texte etwas unterbrochen werden und somit ein etwas "luftigeres" Gefühl beim Lesen der Infos entsteht.

Produkte-Seiten

Zusätzlich zu der Landing Page wurde der Fokus zudem auf die Präsentation von 5 Produkten gelegt. Jede Produkte-Serie erhielt eine eigene Seite und wurde mit den grossformatigen, weiter oben bereits gezeigten, Hintergrundbildern versehen. Vom Design her wurden die Seiten, wie die Landing Page ebenfalls, schlicht und übersichtlich gestaltet. Die Bilder kamen mit diesem Design-Entscheid somit optimal tragend zur Geltung.

Im unteren Bereich der Seiten befinden sich, ergänzend zur visuellen Präsentation, jeweils noch Anpassungsmöglichkeiten für die Produkte. Da eine Thumbnail-Vorschau einiges ansprechender als eine Drop-Down Liste wirkt, wird das Karussel auch hier erneut eingesetzt.

Technische Daten & Vorschau

Live Version
Akaru Design Layout Version 1: Landing Page
Akaru Design Layout Version 1: Produktseite



Redesign 2018: Landing Page & Produkte-Seiten

Komplett ausgelasteter Freelancer... Coming Soon. Versprochen! Live Version