Analiza interfejsu strony internetowej nevershy. pl
Agnieszka Jakimiec Kinga Pawlik Magdalena Przybycień Justyna Wojtaczka
I. analiza interfejsu strony
badania własne cele strony cechy wizualne dostępne funkcjonalnści budowa strony błędy i niejasności
cele strony
cechy wizualnech
funkcjonalnści
budowa strony
Cele strony: - sprzedaż damskiej bielizny i akcesoriów - reklama sklepu NeverShy.pl - pozyskiwanie nowych klientów - łatwa obsługa strony (nawigacja - budowanie lojalności klientów - wyróżnienie się na tle konkurencji
Grupa docelowa: - ze względu na bogaty asortyment m. in. bieliznę klasyczną, piżamy, szlafroki,
odzież ciążową, bieliznę erotyczną, rajstopy itp. strona adresowana jest do
możliwie największej grupy kobiet, nie wykluczając mężczyzn
- strona adresowana do użytkowników z Polski
błędy i niejasności
cele strony
cechy wizualnech
szata graficzna
funkcjonalnści
kolorystyka
budowa strony
błędy i niejasności
typografia
Strona główna - podział na 4 sektory
Grafika strony: - głównym elementem strony są zdjęcia bielizny - po prawej stronie znajdują się dwa interaktywne przyciski: pierwszy to kontakt, drugi to powrót do początku strony „top” , - w tle znajduje się zdjęcie ratanowego łóżka, - próba zmniejszania wyświetlanej strony nie wpływa na wielkośc grafiki tła, - layout w kolorach bieli, szarościach, granatu i czerwonego, - logo w lewym górnym rogu strony - niezmieny pasek menu ułatwiający wyszukiwanie
1. 2. 3. 4. Podstrona
- podział na 3 sektory, - pole wyboru produktu podzielone na 2 kolumny
produktów
1. 2. Budowa logo sklepu:
logotyp sygnet
3.
cele strony szata graficzna
cechy wizualnech kolorystyka
funkcjonalnści
budowa strony
typografia
Strona główna R:255 G: 255 B: 255 R:68 G: 73 B: 93
R:92 G: 97 B: 126 R:92 G: 97 B: 126
R:227G: 229 B: 226
R:255 G: 255 B: 255
błędy i niejasności
cele strony szata graficzna
cechy wizualnech kolorystyka
funkcjonalnści
budowa strony
typografia
Podstrona:
R:204 G:204 B: 204 R:247G: 4 B: 84
R:151 G;157 B 171
R:92G: 179B: 128
błędy i niejasności
cele strony
cechy wizualnech
szata graficzna
Strona główna
funkcjonalnści
kolorystyka
budowa strony
typografia
Arial fonts family Bree Serif 17 pkt Bree Thin 17 pkt
Arial Normal 13 pkt
Arial Normal 13 pkt Arial Normal 10 pkt
Arial Normal 12 pkt
Arial Normal 13 pkt
Arial Normal 14 pkt
błędy i niejasności
cele strony szata graficzna
Podstrona
cechy wizualnech
funkcjonalnści
kolorystyka
budowa strony
typografia
Arial fonts family
Arial Normal 20 pkt
Arial Normal 24 pkt
Arial Normal 10 pkt
Arial Normal 12 pkt
błędy i niejasności
cele strony
cechy wizualnech
funkcjonalnści
interakcje
procesy
rodzaje
budowa strony
Dostępne funkcjonalności
- wyszukiwarka produktów;
bez logowania się:
- koszyk z wybranymi produktami; - menu z kategoriami produktów; - stopka - informacje i kontakt z firmą;
Funkcjonalności dotyczące
- możliwośc kupna produktów
procesu zakupu (dostępne
- możliwośc zmiany danych osobistych
po zalgowaniu):
- możliwość zmiany danych wysyłkowych - automatyczne odsyłanie do PayU - historia i szczegóły zamówień - zwroty produktów
błędy i niejasności
cele strony
cechy wizualnech
funkcjonalnści
interakcje
procesy
rodzaje
budowa strony
błędy i niejasności
Rodzaje interakcji: Biustonosze Pushup
- klikanie
- przesuwanie suwakiem
- scrollowanie
- rozwijanie po najechaniu
- pomniejszanie po kliknięciu
- powiększenie po najechaniu
- wygaszenie po najechaniu
- wyświetlanie opisu po najechaniu
cele strony
cechy wizualnech
funkcjonalnści
interakcje
procesy
rodzaje
budowa strony
błędy i niejasności
Proces rejestracji:
1.
Kliknięcie w „Zarejestruj się”
2. Uzupełnienie pola „Adres E-mail”
3.
Uzupełnienie danych osobistych
4.
Przeniesienie do zakładki „Moje konto”
Proces zakupu: 1. Wybór produktu
2.
Wybranie rozmiaru, koloru i ilości
3.
Wybór sposobu dostawy oraz adresuwysyłkowego
4. Podsumowanie zamówienia
5.
Potwierdzenie zamówienia
cele strony
cechy wizualnech
strona główna
podstrona
funkcjonalnści linki
budowa strony
błędy i niejasności
architektura informacji
opcje logowania logo firmy główny pasek menu wyboru produktów
wyszukiwarka rejestracja koszyk
zmieniający się baner reklamowy
kontakt trzy boksy informacyjne z produktami polecanymi informacje o firmie, kosztach wysyłki, kontakcie, tabele rozmiarów, regulamin, koszty wysyłki
- element stały na stronie
strzałka odsyłająca na początek strony
informacje o akceptowanych kartach płatniczych
cele strony strona główna
cechy wizualnech podstrona
funkcjonalnści linki
budowa strony
błędy i niejasności
architektura informacji
Strona wyboru produktów
nazwa produktu oraz sortowanie
prezentacja dostępnych produktów uściślenie wyboru produktów
cele strony strona główna
cechy wizualnech podstrona
funkcjonalnści linki
budowa strony
błędy i niejasności
architektura informacji
Strona opisu produktu
opis produktu zdjęcie produktu
pole opcji oraz dodania produktu do koszyka
produkty polecane
produkty polecane
cele strony strona główna
cechy wizualnech podstrona
funkcjonalnści linki
budowa strony
błędy i niejasności
architektura informacji
Strona zakupu produktów
ikony fazy zakupu produkty w koszyku tabela z kwotą do zapłaty wybór formy dostawy
opcja pakowania jako prezent wybór formy płatności
dane kupującego
cele strony
cechy wizualnech
strona główna
Podstrony stopki
pole informacji podstron stopki
podstrona
funkcjonalnści linki
budowa strony architektura informacji
błędy i niejasności
cele strony
cechy wizualnech
strona główna
Podstrony stopki
wybór tabeli rozmiarów według producentów
tabele rozmiarów uniwersalnych
podstrona
funkcjonalnści linki
budowa strony architektura informacji
błędy i niejasności
cele strony strona główna
cechy wizualnech podstrona
funkcjonalnści linki
budowa strony
błędy i niejasności
architektura informacji
Linki wewnętrzne podstrony prezentacji produków logo główny pasek menu
logowanie wyszukiwarka rejestracja koszyk okruszki
zdjęcie produktu
kontakt powrót do góry strony
podstrony stopki
cele strony strona główna
cechy wizualnech podstrona
Link zewnętrzny podstrony kontakt
link do mapy google
funkcjonalnści linki
budowa strony architektura informacji
błędy i niejasności
cele strony strona główna
cechy wizualnech podstrona
funkcjonalnści linki
budowa strony architektura informacji
błędy i niejasności
cele strony
cechy wizualnech
funkcjonalnści
interakcje
procesy
rodzaje
budowa strony
błędy i niejasności
Proces rejestracji:
Kliknięcie w „Zarejestruj się”
Uzupełnienie pola „Adres E-mail”
Uzupełnienie danych osobistych
Przeniesienie do zakładki „Moje konto”
Proces zakupu:
Wybór produktu
Wybranie rozmiaru, koloru i ilości
Wybór sposobu dostawy oraz adresu wysyłkowego
Podsumowanie zamówienia
Potwierdzenie zamówienia
cele strony
cechy wizualnech
funkcjonalnści
- brak mozliwości wyboru kategorii produktów w zakładce Nowości
- brak możliwości doprecyzowania produktów w wynikach wyszukiwania
budowa strony
błędy i niejasności
cele strony
cechy wizualnech
funkcjonalnści
budowa strony
- okienko wyszukiwarki jest umiejscowione w sąsiedztwie opcji logowania i rejestracji - jest mało widoczne
- wyszukiwarka daje możliwość wyszukiwania jedynie modeli produktów wg ich konkretnej nazwy
błędy i niejasności
cele strony
cechy wizualnech
- za duży przeskok (5 zł) w wyszukiwarce cenowej
- brak zakładki Promocje
- brak FAQ
funkcjonalnści
budowa strony
błędy i niejasności
II. analiza interfejsu strony
badania użyteczności cele badawcze przebieg badania analiza wyników wnioski podsumowanie
cele badawcze
przebieg badania
analiza wyników
wnioski
1. Badanie procesu zakupu określonego produktu. 2. Badanie procesu posługiwania się tabelą rozmiarów
(odnalezienie i użytkowanie).
3. Badanie procesu zakupu produktu o wybranych cechach.
podsumowanie
cele badawcze
przebieg badania
analiza wyników
wnioski
podsumowanie
W badaniu wzięło udział 5 osób. Badanie polegało na obserwacji użytkowników podczas wykonywania trzech czynności w badanym sklepie internetowym. Scenariusz badania/polecenia które mieli wykonać badani/: 1. Dodaj do koszyka figi Florence, czarno-niebieskie, rozmiar M. 2. Dodaj do koszyka rajstopy w rozmiarze 3/4, w cenie pomiędzy 12 a 17 złotych. 3. Dodaj do koszyka biustonosz w kolorze czarnym, typ bardotka, dla osoby
o obwodzie w biuście 90 cm, pod biustem 70 cm.
Celem badania było sprawdzenie: - drogi jaką obiera użytkownik w procesie zakupu produktu, - problemów jakie może napotkać w trakcie tej drogi - łatwości poruszania się po stronie. Czas badania jedengo użytkownika nie przekroczył 15 minut. Do zapisania komentarzy badanych oraz obrazu ruchów kursora na ekranie użyto programu rejestrującego „Free Screen To Video”.
cele badawcze BADANIE I
przebieg badania
analiza wyników
wnioski
podsumowanie
Dodaj do koszyka figi Florence, czarno-niebieskie, rozmiar M.
Najkrótszy czas - 0:27 wykonane w 5 krokach. Najdłuższy czas - 0:49, wykonane w 6 krokach. numer kliknięcia kliknięcia następujące po sobie w jednym miejscu
cele badawcze BADANIE I
I.
przebieg badania
analiza wyników
wnioski
podsumowanie
Dodaj do koszyka figi Florence, czarno-niebieskie, rozmiar M.
Badanie miało na celu sprawdzenie, jaką drogę zakupu częściej wybierają użytkownicy, oraz która z nich jest najkrótsza. W wynikach badaniach można wyróżnić dwa sposoby realizacji zadania: 1. wyszukiwanie poprzez wybór odpowiedniej kategorii Wybrała go jedna osoba, która dokonała zakupu, w 5 krokach, w najkrótszym czasie (0,27s) 2. wyszukiwanie za pomocą wyszukiwarki Większość badanych, aby znaleźć konkretny produkt skorzystała z opcji wyszukiwarki. Wybrało ją 4 badanych. Najdłuższy zakupu produktu w ten sposób wynosił 0,49s. Na dłuższy czas wyszukiwania tym sposobem może mieć wpływ sposób działania samej wyszukiwarki - podpowiada ona nazwy konkretnch produktów, rodziny produktów.
cele badawcze
BADANIE II
przebieg badania
analiza wyników
wnioski
podsumowanie
Dodaj do koszyka rajstopy w rozmiarze 3/4, w cenie pomiędzy 12 a 17 złotych.
Najkrótszy czas - 1:19, wykonane w 7 krokach. Najdłuższy czas - 2:44, wykonane w 10 krokach. numer kliknięcia kliknięcia następujące po sobie w jednym miejscu
cele badawcze
BADANIE II
II.
przebieg badania
analiza wyników
wnioski
podsumowanie
Dodaj do koszyka rajstopy w rozmiarze 3/4, w cenie pomiędzy 12 a 17 złotych.
Badanie miało na celu sprawdzenie funkcjonowania opcji kategoryzacji produktu (wybór koloru i wykorzystanie suwaka zakresu cen). Badanie wykazało, że wszyscy badani mieli kopot ze zrozumieniem nazewnictwa rozmiaru - nie byli pewni co oznacza „3/4”.O trudności może świadczyc fakt, że trzy osoby dodały do koszyka przypadkowy rozmiar rajstop, pomijając wybór rozmiaru. 4 osoby korzystała z kategoryzacji produktów po lewej stronie okna. Najkrótszy czas wynosił 1:19s. Jedna osoba pominęła ten etap - wykorzystał opcję wyszukiwarki. Osoba ta miała najdłuższy czas rzystała z opcji wyszukiwarki 4 krotnie.
wykonania zadania 2:44s. Sko-
analiza wyników
wnioski
cele badawcze
przebieg badania
BADANIE III
Dodaj do koszyka biustonosz w kolorze czarnym, typ bardotka, dla osoby o obwodzie w biuście 90 cm, pod biustem 70 cm.
podsumowanie
Najkrótszy czas - 1:08, wykonane w 6 krokach. Najdłuższy czas - 3:53, wykonane w 13 krokach. numer kliknięcia kliknięcia następujące po sobie w jednym miejscu
analiza wyników
wnioski
cele badawcze
przebieg badania
BADANIE III
Dodaj do koszyka biustonosz w kolorze czarnym, typ bardotka, dla osoby o obwodzie w biuście 90 cm, pod biustem 70 cm.
III.
Badanie miało na celu sprawdzenie funkcjonalności tabeli rozmiarów. Wszyscy badani prawidłowo okreslili i wyborali rozmiar pod biustem, ponieważ tę czynność ułatwia rozwijany pasek na karcie produktu oraz suwak w kategoryzacji po lewej stronie. Największy probelm wszystkim badanym (tj. 5 osób) sprawiło określenie miseczki biustonosza, czyli rozmiaru w biuście. Najwięcej czasu tracili badani na poszukiwaniu tabeli rozmiarów, mimo iż wewnętrzym link znajdowal się w opisie produktu. Być może jest to spowodowane tym, że jest on mało widoczny. Sama tabela również okazała się trudna w zrozumieniu (obwód 90 cm pasuje zarówno do miseczki D i E). Jedna osoba (badany nr 3) nie skończyła badania, nie udało się jej przełożyć 90 cm w obwodzie w biuście na rozmiar miseczki. Jedynie 2 osobom udało się skożystać z tabeli rozmiarów. 2 badanych przypadkowo wybrało poprawny rozmiar produktu, pomijając korzystanie z tabeli. W śród nich była osoba z najkrótszym czasem 1:08s.
podsumowanie
cele badawcze
przebieg badania
analiza wyników
wnioski
podsumowanie
Najszybciej badani wykonywali zadaie 1. Średni czas badania wynosił 48,8s. Osoba z najkrótszym czasem dokonała zakupu w ciągu 0,27s.
Najdłużej badani wykonywali zadanie 3 średni czas w tym badaniu wynosił 106 s, był on krótszy od średniego czasu badania 2 (109,4 s.). Jednak w badaniu 3 jedna osoba nie wykonała zadania i nie dodała produktu do koszyka.
2 badanych nie wykonało poprawnie zadania pierwszego. Przed dodaniem do koszyka nie wybrali poprawnego rozmiaru. 1 badany nie potrafił znaleźć odpowiedniego rozmiaru i pozostawili zadanie trzecie nieukończone.
cele badawcze
przebieg badania
analiza wyników
wnioski
podsumowanie
Z badań wynika, że wyszukanie produktu nie stan0wi problemu. Dopiero dobieranie rozmiaru utrudnia dokonanie zamówienia - probleme stanowi rozwijane pole z wymiarami, oraz brak wyraźnego zaznaczenia odnośnika do tabelii rozmiarów. Dużo czasu badani tracili używając wyszukiwarki. Po wpisaniu ogólnej frazy np.: figi, pojawiała się lista, jednak nie można było zawęzić wyszukiwania. Szukając przez wyszukiwarkę nie można filtrować wyników - trzeba wybrać jeden konkretny. Ostatnim zauważonym problemem jest trudne do zrozumienia oznaczenie, produktów wielokolorowych- w wyszukiwarce pod granatowym kwadracikiem, znajdują się produkty w kolorze czarno-niebieskim.
cele badawcze
przebieg badania
analiza wyników
wnioski
podsumowanie
Wybór sprecyzowanego produktu nie stanowi problemu. Dopiero uszczegółowienie jego cech może utrudniać dokonanie zakupu. Jeśli badany nie zna rozmiaru, może mieć trudność z jego doborem. W większości przypadków czas spędzony na dodanie do koszyka konkretnego produktu nie przekroczył 4 minut. Badani mieli kłopot z działaniem wyszukiwarki. Szukając przez wyszukiwarkę nie można filtrować wyników - trzeba wybrać jeden konkretny. Po skorzystaniu z tej opcji nie można było zawęzić wyszukiwania paskami zakresu ceny czy rozmiaru. Problemem okazała sie również trudne do zrozumienia oznaczenie w tabeli kategoryzacji produktów wielokolorowych- pod kwadracikiem o kolorze granatowym, znajdują się produkty w kolorze czarno-niebieskim.
cele badawcze
przebieg badania
analiza wyników
wnioski
podsumowanie
Strona funkcjonuje prawidłowo, jednak posiada błędy następującego rodzaju: - brak kategoryzacji produktów w zakładce Nowości - brak kategoryzacji produktów w wynikach wyszukiwania - zakres cen - minimalny przeskok o 5 zł - brak zakładki Promocji - brak FAQ - umiejscowienie i widoczność tabeli rozmiarów - doprecyzowanie wyboru koloru tak aby był on jednoznaczny( granatowy kolor–kwadracika nie oznaczał czarno-niebeskiej bielizny) - należy usunąć problem z pojawiającym się i znikającym odnośnikiem do facebooka
Koniec