(20 marca 2020)

W całej sieci projektanci i inżynierowie coraz lepiej radzą sobie z budowaniem z myślą o dostępności. W Wistia ostatnia aktualizacja naszego odtwarzacza wideo była dużym krokiem naprzód, wprowadzając ulepszenia, dzięki którym jest przyjazny dla czytnika ekranu, umożliwia nawigację za pomocą klawiatury i obsługuje audiodeskrypcje.

Ale tak fantastyczne i utalentowane jak nasz zespół, są pewne aspekty dostępności wideo, których po prostu nie możemy naprawić za kulisami. Nadal to twórcy wideo mogą zamówić napisy, dodać opisowy tekst alternatywny do swoich miniatur i wybrać kolor odtwarzacza, który będzie pasował do ich marki. Ten wybór ma duży wpływ na dostępność, ponieważ jasny kolor tła może sprawić, że tekst i ikony będą mało kontrastowe, aż do nieczytelności.

Kontrola nad wyglądem i stylem gracza jest jedną z najważniejszych funkcje, które nasi klienci wymieniają najczęściej jako powód wyboru Wistii, ale jest to również wybór, który może poważnie wpłynąć na dostęp bez zdawania sobie sprawy, o co toczy się gra.

Aby rozwiązać ten problem, postanowiliśmy zaprojektować próbnik kolorów, który ułatwia wybór dostępności.

Umieszczenie na nim liczby oznacza dokonanie świadomego wyboru za pomocą jak najmniejszej liczby kliknięć. Szukając prostego interfejsu użytkownika o niskim współczynniku tarcia do wybierania kolorów, zebraliśmy milion (?) Różnych sposobów wyboru koloru. Dlaczego te wszystkie są różne? Dlaczego nie ma standardu próbnika kolorów? Jaka jest różnica między „Jasnością” a „Jasnością”?

Odpowiedź tkwi w trójwymiarowej przestrzeni kolorów. Oznacza to, że aby dokładnie przedstawić wszystkie możliwe kolory, potrzebujesz trójwymiarowego kształtu. Model, który najbardziej odpowiada naszym instynktom dotyczącym koloru, to HSV: Hue (plama na tęczy), Saturation (czystość tego odcienia w porównaniu z jego zamgleniem zmieniającym się w szary), Value (jasność tego odcienia w porównaniu z jego wtopieniem w biel lub czarny). Każda z tych trzech zmiennych jest wymiarem niezbędnym do zdefiniowania koloru wyświetlanego na ekranie.

Tak fajnie, jak byłoby, gdyby użytkownicy wybierali kolor, przechodząc w trójwymiarowym świecie do współrzędnej (x, y, z) , która najlepiej pasuje do ich marki, nie spowodowałoby kilku kliknięć i szybkich, dobrych wyborów. Powodem, dla którego istnieje tak wiele selektorów kolorów jest to, że potrzeba pewnego stopnia abstrakcji, aby wziąć tę trójwymiarową przestrzeń kolorów i zredukować ją do dwuwymiarowego interfejsu użytkownika . Dlatego wszystkie selektory kolorów mają co najmniej dwie (czasem trzy) osie do wyboru – użytkownik musi wybrać ich x, y i z; ich odcień, nasycenie i wartość. Dla naszego zespołu projektowego te wybory oznaczają dodatkowe kliknięcia. Aby zminimalizować te kliknięcia, zadaliśmy sobie pytanie, które z nich są najważniejsze i najmniej ważne.

Wybór odcienia jest najważniejszym kliknięciem; wybranie nasycenia jest najmniej ważnym kliknięciem.

Odcień to pierwsza rzecz, o której myślimy, kiedy myślimy o wyborze koloru. W kontekście dopasowania odtwarzacza wideo do koloru marki nasycenie jest ostatnią rzeczą, o której myślimy. Dzieje się tak, ponieważ większość kolorów marki jest w pełni nasycona, a nawet jeśli tak nie jest, prawdopodobnie nadal myślisz o nich w ten sposób. Oznacza to, że wielu użytkowników nigdy nie będzie chciał, aby nasycenie wyniosło cokolwiek innego niż 100, a jeśli jest to własne kliknięcie, to kliknięcie, którego możemy potencjalnie uniknąć. To pozostawia tylko odcień i wartość do wyboru, które mogą być osiami dwuwymiarowego pola i można je wybrać jednym kliknięciem.

Oto! A wybór koloru jednym kliknięciem. A co z dostępnością? Możemy dodać tekst pomocniczy, który wyjaśnia, dlaczego kontrast jest ważny (robimy to) i pokazać obliczony współczynnik kontrastu i czy spełnia on standard (my też to robimy), ale praca do wykonania jest nadal wyborem . Nasi użytkownicy muszą zrozumieć, z czego mają do wyboru, nie tracąc kontekstu pełnego spektrum opcji. W końcu selektory kolorów są wystarczająco skomplikowane, a obejrzenie tego, co się dzieje, jest łatwiejsze dzięki animacji pokazującej, co jest zabierane.

Nasze rozwiązanie dodaje kliknięcie, ale tylko jeden. Po kliknięciu pola wyboru selektor maskuje wszystkie wartości, które nie tworzą wystarczająco dużego kontrastu w stosunku do białych elementów sterujących odtwarzacza, aby można je było uznać za dostępne. Jeśli Twoje poprzednie ustawienie nie mieści się w dopuszczalnym zakresie, odcień pozostaje taki sam, a Jasność spada do najwyższego dopuszczalnego poziomu.

Obliczenia są oparte na matematyce dostarczonej przez organizację Web Content Accessibility Guild , na której standardzie AA opieramy nasze prace nad dostępnością. Stamtąd włączamy dodatkowy współczynnik lekkości, aby uwzględnić 80\% krycie odtwarzacza Wistia. Oznacza to, że scenariusz z najniższym kontrastem, gdy odtwarzacz jest nałożony na czystą biel, nadal daje wystarczający kontrast.

Ten próbnik kolorów to tylko niewielka część naszego narzędzia ułatwień dostępu, które zawiera listę kontrolną dla każdego wideo i pomocne podpowiedzi w trakcie procesu dostosowywania, wyjaśniające, jak różne wybory wpływają na dostępność. Duża część tej pracy jest wykonywana za kulisami przez firmę Wistia, ale pomagamy użytkownikom w zapoznawaniu się z ustawieniami, które muszą dostosować, to sposób, w jaki staramy się, aby dostępność była łatwym wyborem.