Az Extreme Digital honlapját mobiltelefonon böngésző látogatók hatékony kiszolgálása
MIMÓZA Kommunikáció 1113 Budapest, Daróczi út 4. Budapest, 2012. szeptember 9.
A dokumentumban leírtak a Mimóza Kommunikáció kizárólagos tulajdonát képezik, azok részleges vagy teljes felhasználása kizárólag a Mimóza Kommunikáció előzetes írásbeli engedélyével lehetséges.
1
Cél Alapjaitól újragondolt ("újragombolt") funkcionalitással és felhasználói felülettel bíró a mobil eszközökre optimalizált honlap. Cél az intuitív navigáción és a felhasználói érdeklődésnek megfelelően csoportosított tartalom megjelenítés és navigáció megvalósítása, hogy a felhasználók minél rövidebb idő alatt elérjék az általuk keresett tartalmat/funkciót. Mindezt azon felhasználók részére, akik mobilról nézik a honlapot (jelenleg edigital.hu: 4,4%; edigital.cz: 3,2%; edigital.ro: 5,1%; edigital.sk: 3,4%), függetlenül attól, telefonjuk képernyője milyen felbontású. Főbb szempontok • Kis képernyőméret: nehezebben olvashatók a szöveges tartalmak. Ezt a betűméret és a szöveg hosszánál is figyelembe kell venni. A honlapot jelenleg mobillal látogatók statisztikái alapján a leggyakoribb felbontás az edigital.hu esetében a 320x480 pixel, míg a többi (cseh, román, szlovák) oldalaknál a 768x1024 pixel. Utóbbiaknál a második leggyakoribb a 320x480 pixeles felbontás. Ettől függetlenül a fejlesztés során a legkisebb megjelenítési méret, melyen használhatónak és olvashatónak kell lennie az oldalnak a 240x320 pixeles felbontás, maximális pedig az 1280x800 pixel. • Felugró vagy új ablakban nem jeleníthető meg tartalom – nem minden telefon/böngésző van felkészítve • Navigáció: egér hiányában nincs MouseOver (egér a link fölött) eset, lenyíló menük nem használhatók, emellett amennyiben nem érintőképernyős készülékről nézzük az oldalt, csak a két- vagy négy irányba mozgó navigációs gomb segíti az oldalon való mozgást • Általában mellőzni kell a javascript használatát a nem okostelefonokra való tekintettel • PDF, Flash, videó mellőzése a felhasználók bármely csoportjának esetleges kizárása elkerülése végett • Internetkapcsolat, internetforgalom költsége és a telefon teljesítménye miatt a tartalom és a design optimalizálása kiemelt fontossággal bír a gyors betöltődés és alacsony internetköltség elérése érdekében. • Fentiek okán (letöltési idő, költségek, helykihasználás) a hirdetések számával és arányával kifejezetten óvatosan kell bánni, a mobiltelefonon tolakodóbb hatást válhatnak ki. Figyelembe véve azonban, hogy az akció is fontos információ, ezért a mobil felületen is mindenképp szerencsés feltüntetni. Tartalmak, funkciók A mobil nézet középpontjába az információ áll. Vásárlásra elsősorban a honlap (illetve egy saját Extreme Digital mobil alkalmazás) javasolt mind a kijelző mérete, mind a billentyűzet hiánya miatt. Az „információs központ” elemi: • üzletek elérhetősége (kapcsolat) • termékinformáció • termék elérhetősége • termékek összehasonlítása • akciók • rendelés állapota Mobil látogatás esetén is a leglátogatottabb oldal a kezdőlap, ám feltűnően sokan lépnek innen egyből az Elérhetőség lapra, ami érthető is, hiszen gyakori felhasználási eset, hogy a telefon a navigációban, az üzlet megtalálásában segít. Ezt a struktúra kialakításánál figyelembe kell venni. Továbbá szintén lényeges a kereső, a kosár valamint a termékcsoportok gyors és közvetlen elérése. Mindezek alapján a következő prioritási sorrend állítható fel a honlap jelenlegi tartalmai alapján: 1. Keresés 2. Nyelvváltás 3. Belépés (és Regisztráció) 4. Üzletek elérhetősége (lokalizációs térkép) 5. Termékcsoportok 6. Ügyfélszolgálat: Rendelés állapotának lekérése, GYIK, Szolgáltatások, Házhozszállítás 7. Kosár (-> Kedvencek erről később) 8. Akciók, Újdonságok, Hírek 9. Hírlevél Emellett mindig lehetőséget kell biztosítani a látogatónak, hogy Teljes nézetre válthasson.
2
Design, elrendezés Két irányzat jellemző a mobil nézet kialakításánál, az egyik esetben minden tartalom, gomb, funkció egy-egy önálló sorban kap helyet (pld Amazon), a másik esetben a telefon képernyőjétől függően egymás mellé rendezett dobozok formájában, mely esetben a legkisebb képernyőn is nagyjából három elem kerül egy sorba. Kiemelt fontosságú a tervezés esetén ugyanakkor az ujjlenyomat figyelembevétele, melynek mérete nagyjából 44x44 pixel, ennél kisebb terület érintése kényelmetlen, zavaró. Továbbá a tervezésnél a fent már említett letöltési sebesség miatt igen visszafogott, egyszerű design használata javasolt. Képek mérete Tekintettel az iPad retina kijelzőjére a megjeleníteni kívánt képeket és design elemeket, grafikákat kétszeres méretben is elérhetővé kell tenni, hogy a nagy felbontással rendelkező eszközökön ne pixelesedjenek a képi-grafikai elemek. Összevonás/egyszerűsítés A hirdetések, hírek, újdonságok, akciók nem jeleníthetők meg a mobiltelefonon a honlappal megegyező formában, annak méretbeli és letöltési igényei miatt. A tartalmak rövidítése, külön menüpontban való elhelyezése javasolt a már korábban említettek okán. Fejlesztés menete, A/B teszt, visszajelzések A fejlesztés során és azt követően is a felület véglegesítéséhez A/B tesztek használata javasolt, valamint a felhasználók visszajelzéseinek és értékelésének kérése és feldolgozása. A fejlesztést több részre ajánlott bontani, mely fázisokat követően A/B tesztek eredményeinek kiértékelésével és a látogatók szavazásos/kérdőíves szondáztatásával érdemes finomítani a további irányokat. Javasolt fázisok: 1. Fázis • • 2. Fázis • • 3. Fázis • • 4. Fázis • 5. Fázis • 6. Fázis •
Mobilra optimalizált kezdőoldal Kapcsolat, elérhetőség megjelenítése Termékcsoportok, adatlapok Ajánlataink: Szolgáltatások, Akciók, Intelligens ajánlatok Termék összehasonlítás Rendelés állapota Keresés Kosár (plusz szolgáltatás: rendeléshez szükséges lépések küldése e-mailben) Hírek, hírlevél feliratkozás
Operációs rendszerek Az utóbbi egy hónap statisztikái alapján a felhasználók kicsivel több, mint a fele használ Androidos készüléket, ám a legtöbben iPad-ről nézik az oldalt. Ennek magyarázata sokféle Androidos készülékben keresendő. Végeredmény Fentiek segítségével alakítható ki az Extreme Digital honlapjának mobil nézete, mely függetlenül attól, hogy a látogató telefonja milyen típusú, teljesítményű vagy mekkora felbontású, a mobil oldal mindenki számára kezelhető és könnyen áttekinthető felületet biztosít az információszerzéshez, a termék- és rendelésinformációk lekéréséhez, az üzletek elérhetőségének megismeréséhez és a nem utolsó sorban a telefonról történő vásárláshoz is.
3
Ajánlott Kezdőoldali elrendezés
LOGO
Teljes nézet >>
[ SK ] [ CZ ] [ RO ] [ EN ]
AJÁNLATAINK
KEDVENCEK Keresés
BELÉPÉS | REGISZTRÁCIÓ Termékek
Ügyfélszolgálat
Elérhetőségek
Fotó-Videó
Informatika
Szórakoztatás
Háztartás
Mobilkommunikáció
Irodatechnika
Könyv
Játék
Képkidolgozás
HÍREK - Iratkozzon fel hírlevelünkre!
[_] [_]
Lorem ipsum lorem ipsum lorem ipsum lorem ipsum
Lorem ipsum lorem ipsum lorem ipsum lorem ipsum
ÚJDONSÁGOK
[_] [_] [_] Termék adatai 1750 Ft
Termék adatai 1750 Ft
Termék adatai 1750 Ft
rólunk | általános szerződési feltételek | adatvédelem | kapcsolat © 2001-2012 Extreme Digital
4
A termékek és termékcsoportok megjelenítése kétféleképpen lehetséges. Gombok-ikonok segítségével egymás mellé rendezve (A-terv), vagy nagy betűkkel írt, egymástól megfelelő távolságra egymástól listaszerűen (b-terv). A-TERV: TERMÉKCSOPORTOK – egymás mellé rendezve
LOGO
Teljes nézet >>
[ SK ] [ CZ ] [ RO ] [ EN ]
AJÁNLATAINK
KEDVENCEK Keresés
BELÉPÉS | REGISZTRÁCIÓ Termékek
Ügyfélszolgálat
Elérhetőségek
Fő banner #1
Fotó-Videó
Informatika
Szórakoztatás
Háztartás
Mobilkommunikáció
Irodatechnika
Könyv
Játék
Képkidolgozás
rólunk | általános szerződési feltételek | adatvédelem | kapcsolat © 2001-2012 Extreme Digital
5
A-TERV: TERMÉKCSOPORTOK / INFORMATIKA – egymás mellé rendezve
LOGO
Teljes nézet >>
[ SK ] [ CZ ] [ RO ] [ EN ]
AJÁNLATAINK
KEDVENCEK Keresés
BELÉPÉS | REGISZTRÁCIÓ
Termékek
Ügyfélszolgálat
Elérhetőségek
INFORMATIKA
ALAPLAP
BILLENTYŰZET
DIGITALIZÁLÓ ESZKÖZ
EGÉR, POZÍCIONÁLÓ
FESTÉKPATRON, TONER
FLOPPY MEGHAJTÓ
HANGFALAK, AUDIOESZKÖZÖK
HANGKARTYA
HALOZATI ESZKÖZ
HUTO
JÁTEKVEZÉRLŐ
KELLÉKANYAG
KOMPLETT GEP
MEMORIA MODUL
MEREVLEMEZ, MEREVLEMEZ HAZ
MONITOR
NOTEBOOK, NETBOOK
NYOMTATÓ, MULTIFUNKCIOS KESZÜLEK
OPTIKAI MEGHAJTO
PENDRIVE
PORTBOVITES
PROCESSZOR
SZKENNER
SZOFTVER
SZAMITOGEPHAZ
TV TUNER
TAPEGYSEG
VICCES TERMEKEK
VIDEOKARTYA
VEDELMI ESZKÖZ
WEBKAMERA, FIGYELORENDSZE R
rólunk | általános szerződési feltételek | adatvédelem | kapcsolat © 2001-2012 Extreme Digital
6
B-TERV: TERMÉKEK / INFORMATIKA – listába rendezve
LOGO
Teljes nézet >>
[ SK ] [ CZ ] [ RO ] [ EN ]
AJÁNLATAINK
KEDVENCEK Keresés
BELÉPÉS | REGISZTRÁCIÓ Termékek
Ügyfélszolgálat
Elérhetőségek
INFORMATIKA
ALAPLAP >> BILLENTYŰZET >> DIGITALIZÁLÓ ESZKÖZ >> EGER, POZÍCIONALÓ >> FESTEKPATRON, TONER >> FLOPPY MEGHAJTÓ >> HANGFALAK, AUDIOESZKÖZÖK >> HANGKÁRTYA >> HÁLÓZATI ESZKÖZ >> HŰTŐ >> JATEKVEZERLO HÍREK - Iratkozzon fel hírlevelünkre!
[_]
KELLEKANYAG Lorem ipsum lorem ipsum lorem ipsum lorem ipsum
KOMPLETT GEP rólunk | általános szerződési feltételek | adatvédelem | kapcsolat © 2001-2012 Extreme Digital
7
KERESÉS A keresés gombot megnyomva egyből szövegbeíró módra vált a telefon, melyben OK bezárásával indul a keresés. (Azaz nincs külön keresés oldal, ahol csak a keresés mező és a gomb látható.) A találati lista elemei kép nélkül, a termék nevét, árát, elérhetőségét tartalmazzák, a termékek 1 gombnyomással helyezhetők a Kedvencek közé, ahol összehasonlíthatja, későbbi megtekintésre eltárolhatja valamint meg is vásárolhatja a látogató (bővebben lásd később -> „Kedvencek”).
LOGO
Teljes nézet >>
[ SK ] [ CZ ] [ RO ] [ EN ]
AJÁNLATAINK
KEDVENCEK Keresés
BELÉPÉS | REGISZTRÁCIÓ Termékek
Ügyfélszolgálat
Elérhetőségek
KERESETTT KIFEJEZÉS: notebook legnépszerűbb elöl | legolcsóbb elöl | legdrágább elöl |legújabb elöl | név szerint
Találatok száma: 412 Samsung series 9 NP900X3C-A01HU + Windows 7 operációs rendszer Raktáron 369.900 Ft
Toshiba Satellite C855-12Z notebook Raktáron 159.900 Ft
Dell Inspiron N5050-i5 notebook, fekete + Windows 7 operációs rendszer Raktáron 149.900 Ft
Dell Inspiron N5040 notebook Raktáron 109.900 Ft
Sony Vaio SVE1511B1E/W notebook, fehér + Windows 7 operációs rendszer + Office 2010 Otthoni és Diák verzió Raktáron 159.900 Ft
Delock 46307 LED notebook lámpa USB 2.0 Elérhető 1.090 Ft 1 2 3 4 5 | Következő »
rólunk | általános szerződési feltételek | adatvédelem | kapcsolat © 2001-2012 Extreme Digital 8
Kedvencek: Termékadatlap, csoportosítás, összehasonlítás Az összehasonlítás funkció újragondolása, a Send To funkció kiemelése feltétlen szükséges a mobil nézet kialakításakor. Új és felugró ablak nem használható, ezért annak megjelenítése egyazon lapon szükséges. Így ennek külön gomb elhelyezése szerencsés az oldalon belül. A kedvencek menüpont hasonlóan viselkedik, mint a kosár, termékeket helyezhetünk bele, melyeket össze tudunk hasonlítani egymással. Ezért javasolt a kosár, összehasonlítás, kívánságlista összevonása és így a Kedvencek menüpont létrehozása, ahol az egyes termékek közül listából választhatunk, és megmondhatjuk, mit kívánunk vele tenni: megvásárolni, egyenként megnézni vagy összehasonlítani. Az akciók, újdonságok, hírek is „bookmarkolhatók”, így azok is erről az oldalról érhetők el. Összehasonlítás Az összehasonlítás a honlapon látható táblázatos megjelenítés helyett folyó szövegként javasolt:
Apple iPad 2 Wi-Fi 16GB tablet, fekete Apple iPad 2 Wi-Fi 32GB tablet, fekete Samsung Galaxy Player 4.2 tablet, fehér (Android) Samsung P7510 Galaxy Tab 10.1 WiFi 16GB tablet, fekete (Android)
Bruttó ár
118.900 139.900 59.900 129.900 Gyártó Apple Apple Samsung Samsung Processzor típus Apple A5 Apple A5 Hummingbird nVidia Tegra 2 Processzor frekvencia 1 GHz 1 GHz 1 GHz 1 GHz Kijelző mérete 9,7" 9,7" 4,2" 10,1 Kijelző felbontás 1024 x 768 pixel 1024 x 768 pixel 800 x 480 pixel 1280 x 800 pixel Memória 16 GB 32 GB 8GB belső memória 16 GB, 1GB belső memória Memória bővítés nincs nincs nincs nincs Operációs rendszer Apple iOS 4 Apple iOS 4 Android 2.3 Android 3.0 Csatlakozás 3.5mm audio jack, WiFi 3.5mm audio jack, WiFi 3.5mm audio jack, USB, WiFi 3.5mm audio jack, Bluetooth 3.0, WiFi Beépített kamera HD kamera HD kamera 2 megapixeles 3 megapixeles Akkumulátor kapacitás 10 óra 10 óra 1530 mAh 7000 mAh Tartozékok használati utasítás használati utasítás adatkábel, fülhallgató, használati utasítás, hálózati töltő adatkábel, használati utasítás, hálózati töltő, sztereó headset Extrák e-iránytű, hátsó VGA kamera, multi-touch kijelző e-iránytű, hátsó VGA kamera, multi-touch kijelző multi-touch kijelző Flash 10.1 támogatás, GPS, H.264 videólejátszás, HD felbontású kép, e-iránytű, előre telepített alkalmazások, fényérzékelő, gravitációs szenzor, gyorsulásmérő, multi-touch kijelző
9