Wpływ projektu Microsoft Inclusive Design na kod Visual Studio

uniwersalny, lub projekt inkluzywny to nowa filozofia projektowania, którą Microsoft ostatnio całkiem poważnie podchodzi do rozwoju oprogramowania. Projekt obejmujący przenosi projekt dostępny na wyższy poziom, ponieważ postrzega dostępność z dużo szerszej perspektywy. Kiedy testowałem nowy edytor kodu źródłowego Microsoftu, Visual Studio Code, kwestia jak wdrożyli teorię w praktyce naturalnie powstało w moim umyśle.

Ten post nie ma być wyłącznie opisem funkcji ułatwień dostępu w Visual Studio Code, ponieważ w oficjalnych dokumentach można znaleźć ich znakomite podsumowanie, ale raczej ma to być studium przypadku, na co należy zwrócić uwagę, kiedy chcesz zaprojektuj integracyjną aplikację w przyszłości.

Ponieważ możemy być pewni, że integracja wkrótce będzie wymaganiem zarówno w przypadku oprogramowania, jak i projektowania stron internetowych, oczywiście nie tylko z powodów altruistycznych, ale dlatego, że przyniesie wielu nowych użytkowników do stołu.

4 zasady projektowania włączającego firmy Microsoft

Windows Dev Center udostępnia dostępne oprogramowanie wewnątrz kategorii użyteczności, opublikowali także wiele świetnych artykułów na ten temat. Microsoft cztery zasady projektowania włączającego (wymienione poniżej krótko) są omówione w tym artykule.

1. Myśleć uniwersalny.
2. Zrób to osobisty.
3. Zatrzymaj to prosty.
4. Stwórz rozkosz.

Jeśli przeczytałeś oryginalny artykuł, zobaczysz zasady wyjaśnione w sposób, który nie zawsze jest łatwy do przetestowania, używając wyrażeń takich jak "więź emocjonalna", „wywołaj cud”, i "magiczny". Więc wolę pozostać przyziemnym, usunąć te subiektywne konotacje i przekształcić zasady w obiektywne kryteria.

Kiedy analizuję sposób ich implementacji w kodzie Visual Studio, używam ich w następującym znaczeniu:

1. Myśleć uniwersalny: Dostępność
2. Zrób to osobisty: Możliwość dostosowania, rozszerzalność
3. Zatrzymaj to prosty: Logiczny interfejs użytkownika bez zakłóceń
4. Stwórz rozkosz: Możliwość wykrywania funkcji

Oczywiście jest to tylko jedna możliwa kategoryzacja i są wiele nakładających się, na przykład możliwość dostosowania może być również częścią “Stwórz rozkosz” zasada, ale ponieważ potrzebujemy czegoś namacalnego, trzymajmy się tej interpretacji na razie.

Podczas gdy Windows Dev Center zaleca stosowanie tych ogólnych zasad projektowania w aplikacjach Windows 10, Microsoft poświęcił także swoją witrynę Microsoft Design projektowi obejmującemu.

Chociaż Visual Studio Code nie jest przeznaczony wyłącznie dla systemu Windows 10, ale ma być oprogramowanie wieloplatformowe, wciąż możemy bezpiecznie przetestować jego funkcje pod kątem wyżej wymienionych zasad, ponieważ Microsoft wyraźnie traktuje projektowanie integracyjne jako ścieżkę projektowania oprogramowania, którą chce śledzić w przyszłości.

Think Universal

Pod “Think Universal” Zasadniczo przeanalizujemy, jak dostępny jest kod Visual Studio dla różnych grup użytkowników, takich jak użytkownicy technologii wspomagających (bez względu na to, czy korzystają z nich w przypadku niepełnosprawności lub preferencji), osoby z ograniczonymi technologiami, osoby, dla których angielski nie jest językiem ojczystym itp..

1. Powiększ

Powiększenie można łatwo wykonać, naciskając Ctrl + = / Cmd + = (Prochowiec) skrót klawiaturowy dla Zbliżenie, i Ctrl + - / Cmd + - (Prochowiec) skrót do Pomniejsz, a także możemy uzyskać dostęp do funkcji Zoom za pomocą górnego paska menu.

Zauważ, że od wersji 1.1.1 na klawiaturach Windows znaki + i - nie działają na klawiaturze numerycznej po prawej stronie, tylko na klawiaturze wpisującej (alfanumerycznej) - która prawdopodobnie nie jest najlepsza do włączania.

Funkcja Trwałego poziomu powiększenia nieco to kompensuje, ponieważ pozwala nam łatwo skonfigurować stały poziom powiększenia w ustawieniach użytkownika (przeczytaj mój poprzedni post, jak to zrobić).

2. Temat o wysokim kontraście

Motywy o wysokim kontraście ułatwiają przetwarzanie informacji wizualnych dla użytkowników niedowidzących, dlatego są ważnym elementem dostępności.

Jest domyślny motyw High Contrast w kodzie Visual Studio, które można ustawić, klikając Plik> Preferencje> Motyw kolorów menu, ale możesz także pobrać inne z Marketplace Code Visual Studio.

Microsoft wprowadził motywy wysokiego kontrastu w systemie Windows 7, miło jest zobaczyć, że są one zgodne z tą funkcją.

3. Nawigacja za pomocą klawiatury

Zapewnienie nawigacji klawiaturowej jest niezbędne dla osób, które nie mogą korzystać z myszy z powodu niepełnosprawności wzrokowej lub ruchowej. Skuteczna nawigacja klawiaturowa pociąga za sobą użytkowników może kontrolować każdą funkcjonalność oprogramowania używając tylko klawiatury.

Kod Visual Studio ładnie implementuje tę funkcję i chociaż ma wiele wstępne powiązania klawiszy (zobacz pełną listę), użytkownicy mogą również dostosować skróty klawiaturowe za pomocą pliku konfiguracyjnego w formacie JSON.

4. Nawigacja na karcie

Nawigacja tabulatorem umożliwia przeskakiwać po różnych obszarach kodu Visual Studio.

Obecnie, od wersji 1.1.1, kod VS nie obsługuje nawigacji po kartach dla wszystkich obszarów, na przykład górny pasek menu nie jest dostępny w ten sposób. Dobrą wiadomością jest to, że Microsoft potwierdza brak tej funkcji w bieżących znanych problemach w dokumentach.

Podczas testów odkryłem, że Redaktor, Pasek boczny, Zobacz pasek (patrz nazywanie obszarów kodu VS), a wszystkie ich działania i elementy są dostępne za pomocą klawisza Tab. Chociaż użytkownicy kart nie mogą uzyskać dostępu do funkcji górnego paska menu za pomocą klawiatury. Paleta poleceń F1 może w pewnym stopniu zastąpić tę opcję, ponieważ wszystkie polecenia, które można znaleźć w górnym menu, są również dostępne z tego miejsca.

Ważną funkcją ułatwień dostępu do nawigacji w kartach jest pułapka kart, która umożliwia użytkownikom przełączanie się między dwiema funkcjami klawisza Tab. Uwięziony klawisz Tab umożliwia poruszać się po różnych częściach kodu VS, podczas gdy zwykle klawisz Tab dodaje znak tabulacji do pliku tekstowego otwórz w obszarze edytora. Użytkownicy mogą przełączać się między tymi dwiema możliwościami, naciskając klawisz Ctrl + M.

5. Czytniki ekranu

Oczywiście dostępne oprogramowanie musi być również w pełni dostępne dla użytkowników czytników ekranu. Dokumenty wspominają, że zespół VS Code dev przetestował dostępność czytnika ekranu z czytnikiem ekranu NVDA.

Do testowania użyłem dwóch innych czytników ekranu, JAWS, który jest jedną z najczęściej używanych aplikacji do czytania ekranu, oraz Microsoft Narrator, który jest wbudowanym czytnikiem ekranu Windows 10.

SZCZĘKI uważnie czytaj wszystkie obszary, polecenia i menu, jednak Narrator miał mniejsze problemy z tym zadaniem. Na przykład poprawnie odczytuje elementy menu z góry tylko wtedy, gdy poruszałem się po nich za pomocą myszy, ale nie wtedy, gdy użyłem strzałki w dół na mojej klawiaturze. Jest to jednak raczej wada Narratora, a nie kodu Visual Studio, więc możemy bezpiecznie założyć, że użytkownicy niedowidzący mogą uzyskać dostęp do wszystkich funkcjonalności Kodu VS za pomocą bardziej zaawansowanej aplikacji czytnika ekranu.

6. Dostępność debugera

Aby aplikacja była w pełni dostępna i integracyjna, musimy także zadbać o części, które prawdopodobnie nie przychodzą nam na myśl. W przypadku kodu Visual Studio, dobrym przykładem jest debugger. Zespół deweloperów zwrócił również uwagę na to, aby był on również włączony, dlatego obsługuje także nawigację na klawiaturze i klawiaturze, a jego czytnik ekranu jest dostępny.

7. Lokalizacja

Teraz jesteśmy gotowi do omówienia funkcji dostępności Listy kodów VS w dokumentach, ale są też inne ważne rzeczy, o których musimy wspomnieć, gdy mówimy o “Think Universal” inkluzywna zasada projektowania. Jednym z nich jest lokalizacja lub innymi słowami wsparcie dla języków obcych jako język wyświetlania, ponieważ wielu ludzi na świecie nie jest rodzimymi użytkownikami języka angielskiego.

Kod Visual Studio jest obecnie zlokalizowany 10 różnych języków wyświetlania (Angielski, chiński uproszczony, chiński tradycyjny, francuski, niemiecki, włoski, japoński, koreański, rosyjski, hiszpański).

Użytkownicy pochodzący z tych języków nie muszą nawet konfigurować swojego języka wyświetlania, jak VS Code domyślnie wybiera język wyświetlania systemu operacyjnego. Jeśli chcą ustawić inny język jako język wyświetlania, mogą łatwo skonfigurować ich język locale.json plik.

Prawdopodobnie 10 języków wyświetlania nie jest aż tak wiele, ale nie jest też źle, jeśli weźmiemy pod uwagę, że kod VS jest nowym oprogramowaniem, a Microsoft najprawdopodobniej będzie obsługiwał więcej w przyszłości. Na razie użytkownicy, których język nie jest wśród obsługiwanych, instalują swój kod VS w języku angielskim.

8. Dostępny rozmiar

Nowoczesne edytory kodu źródłowego nie są zbyt duże, a Microsoft również dołączył do tego trendu, ponieważ kod Visual Studio to mniej niż 100 MB pobieranie, a jego ślad na dysku jest mniejszy niż 200 MB.

9. Rozwój wieloplatformowy

Jeśli chcemy oprogramowania integracyjnego, oczywiście musi to być także platforma wieloplatformowa, co oznacza, że ​​musi działać na różnych systemach operacyjnych. Kod VS spełnia ten wymóg, ponieważ obsługuje Windows, OS X i Linux także.

Zrób to osobiście

“Zrób to osobiście” to druga zasada Microsoft dotycząca projektowania włączającego i przyjrzymy się temu możliwość dostosowania i rozciągliwość zgodnie z tym kryterium, jak obiecałem wcześniej. Kod Visual Studio spełnia oba wymagania tak ładnie, że nawet napisałem osobne posty na obu z nich, tutaj na temat dostosowywania, a tutaj na temat rozszerzalności.

W skrócie, konfigurowalność jest zaimplementowana za pomocą niestandardowe motywy i modułowe ustawienia konfiguracji formatu JSON, podczas gdy rozszerzalność osiąga się przez niestandardowe rozszerzenia użytkownicy mogą pobierać z Visual Studio Code Marketplace lub tworzyć własne w TypeScript lub JavaScript.

Tutaj możesz przeczytać więcej o technicznym podłożu podejścia Visual Studio Code do rozszerzalności.

Możliwość dostosowania jest rozwiązana w sposób idealny dla ludzi znających się na technologii, którzy są typowymi użytkownikami edytorów kodu źródłowego, ponieważ znaczna ich część jest implementowana za pośrednictwem modułowe pliki konfiguracyjne w formacie JSON.

To świetne rozwiązanie, ponieważ opcje konfiguracji nie są ukryte za ogromną hierarchią menu, która jest trudna do przejrzenia. Użytkownicy, nawet jeśli nie kodują ekspertów, mogą łatwo edytuj swój zwyczaj .json pliki, ponieważ kod Visual Studio otwiera domyślne i niestandardowe ustawienia w dwóch panelach edytora obok siebie, umożliwiając użytkownikom łatwe eksperymentowanie z nimi.

Pliki konfiguracyjne są modularyzowane, stanowią logiczną strukturę hierarchii .json pliki, oto lista najważniejszych:

1. settings.json dla niestandardowe ustawienia użytkownika, dostępne przez Plik> Preferencje> Ustawienia użytkownika menu
2. .vscode / settings.json dla niestandardowe ustawienia obszaru roboczego, dostępne przez Plik> Preferencje> Ustawienia obszarów roboczych menu
3. keybindings.json dla niestandardowe powiązania klawiszy, dostępne przez Plik> Preferencje> Skróty klawiaturowe menu
4. javascript.json, php.json, css.json, c.json, i kilka innych .json pliki dla różnych języków programowania do konfiguracji niestandardowe fragmenty użytkownika, dostępne przez Plik> Preferencje> Fragmenty użytkownika menu
5. launch.json dla niestandardowe ustawienia debugera, dostępne po kliknięciu ikony koła zębatego na górnym pasku widoku debugowania (po lewej stronie edytora)
6. .vscode / locale.json dla niestandardowe ustawienia języka wyświetlacza, dostępne po wpisaniu Konfiguruj język polecenie do palety poleceń (F1)
7. .vscode / tasks.json dla niestandardowe ustawienia paska zadań, dostępne po wpisaniu Skonfiguruj Runner zadań polecenie do palety poleceń (F1)

Myślę, że użytkownicy VS Code nie mogą narzekać na możliwości dostosowania, ponieważ nawet wymienienie opcji było wyczerpującym zadaniem.

Ponieważ opcje konfiguracji są modułowe, użytkownicy muszą się nimi zająć naprawdę potrzebują, co pomaga im skupić się na zadaniach, które chcą wykonywać. W ten sposób pozostanie im bardziej intuicyjny przepływ pracy.

Nie komplikuj

Możemy spotkać się z Microsoftem Nie komplikuj włącznie z zasadą projektowania w wielu innych miejscach programowania i projektowania, pomyśl tylko o zasadzie projektowania KISS (Keep It Simple, Stupid) i DRY (Don't Repeat Yourself). W tym bieżącym kontekście skupimy się na prostota interfejsu użytkownika.

Jeśli chodzi o dostępność, łatwy w użyciu, prosty interfejs użytkownika jest zwykle zalecany ze względu na użytkowników z upośledzeniem funkcji poznawczych i intelektualnych. Ponieważ Visual Studio Code jest edytorem kodu źródłowego, prawdopodobnie nie jest to oprogramowanie, które jest często używane przez ludzi, którzy mają tego rodzaju upośledzenie, jednak mogą występować również szare obszary.

Prostota jest jednak ważna nie tylko z ich powodu, ale również dobrze zaprojektowany interfejs logiczny obniż krzywą uczenia się, i zwiększyć szybkość pracy, uczynienie oprogramowania bardziej atrakcyjnym dla ogółu społeczeństwa.

Kod Visual Studio również wykorzystuje dobrze znane zjawisko psychologiczne, efekt zwykłej ekspozycji (lub zjawisko znajomości), ponieważ przyjmuje podstawowy układ podobny do układu innych znanych edytorów kodu źródłowego, takich jak Atom, użyj.

Z dokumentów możemy dowiedzieć się, że było to przedsięwzięcie, które Microsoft wywarł ogromny wpływ na:

Kod VS zapewnia również użytkownikom funkcję edycji obok siebie, którą można znaleźć także w innych edytorach kodu źródłowego, i to nie przypadek, ponieważ znacznie upraszcza proces kodowania, i oczywiście przyczynia się do “Nie komplikuj” integracyjna zasada projektowania.

Oprócz podstawowego interfejsu użytkownika, Visual Studio Code ma fajne funkcje, o których warto wspomnieć w artykule o projektowaniu włączającym, takim jak:

• Intellisense która dostarcza użytkownikom sugestie oparte na kontekście (część zaplecza wykorzystująca sztuczną inteligencję jest również dobrym rozwiązaniem)
• Zerkać (Shift + F12), który wyświetla pełne definicje funkcji w oknie wbudowanym
• Paleta poleceń (F1), który powoduje, że wszystkie polecenia są dostępne w tym samym miejscu.

Utwórz rozkosz

Nie jest szczególnie łatwo znaleźć konkretne kryteria, których możemy użyć do zbadania “Utwórz rozkosz” inkluzywna zasada projektowania, więc ostatecznie zdecydowałem się na kryterium możliwość odkrywania funkcji, jak Microsoft zdefiniował tę zasadę w następujący sposób:

To sformułowanie może przypomnieć wielu z was o mikro-momentach, jednej z najnowszych wielkich rzeczy w Google, a zatem pokazać, w jaki sposób wiodące firmy technologiczne mogą dojść do podobnych wniosków, kiedy zastanawiają się, jak przenieść branżę do przodu.

W projektowaniu włączającym bardzo ważne jest angażować użytkowników, i wzbudzić ich ciekawość, że możemy osiągnąć prawdopodobnie najlepsze, jeśli my pomóż im iść naprzód kiedy osiągnęli pewien punkt w podróży użytkownika. Właśnie w odpowiednim momencie, nie przed, nie po.

Kiedy o tym mówimy możliwość odkrywania funkcji, bardziej światowy przejaw tworzenia rozkoszy, może być zwiększony przez takie rzeczy, jak dobrze zaprojektowana nawigacja użytkowa, inteligentna dokumentacja i pomocnicze informacje, które pojawiają się tylko w odpowiednim momencie.

Możemy znaleźć przykłady wszystkich tych funkcji w Visual Studio Code, pomyśl tylko o powyższych IntelliSense i Paleta poleceń, ale Podświetlanie składni i własne fragmenty kodu może również pomóc użytkownikom w maksymalnym wykorzystaniu oprogramowania. Musisz sam ocenić, czy korzystanie z Visual Studio Code pozostawia uczucie zadowolenia.

Dla siebie bardziej lubiłem to doświadczenie: dobrze zorganizowana dokumentacja online, łatwy w nawigacji rynek Visual Studio Code, i niestandardowe motywy kolorów które można przeglądać w czasie rzeczywistym, przewijając listę rozwijaną (dostęp do niej przez Plik> Preferencje> Motyw kolorów menu).

Ostatnie słowa

Ponieważ projektowanie włączające jest nową dziedziną, przemysł technologiczny jest nadal w fazie eksperymentów. Myślę, że Microsoft dokonał znaczącego przełomu określenie czterech zasad projektowania włączającego.

Jak widzieliśmy, udało im się z powodzeniem wdrożyć teorię w praktyce w swoim nowym edytorze kodu źródłowego, Visual Studio Code, chociaż nadal istnieją pewne pola do ulepszenia, takie jak zapewnienie pełnej obsługi Tab i globalnej funkcji Search and Replace.

Ponieważ zarówno dostępność, jak i integracja są części doświadczenia użytkownika, dobrym pomysłem jest dowiedzieć się o nich więcej, jeśli chcesz być na bieżąco z najnowszymi trendami w branży. Oto zasoby, które mogą pomóc:

• Artykuły o dostępności Windows Dev Center
• Podręcznik pakietu Microsoft Design Inclusive Design Toolkit (PDF) (do pobrania)
• Znacznik dostępności Hongkiat.com