Pomyśl o swojej ulubionej witrynie lub aplikacji. Co sprawia, że jest ona Twoją ulubioną? Teraz pomyśl o stronie lub aplikacji, która Ci się nie podoba. Co Ci się nie podoba? Sposób, w jaki użytkownicy wchodzą w interakcję z Twoim projektem, oraz ich wrażenia z korzystania z witryny i aplikacji mogą się różnić.
Może się ona zmieniać w zależności od pory dnia, rodzaju używanego urządzenia, tego, czy użytkownik się wyspał, czy jest chory, czy korzysta z technologii wspomagającej i wielu innych czynników. Na świecie żyje blisko 8 miliardów ludzi, więc możliwości wykorzystania i odbioru Twoich projektów są nieograniczone.
Projektowanie włączające
Jak możemy jednocześnie zaspokoić wszystkie potencjalne potrzeby użytkowników? Wpisz projektowanie włączające. Projektowanie z myślą o integracji społecznej wykorzystuje podejście skoncentrowane na człowieku, które łączy w sobie integrację społeczną, użyteczność i dostępność.
W przeciwieństwie do projektowania uniwersalnego, które koncentruje się na jednym projekcie, z którego może korzystać jak najwięcej osób, zasady projektowania z myślą o integracji skupiają się na projektowaniu dla konkretnej osoby lub przypadku użycia, a następnie na rozszerzaniu tego projektu na inne osoby.
Istnieje 7 zasad projektowania z myślą o dostępności:
- Zapewnij porównywalne wrażenia: zadbaj o to, aby interfejs zapewniał wszystkim użytkownikom takie same wrażenia, dzięki czemu będą mogli wykonywać zadania w sposób odpowiadający ich potrzebom, nie obniżając jakości treści.
- Weź pod uwagę sytuację: zadbaj o to, aby interfejs zapewniał użytkownikom wartościowe wrażenia niezależnie od ich sytuacji.
- Spójność: używaj znanych konwencji i stosuj je w logiczny sposób.
- Zapewnij kontrolę: zadbaj o to, aby użytkownicy mogli uzyskiwać dostęp do treści i wchodzić z nimi w interakcje w preferowany przez siebie sposób.
- Oferuj wybór: rozważ udostępnienie różnych sposobów wykonywania zadań, zwłaszcza tych złożonych lub niestandardowych.
- Nadaj priorytet treściom: pomóż użytkownikom skupić się na podstawowych zadaniach, funkcjach i informacjach, rozmieszczając te elementy w preferowanej kolejności w treści i układzie.
- Dodawanie wartości: zastanów się nad celem i znaczeniem funkcji oraz nad tym, jak poprawiają one komfort różnych użytkowników.
Profile klientów
Podczas opracowywania nowego projektu lub funkcji wiele zespołów korzysta z person użytkowników, które pomagają im w tym procesie. Persony to fikcyjne postacie, które korzystają z Twoich usług cyfrowych. Często są one tworzone na podstawie ilościowych i jakościowych badań użytkowników.
Persony to też szybki i niedrogi sposób na testowanie i ustalanie priorytetów tych funkcji w trakcie procesu projektowania i tworzenia. Pomagają one skupić się na decyzjach dotyczących komponentów witryny, dodając do rozmowy warstwę uwzględniającą rzeczywiste warunki, co ułatwia dostosowanie strategii i tworzenie celów ukierunkowanych na konkretne grupy użytkowników.
Uwzględnianie niepełnosprawności
„Ludzie są różni. Mogę mówić tylko z własnego doświadczenia. Gdy poznasz jedną osobę głuchą, poznasz tylko tę jedną osobę, a nie nas wszystkich”.
Meryl Evans z prezentacji ID24 Deaf Tech: Travel Through Time from Past to Future.
Profile użytkowników mogą być używane jako narzędzie projektowania inkluzywnego, jeśli uwzględnisz w nich osoby z niepełnosprawnościami. Możesz to zrobić na wiele sposobów. Możesz utworzyć profile użytkowników z niepełnosprawnościami, dodać niepełnosprawności do istniejących profili użytkowników, a nawet utworzyć spektrum profili, aby odzwierciedlić dynamiczną rzeczywistość niepełnosprawności sytuacyjnych, tymczasowych i trwałych.
Niezależnie od tego, jak uwzględnisz osoby z niepełnosprawnościami w swoich profilach, nie powinny one być oparte na prawdziwych osobach ani stereotypach. Persony nigdy nie zastąpią testów z użytkownikami.
- Imię i nazwisko: Jane Bennet
- Wiek: 57 lat
- Lokalizacja: Essex, Wielka Brytania
- Zawód: inżynier UX
- Niepełnosprawność: drżenie rąk spowodowane wczesną postacią choroby Parkinsona
- Cele: używaj funkcji zamiany mowy na tekst, aby łatwiej dodawać sugestie dotyczące kodu; wyszukuj sprzęt rowerowy online przy użyciu minimalnej liczby naciśnięć klawiszy.
- Problemy: witryny, które nie obsługują sterowania za pomocą klawiatury; aplikacje do projektowania z małymi obszarami interakcji dotykowej.
Jako inżynier UX Jane projektuje i tworzy strony, które są niezbędne do utrzymania aktualności witryny jej firmy. W ciągu dnia pomaga wielu członkom zespołu. Jest mistrzynią w gaszeniu pożarów technicznych i każdy zwraca się do niej, gdy coś niespodziewanie się zepsuje.
Utrata precyzyjnych umiejętności motorycznych z powodu drżenia rąk utrudnia jej korzystanie z myszy. Coraz częściej korzysta z klawiatury do poruszania się po internecie. Jane zawsze dbała o kondycję fizyczną. Uwielbia wyścigi szosowe i BMX. Dlatego diagnoza choroby Parkinsona o wczesnym początku, którą usłyszała w zeszłym roku, była dla niej ogromnym ciosem.
Symulatory niepełnosprawności
Zachowaj szczególną ostrożność, korzystając z symulatorów niepełnosprawności, aby naśladować lub uzupełniać swoje persony.
Symulatory niepełnosprawności są mieczem obosiecznym, ponieważ mogą budować sympatię lub empatię. Zależy to od osoby, kontekstu, w jakim symulator jest używany, i wielu innych czynników, na które nie mamy wpływu. Wielu zwolenników ułatwień dostępu jest przeciwnych używaniu narzędzi do symulacji niepełnosprawności i zaleca oglądanie filmów, demonstracji, samouczków i innych treści stworzonych przez osoby z niepełnosprawnością oraz poznawanie ich doświadczeń z pierwszej ręki.
„Uważam, że musimy być całkowicie szczerzy i przyznać, że żadne symulacje nie mają wpływu na niektóre z najważniejszych kwestii, które osoby widzące powinny zrozumieć i zapamiętać. Niepełnosprawność wzroku nie jest cechą, która nas definiuje. Największą przeszkodą są nieporozumienia i niskie oczekiwania związane z niepełnosprawnością wzroku.
Te nieporozumienia tworzą sztuczne bariery, które uniemożliwiają nam pełne uczestnictwo, a te fałszywe ograniczenia stają się czymś, co nas powstrzymuje”.
Mark Riccobono, prezes National Federation of the Blind.
Heurystyka ułatwień dostępu
Podczas tworzenia profili i projektów możesz dodać do przepływu pracy heurystyki. Heurystyki to zasady projektowania interakcji, wprowadzone w 1990 roku przez Jakoba Nielsena i Rolfa Molicha. Te 10 zasad powstało na podstawie wieloletniego doświadczenia w dziedzinie inżynierii użyteczności i od tego czasu są wykorzystywane w programach projektowania i interakcji człowiek-komputer.
W 2019 roku zespół projektowy Deque stworzył i udostępnił nowy zestaw heurystyk dotyczących dostępności cyfrowej. Z badań wynika, że jeśli dostępność jest uwzględniana w procesie projektowania, można uniknąć nawet 67% wszystkich błędów związanych z dostępnością witryny lub aplikacji. To ogromny wpływ, który można osiągnąć, zanim jeszcze napiszesz choćby jedną linię kodu.
Podobnie jak w przypadku pierwotnego zestawu heurystyk, podczas planowania projektu należy wziąć pod uwagę 10 heurystyk dotyczących ułatwień dostępu.
- Metody i sposoby interakcji: użytkownicy mogą skutecznie korzystać z systemu, używając wybranej metody wprowadzania danych (np. myszy, klawiatury, dotyku itp.).
- Nawigacja i wyszukiwanie: użytkownicy mogą poruszać się po systemie, znajdować treści i w każdej chwili określać swoje położenie.
- Struktura i semantyka: użytkownicy mogą zrozumieć strukturę treści na każdej stronie i wiedzieć, jak korzystać z systemu.
- Zapobieganie błędom i stany: interaktywne elementy sterujące mają trwałe, zrozumiałe instrukcje, które pomagają zapobiegać błędom. Zapewniają też użytkownikom jasne stany błędów, które wskazują, jakie są problemy i jak je rozwiązać, gdy tylko wystąpią.
- Kontrast i czytelność: użytkownicy mogą łatwo odróżnić i odczytać tekst oraz inne istotne informacje.
- Język i czytelność: użytkownicy mogą łatwo przeczytać i zrozumieć treści.
- Przewidywalność i spójność: użytkownicy mogą przewidzieć przeznaczenie każdego elementu. Widać, jak każdy element jest powiązany z całym systemem.
- Czas i przechowywanie: użytkownicy mają wystarczająco dużo czasu na wykonanie zadań i nie tracą informacji, jeśli czas (czyli sesja) się skończy.
- Ruch i miganie: użytkownicy mogą zatrzymać elementy na stronie, które się poruszają, migają lub są animowane. Użytkownicy nie powinni być rozpraszani ani w inny sposób narażeni na szkodliwe działanie tych elementów.
- Alternatywy wizualne i słuchowe: użytkownicy mogą uzyskać dostęp do alternatyw tekstowych dla wszystkich treści wizualnych lub dźwiękowych, które przekazują informacje.
Gdy poznasz podstawowe heurystyki ułatwień dostępu, możesz zastosować je do persony lub projektu, korzystając z arkusza heurystyk ułatwień dostępu i postępując zgodnie z podanymi instrukcjami. To ćwiczenie jest bardziej pouczające, gdy zbierzesz różne punkty widzenia.
Przykładowa heurystyczna ocena dostępności punktu kontrolnego dotyczącego nawigacji i wskazywania drogi może wyglądać tak:
| Punkty kontrolne do nawigacji i wskazywania drogi | Excels (+2 pkt) | Powodzenie (+1 pkt) | Niepowodzenia (-1 pkt) | Nie dotyczy (0 pkt) |
|---|---|---|---|---|
| Czy wszystkie aktywne elementy mają wyraźny, widoczny wskaźnik, gdy są zaznaczane? | ||||
| Czy strona ma zrozumiały tekst tytułu, w którym na pierwszym miejscu znajdują się informacje dotyczące strony? | ||||
| Czy element tytułu strony i tag H1 są takie same lub podobne? | ||||
| Czy każda główna sekcja ma odpowiedni nagłówek? | ||||
| Czy przeznaczenie linków jest określone na podstawie samego tekstu linku lub jego bezpośredniego kontekstu? | ||||
| Czy u góry strony znajduje się link do pominięcia i czy jest on widoczny po ustawieniu na nim fokusu? | ||||
| Czy rozmieszczenie elementów nawigacyjnych ułatwia orientację w przestrzeni? |
Gdy wszyscy członkowie zespołu zapoznają się ze stroną lub komponentem i przeprowadzą heurystyczną ocenę dostępności, podsumowuje się wyniki każdego punktu kontrolnego. Na tym etapie możesz zdecydować, jak rozwiązać znalezione problemy lub poprawić pominięcia, które mają kluczowe znaczenie dla zapewnienia dostępności cyfrowej.
Adnotacje dotyczące ułatwień dostępu
Zanim przekażesz projekt zespołowi deweloperów, rozważ dodanie adnotacji dotyczących ułatwień dostępu.
Adnotacje służą do wyjaśniania wyborów dotyczących kreacji i opisywania różnych aspektów projektu. Adnotacje dotyczące ułatwień dostępu skupiają się na obszarach, w których deweloperzy mogą dokonywać bardziej dostępnych wyborów programistycznych, korzystając ze wskazówek zespołu projektowego lub specjalisty ds. ułatwień dostępu.
Adnotacje dotyczące ułatwień dostępu można stosować na każdym etapie procesu projektowania, od szkieletów po makiety o wysokiej wierności. Mogą one obejmować ścieżki użytkownika, stany warunkowe i funkcje. Często używają symboli i etykiet, aby usprawnić proces i skupić się na projekcie.
Poniższe przykłady ilustracji projektów pochodzą z zestawu adnotacji dotyczących ułatwień dostępu na stronie Indeed.com w Figma.
W zależności od programu do projektowania możesz wybierać spośród wielu zestawów początkowych adnotacji dotyczących ułatwień dostępu. Możesz też utworzyć własny zestaw. W każdym z tych przypadków musisz zdecydować, jakie informacje należy przekazać zespołowi przejmującemu obsługę i jaki format będzie najlepszy.
Oto niektóre obszary, w których warto dodać adnotacje dotyczące ułatwień dostępu:
- Kolor: podaj współczynniki kontrastu wszystkich różnych kombinacji kolorów w palecie.
- Przyciski i linki: identyfikowanie stanów domyślnego, najechania, aktywnego, fokusu i wyłączonego.
- Pomiń linki: wyróżnij ukryte i widoczne elementy projektu oraz miejsca, do których prowadzą linki na stronie.
- Obrazy i ikony: dodaj rekomendacje dotyczące tekstu alternatywnego do najważniejszych obrazów i ikon.
- Audio i wideo: wyróżniaj obszary i linki do napisów, transkrypcji i audiodeskrypcji.
- Nagłówki: dodaj poziomy programowe i uwzględnij wszystko, co wygląda jak nagłówek.
- Punkty orientacyjne: wyróżnij różne sekcje projektu za pomocą kodu HTML lub ARIA.
- Komponenty interaktywne: identyfikowanie elementów klikalnych, efektów najechania kursorem i obszaru fokusu.
- Klawiatura: określ, gdzie ma się zaczynać zaznaczenie (punkt alfa) i jaka ma być kolejność tabulacji.
- Formularze: dodawaj etykiety pól, tekst pomocniczy, komunikaty o błędach i komunikaty o sukcesie.
- Nazwy dostępne: określ, jak technologia wspomagająca powinna rozpoznawać element.