Techniki multimedialne – projektowanie prezentacji multimedialnych

Interfejs użytkownika w systemach 

multimedialnych

Interfejs użytkownika

składa się z części 

systemu, które są widoczne dla użytkownika oraz 

którymi może on manipulować oraz z modeli i 

wrażeń, które tworzą się w umyśle użytkownika 

podczas pracy z tymi częściami systemu.

Aby stworzyć interfejs użytkownika, należy 

najpierw stworzyć 

model użytkownika

.

Model użytkownika powinien umożliwiać 

poprawne wnioskowanie dotyczące przewidywanego 

zachowania systemu.

1

Techniki multimedialne – projektowanie prezentacji multimedialnych

Model użytkownika

2

Techniki multimedialne – projektowanie prezentacji multimedialnych

Etapy projektowania interfejsu

użytkownika:

1.

Poznanie wymagań użytkownika

2.

Dobór rodzajów okien i opracowanie

systemu menu

3.

Opracowanie elementów sterujących

związanych z urządzeniami

4.

Rozplanowanie położenia okien

5.

Dobór kolorów

6.

Utworzenie ikon

7.

Przygotowanie komunikatów i

tłumaczeń

8.

Testowanie

3

Techniki multimedialne – projektowanie prezentacji multimedialnych

Interfejs użytkownika: analiza i projektowanie

Strategia

Projektowanie systemu

Analiza zadań i celów

Kontekst użycia

Określenie koncepcji, metafory itp. , ,..,

Poziom zadania

Projektowanie interfejsu

Określenie klas użytkowników

4

Techniki multimedialne – projektowanie prezentacji multimedialnych

Interfejs użytkownika: analiza i projektowanie

Widok użytkownika

Poziom semantyczny

Analiza

Model systemu

5

Techniki multimedialne – projektowanie prezentacji multimedialnych

Interfejs użytkownika: analiza i projektowanie

Projektowanie

Model= Widoki+ Sterowanie

Poziom syntaktyczny

Wybór standardu

Poziom prezentacji

Projektowanie prezentacji

Model

systemu

Prototypowanie

i

Implementacja

Widoki

Sterowanie

Testowanie

i

Konserwacja

6

Techniki multimedialne – projektowanie prezentacji multimedialnych

Menu i nawigowanie

1. Można założyć, że użytkownik ma odruch klikania

na to co go interesuje

2. W polskich wersjach językowych polecenia menu

powinny być w trybie rozkazującym: 

Wytnij

, 

Kopiuj

,

Otwórz

...

3. Poszczególne okna dialogowe powinny być

odpowiednio zatytułowane : 

Wycinanie

,

Kopiowanie

, 

Otwieranie

...

4. Trzy kropeczki - dalszy dialog

5. Unikać całych zdań np.

Press to Quit = Quit

7

Techniki multimedialne – projektowanie prezentacji multimedialnych

Kolor

Kolor

można wykorzystać do:

¾ wyróżniania elementów 
¾ kategoryzowania informacji
¾ zwiększenia realności prezentowanej

rzeczywistości

Problemy związane ze stosowaniem kolorów:

¾przyciąga uwagę (czasami nazbyt)
¾ oko w różnym stopniu odbiera różne kolory 
¾ nierozróżnianie kolorów jest częstą wadą wzroku

8

Techniki multimedialne – projektowanie prezentacji multimedialnych

Kolor

1. Jeżeli elementy mają być numerowane, należy

wykorzystać kolejność jak w widmie:

czerwony 

<

pomarańczowy 

<

żółty

zielony

<

niebieski

<

fioletowy

2. Kolorów czerwonego i zielonego powinno się

używać w centrum pola widzenia.

3. Należy wykorzystać skojarzenia znaczeniowe

kolorów (np. 

czerwony

oznacza 

STOP

, 

zielony

-

DALEJ

)

4. Kolor nie powinien być jedynym wyróżnikiem

(szczególnie ważne dla osób z wadami w

postrzeganiu kolorów)

9

Techniki multimedialne – projektowanie prezentacji multimedialnych

Głos

1. Komputer powinien „mówić”, gdy użytkownik nie

patrzy na ekran, porusza się lub nie ma dostępu do

komputera

2. Komunikaty powinny najpierw zawierać cel, a

potem czynność, np.:

Aby uruchomić program, naciśnij spację

3. Powinna być możliwość niewysłuchiwania

komunikatów do końca oraz powtarzania ich

4. Średnia prędkość czytania: 180 słów na minutę

10

Techniki multimedialne – projektowanie prezentacji multimedialnych

Rysunki, ikony i symbole

1. Symbole i ikony powinny zastępować tekst, aby

sugerować użytkownikowi znaczenie elementów

interfejsu

2. Należy korzystać ze zbioru powszechnie używanych

symboli (np. do oznaczenia poleceń na pasku

narzędzi)

3. Korzystnie jest wykorzystać symbole znane z życia

(np. znaki drogowe)

11

Techniki multimedialne – projektowanie prezentacji multimedialnych

Tekst

Czcionki

• proste i czytelne

• nie  więcej niż 2 kroje

• jeden z krojów powinien być dominujący

• stosowanie kroju powinno mieć określony cel

Rozmiar

• nie  więcej niż 3 rozmiary czcionki

• nie wolno zmniejszać czcionki, aby zmieścić tekst

Należy pamiętać, że czytanie z ekranu jest dość 

męczące.

12

Techniki multimedialne – projektowanie prezentacji multimedialnych

Tekst

ƒ

Powstał około 6000 lat temu, Mezopotamia, 

Egipt, Sumeria, Babilonia

ƒ

Nawet pojedyncze słowa, mogą mieć bardzo 

duże znaczenie

ƒ

Język literacki, gazetowy, ogłoszeń, 

komunikatów komputerowych itp.

ƒ

Kodowanie znaków w pamięci komputera 

(ASCII)

ƒ

Czcionki

13

Techniki multimedialne – projektowanie prezentacji multimedialnych

Polskie „ogonki”

ƒ

„Standardy” DOS-owe: Mazowia, DHN, Latin2 

(852)

ƒ

MS Windows - CP1250 (środkowoeuropejski)

ƒ

Polska Norma PN-93 T-42118

ƒ

Unix/Internet - ISO 8859-2

14

Techniki multimedialne – projektowanie prezentacji multimedialnych

Czcionki - fonts

ƒ

Rodzina znaków graficznych 

„font family/typeface”, np. Arial, Courier

ƒ

Styl „font style”,  np. normalny, kursywa 

„italic”

ƒ

Pogrubienie „bold” to albo kolejny styl albo 

grubość czcionki „font weight”

ƒ

Rozmiar czcionki „font size” to najczęściej 

odległość między kolejnymi liniami bazowymi 

(wyrażony w punktach =  1/72 cala)

ƒ

Font - wybrana rodzina, rozmiar, styl itd., np. 
Times 12p italic, Courier 10p Bold

15

Techniki multimedialne – projektowanie prezentacji multimedialnych

ƒ

Słowa, sekcje, strony są połączone

ƒ

Można poruszać się po informacji według 

ustalonych połączeń

ƒ

Ponieważ hipertekst jest w formie 

elektronicznej można bezpośrednio 

wyszukiwać konkretne informacje

Hipertekst

jest to tekst zawierający odniesienia do innego 

tekstu:

16

Techniki multimedialne – projektowanie prezentacji multimedialnych

Struktura hipertekstu

A

B

C

D

E

F

17

Techniki multimedialne – projektowanie prezentacji multimedialnych

Hipertekst

ƒ

Na CD można mieć około 100 000 stron, co 

przy normalnym układzie strona po stronie nie 

nadawałoby się do użytku

ƒ

Hipertekst bardziej odpowiada sposobowi 

organizacji myśli ludzkich

ƒ

Jednak zbyt dużo swobody i można zginąć w 

nieliniowej informacji

18

Techniki multimedialne – projektowanie prezentacji multimedialnych

Systemy hipertekstowe

ƒ

HTML - Hypertext Marckup Langauge

ƒ

Windows help files – HLP

ƒ

PDF - Portable Document Format

19

Techniki multimedialne – projektowanie prezentacji multimedialnych

Hipertekst i multimedia - hipermedia

ƒ

Różne media + Struktura hipertekstowa 

= Hipermedia 

ƒ

Grafika może być wkomponowana w tekst

ƒ

Odnośniki hipertekstowe mogą kierować do 

innych typów danych

20

Techniki multimedialne – projektowanie prezentacji multimedialnych

A

B

C

D

E

F

Zwykły tekst

Hipertekst

Czytamy liniowo

Poruszamy się między stronami

Hipertekst i hipermedia

Hipertekst

jest to tekst zawierający odniesienia do 

innego tekstu

21

Techniki multimedialne – projektowanie prezentacji multimedialnych

Rysunki

Film

Dźwięk

Tekst

Hipertekst i hipermedia

Hipermedia

mają strukturę hipertekstu, ale wyko-

rzystują również inne media (grafika, rysunki, a 

zwłaszcza dźwięk, animację i wideo).

22