Analiza wyglądu stron internetowychPolsko-Japońskiej Akademii Technik Komputerowych

edu.pjwstk.edu.pldziekanat.pjwstk.edu.plplanzajec.pjwstk.edu.pl

Agata Juszkiewicz, Anastasia Buialo, Wojciech Płudowski, projektowanie graficzne, dr Justyna Kucharczyk,ścieżka anglojęzyczna, 2 rok, 2016, Sztuka Nowych Mediów, Polsko–Japońska Akademia Technik Komputerowych

2

Oceniane elementy

pasek tytułowy

system logowania do stron

menu główne

plan zajęć

Wstęp

Kryteria oceniania

kompozycja

typografia

kolorystyka

funkcjonalność

ikony i elementy graficzne

dziekanat.pjwstk.edu.pl

Strony główne

15 849,4% 50,6%

Procent ankietowanych Liczba wskazanych cech

Strona główna web dziekanatu po zalogowaniupokazuje nam pusty ekran z przywitaniem i menu umieszczonym po lewej stronie.

2

Oceniane elementy

pasek tytułowy

system logowania do stron

menu główne

plan zajęć

Wstęp

Kryteria oceniania

kompozycja

typografia

kolorystyka

funkcjonalność

ikony i elementy graficzne

dziekanat.pjwstk.edu.pl

Strony główne

15 849,4% 50,6%

Procent ankietowanych Liczba wskazanych cech

Strona główna web dziekanatu po zalogowaniupokazuje nam pusty ekran z przywitaniem i menu umieszczonym po lewej stronie.

edux.pjwstk.edu.pl

Strony główne

15 849,4% 50,6%

Procent ankietowanych Liczba wskazanych cech

Strona główna Edux jest stroną pokazującą zakładkę menu z obecnie obwiązującymi kursami i menuułożonym horyzontalnie wzdłóż strony.

planzajec.pjwstk.edu.pl

Strony główna

15 849,4% 50,6%

Procent ankietowanych Liczba wskazanych cech

Strona główna planu zajęć zawiera dużą ilość informacji pod niepasującym kolorystycznie do layoutu strony paskiem informacyjnym o współfinansowaniu projektu „Kaizen”

Ankiety

Wzór przeprowadzonej ankiety

Ankieta, dotycząca strony internetowej Polsko-Japońskiej Akademii Techink Komputerowych.

Płeć: ☐ K ☐M

Użytkownik: ☐ Wykładowca

☐ Uczeń Kierunek studiów: ☐ Informatyka ☐ Sztuka Nowych Mediów ☐ Zarządzanie informacją ☐ Kultura Japonii

Który rok studiów? … rok

1. Jak często korystasz ze strony www.pja.edu.pl? … raz(y) na : ☐ Dzień ☐ Tydzień ☐ Miesiąc ☐ Semestr ☐ Rok ☐ Nigdy Dlaczego?………………………………………………………………………

2. Z jakich funkcji korzystasz? – – – – –

Podkreśl dwie, których używasz najczęściej.

3. Czy brakuje Ci jakiejś funkcji na stronie? ☐ Nie ☐ Tak Jakiej? …………………………………………………………………………

4. Podaj nawiększą zaletę i wadę funkcjonalności strony. Zaleta: …………………………………………………………………………………………… Wada: ……………………………………………………………………………………………

nowoczesna

czyte lna

przyjemna

lekka

zachęcająca

ciekawa

przestarzała

nieczytelna

męcząca

przeładowana

odrzucająca

nużąca

3 2 1 0 1 2 3

0

0

0

0

0

0

ANKIETA

Ankiety

Dane podstawowe ankietowanych

Kierunek i rok studiów:

I

Rok studiów Ilość studentów

II

III

LEGENDA:

Informatyka

SNM

Kultura Japonii

1 osoba

Liczba osób: 54

Płeć:

Kobiety Mężczyźni

Korzystanie ze strony

Wykres przedstawia częśtotliwość korzystania z naszej strony przez ankietowanych.

Ankiety

na dzień

Częstotliwość Ilość studentów

na tydzień

na miesiąc

na semestr

1 raz

2 razy

3 razy

1 osoba

4 razy

5 razy

LEGENDA:

Sporo użytkowników korzysta ze strony raz dzien-nie. Jednak zdecydowana większość używa jej 2-3 razy na tydzień.

Korzystanie ze strony

Wykres przedstawia częśtotliwość korzystania z naszej strony przez ankietowanych.

Ankiety

na dzień

Częstotliwość Ilość studentów

na tydzień

na miesiąc

na semestr

1 raz

2 razy

3 razy

1 osoba

4 razy

5 razy

LEGENDA:

Sporo użytkowników korzysta ze strony raz dzien-nie. Jednak zdecydowana większość używa jej 2-3 razy na tydzień.

Ankiety

Najczęściej używane funkcje

program studiówweb dziekanat

aktualności

aktualności

godz. otwarcia

eduxpoczta

plan zajęć

sklep microsoftuinfo. odnośnie procedur

kontakt

Najwięcej użytkowników porusza się w obrębie trzech funkcji na stronie, odpowiednio: plan zajęć, web dziekanat i poczta. Pozostałe funkcje są bardzo rzadko używane.

Najczęściej wymieniane wady i zalety

Ankiety

Komentarze pozytywne dotyczyły kilku powtarzanych cech. Negatywne poruszały wiele próblemów, z którymi spotykają się użytkownicy strony.

czytelnawygląd

zawartość

instynktowna

plan zajęć

łatwa

kolorystyka

nieintuicyjna

chaoswygląd

nieaktualne

przeładowanie

brak

BSSproblemy kontakt

łogowanie

web dziekanatopłaty

plan zajęć

wydarzenia

grafiki

istnieje

LEGENDA:

Zalety

Wady

Im większa punktacja słowa, tym większa liczba osób wpisała je jako opinia na temat strony.

Ankiety

39.5% 60,5%60% 40%

Procent wypowiedzi mężczyzn Procent wypowiedzi kobiet

Nieinstynkyowna?

Według ankiety obsługiwanie strony jest intuicyjne dla większości mężczyzn. Jednakże dla porównywa-lej większości kobiet strona jest nieinstynktowna.

Jeden z ankietowanych studentów informatyki za-znaczył, że „przydałaby się wydajniejsza wyszukiwar-ka oraz wyróżnienie najistotniejszych funkcji/stron".

Zalety Wady

LEGENDA:

Ankiety

39.5% 60,5%60% 40%

Procent wypowiedzi mężczyzn Procent wypowiedzi kobiet

Nieinstynkyowna?

Według ankiety obsługiwanie strony jest intuicyjne dla większości mężczyzn. Jednakże dla porównywa-lej większości kobiet strona jest nieinstynktowna.

Jeden z ankietowanych studentów informatyki za-znaczył, że „przydałaby się wydajniejsza wyszukiwar-ka oraz wyróżnienie najistotniejszych funkcji/stron".

Zalety Wady

LEGENDA:

Komentarze z otwartych pytań z ankiety

Ilość pozytywnych i negatywnych opinii użytkowni-ków jest zbliżona. Jednakże komentarze pozytywne dotyczyły tylko kilku powtarzanych cech.

Ankiety

Negatywne zaś poruszały wiele próblemów z który-mi spotykają się użytkownicy strony.

15 849,4% 50,6%

Procent ankietowanych Liczba wskazanych cech

Zalety Wady

LEGENDA:

Ankiety

Oceny użytkowników

nowoczesna

czytelna

przyjemna

lekka

zachęcająca

ciekawa

Ankiety

przestarzała

nieczytelna

męcząca

przeładowana

odrzucająca

nużąca

+ –

LEGENDA:

3 2

1

Pozytywne:

0 Neutralne:

3

2 1

Negatywne:

Ankietowani odpowiadali pozytywniej w porówna-niu z wypisywanymi przez nich komentarzami. Strona została uznana przez większość za nowocze-sną, przyjemną i zachęcającą. Warto zwrócić

uwagę, że przy niektórych cechach, pozytywnych odpowiedzi było blisko połowy, a znacząca część była neutralna lub negatywna. Czy taki wynik nam wystarczy?

Ankiety

Oceny użytkowników

nowoczesna

czytelna

przyjemna

lekka

zachęcająca

ciekawa

Ankiety

przestarzała

nieczytelna

męcząca

przeładowana

odrzucająca

nużąca

+ –

LEGENDA:

3 2

1

Pozytywne:

0 Neutralne:

3

2 1

Negatywne:

Ankietowani odpowiadali pozytywniej w porówna-niu z wypisywanymi przez nich komentarzami. Strona została uznana przez większość za nowocze-sną, przyjemną i zachęcającą. Warto zwrócić

uwagę, że przy niektórych cechach, pozytywnych odpowiedzi było blisko połowy, a znacząca część była neutralna lub negatywna. Czy taki wynik nam wystarczy?

Szeroka kolumna

Typografia

15 849,4% 50,6%

Procent ankietowanych Liczba wskazanych cech

Tekst ułożony jest w jednej wielkiej kolumnie rozcią-gniętej na szerokość prawie całej strony, co utrudnia czytanie.

planzajec.pjwstk.edu.pl

W przykładzie pokazanym poniżej w jednej linii tekstu znajduje się przeszło 160 znaków, a ich liczba nie po-winna przekraczać 100.

Szeroka kolumna

Typografia

15 849,4% 50,6%

Procent ankietowanych Liczba wskazanych cech

Tekst ułożony jest w jednej wielkiej kolumnie rozcią-gniętej na szerokość prawie całej strony, co utrudnia czytanie.

planzajec.pjwstk.edu.pl

W przykładzie pokazanym poniżej w jednej linii tekstu znajduje się przeszło 160 znaków, a ich liczba nie po-winna przekraczać 100.

Nieodpowiedni rozmiar fontu

Typografia użyta na stronie ma niską punktację z niedo-pasowaną interlinią.

Typografia

15 849,4% 50,6%

Procent ankietowanych Liczba wskazanych cech

dziekanat.pjwstk.edu.pl

Nieodpowiedni rozmiar fontu

Typografia użyta na stronie ma niską punktację z niedo-pasowaną interlinią.

Typografia

15 849,4% 50,6%

Procent ankietowanych Liczba wskazanych cech

dziekanat.pjwstk.edu.pl

Menu

Boczne menu w web dziekanacie zawiera ikonki,menu planu zajęć ma szare podlewy, górnemenu w Eduxie ma wygląd folderów.

Podobna sytuacja nie robi wrażenia, że wciąż jesteśmy na tej samej stronie.

dziekanat.pjwstk.edu.pl planzajec.pjwstk.edu.pl edu.pjwstk.edu.pl

Graficzne rozwiązanie każdego menu wygląda zupełnie inaczej

Menu

Boczne menu w web dziekanacie zawiera ikonki,menu planu zajęć ma szare podlewy, górnemenu w Eduxie ma wygląd folderów.

Podobna sytuacja nie robi wrażenia, że wciąż jesteśmy na tej samej stronie.

dziekanat.pjwstk.edu.pl planzajec.pjwstk.edu.pl edu.pjwstk.edu.pl

Graficzne rozwiązanie każdego menu wygląda zupełnie inaczejTakie istotne funkcje, jak poczta, plan zajęć,osobiste konto, aktualności są ukryte w linkach. Natomiast plan zajęć i godziny pracy dziekanatu

w Gdańsku i Bytomiu są niepotrzebne w osobistymweb dziekanacie warszawskim studentom. Wiele funkcji się powtarzają w obrębie jednego menu.

W menu są poukrywane istotne funkcje

Ikony mają za dużo detali dla takiej małej skali.Nie ma spójności w kolorach. Wizerunek ikon i treść tytulów też nie są w spójności: co mająwspólnego space invader i BSS, muzeum i konto?

dziekanat.pjwstk.edu.pl

Menu jest zbyt skomplikowane, ikony są niedopasowane Czy konieczne jest tyle przejść?

dziekanat.pjwstk.edu.pl pja.edu.pl/rozklad-roku planzajec.pjwstk.edu.pl

Po zalogowaniu się na web dziekanacie, gdy klikniemy schowaną zakładkę „plan zajęć” zostajemy przeniesieni na stronę rozkładu roku akademickiego. Następnie, po znalezieniu kolejnego linku do planu i

Menu

klinięciu go, zostajemy przekierowani do strony głównej planu zajęć gdzie musimy kliknąć zakładkę „Twój plan zajęć” by ponownie się logować, choć już to robiliśmy.

Ikony mają za dużo detali dla takiej małej skali.Nie ma spójności w kolorach. Wizerunek ikon i treść tytulów też nie są w spójności: co mająwspólnego space invader i BSS, muzeum i konto?

dziekanat.pjwstk.edu.pl

Menu jest zbyt skomplikowane, ikony są niedopasowane Czy konieczne jest tyle przejść?

dziekanat.pjwstk.edu.pl pja.edu.pl/rozklad-roku planzajec.pjwstk.edu.pl

Po zalogowaniu się na web dziekanacie, gdy klikniemy schowaną zakładkę „plan zajęć” zostajemy przeniesieni na stronę rozkładu roku akademickiego. Następnie, po znalezieniu kolejnego linku do planu i

Menu

klinięciu go, zostajemy przekierowani do strony głównej planu zajęć gdzie musimy kliknąć zakładkę „Twój plan zajęć” by ponownie się logować, choć już to robiliśmy.

Nieodpowiednio zaprojektowany

Użycie małych ciemnych liter na ciemnym tle zmniejsza czytelność planu zajęć, brakuje kontrastu.

Plan zajęć

Niekonsekwentna wielkość interlinii i rozmiar okien przedmiotów. Tekst nie powinien być ucięty w poło-wie wyrazu jeśli nie mieści się w oknie.

przeskalowanawysokość interlinii

Nieodpowiednio zaprojektowany

Użycie małych ciemnych liter na ciemnym tle zmniejsza czytelność planu zajęć, brakuje kontrastu.

Plan zajęć

Niekonsekwentna wielkość interlinii i rozmiar okien przedmiotów. Tekst nie powinien być ucięty w poło-wie wyrazu jeśli nie mieści się w oknie.

przeskalowanawysokość interlinii

Rekomendacje

Krój pismaMożna rozważyć zmianę kroju na taki, który zawiera polskie znaki oraz kilka odmian grubości. Przykladowe kroje można znaleźć w Google fonts.

krój Fira Sans

Rekomendacje

Krój pismaMożna rozważyć zmianę kroju na taki, który zawiera polskie znaki oraz kilka odmian grubości. Przykladowe kroje można znaleźć w Google fonts.

krój Fira Sans

Rekomendacje

KompozycjaZaleca się ustalenie gridu i zweryfikowanie hierarchiiinformacji, wyznaczenie wielkości w tytulariach.

KolorystykaZaleca się dobrać kolory w odpowiednym kontraście.

TypografiaZaleca się podnieść punktacje, zadbać o interlinie i tracking.

UżytecznośćZaleca się zwęzić ścieżki do popularnych żródel orazprzeprowadić UX analize strony.