Az Ügyfél

krafty_logo-01A Krafty.hu a hazai e-kereskedelmi piac egyik új, innovatív vállalkozása; egy hiánypótló és nagy jövő előtt álló fiatal szereplő a webáruházak terepén. A portál célja, hogy összegyűjtse a hazai kézműves designerek kínálatát és azokat egy modern, könnyen használható piactéren közvetítse. Célja az olyan minőségi, kisszériás egyedi termékek népszerűsítése, amelyek másképpen nehezen tudnának nagy célközönséget elérő kereskedelmi forgalomba kerülni. A Krafty.hu tehát egy piactér, ahol adni-venni lehet olyan egyedi termékeket, amelyek magukon viselik a készítőjük egyéniségét. A portál egyben fontos megjelenési lehetőséget és értékesítési csatornát jelent ezen termékek alkotói számára.

Nem a Krafty az első olyan portál, amely felismerte a kézműves designerek termékeinek értékesítésében rejlő potenciált és platformot adott nekik. Nemzetközi szinten több hasonló jellegű portállal találkozhatunk. Fontos különbség ugyanakkor más, hasonló platformokhoz képest, hogy a Krafty.hu kínálata komoly válogatás és minőségi ellenőrzés révén áll össze, az alkotókat pedig a portál üzemeltetői kommunikációs támogatással, marketing aktivitással és termékfejlesztési tanácsokkal is segítik. A Krafty.hu tehát nemcsak egy megjelenési platform, de üzleti inkubátor is. Alapítói nagy kommunikációs tapasztalattal rendelkező szakemberek, akik 2015-ben döntötték el, hogy belevágnak régi álmuk, az első igazán jól működő hazai kreatív piactér megvalósításába. Ehhez rengeteg időt, energiát és elszántságot tettek a projekt mögé. Nagy örömünkre a Krafty megálmodói az OANDER csapatát választották partnerül a projekt megvalósításához

krafty_casesutdy_01

A kihívás

A Krafty létrehívásának célja részben üzleti vállalkozás, részben pedig küldetés volt: a portál alapítói hozzá kívántak járulni a szenvedélyes alkotók és tervezők piaci sikeréhez termékkínálatuk ismertségének növelésén keresztül, az igényes design termékek iránt érdeklődő vásárlóknak pedig alternatívát kívántak nyújtani a fast fashion divatmárkák és a nagy lakberendezési láncok kínálatához képest. „Tárgyak, amiknek lelkük van” – olvastuk az arculati brief első soraiban, amely azonnal beindította a fantáziánkat.

A projektben nemcsak tervezőként és fejlesztőként vettünk részt, de IT és üzletfejlesztési tanácsadóként segítettük a koncepció finomhangolását, az üzleti folyamatok kialakítását, emellett az alapítók a Krafty márka arculattervezési feladatai terén is bizalmat szavaztak nekünk. Így a projekt a csapatunk számára rendkívüli felelősséggel járt; a Krafty sikere igen sok területen múlott az általunk szállított megoldások minőségétől és a ránk bízott tanácsadói munkák eredményességétől. A Krafty.hu létrehívása és a termékkel kapcsolatos közös gondolkodás egy igazi, az ügyféllel kéz a kézben végzett alkotómunka volt és a legizgalmasabb megbízatásaink között tartjuk számon.

Az arculat tervezése

Digitális platformok arculattervezése egy rendkívül izgalmas feladat, különösen, ha egy zöldmezős projektről van szó, ahol nem kötik a kezünket múltból örökölt beidegződések vagy szabályrendszerek. A semmiből létrehozni egy márka élményvilágát igazán inspiráló feladat, különösen, ha a készülő márkának alkotó csapatként magunk is rajongóivá válunk. A Krafty.hu arculattervezési folyamata végigjárta a branding klasszikus evolúciós lépcsőfokait: üzleti brief-fel, ügyfél által definiált moodboard-dal kezdődött, majd best practice minták elemzésén, kísérleti színpalettákon, hangulati leírásokon és közös ötleteléseken keresztül formálódott. Az arculat kialakítását nagyban segítették az ügyfél által igen pontosan definiált user persona leírások. A Krafty márka elsődleges célcsoportját azok a potenciális vásárlók alkotják, akinek fontos, hogy szép, ötletes tárgyakkal körülvéve éljenek, öltözködésük ne csak a divatot, hanem értékrendjüket is tükrözze, akik szívesen áldoznak arra, hogy ne tucatárut vásároljanak és akiket jó érzéssel tölti el, hogy ezzel helyi kisvállalkozásokat, alkotókat támogatnak. Ezek fényében a tervezett márkavilág kulcsmotívumai az érthetőség, emberközeliség és a visszafogott játékosság voltak.

moodboard

A Krafty márka arculattervezését segítő moodboard egy részlete

A legnagyobb kihívást természetesen a logó kialakítása jelentette, hiszen ez minden arculat meghatározó eleme. Már a projekt elejétől kezdve logotípiában gondolkodtunk, amely egy izgalmas tipográfiai kihívást jelentett. Összesen közel 30 különböző skicc és draft irány finomításán, alapos értékelésén keresztül jutottunk el a végleges verzióig. A logó tervezése közben folyamatosan az egyes logó variációkhoz kapcsolódó tipográfiai és színpaletta mintákat társítottunk, így a logóról nemcsak önmagában, hanem annak kontextusában tudunk beszélgetni az ügyféllel. A végleges logó kialakítását követően az arculati elemeket egy egységes vizuális keretrendszerbe csomagoltuk, amely kellő alapot adott a UI tervezéshez.

Az arculattervezés során készült néhány logó koncepció:

logos

Az arculattól a felhasználói élményig

A projekt arculattervezési szakaszával párhuzamosan zajlott a funkcionális best practice vizsgálat és az üzleti folyamatok (elsősorban a dropshipping alapú vásárlási és kiszolgálási workflow) tervezése. Miután a vásárlási folyamatokat user journey ábrák formájában véglegesítettük, elkezdtük az ergonómiai tervezést, amely minden projektünkben a látványvilág kialakítását megelőző fontos lépés. Az ügyféllel közösen tartalmas termékműhely találkozókon vitattuk meg a folyamatosan készülő, alakuló drótvázak állapotrajzait és mivel a UX tervezési szakasz párhuzamosan zajlott az arculattervezési munkával, a branding kialakításában hozott döntések hasznos ráhatással voltak magukra az ergonómiai tervekre is. A tervezés fontos szempontja volt természetesen a tökéletes reszponzivitás, amely a Krafty esetében nemcsak tablet és mobil optimalizált állapotokban nyilvánul meg, hanem desktop állapotban is több fázisban igazodik a rendelkezésre álló képernyő területhez. Az ergonómiai felépítést egy 12-es hasábosztású modulhálóra építettük fel, amely nagyon rugalmasan alakítható választásnak bizonyult az egyes reszponzív tartományok megrajzolásához.

Minták a Krafty ergonómiai tervei közül:

wireframes

A drótvázak elfogadását követően láttunk neki a webes látványvilág kialakításának. Ekkora már a kezünkben volt a kész arculat, az ergonómiai tervkészlet és a portál tartalmi terve is, vagyis a design kialakításhoz szükséges inputok a kellő időben „futottak össze”. Az arculattervezéshez hasonlóan a UI design tervezés is egy evolúciós folyamat volt, amely során több különböző stílusú, hangulatú és vizuális komplexitású koncepción keresztül jutottunk el a végeredményig. A Krafty tervezésének érdekessége az volt, hogy a grafikai koncepciók egy igen széles stíluspalettát jártak be, mire megtaláltuk az ideális felhasználói élményt. A design tervezés első fázisában még egy alapvetően mozgalmas, material design alapokra épülő felhasználói élményt igyekeztünk elérni, ám az ügyféllel való közös gondolkodás során végül a flat stílus és a minimalista design komplexitás irányába mozdultunk el.

Út a játékosságtól a minimalista design-ig. Néhány pillanatkép a Krafty design tervek evolúciójából:

krafty_design_concepts

Mindezen projekt közbeni változás fő mozgatórugója az volt, hogy zöldmezős startup projekt lévén a tervezéssel párhuzamosan zajlott a kereskedő partnerek felkeresése és a kínálat felépítése, azaz menet közben ismerkedtünk meg a portálon helyet kapó termékek képi világával. Rájöttünk, hogy a termékek önmagukért beszélnek és az eredeti grafikai elgondolásaink túlságosan tolakodóak lettek volna. A Krafty-n megjelenő design termékek minősége és izgalmas vizualitása tehát fokozatosan átértékelte bennünk és ügyfelünkben is a webdesign szerepét és ideális hangsúlyát. Így noha eredetileg egy kreativitást és mozgalmasságot sugalló hangulatot képzeltünk el a Krafty.hu számára, a tervezés során szándékosan egyre inkább háttérbe szorítottuk a kezelőszervek és a tartalmakat befoglaló design keret „erejét”, minél inkább teret engedve maguknak a termékeknek.

A fokozatos egyszerűsítés jegyében az arculattervezéskor a webdesign számára előzetesen definiált mozgalmas színpalettát elengedtük, a tartalmakat pedig végül tisztán fekete-fehér környezetbe ültetve tálaltuk. A portál tipográfiáját is több lépésben enyhítettük. Az eredetileg markáns, testes szövegkaraktert a sokkal visszafogottabb Roboto fontcsalád „csendesebb” metszeteire cseréltük.

design_showcase

Az így kialakított design tehát egy viszonylag hosszú utat tett meg a kezdeti koncepciók és a fejlesztésre jóváhagyott látványvilág között – a tervezési fázisban egy határozott stílusváltást is megélve. A végeredmény egy tiszta user interface lett, amely nem tolakodó, semmilyen öncélú grafikai elemet nem tartalmaz és amely alapvetően a képi tartalmakra és tipográfiára hagyatkozik. A Krafty.hu végleges megjelenésében a tartalom alkotja a design meghatározó részét, a UI komponensek pedig végletekig letisztultak. Izgalmas felfedezőút volt, ahogy a design elemek hangsúlyát fokozatosan csökkentettük, a portál mondanivalója mégis gazdagabbá vált általuk. A Krafty.hu az egyik leginkább minimalista design-nal rendelkező digitális termék, amely az elmúlt években a műhelyünkben készült. A webáruház végső megjelenése a „content first” elv érvényesülését szolgálja, minden felülete a tartalmat, a kézműves tárgyakat és azok alkotóit helyezi középpontba.

Fejlesztés

A webáruház megvalósításához a Magento webshop motort javasoltuk ügyfelünknek, amelynek hasonló komplexitású projektekben való alkalmazásában csapatunk az elmúlt években számtalan portálfejlesztésben bizonyított. A Krafty nem egy hagyományos webshop, hanem piactérként számos kereskedő kínálatát aggregálja, így a hagyományos e-kereskedelmi üzleti funkciókat jelentősen ki kellett egészíteni. Mind a projekt büdzsé, mind a fejlesztés átfutási ideje tekintetében fontos előnyt jelentett a Magento nyílt forráskódú jellege, amely szabad továbbfejleszthetőséget biztosított ezen kiegészítések megvalósítására. Korábbi projektjeink révén továbbá komoly tapasztalatokkal rendelkeztük a Krafty-hoz hasonló dropshipping rendszerben működő webshopok kialakításában. Vagyis mind üzleti tapasztalatokkal, mind kipróbált technológiai megoldásokkal tudtunk szolgálni arra vonatkozóan, hogy a webáruház a kereskedelmi értéklánc elosztó központjává válva képes legyen számos kereskedő termékeit egy egységes ernyőmárka alatt forgalmazni.

A webáruház frontend felületének 12-es osztású reszponzív gridrendszere:

krafty_responsive_grid

A Magento webáruház motor core-szintű továbbfejlesztése révén a kereskedők a Krafty.hu piacterén belül gyakorlatilag egy-egy saját webáruház szekciót kapnak, a felhasználók pedig a böngészési és vásárlási lépések során a rendelésüket a Krafty.hu-n keresztül adják le, ám azok kiszolgálását már a kereskedők végzik. Ehhez az általunk fejlesztett rendszer az elkészült rendelések tételeit automatikusan szétválogatja és továbbítja azokhoz a kereskedőkhöz, akikhez egy-egy adott termék tartozik, a kereskedők pedig egy saját admin felületen tudják nyomon követni és adminisztrálni eladásaikat. A projekthez készült backend továbbfejlesztések támogatják továbbá a kereskedők részletes bemutatását, márkájuk, bemutató felületeik szerkesztését, egyedi árszabályok, szállítási és fizetési módok kialakítását és kínálatuk központi rendszerben való kategorizálását. A webáruház így az egyes szerepkörök alapján többszintű admin felülettel rendelkezik, míg frontend oldalról a vásárlási élmény egy egységes, zavartalan ökoszisztémát alkot. Ennek részét képezik olyan kényelmi funkciók, mint a termékek bevásárló listára helyezhetősége, összetett keresési és szűrési opciók, webáruházzal szinkornizált hírlevél kiszolgálás és egy stabil banki integráció. A Krafty reszponzív frontend fejlesztését Bootstrap alapokon valósítottuk meg a projekt fejlesztésekor legfrisebb 1.9-es verziójú Magento alap template egyedi fejlesztésű sablonnal való lecserélésével.

A szállított portál

A megvalósult Krafty.hu kiérdemelten kiemelt helyet foglal el az OANDER büszkeségfalán. Élvezettel dolgoztunk rajta és örömünket leltük a projekt minden percében. Természetesen a projekt sikere még inkább a lelkes alapítók érdeme, akik a projekt közben felállították a vállalkozás céges hátterét és megszervezték annak működését. Nem veszítettek fókuszt; az elejétől a végéig tudták, hogy mit szeretnének elérni. Hatékony piacravezetési kampányt szerveztek és remek alkotókat maguk köré szervezve egy igen válogatott termékkínálatot állítottak össze a portál indulásáig. A webáruház 2015 novemberében alaposan kitesztelt és tartalmakkal feltöltött állapotban indult el, igényes válogatásokkal, közel 40 kereskedővel és több mint ezer minőségi design termékkel a fedélzeten. A webáruház mind a termékeiket eladásra bocsátó kézműves alkotók, mind a vásárlók részéről igen pozitív fogadtatásban részesült. Azoknak, akik akár maguknak, akár ismerőseiknek szeretnének kedveskedni egy-egy igazán egyedi, kézműves technológiával készült design termékkel, feltétlenül javasoljuk, hogy kattintsanak ide. Kalandra fel!

krafty_mockups_3