eshop-de­sign, das Spaß macht und ver­kauft

Ob gro­ßer oder klei­ner Shop- die tech­ni­schen An­for­de­run­gen, von Mo­bi­le-Op­ti­mie­rung bis zur rei­bungs­lo­sen User Ex­pe­ri­ence, sind die­sel­ben. Um­so wich­ti­ger wer­den da­her krea­ti­ve Kons­ep­te für die Pro­dukt­in­sze­nie­rung und SEO- re­le­van­tes Sto­ry­tel­ling

PAGE - - Contents -

Wir stel­len die Trends bei der Pro­dukt­in­sze­nie­rung vor und zei­gen, wie smar­tes, Seo-ge­rech­tes Sto­ry­tel­ling für So­ci­al-me­dia-buzz und Traf­fic sorgt. Plus: Be­währ­te Sho­psys­te­me und das neue Web­flow Ecom­mer­ce

● Ei­nen Top-job hat die New Yor­ker Agen­tur Attck bei der Um­set­zung des Web­shops Fils Uni­que von Ni­co­las van Heu­le ab­ge­lie­fert. Die­ser hat­te als Wirt­schafts­an­walt 18 J ah­re l ang bie­de­re M an­schet­ten­knöp­fe tra­gen müs­sen, be­vor er sich ent­schloss, sel­ber wel­che zu ent­wer­fen: Ver­stö­rend echt wir­ken­de In­sek­ten, ein knall­ro­ter Kra­ke, ei­ne halb ge­schäl­te Ba­na­ne, al­le fi­li­gran be­malt und aus Ster­ling­sil­ber ge­fer­tigt, be­völ­kern nun sei­nen die­sen Som­mer ge­launch­ten Shop. Fo­tos und ein Video vom auf­wen­di­gen Her­stel­lungs­pro­zess der Schmuck­stü­cke zie­hen den po­ten­zi­el­len Käu­fer in d as Er­leb­nis der Sei te. Das Web­de­sign ist mi­ni­ma­lis­tisch und zu­rück­hal­tend, Pro­dukt­be­zeich­nung und Preis gibt der Shop zum Bei­spiel erst durch ei­nen Ho­ver-ef­fekt frei.

Bei der Kon­zep­ti­on von Fils Uni­que hat Attck ge­nau hin­ge­schaut, das Bu­si­ness­mo­dell des Auf­trag­ge­bers ver­stan­den und auf Ba­sis von Sho­pi­fy ei­nen On­li­ne­shop ge­baut, der die s kur­ri­len Pre­zio­sen so ins Ram­pen­licht stellt, dass sie sich su­per auf Pin­te­rest und Ins­ta­gram pos­ten las­sen. »Die er­staun­li­che Ge­schich­te der Met­a­mor­pho­se vom An­walt zum De­si­gner so­wie die gut do­ku­men­tier­te Her­stel­lung ha­ben auf De­si­gn­blogs und in der Presse für Awa­ren­ess ge­sorgt und wer­den un­er­müd­lich ge­teilt«, sagt Attck- Grün­der Den­nis Plu­ci­nik.

Viel Mü­he hat Attck auf die Pro­dukt­fo­to­gra­fie ver­wen­det und die Man­schet­ten­köp­fe sty­lish auf ei­ner Glas­un­ter­la­ge in­sze­niert. Ein klu­ger Schach­zug, denn wäh­rend man sich durch ei­ne in­di­vi­du­el­le Bild­spra­che als klei­ner A nbie­ter g ut di ffe­ren­zie­ren k ann, ori­en­tiert man sich bei der Qua­li­tät der Pro­dukt­fo­tos und der Prä­sen­ta­ti­on bes­ser an den ganz Gro­ßen. »Je bes­ser sich das Pro­dukt von al­len Sei­ten be­gutach- ten lässt, des­to hö­her die Con­ver­si­on«, so Vol­ker Will, Part­ner der E-com­mer­ce-agen­tur su­per­re­al (sei­ne Tipps zur E-shop- Gestal­tung le­sen Sie auf Sei­te 22). Hoch­wer­tig­keit ist auch bei den g eka­chel­ten P ro­dukt­über­sich­ten an­ge­zeigt. Auch wenn es hier eher um Funk­tio­na­li­tät wie Sor tie­rung und F il­ter geht, ist ein ein­heit­li­cher Look wich­tig für das Bran­ding und die Dif­fe­ren­zie­rung.

Neue Kon­zep­te für klei­ne­re Shops

Dass ein tol­les Pro­dukt und ei­ne tol­le Ins­ze­nie­rung al­lein heut e nicht mehr aus­rei­chen, um ei­nen er­folg­rei­chen Shop zu star­ten, weiß je­der Kom­mu­ni­ka­ti­ons­pro­fi. Das An­ge­bot muss mit ge­schick­tem Sto­ry­tel­ling und Con­tent Mar­ke­ting be­glei­tet wer­den. »Men­schen in­ter­es­sie­ren sich nicht für ein Pro­dukt, son­dern für die Er­fah­rung, die sie da­mit ma­chen«, meint Tim Ke­ding, CEO von Sho­epas­si­on in Ber­lin, ei­nem Shop für hand­ge­fer­tig­te Schu­he (sie­he Sei­te 30). Die­se woll­te Ke­ding nicht ein­fach nur ver­kau­fen, son­dern: » Ich ha­be das, was ei­nen Fein­kost­la­den aus­macht, ins In­ter­net über­tra­gen.« Und oben­drauf gibt es vie­le In­for­ma­tio­nen rund um die Her­stel­lung, Pass­form und Pfle­ge von Schu­hen.

Es sind vor al­lem nut zwer­ti­ge, Seo-op­ti­mier­te In­hal­te, die Sho­epas­si­on im Goog­le-ran­king nach oben ka­ta­pul­tier­ten. Das Sto­ry­tel­ling bringt die User von den So­ci­al-me­dia-ka­nä­len in den Shop und mo­ti­viert sie, er­wor­be­ne Pro­duk­te in ih­ren Ka­nä­len zu tei­len. »Kon­zen­triert man sich bei der Ent­wick­lung auf den Nut­zen für den Kon­su­men­ten, fin­det man im­mer fes­seln­de In­hal­te, die es selbst Kun­den mit über­schau­ba­rem Bud­get er­lau­ben, sich im On­li­neLärm Awa­ren­ess zu ver­schaf­fen«, er­klärt Vol­ker Will.

Ge­ra­de bei mo­bi­len Shop-ver­sio­nen rückt die ECom­mer­ce-agen­tur Kom­merz aus Es­sen von der üb­li­chen Sys­te­ma­tik ab. »Smart­pho­ne-user ha­ben ein viel kon­kre­te­res, be­darfs­ori­en­tier­tes Kauf ver hal ten. Schon auf­grund der klei­ne­ren F lä­che sind sie viel ziel­ge­rich­te­ter un­ter­wegs und na­vi­gie­ren di­rekt zur Pro­dukt­aus­wahl«, sagt Tim Bö­ker, ge­schäfts­füh­ren­der Ge­sell­schaf­ter von Kom­merz. Dies müs­se man bei der Kon­zep­ti­on be­rück­sich­ti­gen und über­le­gen, wie man dem User trotz­dem in­spi­ra­ti­ve In­hal­te prä­sen­tiert. Die Lö­sung beim von Kom­merz ent­wi­ckel­ten Bvb-fan­shop war, emo­tio­na­les Sto­ry­tel­ling mit Kauf­funk­tio­nen zu kom­bi­nie­ren. In dem m aga­zi­ni­gen L ay­out wech­seln sich Ge­schich­ten über d ie Spie­ler mit Pro­dukt­bil­dern ih­rer Tri­kots und an­de­ren Mer­chan­di­sing-ar­ti­keln ab.

Ma­xi­ma­le Usa­bi­li­ty

So viel Spiel­raum man bei der K on­zep­ti­on des EShops hat, so kl ar de­fi­niert sind heu­te die t ech­ni­schen An­for­de­run­gen. Der Shop muss funk­tio­nie­ren, das heißt, al­le Stan­dards wie zum Bei­spiel un­ter­schied­li­che P ay­ment- und L ie­fer­mög­lich­kei­ten ab­de­cken, da­mit der Kauf für den User rei­bungs­los und schnell zu er­le­di­gen ist. Die­se tech­nisch-funk­tio­na­len Stan­dards muss das zu­grun­de lie­gen­de

Bu­si­ness­plan er­stel­len. De­fi­nie­ren Sie ge­mein­sam mit dem Kun­den die KPIS für ein Worst- und Bes­tCa­se-sze­na­rio. Wie viel Traf­fic über Ow­ned, Paid und Ear­ned Me­dia be­nö­tigt er, wel­che Wa­ren­korb­grö­ße und wel­che Con­ver­si­on? Wie teu­er ist der Wa­ren­ein­kauf, wie hoch sind die ge­plan­ten Mar­ke­ting­aus­ga­ben, wie hoch die in­itia­len und die lau­fen­den Kos­ten für den Shop? Erst nach dem Zu­sam­men­tra­gen die­ser Eck­punk­te be­kommt der Shop­be­trei­ber ei­ne Vor­stel­lung von sei­nem In­vest­ment und von mög­li­chen Ge­winn­chan­cen. Mar­ke­ting­stra­te­gie fest­le­gen. Da Traf­fic für ei­nen On­li­ne­shop so es­sen­zi­ell ist, gilt es, mit dem Kun­den den USP, al­so das Al­lein­stel­lungs­merk­mal sei­ner Mar­ke und Pro­duk­te zu er­ar­bei­ten und dar­aus die pas­sen­de Mar­ke­ting­stra­te­gie ab­zu­lei­ten. Nutz­er­zen­triert den­ken. Er­for­schen Sie, wel­che Ziel­grup­pe der Auf­trag­ge­ber hat und was de­ren Be­dürf­nis­se sind. Dar­an ori­en­tiert sich näm­lich nicht nur die An­spra­che mit Bild und Text, son­dern auch der Ein­satz sinn­vol­ler Fil­ter im On­li­ne­shop und nütz­li­cher Fea­tu­res, die dem (po­ten­zi­el­len) Käu­fer Ar­beit ab­neh­men und die Nut­zung love­able ma­chen. Über­zeu­gen Sie den Kun­den da­von, dass er nicht am User spart. »Mo­bi­le First« ent­wi­ckeln. Ma­chen Sie dem Kun­den klar, dass »Mo­bi­le First« kei­ne Op­ti­on, son­dern es­sen­zi­ell für den Er­folg des Shops ist. Auch auf dem Smart­pho­ne muss der User schnell zum ge­wünsch­ten Pro­dukt und zum Kauf­ab­schluss ge­lan­gen. Mu­tig sein! Ge­win­nen Sie den Kun­den da­für, et­was zu wa­gen und an­ders zu ma­chen als die gro­ßen On­line­händ­ler, al­so so­wohl ei­ne neue vi­su­el­le Spra­che als auch neue Tech­no­lo­gi­en aus­zu­pro­bie­ren. Ful­fill­ment ist Teil der De­si­gnauf­ga­be. Zur Cust­o­m­er Jour­ney im E- Com­mer­ce ge­hö­ren die Ver­pa­ckung be­zie­hungs­wei­se das Au­s­pa­ck­erleb­nis eben­so wie die Be­stä­ti­gungs­mails oder das Re­tou­ren­ma­nage­ment. Ent­spre­chend soll­te der ge­sam­te Pro­zess kon­sis­tent und kun­den­zen­triert ge­stal­tet wer­den. Stra­te­gie fürs Cust­o­m­er-re­la­ti­ons­hip-ma­na­ge

ment er­ar­bei­ten. Da es teu­er ist, neue Kun­den zu ge­win­nen, lohnt sich die Pfle­ge von Be­stands­kun­den. Hier hel­fen E-mail-mar­ke­ting­sys­te­me, die ei­ne Viel­zahl an Mög­lich­kei­ten bie­ten, um Kun­den zu ka­te­go­ri­sie­ren und zu klas­si­fi­zie­ren so­wie An­ge­bo­te zu per­so­na­li­sie­ren. Täg­lich ana­ly­sie­ren. Ver­glei­chen Sie die Goo­gleAna­ly­tics-zah­len des Shops je­den Tag mit dem de­fi­nier­ten Kpi-set-up. Ver­brin­gen Sie dann 10 Pro­zent der Zeit mit der Ana­ly­se der Zah­len und 90 Pro­zent mit der Dis­kus­si­on, was man op­ti­mie­ren kann. (ae)

Sho­psys­tem mit­brin­gen. Da die Ent­wick­lung ei­ner in­di­vi­du­el­len Lö­sung aus Kos­ten­grün­den meist nicht in­fra­ge kommt, sind fer­ti­ge, in der Re­gel mo­du­lar auf­ge­bau­te Sho­psys­te­me prak­ti­ka­bler (sie­he Sei­te 24 f.). Hier kann man für sei­nen Kun­den die Fea­tu­res aus­su­chen, die am bes­ten zu sei­nem Bu­si­ness­mo­dell pas­sen. Je nach ge­plan­tem Um­satz und Be­stell­vo­lu­men fil­tert man pas­sen­de Sho­psys­te­me her­aus und er­mit­telt über die Kos­ten für An­scha­fung und lau­fen­den Be­trieb die ge­eig­ne­te Lö­sung. Da­bei soll­te das Sho­psys­tem we­der über­di­men­sio­niert sein, um ho­he Li­zenz- und War­tungs­kos­ten zu ver­mei­den, noch un­ter­di­men­sio­niert, da­mit es schnel­les Wachs­tum oder Zu­grifs­spit­zen ver­kraf­tet.

Re­s­pon­sives De­sign ge­hört wie über­all im Web zum Pflicht­pro­gramm, da­mit der Kun­de kei­ne Mehr­kos­ten für na­ti­ve Apps und die da­mit ver­bun­de­nen Up­dates hat. Und da Per­for­mance ge­ra­de im E- Com­mer­ce ein Schlüs­sel­kri­te­ri­um ist, emp­fiehlt es sich, kon­se­quent »Mo­bi­le First« zu ent­wi­ckeln. Zwar wol­len vie­le Kun­den die Ent­wür­fe im­mer noch lie­ber auf dem gro­ßen Desk­top se­hen, aber da müs­se man kon­se­quent blei­ben, so Vol­ker Will: »Nur wer zu­erst für den kleinsten Screen ge­stal­tet, sieht auf den ers­ten Blick Schwä­chen wie zu lang­sam la­den­de Bil­der und Vi­de­os oder ei­ne ha­ken­de User Ex­pe­ri­ence. Hier hel­fen Mi­cro­in­ter­ac­tions und Tran­si­ti­ons, den Pro­zess flüs­sig und trans­pa­rent zu gestal­ten. Klas­si­sches Bei­spiel sind et­wa Ani­ma­tio­nen als Hil­fe beim Aus­fül­len von For­mu­la­ren für die Re­gis­trie­rung und im Check-out-pro­zess – ein kur­zes Schüt­teln, wenn die Ein­ga­be im For­mu­lar­feld falsch war oder ein Häk­chen als Feed­back.

»Tech­ni­sche Wid­rig­kei­ten wie klei­ne Bild­schirm­grö­ßen oder ei­ne feh­len­de Band­brei­te sind ei­gent­lich su­per fürs De­sign, denn sie zwin­gen uns, auf den Punkt zu kom­men und zu ent­schei­den, was rein darf und was drau­ßen blei­ben muss«, er­klärt Ma­ri­us Bruns, Unit Di­rec­tor bei hmmh in Bre­men. Die ECom­mer­ce-agen­tur ent­wi­ckelt re­s­pon­sive E-shops im­mer »Mo­bi­le First« und hat sich da­bei als tech­ni­sches Li­mit ein Per­for­man­ce­bud­get ge­setzt, das brem­sen­den, »per­for­man­ce­hung­ri­gen« Ele­men­ten den Ein­gang in den Shop ver­wehrt. Die­ses Bud­get er­rech­net sich aus den durch­schnitt­li­chen Wer­ten der Kon­kur­renz mi­nus 20 Pro­zent »Das ver­ste­hen un­se­re Kun­den, denn Per­for­mance-ein­bu­ßen be­deu­ten Um­satz­ein­bu­ßen«, sagt Bruns. Sol­che Kri­te­ri­en mo­ti­vie­ren Kun­den und De­si­gner ge­mein­sam zum Mi­ni­ma­lis­mus – selbst­ver­ständ­lich, oh­ne dass die Usa­bi­li­ty dar­un­ter lei­det. ae [5951]

PA­GE edos­sier »E-shop-sys­te­me für De­si­gner«. Wie Krea­ti­ven der Ein­stieg in den E-com­mer­ce ge­lingt ↗ www.pa­ge-on­li­ne.de/pddp1020

»Mi­cro­in­ter­ac­tions: Ani­ma­tio­nen & Tran­si­ti­ons«. Un­ser edos­sier mit Best Prac­tices für ei­ne ge­lun­ge­ne User Ex­pe­ri­ence in Web und Mo­bi­le gibt’s un­ter ↗ www.pa­ge-on­li­ne.de/pddp1091

Mit Lie­be zum De­tail und erst­klas­si­ger Pro­dukt­fo­to­gra­fie setz­te die New Yor­ker Di­gi­ta­l­agen­tur Attck die Man­schet­ten­knöp­fe für Fils Uni­que in Sze­ne. Flan­kiert wird der Sho­pi­fy-shop von Video- und Bild­ma­te­ri­al, das den User über den auf­wen­di­gen Krea­ti­ons- und Her­stel­lungs­pro­zess auf­klärt

Bei der Kon­zep­ti­on ei­nes Shops kann man viel falsch ma­chen. Vol­ker Will, ge­schäfts­füh­ren­der Ge­sell­schaf­ter der E-com­mer­ceA­gen­tur su­per­re­al in Ham­burg (www.su­per­re­al.de), er­klärt, wor­auf es an­kommt.

Newspapers in German

Newspapers from Germany

© PressReader. All rights reserved.