Porównanie funkcjonowania dwóch portali internetowych Mateusz Wrzosek Wzornictwo, rok 2, semestr III prow. prof. ASP W. Gdowicz, asys. mgr Marta Więckowska Zakład Badań Wizualnych i Interakcji ASP Katowice 2011/2012
część 1 - porównawcza analiza własna
- cele stron - strona główna
-
podział strony na główne elementy podział na rodzaj elementów strony podział na rodzaj linków na stronie kolorystyka strony i tekstów obszar obejmowania strony przez ekran
- mapy stron - draftest - opinia własna
część 2 - badanie z użytkownikami - opis badania
-
komenda a strony O.pl komenda b strony O.pl komenda c strony O.pl zestawienie wyników strony O.pl średnia czasów dla strony O.pl komenda a strony purpose.pl komenda b strony purpose.pl komenda c strony purpose.pl zestawienie wyników strony purpose.pl średnia czasów dla strony purpose.pl zestawienie wyników dla obu stron średnia czasów dla strony purpose.pl
- opinie badanych
- wnioski
część 3 - porównanie analizy własnej z badaniem użyteczności - porównanie menu
cele stron
strona główna
część 1 - porównawcza analiza własna
cele strony O.pl:
cele strony Purpose:
- udostępnianie informacji o wydarzeniach kulturalnych na terenie kraju - aktywnościach kulturalnych lub aktualnościach w tymże świecie w wielu kategoriach - strona bazuje na strukturze newsów - informowanie o odbywających się konkursach - możliwość zamówienia magazynu “O” - możliwość zamówienia newsletteru - strona przydziela własną Nagrodę - reklamy dotyczą także świata kulturalnego
- udostępnianie informacji o wydarzeniach kulturalnych na terenie kraju - aktywnościach kulturalnych lub aktualnościach w tymże świecie w wielu kategoriach - strona bazuje na strukturze elektronicznego magazynu - możliwość zamówienia magazynu “Purpose” - możliwość zamówienia newsletteru - strona posiada osobny dział z wyrobami brandu p+eco - reklamy nie zawsze dotyczą świata kulturalnego, są także zwykłe komercjale
menu
cele stron
strona główna
mapy stron
część 1 - porównawcza analiza własna 16 elementów
13 elementów menu tytułowe
logo
logo
wyszukiwanie wyszukiwarka
menu główne
menu główne
wyszukiwanie wyszukiwarka
podmenu
podmenu artykuł główny artykuł główny
konkursy
reklama aktualności
reklamy
reklama
magazyn informacje
informacje
newsy
informacje
newsletter
newsy
opinie
menu w stopce menu w stopce na stronie o.pl obszar przeznaczony na aktualności, artykuły i główne wydarzenia, zajmuje dużo mniej miejsca niż to jest na purpose.pl, a także na purpose układ elementów jest klarowny
cele stron
strona główna
podział strony na główne elementy
podział na rodzaj elementów strony
grafika, kolorystyka i teksty stron
część 1 - porównawcza analiza własna elementy statyczne
elementy dynamiczne
na obu dwóch stron rozkład i układ elementów statycznych i dynamicznych jest podobny, lecz na o.pl elementów jest znacznie więcej
strona główna
podział strony na główne elementy
podział na rodzaj elementów strony
grafika, kolorystyka i teksty stron
obszar obejmowania strony przez ekran
część 1 - porównawcza analiza własna linki wewnętrzne
linki zewnętrzne
strona o.pl posiada więcej linków zewnętrznych i miejsc gdzie można opuścić stronę, natomiast purpose.pl posiada tylko jedno zawsze to samo miejsce na reklamy czyli linki zewnętrzne
strona główna
podział strony na główne elementy
podział na rodzaj linków na stronie
grafika, kolorystyka i teksty stron
obszar obejmowania strony przez ekran
część 1 - porównawcza analiza własna kolorystyka strony i tekstów logo
logo
kolorystyka
kolorystyka
tło
napisy
tło
B B B B B B B B B B
podział strony na główne elementy
podział na rodzaj elementów strony
napisy
B B B B B
kolorystyka strony i tekstów
obszar obejmowania strony przez ekran
mapy stron
część 1 - porównawcza analiza własna ułożenie i wyśrodkowanie stron względem ekranu
5,6 długości ekranu układ pionowy
1,33 długości ekranu układ poziomy
wielkość ekranu o przekątnej 16:9
porównaie długości stron, mierzone w długościach ekranu dłuższa strona przekłada się na dłuższe jej przewijanie, a tym samym negatywnie wpływa na jej użytkowanie jak widać strona o.pl jest kilkukrotnie dłuższa od purpose.pl dodatkowo strona o.pl jest lokalizowana na lewą stronę ekranu z rozpraszającą uwage grafiką po prawej, kiedy purpose.pl jest wycentrowana na środku ekranu podział na rodzaj elementów strony
grafika, kolorystyka i teksty stron
obszar obejmowania strony przez ekran
mapy stron
uwagi
część 1 - porównawcza analiza własna
Home
News
Wydarzenia
Magazyn
Nagroda O
Cytaty
Kartki
Info
Magazyn
Archiwum
Wydarzenia
Kultura
Nauka
Przedsięb.
Wywiad
News -> Archiwum
Home
Start
Start
Katalog
Start
Wstep
Architektura
Technologia
Oferty pracy
Architektura
Artykul
O Nagrodzie O
Najnowsze
Top Kartki
Partnerzy
Wywiad
Wzornictwo
Badania i rozwoj
Profile
Design
Myslnik
Kontakt
Kategorie
Nowosci
Reklama
Prezentacja
Sztuka
Edukacja
Przetargi
Film
Opinie
FotoWall
Pomoc
Kontakt
Analiza
Moda
Fotografia
Renzje
Lista autorów
Literatura
Rozmowy
Impressum
Kariera
Muzyka
Przemysl kultury
Film i teatr
Muzyka
Mloda kultura
Turystyka
Nowe Media
Warsztaty Felieton
Taniec
Margines
Peco
Wideo
Prawo
Polityka pryw.
Sztuka
Pleasure
Teatr Konferencje Historia Kids Nagłówek O Purpose
Stopka Copyright
Praca
Polityka pryw.
XHTYML 1.1
Kontakt
CSS
Reklama
Created by...
Kontakt
Partnerzy
RSS
Newsletter
Rejestracja
Logowanie
Powered by...
graficzne przedstawienie map stron, stworzone by zaprezentować ilość zakładek występujących po rozklikaniu danej zakładki menu głównego
cele stron
Reklama
strona główna
menu główne zakładki po rozwinięciu menu
mapy stron
draftest
uwagi
English
część 1 - porównawcza analiza własna
opis badania
średnie z poszczególnych kategorii Draftestu: O.pl
- test oceny wizualnej części strony - przeprowadzany na grupie 10 osób - każda z osób dokonuje oceny walorów strony www w skali od 1 do 5, w sześciu kategoriach - przedmiotem testu była strona “home” - badanie wykonywane za pomocą programu online na stronie www.draftest.com
4,09
kategorie ocenianie według Draftestu:
-
pierwsze wrażenie kolory widoczność loga innowacyjność struktura informacji użyteczność
purpose pierwsze wrażenie
3,9
3,7
kolory
3,2
3,8
widoczność loga
3,86
3,21
innowacyjność
3,1
3,55
struktura informacji
3,7
3,27
użyteczność
3,99
wyniki
O.pl stwarza lepsze pierwsze wrażenie oraz kusi kolorami natomiat purpose.pl zdobyło lepszą ocene ze względu na użyteczność strony
strona główna
mapy stron
draftest
opinia własna
badania
część 1 - porównawcza analiza własna łatwość i płynność nawigacji - wiele odnośników do podstron - wstępny natłok informacji kompletnie dezorientuje - bardzo długa strona co przekłada się na ciągłe przewijanie
- klarowność układu i przemyślana kategoryzacja działa dodatnio na szybkość trafienia w szukane miejsce na temat danej kategorii
czytelność układu strony - pierwsze wrażenie chaosu panującego na stronie - całość dzieli sie w odrębne ciągi dotyczące różnych zagadnień - przesunięcie strony do lewej krawędzi ekranu
- strona wyśrodkowana na ekranie, - proste środki graficzne sprzyjają czytelności układu, - strona przejrzyście podzielona na obszary tematyczne
kategoryzacja treści - szczegółowa, logiczna - czasem odnośniki nie pokrywają się z treścią wyświetlaną po kliknięciu weń
- szczegółowa, logiczna - odnośniki pokrywają się treściowo z ich nazwą - kilka niezrozumiałych odnośników dla laika
zrozumiałość treści dla użytkownika - treść zrozumiała, bogata w informacje, przyjemna w czytaniu
- świetnie skategoryzowane odnośniki - wydaje się czasem że informacja nie jest w pełni kompetentna
sposób prezentacji odnośników i informacji - obraz dotyczący artykułu podpisany krótkim zdaniem na temat oraz tekst dotyczący artykułu - wyróżnienie tematu artykuły kolorem - gęsto od informacji
- artykuł wspierany obrazem, lecz nie podpisanym - temat w nagłówku artykułu - bez wyróźnienia kolorystycznego, za to z dużym kontrastem między treścią i osobnymi artykułami
estetyka grafiki - żywe lecz nie rzucające się kolory menu - pstrokate, rozpraszające elementy graficzne - tekst oraz obrazy artukułów przedstawiane na białym tle
mapy stron
draftest
opinia własna
- ascetyczna monochromatyczna kolorystyka - czystość, biel - czarne subtelne napisy w menu jak i artykułach
badania
oceny
część 2 - badanie z użytkownikami
opis badania
zaobserwowanie reakcji użytkownika podczas poruszania się na stronie każda z osób ma do wykonania na stronie trzy polecenia rejestrowana oraz badana jest droga użytkowników do celu, ilość błędnych wyników oraz powrotów na strone główną w tym badaniu analizowany jest stopień zrozumienia, intuicyjności oraz kategoryzacji treści strony sesja nagrywana jest za pomocą programu CamStudio test przeprowadzany jest na 3 osobach
komendy dla użytkowników dla strony O.pl
a b c
odnajdź i zamów newsletter na stronie znajdź informacje na temat American Film Festival znajdź artykuł Bunkry. Mistyczne, barbarzyńskie, znudzone
komendy dla użytkowników dla strony Purpose
a b c
odnajdź i zamów newsletter na stronie znajdź wydanie magazynu z czerwca 2010 dowiedz się o produkcie Zegar kuchenny “Magnetic”
draftest
opinia własna
opis badania
komenda a strony O.pl
komenda b strony O.pl
część 2 - badanie z użytkownikami komenda a - odnajdź newsletter na stronie użytkownik 1 0:13 cel
poziomy strony 1 2
strona główna
3
użytkownik 2
poziomy strony 1
0:09
0:17
news
cel
strona główna
2 3
użytkownik 3
poziomy strony 1 2
0:16
0:28
0:39
magazyn
home
cel
strona główna
3
linie oznaczają uproszczony ślad kursora
opinia własna
badania
kierunek krzywej zależy od wgłębiania sie w strukture strony kierunek w góre oznacza powrót
komenda a strony O.pl
komenda b strony O.pl
komenda c strony O.pl
część 2 - badanie z użytkownikami komenda b - znajdź informacje na temat American Film Festival użytkownik 1 0:04 0:07 wydarzenia
poziomy strony 1 2
film
0:18 cel
strona główna
3
użytkownik 2
poziomy strony 1
0:10
0:28
wydarzenia
szukaj
0:39 0:45 enter
cel
strona główna
2 3
użytkownik 3
poziomy strony 1 2
0:06
0:23
0:31
0:43
news
wydarzenia
film
cel
strona główna
3
linie oznaczają uproszczony ślad kursora
badania
komenda a strony O.pl
kierunek krzywej zależy od wgłębiania sie w strukture strony kierunek w góre oznacza powrót
komenda b strony O.pl
komenda c strony O.pl
zestawienie wyników strony O.pl
część 2 - badanie z użytkownikami komenda c - znajdź artykuł Bunkry. Mistyczne, barbarzyńskie (...) użytkownik 1 0:05 0:08 magazyn artykuł
poziomy strony 1 2
0:19
0:28
0:38 0:42 0:47 0:50 0:55 1:02
kolejna strona
kolejna strona
szukaj enter strona szukaj enter główna
cel
strona główna
3
użytkownik 2 0:08 fotografia
poziomy strony 1
0:20 0:26 0:29 0:36 kolejna szukaj enter strona
cel
strona główna
2 3
użytkownik 3
poziomy strony 1 2
0:02
0:06 0:11 0:17
0:34
szukaj
enter magazyn artykuł
news
0:49 0:55 fotografia
cel
strona główna
3
linie oznaczają uproszczony ślad kursora
komenda a strony O.pl
komenda b strony O.pl
kierunek krzywej zależy od wgłębiania sie w strukture strony kierunek w góre oznacza powrót
komenda c strony O.pl
zestawienie wyników strony O.pl
średnia czasów dla strony O.pl
część 2 - badanie z użytkownikami komenda a
komenda b
komenda c
linie oznaczają uproszczony ślad kursora, a koła ukazują cel wyznaczony dla danej komendy
użytkownik 1
wyraźnie widać iż trzecia komenda dotycząca odnalezienia konkretnego artykułu była najbardziej problematyczna dla badanych, co widać po zawiłych śladach kursora biegnących po mapi, problemem była niedokładna wyszukiwarka wbudowana w stronę
użytkownik 2 użytkownik 3 komenda b strony O.pl
komenda c strony O.pl
zestawienie wyników strony O.pl
średnia czasów dla strony O.pl
komendy dla użytkowników strony Purpose
część 2 - badanie z użytkownikami średnia wszystkich użytkowników komenda a
0:23
0:39
0:13
po lewej wykresy przedstawiają osobno czas poszczególnych użytkowników jaki poświęcili by wykonać polecenie po prawej średnie czasów wszystkich użytkowników dla danej komendy
0:17
komenda b 0:45
0:43
komenda a - została wykonana w miarę szybko i łatwo
0:18
komenda b - umiarkowanie trudna
komenda c 1:02 0:55
komenda c - wykonanie tego polecenia nie należało do łatwych
0:51
0:36
użytkownik 1 komenda c strony O.pl
0:35
ze względu na czas:
użytkownik 2
użytkownik 3
zestawienie wyników strony O.pl
czasy podawane są w sekundach
średnia czasów dla strony O.pl
komendy dla użytkowników strony Purpose
komenda a strony purpose.pl
część 2 - badanie z użytkownikami komenda a - odnajdź newsletter na stronie użytkownik 1 0:09 cel
poziomy strony 1 2
strona główna
3
użytkownik 2 0:04 0:10 magazyn
poziomy strony 1 2
cel
strona główna
3
linie oznaczają uproszczony ślad kursora
użytkownik 3 0:05 cel
poziomy strony 1 2
strona główna
3
kierunek krzywej zależy od wgłębiania sie w strukture strony kierunek w góre oznacza powrót
zestawienie wyników strony O.pl
średnia czasów dla strony O.pl
komenda a strony purpose.pl
komenda b strony purpose.pl
komenda c strony purpose.pl
część 2 - badanie z użytkownikami komenda b - znajdź wydanie magazynu z czerwca 2010 uzytkownik 1
poziomy strony 1 2
0:06 0:12
0:27
magazyn archiwum
cel
strona główna
3
użytkownik 2 0:10 0:15 0:19 0:27 archiwum szukaj enter
poziomy strony 1 2
brak wyników
0:33 archiwum
0:48 cel
strona główna
3
linie oznaczają uproszczony ślad kursora
użytkownik 3
poziomy strony 1 2
0:08
0:20
archiwum
cel
strona główna
3
kierunek krzywej zależy od wgłębiania sie w strukture strony kierunek w góre oznacza powrót
średnia czasów dla strony O.pl
komenda a strony purpose.pl
komenda b strony purpose.pl
komenda c strony purpose.pl
zestawienie wyników strony Purpose
część 2 - badanie z użytkownikami komenda c - dowiedz się o produkcie Zegar kuchenny “Magnetic” użyrkownik 1 0:12 0:18 wyszukiwanie
poziomy strony 1 2
0:27
enter
cel
strona główna
3
użyrkownik 2
poziomy strony 1 2
0:14 0:18
0:40 0:45 0:49
nauka
szukaj enter
technologia
cel
strona główna
3
linie oznaczają uproszczony ślad kursora
użyrkownik 3 0:03 0:07 0:18 szukaj enter
poziomy strony 1 2
cel
strona główna
3
kierunek krzywej zależy od wgłębiania sie w strukture strony kierunek w góre oznacza powrót
komenda a strony purpose.pl
komenda b strony purpose.pl
komenda c strony purpose.pl
zestawienie wyników strony Purpose
średnia czasów dla strony Purpose
część 2 - badanie z użytkownikami
komenda a
komenda b
komenda c
linie oznaczają uproszczony ślad kursora, a koła ukazują cel wyznaczony dla danej komendy
użytkownik 1
w tym wypadku komenda b dotycząca znalezienia konkretnego wydania magazynu z czerwca 2010 roku przysporzyła najwięcej kłopotów
użytkownik 2 użytkownik 3 komenda b strony purpose.pl
komenda c strony purpose.pl
zestawienie wyników strony Purpose
średnia czasów dla strony Purpose
zestawienie wyników dla obu stron
część 2 - badanie z użytkownikami średnia wszystkich użytkowników komenda a
0:09
komenda b
0:10
0:05
0:48
po lewej wykresy przedstawiają osobno czas poszczególnych użytkowników jaki poświęcili by wykonać polecenie po prawej średnie czasów wszystkich użytkowników dla danej komendy ze względu na czas:
0:27
komenda a - bardzo szybko 0:20
komenda b - umiarkowanie trudna
0:08 0:32
komenda c - umiarkowanie trudna
komenda c
0:49
0:31
0:27 0:18
użytkownik 1 użytkownik nr 3 strony Purpose
użytkownik 2
użytkownik 3
zestawienie wyników strony Purpose
czasy podawane są w sekundach
średnia czasów dla strony Purpose
zestawienie wyników dla obu stron
średnia czasów dla obu stron
część 2 - badanie z użytkownikami komenda a
użytkownik 1 użytkownik 2 użytkownik 3 zestawienie wyników strony Purpose
komenda b
komenda c
zamierzony stopień trudności wzrastał z każdym kolejnym poleceniem we wszystkich wypadkach jest zauważalne że strona O.pl wymaga dużo dłuższego, czasochłonnego przewijania strony i odnaleźć dany wynik większosć komend dla purpose.pl ograniczało się w polu górnym polu strony średnia czasów dla strony Purpose
zestawienie wyników dla obu stron
średnia czasów dla obu stron
wnioski
część 2 - badanie z użytkownikami komenda a
0:23
komenda a - dotycząca odnalezienia newslettera została wykonana błyskawicznie na stronie purpose. pl, kiedy na O.pl opcja ta była ledwo zauważalna mimo powtarzania się elementu newslettera na każdej stronie
0:08
komenda b
0:35
komenda b - której celem było odnalezienie informacji dotyczących dla wydarzenia lub magazynu, w obu przypadkach rozwiązane w podobnym czasie
0:32
komenda c
0:51
komenda c - odnalezienie dokładnie sprecyzowanego zagadnienia, strona O.pl okazała się być bardziej wyzywającą w porównaniu do drugiej
średnie czasy wykonywania poleceń dla O.pl
średnia czasów dla strony Purpose
zestawienie wyników dla obu stron
0:31
średnie czasy wykonywania poleceń dla purpose.pl
średnia czasów dla obu stron
opinia badanych
wnioski
część 2 - badanie z użytkownikami łatwość i płynność nawigacji - bogatość odnośników - ciągłe przewijanie strony, okazało sie nie być na tyle irytujące
- klarowność układu i przemyślana kategoryzacja działa dodatnio na szybkość trafienia w szukane miejsce na temat danej kategorii
czytelność układu strony - pierwsze wrażenie chaosu panującego na stronie - problemy z odczytaniem treści - przesunięcie strony do lewej krawędzi ekranu
- strona wyśrodkowana na ekranie, - proste środki graficzne sprzyjają czytelności układu, - strona przejrzyście podzielona na obszary tematyczne
kategoryzacja treści - zbyt rozbudowana - nie pokrywające się, mylne odnośniki
- odnośniki pokrywają się treściowo z ich nazwą - lecz mylą użytkownika - kilka niezrozumiałych odnośników dla laika
zrozumiałość treści dla użytkownika - treść zrozumiała, bogata w informacje, przyjemna w czytaniu
- świetnie skategoryzowane odnośniki - wydaje się czasem że informacja nie jest w pełni kompetentna
sposób prezentacji odnośników i informacji - obraz dotyczący artykułu podpisany krótkim zdaniem na temat oraz tekst dotyczący artykułu - duża ilość informacji na stronie głównej jako zaleta
- artykuł wspierany obrazem, lecz nie podpisanym - temat w nagłówku artykułu - bez wyróźnienia kolorystycznego, za to z dużym kontrastem między treścią i osobnymi artykułami
estetyka grafiki - pierwsze wrażenie - zbyt wiele dzieje się na ekranie - pstrokate, rozpraszające elementy graficzne - tekst oraz obrazy artukułów przedstawiane na białym tle średnia czasów dla strony Purpose
zestawienie wyników dla obu stron
- ascetyczna monochromatyczna kolorystyka - czystość, biel - czarne subtelne napisy w menu jak i artykułach
opinia badanych porównanie
wnioski
część 3 - porównanie analizy własnej z badaniem użyteczności analiza własna
opinie badanych
analiza własna
opinie badanych
łatwość i płynność nawigacji
czytelność układu strony
kategoryzacja treści
zrozumiałość treści dla użytkownika
sposób prezentacji odnośników i informacji
estetyka grafiki
porównanie przedstawia średnie opiń własnych oraz użytkowników strona purpose.pl cechuje się łatwiejszą nawigacją i większą przejrzystością, natomiast o.pl posiada więcej informacji zestawienie wyników dla obu stron
opinia badanych porównanie
wnioski
część 3 - porównanie analizy własnej z badaniem użyteczności
wnioski dla strony O.pl:
wnioski dla strony Purpose:
- tracony czas na przewijaniu, przekłada się na długi czas poszukiwań
- opcja wyszukaj działa tylko na wybraną główną zakładkę, tak więc nie znajdzie się informacji na temat danej rzeczy w nieodpowiedniej zakładce głównej, np inf. na temat magazynu nie wyszukają się w zakładce o Nagrodzie ‘O’
- bardzo sprawna wyszukiwarka wbudowana w stronę,
- wygodna archiwizacja treści i ich sposób przedstawiania, nie wymaga ciągłego przewijania
- strona za to nie zawiera tylu infomracji co porównywana,
- duża kategoryzacja wpływa pozytywnie na łatwość szukania, ale nie niweluje problemu przewijania ze względu na ogromną ilość treści jaką przedstawia opisywana strona
ogółem: - czasochłonne przewijanie strony,
- zbyt skumulowane przedstawianie treści, - więcej informacji
opinia badanych porównanie
ogółem:
wnioski
- łatwość nawigacji, - łatwe wyodrębnianie poszczególnych treści, - mniej informacji