UX/UI dizájn, termékfejlesztés

Riffer

Teljes, végponttól végpontig végigvitt alkalmazástervezési folyamatot mutatunk be egy zenészeknek szóló koncepció-appon: az információs architektúrától a működő, kattintható prototípusig.

Ügyfél

Riffer — mobilalkalmazás zenészek számára

Riffer — mobilalkalmazás zenészek számára

Év

4 hét

4 hét

Szolgáltatások

UX-kutatás, információs architektúra, felhasználói folyamatok, UI-tervezés, funkcionális prototípus

UX-kutatás, információs architektúra, felhasználói folyamatok, UI-tervezés, funkcionális prototípus

Iparág

Zenészközösségi és próbaterem-foglalási alkalmazás

Zenészközösségi és próbaterem-foglalási alkalmazás

Technológia

Figma, Figma Make

Figma, Figma Make

Riffer case study — discovery phase: Versenytárselemzés
Riffer case study — design phase: A kutatástól a tervezésig
Riffer case study — development phase: Prototípus

A Riffer egy önálló kezdeményezésű koncepcióprojekt, amelynek célja nem egy ügyfélmegbízás teljesítése volt, hanem annak bemutatása, hogyan néz ki nálunk egy alkalmazástervezési folyamat a kutatástól a funkcionális prototípusig, olyan mélységben, amit ügyfélmunkánál az NDA-k és a határidők ritkán engednek meg nyilvánosan megmutatni.

Az ötletet közvetlen környezetünkben több zenész ismerős tapasztalata adta. Elmondásuk szerint rendszeresen ütköznek nehézségbe, amikor közös próbatermet vagy stúdiót szeretnének foglalni, és kevés az olyan aktív közösség, ahol ezt egyszerűen meg lehetne oldani.

Kutatás és stratégia

01

Versenytárselemzés

A piacon elérhető konkurensek közül a Vampr appot vizsgáltuk részletesebben. A tapasztalat az volt, hogy a más zenészekkel való matching jól működik, viszont a tényleges interakció, a közös próba megszervezése, már nehézségekbe ütközik. Egyik komolyabb versenytárs alkalmazásnál sem találtunk megoldott foglalási funkciót, pedig ez az, ami a zenészek valós, mindennapi problémáját oldaná meg.

02

A pozicionálás

Ez a felismerés adta a Riffer fő irányát: az app igazolt helyszíneket biztosítana, amelyek meghirdethetik elérhetőségüket, és közvetlen foglalást tesznek lehetővé. Nem egy újabb matching-alkalmazás, hanem az, ami a matching után hiányzik.

03

Információs architektúra

Az alkalmazás struktúrája a teljes utat lefedi a regisztrációtól a tényleges közös zenélésig: zenészek és helyszínek felfedezése instrumentum, műfaj és elérhetőség alapján, zenekar-alapítás és -kezelés, próbaterem-foglalás fizetéssel, valamint élő, online próba lehetősége TV-re tükrözve. Az IA-fázisban emellett tudatosan dokumentáltuk azokat a kisebb funkciókat és irányokat is, amelyeket az első verzióból szándékosan kihagytunk — ezek jelölve szerepelnek a tervben, hogy a kihagyás tudatos döntés legyen, ne hiányzó munka.

Design megközelítés

01

A kutatástól a tervezésig

A vizuális és funkcionális döntések középpontjában az állt, hogy az app ne csak a matchingnél álljon meg, ami a Vampr-nál azonosított hiányosság volt. A zenész-profilok instrumentum- és műfaj-címkékkel, valamint közvetlen üzenetküldéssel segítik a felfedezést, de minden profilról egyenes út vezet a következő lépéshez: zenekar alapítása, próba szervezése vagy helyszín foglalása.

02

Igazolt helyszínek és bizalom

A helyszín-profilok (pl. próbatermek, stúdiók) fényképekkel, árazással és valós elérhetőséggel jelennek meg, „Book now” gombbal. Ez közvetlenül arra a problémára válaszol, amit a kutatás során azonosítottunk: a foglalás megbízhatósága volt a hiányzó láncszem, nem a zenészek megtalálása.

03

Band Hub mint koordinációs központ

A zenekaralapítás után a Band Hub egy helyen fogja össze a tagokat, a próbarendet és a live session indítását. Ez a döntés azt a problémát oldja meg, hogy egy zenekar tagjainak egyeztetése (ki ér rá, mikor próbálunk, hol) általában szétszórtan zajlik chat-alkalmazásokban és papíron.

04

Foglalás és fizetés egy folyamatban

A próbaterem-foglalás naptárnézettel, időpontválasztással és beépített fizetési lépéssel zárul, a foglalás visszaigazolásáig. A cél az volt, hogy a foglalás ne külön telefonhívást vagy e-mailt igényeljen, hanem az appon belül, megszakítás nélkül mehessen végbe.

05

Vizuális nyelv

A vizuális irány célja a fiatal zenészek megszólítása volt, egy modern és egy analógabb hatás ötvözésével. A sötét háttér és a vibráló lime szín adja a modern, lendületes karaktert, míg a képi világ az analógabb, kevésbé csiszolt hangulatot hozza be. Így az app sem tisztán technológiai terméknek, sem nosztalgikus zenei közösségnek nem hat egyoldalúan.

Fejlesztés

01

Prototípus

A design rendszert Figma Make segítségével funkcionális, kód-alapú prototípussá alakítottuk: nem csak kattintható makettet, hanem ténylegesen interaktív, tesztelhető felületet, amely a teljes fő útvonalat végigviszi — regisztrációtól az onboardingon, a zenészek felfedezésén és a band létrehozásán át a próbaterem-foglalásig és a live szobáig.

02

Nyitott kérdés

A legnagyobb, egyelőre tisztázatlan tervezési kérdés a live stream funkció. Az online próba valós idejű hang- és képátvitele komoly latency- és hangminőségi kihívást jelent, ami jelentősebb fejlesztői háttértudást és befektetést igényelne a jelenlegi koncepción túl.

Eredmény

A Riffer egy dokumentált, végigvitt tervezési folyamatot mutat be, amely valós felhasználói problémából indul: zenész ismerősök tényleges nehézségeiből a próbaterem-foglalással kapcsolatban. Erre épült a konkurenciaelemzés, amely azonosította a piaci rést — a matching működik, a foglalás nem —, majd ez a felismerés közvetlenül alakította az információs architektúrát és a design döntéseket a helyszín-profiloktól a Band Hubon át a fizetési folyamatig. A projekt működő, kód-alapú prototípusig jutott, amely a teljes felhasználói utat végigviszi.

Teljes átfutási idő

4 hét

Teljes felhasználói út

21 screen

End-to-end projekt tervezés

✓

Riffer case study — discovery phase: A pozicionálás
Riffer case study — design phase: Igazolt helyszínek és bizalom
Riffer case study — discovery phase: Információs architektúra
Riffer case study — design phase: Band Hub mint koordinációs központ