Fortsetzung über unser Projekt für die Grohe AG:
Auf der alten Grohe.de-Startseite ließen sich nie mehrere Grohe-Produkte auf einmal (d. h. gleichzeitig) präsentieren.
Eine behäbige Flash-Animation stellte immer nur ein Produkt nach dem anderen vor. Und diese sequentielle Präsentation musste umständlich über “Player”-Funktionen gesteuert werden.
Dazu kam, dass die Aufbereitung der Infos nachteilig war: Vorgestellt wurden eher Design und Image und weniger die Produktvorteile, die Interessierte zu Käufern machen. Muss gestehen, dass ich über das erste Produkt nie hinausgekommen bin.
Dieser Show-Stopper musste also weg und die neue Startseite einen völlig anderen Weg einschlagen: Im oberen Bereich sollte sie mehr als ein, besser vier Produkte auf einmal präsentieren. Zugleich musste Raum für mehr Produktinformation und -nutzen her, ohne die Seite zu überfrachten.
Wir haben die Anforderung mit einem Akkordeon-Widget gelöst:
Akkordeon-Widget* (auch Zieharmonika-Widget*) heißt eine grafische Darstellung, bei der sich etwas auseinanderzieht bzw. auseinanderziehen lässt – wie bei einem Akkordeon (a.k.a. Quetschkommode).
Für die Abbildung oben haben wir den Bereich aus der Grohe.de-Startseite herausgeschnitten, der gemeint ist: In der Produktpräsentation sind klickbare Stege (auch Panele; siehe Abbildung oben: Panele 1bis 4) nebeneinander angeordnet. (Vertikal ist so etwas selbstvertürlich auch möglich.)
Jedes Panel – bei Grohe.de sind es vier – zeigt jeweils ein Produkt inkl. Produktnamen. Dem Nutzer werden immer vier Produkte auf einen Schlag angeboten. (Erste Anforderung erfüllt.)
Bleibt der Nutzer inaktiv, d. h. führt er den Cursor nicht über den Präsentationsbereich, öffnen sich – einer nach dem anderen – die größeren Content-Bereiche der Panele (wie bei einem Akkordeon).
In einem solchen Content-Bereich ist Platz für mehr Information, d. h. Text und Bild.
Ein Panel ist also immer aufgeklappt. (Im Bild oben ist exemplarisch der Content-Bereich des 3. Panels ausgefahren.)
Der Nutzer erfährt mehr über das jeweilige Produkt, ohne dass die anderen von der Bildfläche verschwinden. (Zweite Anforderung erfüllt.)
Einige weitere Umsetzungsdetails sorgen für eine sehr intuitive Bedienbarkeit des Widgets.
Wer mehr wissen möchte, wem wir bei Umsetzung oder Konzeption solcher Widgets, Funktionen und Sensationen auf einer Website helfen können, kann sich bei uns melden. KM2 >>, die knuffige Internetagentur in Düsseldorf, hilft gern.
Zum Schluss: Ich freue mich. Einfach so. Über das zurückliegende Projekt. Das Vertrauen unseres Kunden Grohe. Darüber, dass nun alles online ist.
* Widget: heißt übersetzt so etwas wie “Vorrichtung” und meint hier ein kleines Programm, das in eine Website zur Anzeige von Informationen eingebunden wird.
Zurück zum ersten Teil des Beitrags über das Projekt für unseren Kunden Grohe.
