Projektowanie Systemów Inf.

Transkrypt

1 Projektowanie Systemów Inf. Wykład VI Interfejs systemu Copyrights by Arkadiusz Rzucidło 1

2 Cechy dobrego systemu Zgodny z wymaganiami użytkownika Niezawodny, poprawny Efektywny Łatwy w konserwacji Ergonomiczny Copyrights by Arkadiusz Rzucidło 2

3 Składniki systemu inf. Informatyczny system informacyjny Źródło danych baza danych Mechanizmy przetwarza danych różne technologie Interfejs użytkownika Narzędzia dodatkowe Czym jest interfejs? Zespół narzędzi programowych, które umożliwiają komunikację między człowiekiem i systemem informatycznym" (I. Dubielewicz, materiały wykładowe Politechniki Wrocławskiej) Copyrights by Arkadiusz Rzucidło 3

4 Interfejs systemu inf. Komunikacja użytkownik SI sterowanie SI (polecenia) przepływ danych (użytkownik system) Typy interfejsu Znakowy Pseudo-znakowy Graficzny -GUI (Graficzny Interfejs Użytkownika) Interfejs jest dobrze zaprojektowany wtedy, gdy system zachowuje się dokładnie tak, jak oczekuje tego użytkownik Interfejs bazuje na modelu użytkownika Copyrights by Arkadiusz Rzucidło 4

5 Model użytkownika Model kreuje się poprzez: Wywiad oczekiwania użytkowników Testy kolejnych wersji systemu prowadzone przez użytkowników Opracowany model użytkownika pozwala dostosować projekt systemu do potrzeb użytkownika Przyczynia się do poprawy ergonomii pracy z aplikacją Jeśli nie jest znany model użytkownika można użytkownikowi przybliżyć model programu za pomocą metafor Copyrights by Arkadiusz Rzucidło 5

6 Poziom użytkownika Nowy Szkolenia, instrukcje obsługi Początkujący Wstępne wyjaśnienia, pomocniki, pomoc kontekstowa, blokowanie Średnio zaawansowany Największa grupa, standard interfejsu, pomoc szczegółowa, indeks Ekspert Skróty, szybkość dostępu, indywidualizacja interfejsu Copyrights by Arkadiusz Rzucidło 6

7 Charakterystyka użytkowników Cechy na które należy zwrócić uwagę Wiek Płeć Wykształcenie Zdolności językowe Częstość użycia programu Swoboda użytkowania komputera Wiedza o wykonywanym zadaniu Wiedza o komputerach Zdolności uczenia się Powyższa charakterystyka użytkowników powinna wpłynąć na stopień zaawansowania interfejsu Copyrights by Arkadiusz Rzucidło 7

8 Zasady konstruowania interfejsu Jeśli model systemu nie jest prosty to z pewnością różni się od oczekiwań użytkownika Zgodność z zastanymi zasadami Uwzględnienie warunków ekstremalnych Czytelne ikony przycisków i opcji jednoznaczność Odpowiedniej wielkości przyciski łatwość wybierania Listy poleceń bez pasków przewijania trudność w obsłudze Opisy tylko konieczne miniumum tekstu im więcej słów w oknach dialogowych, tym mniejsza szansa na ich przeczytanie i większa dezorientacja użytkownika. Interfejs musi być użyteczny nie tylko w idealnych warunkach (oświetlenie, umiejętności użytkownika) Copyrights by Arkadiusz Rzucidło 8

9 Zasady projektowania Dobry interfejs w maksymalnym stopniu uwzględnia fakt, że użytkownicy często mają kłopoty z poprawną obsługą myszy. Interfejs nie powinien wymagać zapamiętywania zbyt wielu informacji Potwierdzanie operacji zatwierdzonych przez użytkownika Wpływa na poczucie bezpieczeństwa przy korzystaniu z aplikacji Sprawia wrażenie panowania nad systemem Program powinien szybko reagować Użytkownik irytuje się jeśli system nie odpowiada informacja o aktualnej fazie przetwarzania Inną metodą jest gromadzenie prostych operacji w jedną czasochłonną Copyrights by Arkadiusz Rzucidło 9

10 Zasada 1 Korzystanie z metafor Wykorzystanie elementów środowiska znanych użytkownikom - przedmiotów lub sytuacji Istotne uwagi: Metafora nie jest koniecznością Użyte raz powinno być używane zawsze Uwaga na różnice kulturowe Copyrights by Arkadiusz Rzucidło 10

11 Zasada 2 Eksponowanie funkcji systemu Ujawnienie wszystkich dostępnych funkcji systemu Poziomy eksponowania funkcji: Toolbar - całkowicie jawne; Menu - dostępne po minimalnym ruchu; Podmenu - dostępne przy większym ruchu; Okno dialogowe - po naciśnięciu klawisza; Podokno dialogowe - dwie czynności; Opcje zaawansowane - dodatkowa wiedza; Funkcje skryptowe - duża wiedza Copyrights by Arkadiusz Rzucidło 11

12 Zasada 3 Dbałość o spójność interfejsu Zachowanie systemu powinno być wewnętrznie i zewnętrznie spójne Wewnętrzna spójność oznacza - podobne techniki zarządzania różnymi obiektami programu te same scenariusze dodawania różnych obiektów podobny styl okienek dialogowych udostępnienie pomocy kontekstowej tym samym działaniem. Zewnętrzna spójność oznacza - program działa podobnie do innych programów na tym komputerze lub systemie operacyjnym podobny układ w menu głównym podobna metoda dokonywania wydruków podobne słownictwo poleceń i komunikatów... Copyrights by Arkadiusz Rzucidło 12

13 Zasada 4 i 5 Wizualizacja stanów systemu Zmiana zachowania systemu musi być wizualnie zaznaczona Wprowadzanie drogi na skróty Zapewnienie dwóch dróg - naturalną i abstrakcyjną do funkcji systemu Rodzaje skrótów Pasek przycisków Skrót klawiszowy Makra Klawisze funkcyjne Copyrights by Arkadiusz Rzucidło 13

14 Zasada 6 Akcentowanie ważnych elementów Niektóre elementy GUI muszą przyciągać uwagę bardziej niż inne Manifestowalność -zdolność do bycia zauważonym Projektując formatkę GUI należy wyznaczyć elementy: o najwyższym stopniu manifestowalności o najniższym stopniu manifestowalności wybrać metodę zwiększenia manifestowalności Metody zwiększenia manifestowalności: Kolor Rozmiar Obramowanie Grupowanie Lokalizacja Animacja Copyrights by Arkadiusz Rzucidło 14

15 Zasada 7 Rozpoznanie potrzeb i zapewnienie różnych środków pomocy użytkownikowi Istnieje pięć typów pomocy: 1. Goal-oriented: Co mogę z tym zrobić...?" 2. Descriptive: Co to jest? Co to robi?" 3. Procedural: Jak mogę tego dokonać?" 4. Interpretive: Czemu tak się stało?" 5. Navigational: Gdzie ja jestem" Copyrights by Arkadiusz Rzucidło 15

16 Zasada 8 Zapewnienie bezpieczeństwa użytkowania Użytkownik musi mieć możliwość cofnięcia przeprowadzonych operacji co daje komfort poprzez niemożność zepsucia czegoś Środki: Maski wprowadzania Reguły poprawności Komunikaty o błędach Potwierdzenie ważnych decyzji Blokowanie danych i funkcji Kontekstowe prowadzenie za rękę Copyrights by Arkadiusz Rzucidło 16

17 Zasada 9 Zachowanie jednolitego kontekstu Ograniczanie dostępnych opcje systemu w zależności od kontekstu Okna modalne Dynamiczne menu Ukrywanie przycisków Copyrights by Arkadiusz Rzucidło 17

18 Zasada 10 Dbałość o estetykę interfejsu Rozmiary i rozmieszczenie przycisków Tło w postaci obrazku Przyciski graficzne Kolory... Copyrights by Arkadiusz Rzucidło 18

19 Reasumując Interfejs powinien być: przystępny prosty łatwy do nauki uwzględniać potrzeby ludzi intuicyjny Copyrights by Arkadiusz Rzucidło 19

20 Technologie System informatyczny może być oparty o różne technologie Systemy typu Desktop Systemy przeznaczone do użytku w sieciach lokalnych Wykorzystanie typowych narzędzi sieci lokalnych Systemy rozproszone Pozwalające na pracę w sieciach rozproszonych (Internet) Zawansowane technologie internetowe Współpraca z różnymi źródłami danych Interfejs niezależny od platformy sprzętowej użytkownika Copyrights by Arkadiusz Rzucidło 20

21 Przepływ danych Wejściowych (wprowadzanie) parametry poleceń odpowiedzi na pytania dialog Wyjściowych wyświetlanie inf. o dialogu Raporty graficzne prezentacje danych Copyrights by Arkadiusz Rzucidło 21

22 Elementy sterowania systemem Sterowanie polecenia (linia komend) klawisze sterujące (skróty) opcje z menu ikony (paski narzędziowe) przyciski dialogu działania myszą i innymi urządzeniami wskazującymi Copyrights by Arkadiusz Rzucidło 22

23 Architektura interfejsu Okna dialogowe dezaktywują aplikację i wymuszają obsługę przyciski powrotu do aplikacji (przynajmniej jeden) Istotne dla interfejsu graficznego interaktywne projektowanie dialogu Problemy interakcyjności tłumaczenia na inny język (problem: prostota stylu ) zmienność kulturowa i prawna (problem: daty, waluty) niuanse kulturowe (problem: kolor np.czerwony, czarny) Problem języka gra słów (np. B2B Biznes to Biznes) Metafor skomplikowanego słownictwa zbyt długich nazw tekstów wewnątrz rysunków Copyrights by Arkadiusz Rzucidło 23

24 Urządzenia realizacji interfejsu Wejściowe Czytniki kart kodowych (perforowane, magnetyczne) Nośniki magnetyczne i optyczne Terminale Urządzenia wskazujące (mysz, pióro) Teletransmisja Wyjściowe Wydruki Terminale Karty kodowe Nośniki magnetyczne i optyczne Ploter, naświetlarka Teletransmisja Copyrights by Arkadiusz Rzucidło 24

25 Bezpieczeństwo systemu Zawarte w technologii użytej do projektowania systemu Będące pochodną architektury przetwarzania danych Desktop Klient Serwer Połączenia bezpieczne (szyfrowanie) Wynikające z charakteru środowiska w którym przetwarzanie jest realizowane Osobne pomieszczenia dla pracowników Dostęp innych osób Inne czynniki Copyrights by Arkadiusz Rzucidło 25

26 Klasyfikacja praw dostępu Hierarchizacja uprawnień użytkowników wynikająca z: Realizowanych zadań w procesie przetwarzania Uzupełnianie podstawowych danych (słowniki danych) Tworzenie dokumentów, formatek, itp. Związane z bieżącą pracą w systemie Dostępu do określonych danych w systemie Całkowite ograniczenie dostępu do niektórych danych Ograniczenie do prezentacji (gość) Wolny dostęp Realizacji czynności administracyjnych Archiwizacja danych Czynności związane z zaawansowanym przetwarzaniem (tworzenie nowych kwerend, modyfikacje istniejących) Czynności na bazie danych Copyrights by Arkadiusz Rzucidło 26

27 Dodatkowe narzędzia systemu Integracja z interfejsem niektórych narzędzi ułatwiających pracę z systemem Uruchamianie kalkulatora Wyświetlanie najnowszych kursów walut ipt. Możliwość eksportowania i importowania danych do systemu Możliwości personalizacji środowiska pracy Dostęp do systemu z różnych komputerów (różnych miejsc, np. z domu) Elementy informowania o przebiegu procesów przetwarzania SMS, , itp. Copyrights by Arkadiusz Rzucidło 27

28 Wskazówki Obiekt GUI Główny pasek menu Menu rozwijane Menu kaskadowe Podmenu (pop-up) Przycisk polecenia Opcja kontrolna (check-box) Opcja wyboru (radio-button) Lista wartości Lista rozwijana (combo) Liczba pozycji wyboru pokazywanych jednocześnie Max 10 pozycji Max 12 pozycji Max 5 pozycji Max 10 pozycji 1 polecenie, max 6 w jednym okienku 1 pojęcie, max w grupie 1 pojęcie, max 6 w grupie Do 50 pozycji na liście, 8-10 do pokazania 1 wartość na liście, do 20 pozycji do pokazania Copyrights by Arkadiusz Rzucidło 28

29 Wskazówki Sprowadzaj ilość informacji na jednym ekranie do minimum Mózg (pamięć szybka) człowieka zapewnia dobrą uwagę nie więcej niż dla 7 elementów o różnym przeznaczeniu Wykorzystuj grupowanie informacji Kąt widzenia człowieka wynosi 5 stopni, więc przeciętnie jest on w stanie skupić się na tekście mającym 6-7 linii i znaków przy czcionce 12pt. Dane zgrupowane na takim obszarze są lepiej identyfikowane Wielkość ikon również powinna podlegać tej regule Zachowuj proporcje okienek Do konstrukcji prostokątnych okien można się posłużyć jedną z tzw. złotych reguł, ustalającą doskonałe (wg starożytnych Greków) proporcje prostokąta 1:1,618 Okna szersze są lepsze od okien wyższych Copyrights by Arkadiusz Rzucidło 29

30 Wskazówki Pilnuj wielkości napisów. Dużą czcionkę człowiek czyta o 13% wolniej, niż normalną (12 pt.) Nie nadużywaj kolorów! Reguła trzech kolorów 90% powierzchni ekranu ma być przedstawiona w trzech nie gryzących się kolorach Reguła kompatybilnych kolorów psycholodzy dawno ustalili zestawy kolorów nawzajem uzupełniających się oraz niekompatybilnych między sobą Reguła kolorów pastelowych zawsze bezpieczniej używać pasteli od kolorów nasyconych Reguła zielonego i czerwonego kolorów kolor czerwony zawsze rezerwuj do ostrzeżeń kolor zielony ma zaznaczać poprawną, bezpieczną sytuację Copyrights by Arkadiusz Rzucidło 30

31 Koniec Źródła: L.Welling, L.Thomson; PHP i MySQL. Tworzenie stron WWW, Helion J.D.Ullman, J.Widom; Podstawowy Wykład z Systemów Baz Danych, WNT M.Mieszczyński, Diabeł i GUI, 5.html A.Klosow; Materiały wykładowe, PWSI Copyrights by Arkadiusz Rzucidło 31