Egy elavult oktatási oldalból dinamikus, összefüggő képzési rendszer.
A Majdnem Híres Rocksuli elavult, nem reszponzív oldalából egy dinamikus, könnyen szerkeszthető és a képzések közötti eligazodást támogató WordPress-rendszer készült.
01 · Kiinduló probléma
A kihívás
A régi oldal nem volt reszponzív, nem rendelkezett valódi mobilos élménnyel, a cookie-kezelés pedig már nem felelt meg a korszerű elvárásoknak. A vizuális megjelenés is a korábbi arculatot tükrözte.
UX szempontból ennél is fontosabb probléma volt, hogy a képzések közötti eligazodás nehézkes volt, az információk hosszú, kevéssé tagolt szövegekben jelentek meg, és a képzések, oktatók, alumni és rendezvények nem támogatták egymást összefüggő tartalmi rendszerként. Az oldal kevéssé adott kedvet ahhoz, hogy a látogató tovább böngésszen vagy jelentkezzen.
Szakmai megközelítés
A projektet információs architektúrával és UI tervezéssel közelítettem meg. A cél az volt, hogy az induló képzések már a főoldalon hangsúlyosan jelenjenek meg, a képzésadatlapokon pedig láthatók legyenek a hozzájuk tartozó oktatók.
A vizuális irányban megtartottam a meglévő sárga–fekete arculatot és logót, de új tipográfiát, nagy kontrasztú layoutot, teljes képernyőt kitöltő elemeket, rövid szöveges blokkokat és mozgó részleteket vezettem be. A fekete-fehér képek hoverre színessé válnak, ami egyszerre támogatja az urbánus, zeneipari karaktert és az oldal dinamizmusát.
02 · Szakmai döntés
A képzések kerültek a középpontba
Probléma
A régi oldalon nem volt egyértelmű, hogyan találja meg valaki a számára megfelelő képzést, és a különböző tartalomtípusok kevéssé segítették egymást.
Döntés
Az információs architektúrát úgy alakítottam át, hogy a képzések legyenek a fő belépési pontok, és a kapcsolódó oktatók, alumni- és rendezvénytartalmak kontextust adjanak hozzájuk.
Megoldás
A képzésadatlapokon megjelennek a hozzájuk tartozó oktatók, a főoldalon pedig külön kiemelt blokk mutatja az induló képzéseket. Az ügyfél adminból maga állíthatja, melyik képzés kapja meg ezt a státuszt.
03 · Szakmai döntés
A meglévő arculatból dinamikus digitális rendszer
Probléma
A sárga–fekete arculat és a logó adott volt, de a régi oldal vizuális rendszere már nem közvetítette a Rocksuli mai karakterét.
Döntés
Új tipográfiát választottam, és a layout alapját nagy, teljes képernyős elemekre, erős kontrasztokra és rövid, jól elkülönülő szöveges tartalmakra építettem.
Megoldás
A fekete-fehér fotók hoverre színessé válnak, a mini animációk pedig mozgást visznek a felületbe anélkül, hogy elvennék a figyelmet a tartalomról. A teljes rendszerhez design system készült.
04 · Folyamat
Önálló entitásokból szerkeszthető oldal
A háttérrendszert úgy építettem fel, hogy a csapat fejlesztői segítség nélkül tudja frissíteni a dinamikus tartalmakat.
- 1
Képzések
A képzések külön adatlapokon kezelhetők, és adminból beállítható, melyik jelenjen meg kiemelten a főoldalon.
- 2
Oktatók
Az oktatók külön szerkeszthetők, és megjelenhetnek a kapcsolódó képzés adatlapján.
- 3
Rendezvények
Az események önálló tartalomtípusként tölthetők fel és időrendben jeleníthetők meg.
- 4
Alumni és GYIK
Az alumni bemutatások és a gyakori kérdések is külön szerkeszthető entitásként működnek.
05 · Szakmai döntés
Az adminfelületet is a használóhoz igazítottam
Probléma
Az oldal csak akkor működik hosszú távon, ha a szerkesztők önállóan és biztonságosan tudják frissíteni a tartalmakat.
Döntés
Az egyedi tartalomtípusokat ACF-mezőkkel építettem fel, hogy a szerkesztők ne layoutokat módosítsanak, hanem jól elnevezett mezőket töltsenek ki.
Megoldás
Az átadáshoz részletes, tartalomjegyzékes felhasználói kézikönyv készült, amely képernyőképekkel és lépésről lépésre mutatja be az oldal kezelését.
06 · Szakmai döntés
WordPress maradt — de új logikával
Probléma
Az induláskor kérdés volt, hogy a WordPress megfelelő alap-e egy értékesítési és kommunikációs célokat egyszerre kiszolgáló oldalhoz.
Döntés
A specifikáció alapján nem volt szükség egyedi backend rendszerre: a WordPress ismert adminfelülete, bővíthetősége és az ACF-alapú tartalommodell jól illeszkedett a projekthez.
Megoldás
Az oldal reszponzív WordPress-rendszerként készült el, technikai SEO-alapokkal, megfelelő átirányításokkal, biztonsági és teljesítménybeállításokkal, valamint mérési integrációval.
07 · Eredmény
Eredmény
Az új oldalon a látogató gyorsabban látja, milyen képzések indulnak, és az egyes adatlapokon a kapcsolódó oktatókkal együtt, kontextusban ismeri meg a programokat. A korábban hosszú szövegfolyamokra épülő tartalom rövidebb, jól elkülönülő egységekre bomlott.
A háttérben a képzések, rendezvények, oktatók, alumni és GYIK elemek önálló, ACF-alapú tartalomtípusokként szerkeszthetők. Az ügyfél azt is maga állíthatja, mely képzések jelenjenek meg induló képzésként a főoldal kiemelt részén. Az átadáshoz tartalomjegyzékkel ellátott, részletes felhasználói kézikönyv készült.
A te projektednél mi a probléma, amit meg kell oldani?
Ha új weboldalon vagy digitális felületen dolgozol, szívesen megnézem, hogyan lehetne UX, design és technikai oldalról egy rendszerként felépíteni.