Vplyv dizajnu Microsoft Inclusive v kóde Visual Studio

univerzálne, alebo vrátane dizajnu je nová filozofia dizajnu. Zdá sa, že Microsoft nedávno vcelku bral do úvahy vývoj softvéru. Inkluzívny dizajn priblížil dizajn na ďalšiu úroveň, pretože vidí dostupnosť z oveľa širšej perspektívy. Keď som bol testovanie nového editora zdrojového kódu spoločnosti Microsoft, Visual Studio Code, otázka ako implementovali teóriu v praxi prirodzene vznikol v mojej mysli.

Tento príspevok nemá v úmysle byť len popisom funkcií prístupnosti programu Visual Studio Code, pretože v oficiálnych dokumentoch nájdete skvelú recenziu, ale spočíva skôr v prípadovej štúdii o tom, na čo treba venovať pozornosť, keď chcete vytvorte inkluzívnu aplikáciu v budúcnosti.

Pretože si môžeme byť istí, že inkluzívnosť bude čoskoro požiadavkou v softvéri aj dizajne webových stránok, samozrejme nielen z altruistických dôvodov, ale preto, že prinesie do tabuľky mnoho nových používateľov.

Microsoft 4 princípy inkluzívneho dizajnu

Program Windows Dev Center sprístupňuje prístupný softvérový dizajn v kategórii Použiteľnosť, a tiež publikovali veľa skvelých článkov na túto tému. Microsoft štyri princípy inkluzívneho dizajnu (uvedené stručne nižšie) sú diskutované v tomto článku.

1. premýšľať univerzálne.
2. Urobiť to osobné.
3. Nechaj si to prostý.
4. vytvoriť potešenie.

Ak ste si prečítali pôvodný článok, uvidíte, že zásady sú vysvetlené tak, že nie je vždy ľahké otestovať pomocou výrazov, ako je "emocionálne spojenie", "vyvolávajte zázrak", a "magický". Takže radšej by som zostal na zemi, odstrániť tieto subjektívne konotácie a premeniť princípy na objektívne kritériá.

Keď analyzujem, ako sa implementujú v programe Visual Studio Code, používam ich v nasledujúcom zmysle:

1. premýšľať univerzálne: Prístupnosť
2. Urobiť to osobné: Prispôsobiteľnosť, rozšíriteľnosť
3. Nechaj si to prostý: Bezrozdeľovacie, logické používateľské rozhranie
4. vytvoriť potešenie: Zisťovateľnosť funkcií

Samozrejme, je to len jedna možná kategorizácia a existujú mnoho prekrývaní, napríklad prispôsobiteľnosť môže byť tiež súčasťou “Vytvorte rozkoš” ale keďže potrebujeme niečo hmatateľné, poďme za túto interpretáciu zachovať zatiaľ.

Zatiaľ čo aplikácia Windows Dev Center odporúča, aby boli tieto aplikácie aplikované pre aplikácie systému Windows 10 zahrnuté, prináša spoločnosť Microsoft svojmu dizajnu Microsoft Design aj inkluzívny dizajn.

Napriek tomu, že kód Visual Studio nie je určený výlučne pre Windows 10, ale má byť a softvér s viacerými platformami, stále môžeme bezpečne testovať jeho funkcie na základe vyššie uvedených zásad, keďže spoločnosť Microsoft jednoznačne zaobchádza s inkluzívnym dizajnom ako s návrhom cesty, ktorú chceme v budúcnosti sledovať.

Myslite Universal

Pod “Myslite Universal” princíp, budeme skúmať, ako prístupný kód Visual Studio pre rôzne skupiny používateľov, ako sú používatelia asistenčných technológií (či už ich používajú na zdravotné postihnutia alebo preferencie), ľudia s obmedzenými technológiami, iní než hovoriaci anglicky, atď..

1. Zoom

Zoom môžete jednoducho vykonať stlačením tlačidla Ctrl + = / Cmd + = (Mac) klávesová skratka pre Priblížiť, a Ctrl + - / Cmd + - (Mac) skratka pre Oddialiť, a môžeme pristupovať aj k funkcii Priblíženie cez hornú lištu ponuky.

Upozorňujeme, že od verzie 1.1.1 na klávesniciach Windows znaky + a - nefungujú na numerickej klávesnici vpravo, iba na klávesnici s písaním (alfanumerická) - čo pravdepodobne nie je najlepšie pre inkluzívnosť.

Funkcia pretrvávajúcej priblíženie mierne kompenzuje toto, pretože nám umožňuje ľahko konfigurovať a trvalá úroveň zväčšenia v užívateľských nastaveniach (prečítajte si môj prepracovaný príspevok o tom, ako to urobiť).

2. Tému s vysokým kontrastom

Tóny s vysokým kontrastom uľahčujú spracovanie vizuálnych informácií pre zrakovo postihnutých používateľov, a preto sú dôležitým prvkom dostupnosti.

Je tu a predvolená téma s vysokým kontrastom v kóde Visual Studio, ktorý môžete nastaviť kliknutím na Súbor> Predvoľby> Tému farieb menu, ale môžete si stiahnuť aj z Visual Studio Code Marketplace.

Microsoft predstavil High Contrast témy v systéme Windows 7, je pekné vidieť, že s touto funkciou postupujú.

3. Navigácia na klávesnici

Poskytovanie navigácie pomocou klávesnice je nevyhnutné pre ľudí, ktorí nemôžu používať myš kvôli vizuálnym alebo pohybovým postihnutím. Efektívna navigácia klávesnicou znamená, že používatelia môže ovládať všetky funkcie softvéru pomocou klávesnice.

Kód Visual Studio pekne implementuje túto funkciu a zatiaľ čo má veľa prednastavené viazanie tlačidiel (pozri celý zoznam), môžu používatelia tiež prispôsobiť klávesové skratky pomocou konfiguračného súboru vo formáte JSON.

4. Karta Tab

Navigácia na karte umožňuje skákať cez rôzne oblasti kódu Visual Studio.

V súčasnosti od verzie 1.1.1 kód VS nepodporuje navigáciu na karte pre všetky oblasti, napríklad horná lišta ponuky nie je takto dostupná. Dobrou správou je, že Microsoft uznáva nedostatok tejto funkcie v aktuálnych známych otázkach v dokumentoch.

Počas testovania som zistil, že Editor, Bočný panel, Zobraziť panel (pozrite názov oblastí VS kódu) a všetky ich akcie a položky sú prístupné pomocou tlačidla Tab. Aj keď používatelia karty Tab nemajú prístup k funkciám hornej lišty s klávesnicou. Príkazová paleta F1 môže nahradiť túto zmenu, pretože všetky príkazy, ktoré sa nachádzajú v hornom menu, môžu byť prístupné aj odtiaľ.

Dôležitou funkciou prístupnosti navigácie na karte je zachytávanie kariet, ktoré umožňuje používateľom prepínať medzi dvoma funkciami tlačidla Tab. Uzamknuté tlačidlo Tab umožňuje pohybovať cez rôzne časti kódu VS, zatiaľ čo normálne tlačidlo Tab pridáva do textového súboru znak Tab otvorte v oblasti editora. Používatelia môžu prepínať medzi týmito dvoma spôsobmi tým, že na klávesovú skratku stlačia klávesy Ctrl + M.

5. Čítačky obrazovky

Samozrejme, prístupný softvér musí byť plne dostupný aj pre používateľov čítačky obrazovky. Dokumenty uvádzajú, že tím VS Code dev testoval dostupnosť čítačky obrazoviek pomocou čítačky obrazovky NVDA.

Na testovanie som použil dve ďalšie čítačky obrazovky, JAWS, ktorá je jednou z najpoužívanejších aplikácií na čítanie obrazovky a Microsoft Narrator, ktorý je vstavaný čítač obrazovky Windows 10.

JAWS čítať nahlas všetky oblasti, príkazy a ponuky starostlivo, ale Narrator mal s úlohou menšie problémy. Napríklad, keď som sa pohyboval s nimi myšou, správne si prečítal hlavné položky menu, ale nie keď som použil šípku nadol na klávesnici. Toto je však skôr nedostatok programu Narrator, nie Visual Studio Code, takže môžeme bezpečne predpokladať, že používatelia so zrakovým postihnutím majú prístup ku všetkým funkciám kódu VS pomocou pokročilejšej aplikácie na čítanie obrazovky.

6. Prístupnosť ladiača

Ak chcete, aby bola aplikácia plne prístupná a obsiahle, musíte sa tiež postarať o časti, ktoré pravdepodobne nejdú najprv na myseľ. V prípade kódu Visual Studio je na to debugger dobrý príklad. Dev tím venoval pozornosť tomu, aby bol tiež inkluzívny, preto podporuje aj kartu Tab a navigáciu pomocou klávesnice a je prístupný aj na čítačku obrazovky.

7. Lokalizácia

Teraz sme pripravení diskutovať o funkciách zoznamu dostupnosti VS kóde v dokumente, ale sú tu aj iné dôležité veci, ktoré potrebujeme spomenúť, keď hovoríme o “Myslite Universal” inkluzívneho návrhu. Jedným z nich je lokalizácia alebo iné slová podpora cudzích jazykov ako jazyk zobrazenia, keďže mnohí ľudia na svete nie sú pôvodnými anglicky hovoriacimi.

Kód Visual Studio je aktuálne lokalizovaný pre 10 rôznych jazykov zobrazenia (Angličtina, zjednodušená čínština, tradičná čínština, francúzština, nemčina, taliančina, japončina, kórejčina, ruština, španielčina).

Používatelia prichádzajúci z týchto jazykov nemusia dokonca nakonfigurovať svoj jazyk na zobrazenie ako VS kód naberá predvolene jazyk pre zobrazenie operačného systému. Ak chcú nastaviť iný jazyk ako jazyk zobrazenia, môžu ľahko nakonfigurovať svoje locale.json súbor.

Pravdepodobne 10 jazykov zobrazovania nie je toľko, ale nie je ani zlé, ak vezmeme do úvahy, že kód VS je nový softvér a spoločnosť Microsoft s najväčšou pravdepodobnosťou bude podporovať viac v budúcnosti. Zatiaľ používatelia, ktorých jazyk nie je medzi podporovanými, dostanú svoj kód VS nainštalovaný v angličtine.

8. Dostupná veľkosť

Moderné editory zdrojových kódov nie sú naozaj veľké a spoločnosť Microsoft sa taktiež pripojila k tomuto trendu, keďže kód Visual Studio je a menej ako 100 MB sťahovať a jeho disková stopa je menšia ako 200 MB.

9. Rozvoj medzi jednotlivými platformami

Ak chceme inkluzívny softvér, samozrejme musí byť aj platforma, čo znamená, že musí fungovať na rôznych operačných systémoch. Kód VS spĺňa túto požiadavku, pretože podporuje Windows, OS X a Linux tiež.

Urobiť to osobne

“Urobiť to osobne” je druhým princípom inkluzívneho dizajnu spoločnosti Microsoft a my sa na to pozrieme prispôsobiteľnosť a prodloužitelnost podľa tohto kritéria, ako som to už sľúbil. Visual Studio Code spĺňa oba požiadavky tak pekne, že som dokonca napísal samostatné príspevky na obidvoch, tu na prispôsobiteľnosť a tu na rozšíriteľnosť.

Stručne povedané, prispôsobiteľnosť je implementovaná s vlastné témy a modularizované nastavenia konfigurácie JSON, zatiaľ čo rozšíriteľnosť je dosiahnutá vlastné rozšírenia ktoré môžu používatelia prevziať z Visual Studio Code Marketplace alebo vytvoriť ich vlastné buď v TypeScript, alebo JavaScript.

Viac informácií o technickom zázemí prístupu Visual Studio Code k rozšíriteľnosti nájdete tu.

Prispôsobiteľnosť je riešená spôsobom, ktorý je ideálny pre technicky zdatných ľudí, ktorí sú typickými používateľmi editorov zdrojových kódov, pretože významná časť je implementovaná prostredníctvom modularizované konfiguračné súbory vo formáte JSON.

Toto je skvelé riešenie, pretože možnosti konfigurácie nie sú skryté za obrovskú hierarchiu v ponukách, ktorú je ťažké vidieť. Používatelia, aj keď nie sú odborníkmi na kódovanie, môžu ľahko upraviť ich vlastné .json súbory, ako Visual Studio Code otvára predvolené a vlastné nastavenia v dvoch tabuľkách editora hneď vedľa seba, čo umožňuje používateľom ľahko experimentovať s nimi.

Konfiguračné súbory sú modularizované, prichádzajú ako logicky štruktúrovaná hierarchia .json súborov, tu je zoznam najdôležitejších:

1. settings.json pre vlastné nastavenia používateľa, prístupné cez internet Súbor> Predvoľby> Nastavenia používateľa Ponuka
2. .vscode / settings.json pre vlastné nastavenia pracovného priestoru, prístupné cez internet Súbor> Predvoľby> Nastavenia Workpraces Ponuka
3. keybindings.json pre vlastné viazanie kľúčov, prístupné cez internet Súbor> Predvoľby> Klávesové skratky Ponuka
4. javascript.json, php.json, css.json, c.json, a veľa ďalších .json súbory pre rôzne programovacie jazyky na nastavenie vlastné úryvky používateľa, prístupné cez internet Súbor> Predvoľby> Odchýlky používateľov Ponuka
5. launch.json pre vlastné nastavenia Debugger, prístupné kliknutím na ikonu ozubeného kolieska v hornom paneli Debug View (vľavo od editora)
6. .vscode / locale.json pre vlastné nastavenia Jazyka zobrazenia, prístupné zadaním Konfigurovať jazyk do príkazovej palety (F1)
7. .vscode / tasks.json pre vlastné nastavenia úloh, prístupné zadaním Konfigurácia úloh do príkazovej palety (F1)

Myslím, že používatelia kódu VS nemôžu sťažovať na prispôsobiteľnosť, pretože dokonca zoznam možností je vyčerpávajúca úloha.

Keďže možnosti konfigurácie sú modularizované, používatelia sa o ne musia postarať skutočne potrebujú, čo im pomáha udržiavať pozornosť na úlohách, ktoré chcú vykonávať. Preto budú ponechané s intuitívnejším pracovným postupom.

Udržujte to jednoduché

Môžeme sa stretnúť so spoločnosťou Microsoft Udržujte to jednoduché inkrementálnym princípom dizajnu na mnohých iných miestach v programovaní a dizajne, premýšľajte o princípe návrhu KISS (Keep It Simple, Stupid) a princípe vývoja softvéru DRY (Do not Repeat Yourself). Pre tento bežiaci kontext sa budeme sústreďovať na jednoduchosť užívateľského rozhrania.

Z hľadiska dostupnosti sa zvyčajne odporúča ľahko použiteľné jednoduché používateľské rozhranie pre používateľov s kognitívnym a intelektuálnym postihnutím. Vzhľadom k tomu, Visual Studio kód je editor zdrojového kódu, pravdepodobne nie je softvér, ktorý je často používaný ľuďmi, ktorí majú takéto poškodenie, ale môžu byť aj niektoré šedé oblasti.

Jednoduchosť nie je dôležitá len preto, lebo je to aj dobre navrhnuté, logické rozhranie znížiť krivku učenia, a zvýšiť rýchlosť práce, čím sa softvér stáva atraktívnejším pre celú populáciu.

Visual Studio Code tiež využíva dobre známy psychologický jav, efekt samotnej expozície (alebo fenoménu znalosti), pretože prijíma základné rozloženie, ktoré je podobné rozloženiu iných známych editorov zdrojových kódov, napríklad Atom, použitie.

Z dokumentov môžeme vedieť, že to bolo úsilie, ktoré spoločnosť Microsoft priniesla obrovský vplyv na:

Kód VS tiež poskytuje používateľom funkciu Editing Side by Side, ktorá sa nachádza aj v iných editorech zdrojových kódov, a nie je to náhoda, pretože to spôsobuje, že kódovanie je oveľa jednoduchšie, a samozrejme prispieva k “Udržujte to jednoduché” inkluzívny dizajnový princíp.

Na vrchole základného používateľského rozhrania má Visual Studio Code vynikajúce funkcie, ktoré stojí za zmienku v článku o inkluzívnom dizajne, ako napríklad:

• Intellisense ktorý poskytuje používateľom návrhy založené na kontexte (časť, ktorá využíva umelú inteligenciu, je tiež pekným riešením)
• pokukovať (Shift + F12), ktorý zobrazuje kompletné definície funkcií v inline okne
• Príkazová paleta (F1), ktorý sprístupňuje všetky príkazy na tom istom mieste.

Vytvorte radosť

Nie je osobitne ľahké nájsť hmatateľné kritériá, ktoré môžeme použiť na preskúmanie “Vytvorte radosť” inkluzívny dizajnový princíp, takže som sa nakoniec rozhodol pre kritérium funkcia vyhľadávania, keďže spoločnosť Microsoft definovala tento princíp nasledujúcim spôsobom:

Táto fráza môže mnohým z vás pripomínať mikro-momenty, jednu z najdôležitejších vecí spoločnosti Google, a preto ukázať, ako vedúce technologické spoločnosti môžu dospieť k podobným záverom, keď premýšľajú o tom, ako presunúť priemysel dopredu.

V inkluzívnom dizajne je veľmi dôležité zapojiť používateľov, a vzbudiť ich zvedavosť, že môžeme dosiahnuť pravdepodobne to najlepšie, ak by sme my pomôžte im vpred keď dosiahli určitú chvíľu v ich cestách užívateľa. proste v správnom okamihu, nie skôr, nie po.

Keď o tom hovoríme funkcia vyhľadávania, čím viac svetového prejavu vytvárania radosti, môže byť zvýšený o veci ako dobre navrhnutá utilita navigácie, inteligentná dokumentácia a podporné informácie, ktoré sa objavia len v správnom čase.

Môžeme nájsť príklady všetkých týchto funkcií v programe Visual Studio Code, stačí zamyslieť sa nad uvedenými IntelliSense a Príkazová paleta, ale zvýraznenie syntaxe a vlastné útržky kódu môžu tiež pomôcť používateľom, aby čo najviac využívali softvér. Musíte posúdiť sami seba, či používanie kódu Visual Studio vás poteší.

Pre seba som sa viac alebo menej páčil skúsenosti: dobre štruktúrovanej online dokumentácie, ľahko navigovateľné Visual Studio Code Marketplace, a vlastné farebné motívy ktoré si môžete prezrieť v reálnom čase počas rolovania zoznamu (prístup cez Súbor> Predvoľby> Tému farieb Ponuka).

Konečné slová

Keďže inkluzívny dizajn je novou oblasťou, technologický priemysel je stále vo fáze experimentovania. Myslím, že spoločnosť Microsoft urobila významný medzník definovanie štyroch princípov inkluzívneho dizajnu.

Ako sme mohli vidieť, podarilo sa úspešne implementovať teóriu v praxi v ich novom editori zdrojových kódov Visual Studio Code, aj keď stále existujú niektoré oblasti na zlepšenie, ako je poskytovanie plnej podpory Tab a globálnej funkcie vyhľadávania a nahrádzania.

Tak ako prístupnosť a inkluzívnosť sú časti skúseností používateľov, môže to byť dobrý nápad dozvedieť sa viac o nich, ak chcete držať krok s najnovšími trendmi v odvetví. Tu sú zdroje, ktoré vám môžu pomôcť:

• Články dostupnosti systému Windows Dev Center
• Návod na tvorbu návrhov príručky Microsoft Design (PDF) (stiahnuteľný)
• Značka prístupnosti Hongkiat.com