Sharework | Finanzshop

Die Firma Sharework GmbH in Hamburg bietet seit Jahren hochspezialierte und marktführende Chartanalyse- und Börsen-Software an.
Wir entwickelten das Web Design für eine eCommerce-Lösung, die als "Shop im Shop" in die Angebote verschiedener Finanzportale flexibel eingebunden werden kann.

 Auf der Suche nach dem optimalen Shop
 Erstmal abspecken und dann fitmachen...

....................................
Projekt
0469 Sharework
Finanzshop
....................................
Auftraggeber
Sharework GmbH
Dirk Nölting
....................................
Usability
Web Design
kilde communications
Joerg Kilian
Jan Schliemann
....................................
Programmierung
Sharework
Frank-David Georges
...................................
Projektstart
22. Mai 2000
....................................
Onlinestart
28. November 2000

Mikronavigation in dynamischem Umfeld

Dieses Projekt wurde in enger Zusammenarbeit mit der Firma Sharework entwickelt und realisiert. Anfangs gab es unterschiedliche Auffassungen über Positionierung und Vorgehensweise. Es wurde jedoch schnell deutlich, dass ein Shop mit überdurchschnittlichem Marktpotential nur zusammen mit Partnern realisierbar sein würde.

Auf der einen Seite wurden Partner gefunden auf deren Finanzportalen der Shop als Cobranding-Lösung oder Commerce-Syndication eingebunden würde, auf der anderen Seite ein starker Logistikpartner für Abwicklung und Distribution. Parallel zur Entwicklung des Business-Modells machten wir uns an die Gestaltung des Shops.

Zu allererst machten wir uns grundsätzliche Gedanken darüber wie unserer Meinung nach ein optimaler Shop aussehen sollte. Es entstanden bald die ersten Designstudien mit denen das Projekt auch visuell präsentiert werden konnte. Wie so oft in der Praxis, mussten dann jedoch bei der Umsetzung viele Zugeständnisse an die technischen Gegebenheiten der Shop-Software gemacht werden.

...........................................
Web Design für eCommerce-Lösung
...........................................
Konzept, Vorprojekt
und Design-Dummy
...........................................
Anpassung an die Shop-Software
...........................................
Optimierung für einen dynamischen Einsatz in unterschiedlichen Layouts
...........................................
Standardisierung der Seitenelemente mit Templates und CSS
...........................................
Neugestaltung und Vereinfachung des Bestellungsprozesses
...........................................
Lieferung eines Design-Prototyp mit statischen HTML-Templates
...........................................

....................................
Web Design








....................................
Als wir anfingen über den Shop nachzudenken, war die große Krise noch nicht über die Dotcoms hereingebrochen. Es zeichnete sich jedoch bereits ab, dass viele eCommerce-Angebote Nutzergewohnheiten falsch einschätzten und an mangelnder Usability litten.

Auf der Suche nach dem optimalen Shop

Wieviel Emotion braucht ein Shop und wieviel Rationalität? Diese Frage begleitete unsere ersten Schritte. Wieviel Einkaufserlebnis darf dem Nutzer bei eingeschränkter Bandbreite gewährt werden, wie glatt und sicher muss ein Bestellsystem funktionieren, damit der Nutzer nicht mitten im Prozess abbricht?

Wir entschieden uns für eine Lösung, die versucht das Beste aus beiden Welten zu erhalten. Einerseits eine gute, lebendige Präsentation des Angebots, andererseits eine gute Orientierung mit einer flüssigen, erweiterbaren und leicht erlernbarenen Navigation.

Es gibt inzwischen eine ganze Reihe von Navigationssymbolen, die sich bei den Benutzern stereotypisch eingeprägt haben.Bei der Entwicklung unserer Icons haben wir uns sehr eng an diese visuelle Norm gehalten.

Gleichzeitig musste ein Layout gefunden werden, welches dynamisch-flexibel in unterschiedlichsten Umgebungen - mit Frames oder auf glatten Seiten – eingesetzt werden konnte. Nach mehreren Optimierungsrunden gelangten wir zu einem Design-Dummy das für die ersten Gespräche mit potentiellen Partnern eingesetzt wurde.

Frühe Designstudie:
Ein Balanceakt zwischen Optik und Bandbreite

Das Design-Dummy:
Ein buntes und deutlich kompakteres Layout

....................................
Web Design





























....................................
Den aktuellen Shop finden Sie hier:
The Bulls
Finanzen
Kursbutler
OS Investor
Sharework

Erstmal abspecken und dann fitmachen...

Nachdem wir so einen optimalen Shop projeziert hatten, kam die Ernüchterung, als uns die Shop-Engine des Partners vorgestellt wurde: eine Standardlösung mit linearen Abläufen und relativ wenig Gestaltungsfreiraum. Am schlimmsten aber war die Tatsache, dass die geplante Sitehierarchie in Frage gestellt wurde, da der Shop weniger Drilldowns (Navigationsebenen) zuließ.

Das bedeutete vor allem erst einmal von opulenten Schaufensterseiten Abstand zu nehmen. Gleichzeitig zwang uns die – durch die Shop-Engine und das Content-Umfeld des Portals – noch weiter reduzierte Performance der Seiten dazu noch minimalistischer zu werden. Alle Produktabbildungen auf der Startseite und in den Segmentseiten wurden soweit reduziert, so dass die einzelne Seite komplett in jedem Fall weniger als 50 KB haben würde.

Die Mikronavigation wurde in mehreren Tests und Abstimmungen erweitert und optimiert. Besondere Aufmerksamkeit widmeten wir den Abläufen und Formulierungen im Kern des Bestellvorgangs: dem Warenkorb. Viele eher diffuse Schritte wurden sinnvoll neu gruppiert und zusammengefasst und mit einheitlicher Optik und konsistentem Wording versehen.

Wir übergaben den fertigen Design-Prototyp an Sharework, die die "Verheiratung" der Shop-Software mit unseren HTML-Templates vornahmen. Wir begleiteten diesen Prozess mit Online-Reviews und Beratung für Gestaltung und Formulierungen. Nach anfänglichen Performance-Problemen wurde der Shop dann erfolgreich in die Angebote der Partnersites integriert.

Erste Anpassungsschritte an die sehr lineare Software des Shops

Eine Sitemap hilft bei der Produktionsplanung...

Der fertige Design-Prototyp mit zahlreichen HTML-Templates

 Projektarchiv
zur Übersichtsseite