Projekt

Projektowanie inkluzywne: sposoby na poszerzenie grona odbiorców produktu

Projektowanie inkluzywne: sposoby na poszerzenie grona odbiorców produktu

Wypróbuj 4 najlepsze zawody projektowe. Bezpłatnie ➞ W 5 dni zapoznasz się z ilustracją, UX/UI, projektowaniem stron internetowych i grafiką. Dodaj 4 świetne case'y do swojego portfolio i zdecyduj o swoim dalszym rozwoju.

Dowiedz się więcej

Osoby z niepełnosprawnościami codziennie napotykają na różne przeszkody. Nie wszystkie wejścia mają podjazdy, drzwi i windy są często zbyt wąskie dla wózków inwalidzkich, a teksturowane płytki dla osób niedowidzących są niezwykle rzadkie. Te same problemy występują w przestrzeni cyfrowej: użytkownicy z dysfunkcją wzroku mogą mieć równie duże trudności z zamówieniem jedzenia w aplikacji, jak i z dotarciem do sklepu. Ważne jest, aby zapewnić dostępność zarówno środowiska fizycznego, jak i cyfrowego dla osób z niepełnosprawnościami, aby mogły one korzystać ze wszystkich usług i produktów bez barier.

Projektowanie inkluzywne ma na celu tworzenie produktów dostępnych dla wszystkich użytkowników, niezależnie od ich sprawności. Duże firmy, takie jak Google, Microsoft i Sber, opracowały własne wytyczne dotyczące dostępności cyfrowej. Zawierają one zasady i najlepsze praktyki, które pomagają poprawić doświadczenia użytkowników i zwiększyć zasięg aplikacji. Przestrzeganie zasad projektowania inkluzywnego nie tylko sprawia, że ​​produkty są bardziej przyjazne dla użytkownika, ale także zwiększa ich konkurencyjność na rynku.

Jak projektowanie inkluzywne stało się trendem

Globalna grupa osób z niepełnosprawnościami liczy około 650 milionów osób, co stanowi 10% światowej populacji. W Rosji mieszka ponad 11 milionów osób z niepełnosprawnościami, co stanowi 8% całkowitej liczby Rosjan. Wiele z nich ma trudności z interakcją z nieczytelnym tekstem, małymi przyciskami lub sygnałami dźwiękowymi. Globalny standard dostępności treści internetowych (WCAG) został opracowany w 2008 roku, ale temat projektowania inkluzywnego nie zyskał wówczas należnej mu uwagi. Wraz ze wzrostem roli usług cyfrowych w naszym życiu, kwestia ich użyteczności dla wszystkich użytkowników staje się coraz ważniejsza. Tworzenie treści dostępnych dla osób z niepełnosprawnościami nie tylko poprawia ich doświadczenia związane z zasobami internetowymi, ale także przyczynia się do tworzenia bardziej sprawiedliwej i inkluzywnej przestrzeni cyfrowej.

W lutym 2021 roku w Holandii przeprowadzono badanie użytkowników urządzeń mobilnych. Wyniki pokazały, że prawie połowa respondentów aktywnie korzysta z funkcji personalizacji, gdy są one dostępne. Najpopularniejszymi ustawieniami były zwiększenie rozmiaru tekstu i przejście na ciemny motyw, z których skorzystało około 30% respondentów. Pokazuje to, że użytkownicy z niepełnosprawnościami stanowią znaczącą grupę odbiorców. Dla firm otwiera to możliwości pozyskania nowych klientów i subskrybentów, podkreślając wagę dostosowywania produktów i usług do potrzeb różnych grup użytkowników.

Pomoc dla osób słabowidzących

Kontrast odgrywa kluczową rolę w przypadku osób słabowidzących, ponieważ ponad 2 miliardy ludzi na całym świecie doświadcza problemów ze wzrokiem. Wysoki kontrast pomaga lepiej zrozumieć informacje i ułatwia czytanie. Standard współczynnika kontrastu tekstu Wytycznych dotyczących dostępności treści internetowych (WCAG) to ważna wskazówka dla programistów i projektantów stron internetowych, którzy chcą zapewnić dostępność treści wszystkim użytkownikom. Przestrzeganie tych standardów nie tylko poprawia użyteczność, ale także pomaga stworzyć bardziej inkluzywną przestrzeń cyfrową.

Grafika: Skillbox Media

Standardy dotyczące treści tekstowych określają, że logo i ilustracje nie muszą spełniać tych wymagań. Jednak w przypadku ważnych elementów interfejsu, takich jak ikony, WCAG zaleca współczynnik kontrastu co najmniej 3:1. Poprawia to czytelność i zrozumienie informacji dla użytkowników z niepełnosprawnościami. Na przykład ikony zgodne z tym standardem zapewniają wystarczającą widoczność i łatwość odbioru, co jest kluczowe dla ogólnej użyteczności interfejsu.

Grafika: Material Design

Słaby kontrast utrudnia odbiór informacji. Ma to negatywny wpływ na czytelność tekstu i może powodować dyskomfort u użytkownika. Należy pamiętać, że zbyt niski kontrast między tłem a tekstem może prowadzić do zmęczenia oczu i osłabienia koncentracji. Dla optymalnej percepcji wzrokowej zaleca się stosowanie jaśniejszych, bardziej wyrazistych kombinacji kolorów, które sprzyjają lepszemu postrzeganiu i przyswajaniu informacji.

Grafika: Material Design

Aby upewnić się, że Twój projekt spełnia wytyczne WCAG dotyczące kontrastu, skorzystaj z usług online, takich jak Coolors lub WebAIM. Dostępne są również wtyczki do Figmy, takie jak Contrast i Color Contrast Checker, które pomogą Ci sprawdzić poziom kontrastu w projekcie. Narzędzia te zapewniają zgodność z zasadami dostępności, co jest niezbędne do tworzenia użytecznych i czytelnych treści dla wszystkich użytkowników.

Rozmiar czcionki to ważny aspekt projektu, który wpływa na czytelność i percepcję tekstu. Określenie optymalnego rozmiaru czcionki jest trudne, ponieważ różne czcionki mogą wyglądać inaczej przy tym samym rozmiarze: niektóre litery będą większe, inne mniejsze. Zalecenia Sbera mówią, że minimalny rozmiar czcionki dla tekstu głównego wynosi 16 pikseli. Standardy WCAG określają minimalną wysokość wiersza równą 1,5-krotności rozmiaru czcionki. Prawidłowy dobór rozmiaru czcionki i wysokości wiersza pomaga poprawić dostępność treści i komfort użytkownika podczas czytania.

Jeśli użytkownicy mają trudności z czytaniem, mogą powiększyć interfejs za pomocą skrótów klawiaturowych Ctrl + i Ctrl -, co proporcjonalnie zwiększa rozmiar czcionki. Aby uniknąć konieczności przewijania w poziomie, ważne jest stosowanie responsywnego układu. Zapewnia to optymalne wyświetlanie treści na różnych urządzeniach i poprawia komfort użytkownika, umożliwiając wszystkim łatwą interakcję z informacjami. Responsywny design sprzyja również lepszemu indeksowaniu stron przez wyszukiwarki, co jest istotne dla SEO.

Strona internetowa VTB jest wyświetlana w standardowej skali 100%. Zapewnia to optymalne doświadczenie użytkownika i łatwość nawigacji po zasobach banku. Prawidłowe skalowanie jest ważnym aspektem projektowania stron internetowych, ponieważ wpływa na dostępność i użyteczność witryny. Ważne jest, aby elementy interfejsu były wyraźnie widoczne i łatwe do zrozumienia, co przyczynia się do bardziej komfortowej interakcji klientów z usługami internetowymi banku.

Zrzut ekranu: strona internetowa VTB

Po powiększeniu do 200% strona automatycznie dostosowuje się do Wersja „pionowa” dla tabletów, zachowując przy tym wygodę dla użytkowników. W rezultacie to ustawienie eliminuje potrzebę przewijania w poziomie, a rozmiar czcionki staje się bardziej czytelny. Poprawia to komfort użytkowania i zapewnia wygodniejszą interakcję z treścią.

Zrzut ekranu: strona internetowa VTB

Kolor ma znaczący wpływ na percepcję informacji przez użytkownika, ale nie każdy potrafi rozróżniać odcienie w równym stopniu. Niektórzy użytkownicy mają zaburzenia widzenia barw, dlatego ważne jest, aby w interfejsach stosować wskazówki tekstowe. Na przykład, tradycyjne użycie koloru czerwonego do sygnalizowania błędów może być nieskuteczne dla osób z daltonizmem. Dlatego oprócz zmiany koloru, kluczowe jest zapewnienie czytelnych powiadomień tekstowych o problemach lub błędach. Dzięki temu wszyscy użytkownicy, niezależnie od postrzegania kolorów, będą mogli dokładnie zrozumieć, co się stało i jak sobie z tym poradzić.

Zrzut ekranu: witryna Google

Czytniki ekranu. Dla osób niewidomych takie elementy jak kontrast, rozmiar czcionki, podpowiedzi i powiększanie nie zapewniają niezbędnej pomocy. Zamiast tego korzystają z czytników ekranu – specjalistycznych programów i aplikacji, które odczytują na głos tekst wyświetlany na ekranie. Technologie te zapewniają dostęp do informacji i pomagają osobom z dysfunkcjami wzroku w interakcji z treściami cyfrowymi, czyniąc je bardziej przystępnymi i łatwiejszymi do zrozumienia. Efektywna wydajność czytnika ekranu zależy nie tylko od projektanta, ale także od dewelopera. Ważne jest, aby typy elementów były poprawnie określone w kodzie. Dzięki temu czytnik ekranu może precyzyjnie informować użytkowników niewidomych i niedowidzących o położeniu przycisków, etykiet i nagłówków na stronie. Prawidłowe znaczniki HTML pomagają poprawić dostępność treści i zapewniają lepsze wrażenia użytkownikom z wadami wzroku.

Grafika: Skillbox Media
Grafika: Skillbox Media

Aby czytniki ekranu działały prawidłowo, przyciski i nagłówki muszą być informacyjne. Ułatwia to użytkownikom bez kontekstu nawigację po interfejsie i efektywniejsze korzystanie z jego funkcji. Intuicyjne sterowanie przyczynia się do lepszej dostępności i łatwości interakcji z interfejsem.

Ułatw czytanie treści

Dekoracyjne czcionki i nieustrukturyzowane strony internetowe mogą utrudniać zrozumienie informacji, szczególnie osobom z niedoborem snu i dysleksją. Optymalizacja projektu i uproszczenie elementów wizualnych znacząco poprawia dostępność treści. Aby poprawić zrozumienie, ważne jest stosowanie czytelnych czcionek i logicznej struktury, dzięki czemu informacje będą bardziej dostępne dla wszystkich użytkowników.

Dla osób z dysleksją znajomy kształt liter w czcionce ma kluczowe znaczenie. Na przykład litera A, zaprojektowana jako kotek, jest trudna do odczytania, nawet jeśli czcionka jest ogólnie wysokiej jakości. Osoba bez dysleksji może od razu zrozumieć taką czcionkę, ale jeśli jest zmęczona, niewyspana lub odwiedza stronę w pośpiechu, będzie miała również trudności z odbiorem ozdobnej czcionki. Dlatego, aby zapewnić komfort czytania, ważne jest stosowanie prostych i łatwych do odczytania czcionek. Pomoże to nie tylko osobom z dysleksją, ale wszystkim użytkownikom, zapewniając przyjemniejsze doświadczenie podczas interakcji z tekstem na stronie internetowej.

Wytyczne Google podkreślają wagę grupowania powiązanych elementów, co jest kluczową zasadą projektowania interfejsu. Podczas interakcji z treścią, instynktownie dzielimy ją na sensowne bloki. Umieszczenie początku zdania w prawym górnym rogu ekranu, a jego końca w lewym dolnym rogu, może wyglądać atrakcyjnie, ale utrudnia zrozumienie tekstu. Prawidłowe rozmieszczenie informacji pomaga poprawić czytelność i percepcję treści, co jest ważnym czynnikiem dla użytkowników i wyszukiwarek.

Zrzut ekranu: witryna Google

Pomóż użytkownikom klikać i przewijać

Osoby z niepełnosprawnością ruchową mają trudności z używaniem obu rąk lub Precyzyjne naciskanie małych przycisków może utrudniać interakcję z różnymi urządzeniami i technologiami, co wymusza rozwój bardziej przystępnych interfejsów. Podczas tworzenia produktów ważne jest uwzględnienie potrzeb tych użytkowników, aby zapewnić im komfort i efektywność korzystania.

Google i Sber zalecają zwiększenie rozmiaru elementów klikalnych i odległości między nimi, aby poprawić komfort użytkowania. Optymalny rozmiar przycisku to co najmniej 44x44 piksele, a minimalna odległość między przyciskami powinna wynosić co najmniej 8 pikseli. Pomoże to poprawić komfort użytkowania i zwiększyć klikalność elementów witryny.

Zrzut ekranu: witryna Alfa-Bank

Jeśli element jest mały, ważne jest, aby był otoczony wystarczającą ilością białej przestrzeni. To nie tylko poprawia percepcję wizualną, ale także pomaga przyciągnąć uwagę do samego elementu, czyniąc go bardziej zauważalnym. Zwiększenie wcięć i białej przestrzeni wokół małych obiektów pomaga poprawić odbiór informacji i ułatwia interakcję z treścią. Prawidłowe wykorzystanie pustki wzmacnia akcenty i sprawia, że ​​kompozycja jest bardziej harmonijna.

Zrzut ekranu: witryna internetowa Alfa-Bank

Przestrzeń wokół elementów powinna być interaktywna i klikalna. Użytkownicy często mają trudności z precyzyjnym naciśnięciem przycisku palcem lub myszą, dlatego znaczenie zwiększenia obszaru interakcji staje się oczywiste. Poprawia to komfort użytkowania i czyni interfejs bardziej przystępnym dla wszystkich.

Projektując interfejs użytkownika, kluczowe jest zapewnienie wygodnej nawigacji za pomocą klawiatury. Obejmuje to nie tylko możliwość przewijania, ale także łatwość wybierania przycisków w celu podążania za linkami. Dla osób z dysfunkcjami motorycznymi korzystanie z klawiatury może być wygodniejsze i bardziej efektywne niż korzystanie z myszy lub touchpada. Zapewnienie dostępności interfejsu dla wszystkich użytkowników jest kluczowym aspektem tworzenia stron internetowych, który pomaga poprawić ogólne wrażenia użytkownika.

Pamiętaj o innych upośledzeniach

Użytkownicy mogą doświadczać całkowitej lub częściowej utraty słuchu, co nie zawsze uniemożliwia im interakcję ze stronami internetowymi i aplikacjami. Wiele osób decyduje się na wyciszenie dźwięku w swoich urządzeniach. Jednak w kontekście gier online i treści wideo konieczne jest zapewnienie napisów. Należy również pamiętać, że jeśli interfejs usługi korzysta z dźwięku do powiadamiania o nowych wiadomościach lub pomyślnych płatnościach, zdarzenia te powinny być dodatkowo wizualnie sygnalizowane na ekranie. Zapewni to dostępność i użyteczność dla wszystkich grup użytkowników.

Aktywna animacja może wywoływać napady padaczkowe u osób z epilepsją. Wytyczne WCAG dotyczące dostępności przewidują możliwość wyłączenia animacji bez wpływu na komfort użytkowania. Zgodnie z zaleceniami Google, animacja treści powinna wyłączać się automatycznie po pięciu sekundach, a jeśli konieczne jest miganie, jego częstotliwość powinna być ograniczona do trzech klatek na sekundę. Pomoże to zapewnić bezpieczeństwo użytkowników i sprawi, że interfejsy będą bardziej dostępne dla osób z epilepsją.

Nie da się uwzględnić wszystkich potencjalnych niepełnosprawności, które mogłyby utrudniać korzystanie ze strony internetowej lub aplikacji. Jednak migające animacje z dźwiękami i tekstem o niskim kontraście prawdopodobnie nie przypadną do gustu nawet osobom bez niepełnosprawności. Wysokiej jakości interfejs, wygodny dla większości użytkowników, to ważny krok w kierunku stworzenia produktu inkluzywnego. Poprawa dostępności interfejsu nie tylko zwiększa satysfakcję użytkowników, ale także poszerza grono odbiorców, co jest ważnym aspektem nowoczesnego projektowania stron internetowych.

Dostępność dla wszystkich jest nieosiągalna

Nawet przestrzeganie ścisłych zasad projektowania WCAG nie gwarantuje, że interfejs będzie użyteczny dla wszystkich użytkowników. Istnieje wiele niuansów i zawiłości, których nie można w pełni uwzględnić. W rezultacie interfejs może stać się bardziej dostępny dla niektórych użytkowników, ale jednocześnie utrudnić interakcję innym. Ważne jest ciągłe testowanie i dostosowywanie projektów, aby jak najlepiej spełniać potrzeby zróżnicowanej publiczności.

W sierpniu 2021 roku Twitter zaprezentował nowy wygląd, deklarując swoje zaangażowanie na rzecz inkluzywności. Firma poprawiła kontrast, wyrównanie i zwiększyła odstępy między blokami tekstu. Zmiany te miały na celu ułatwienie korzystania użytkownikom z dysleksją. Jednak wielu użytkowników wyraziło niezadowolenie. W komentarzach zauważono, że nowa czcionka Chirp była zbyt mała i trudna do odczytania, zwłaszcza dla osób z dysleksją. Co więcej, zwiększony kontrast powodował u niektórych użytkowników skargi na bóle głowy i migreny. Te negatywne reakcje podkreślają wagę uwzględniania potrzeb wszystkich użytkowników podczas projektowania interfejsów mediów społecznościowych.

Twitter odpowiedział na negatywne komentarze użytkowników kilka dni później, ale nie podjęto decyzji o powrocie do starego wyglądu. Zamiast tego firma ogłosiła jedynie drobne zmiany w wersji dla systemu Windows. Twitter nie wprowadził żadnych dalszych istotnych aktualizacji, a jesienią użytkownicy nadal publikowali komentarze z prośbami o powrót do poprzedniego interfejsu. Czcionka wygląda obecnie w interfejsie tak:

"Proszę, proszę, proszę, pomóż osobom z zespołem nadwrażliwości skotopowej rozwiązać problem z czcionką Chirp, abyśmy mogli korzystać z aplikacji. Naprawdę Cię błagamy. Jeśli zobaczę Chirp na filmie lub na ruchomym tle, zwymiotuję albo dostanę ataku." Zrzut ekranu: @cullend / Twitter

Nowy wygląd Twittera spotkał się z pozytywnymi recenzjami, ale nie da się zadowolić wszystkich użytkowników. Jednym z rozwiązań mogłoby być umożliwienie personalizacji interfejsu, pozwalając użytkownikom na dostosowanie czcionek, kolorów i przycisków do własnych preferencji. Przykład Twittera pokazuje, że nadmierna inkluzywność może mieć negatywne konsekwencje. Ważne jest, aby brać pod uwagę potrzeby różnych grup użytkowników, ale nie należy próbować zaspokajać ich wszystkich naraz. Zbyt kontrastowy interfejs z dużymi przyciskami i długimi opisami może być niewygodny dla większości użytkowników. Skuteczny projekt powinien równoważyć dostępność i użyteczność, zapewniając komfort użytkowania szerokiemu gronu odbiorców.

Projektowanie inkluzywne to podejście, które koncentruje się na tworzeniu produktów i usług dostępnych dla wszystkich użytkowników, niezależnie od ich sprawności lub niepełnosprawności. Zasada ta uwzględnia różnorodność ludzkich doświadczeń i dąży do minimalizacji barier, które mogą pojawić się podczas korzystania z różnych technologii i usług. Głównym celem projektowania inkluzywnego jest zapewnienie równych szans wszystkim, w tym osobom z niepełnosprawnościami, seniorom i osobom borykającym się z przejściowymi trudnościami. Projektowanie inkluzywne poprawia doświadczenia użytkowników, zwiększa ich satysfakcję i poszerza zasięg. Ważne jest, aby uwzględniać potrzeby zróżnicowanych grup użytkowników na wszystkich etapach rozwoju – od badań i projektowania, przez testowanie, po wdrażanie. W ten sposób projektowanie inkluzywne nie tylko rozwiązuje problemy z dostępnością, ale także tworzy lepsze i bardziej funkcjonalne rozwiązania dla wszystkich.

  • Niewidomy ekspert ds. dostępności interfejsu niewizualnego mówi o głównych błędach popełnianych przez projektantów i programistów
  • Dlaczego funkcje dla osób niepełnosprawnych są „ukryte” w projektowaniu
  • Waleria Kurmak o tandemie projektant-programista, problemach komunikacyjnych i projektowaniu inkluzywnym w Rosji

Profesjonalny projektant graficzny

Nauczysz się tworzyć elementy identyfikacji wizualnej i grafiki dla firm. Zbudujesz portfolio, które odzwierciedli Twój styl i potwierdzi Twoje umiejętności projektowe. Możesz rozpocząć karierę w studiu lub jako freelancer.

Dowiedz się więcej