Utjecaj Microsoftovog inkluzivnog dizajna u Visual Studio Code

univerzalan, ili uključiv dizajn je nova filozofija dizajna. Čini se da Microsoft nedavno vrlo ozbiljno shvaća razvoj softvera. Inkluzivni dizajn pristupa dizajnu na sljedeću razinu, budući da pristupačnost gleda iz mnogo šire perspektive. Kada sam testirao novi Microsoftov editor izvornog koda, Visual Studio Code, pitanje je kako su primijenili teoriju u praksi prirodno se pojavio u mojoj glavi.

Ovaj post ne namjerava biti samo opis značajki pristupačnosti Visual Studio Code-a, jer u službenim dokumentima možete pronaći izvrsnu recenziju o njima, nego želi biti studija slučaja o tome na što treba obratiti pozornost kada želite dizajnirajte uključivu aplikaciju u budućnosti.

Zato što možemo biti sigurni da će inkluzivnost uskoro biti zahtjev i za softver i za web dizajn, naravno ne samo zbog altruističkih razloga, nego zato što će dovesti mnoge nove korisnike na stol..

Microsoftova 4 načela inkluzivnog dizajna

Windows Dev Center stavlja pristupačan softverski dizajn unutar kategorije Upotrebljivost, te su također objavili mnogo sjajnih članaka na tu temu. Microsoft četiri načela uključivog dizajna (ukratko navedene u nastavku) raspravlja se u ovom članku.

1. Razmišljati univerzalan.
2. Napraviti osobni.
3. Zadrzi to jednostavan.
4. Stvoriti zadovoljstvo.

Ako ste pročitali izvorni članak, vidjet ćete da su načela objašnjena na način koji nije uvijek lako testirati, koristeći izraze poput "emocionalna veza", "evociraj čudo", i „Čarobni”. Zato bih radije ostao na zemlji, uklonio ove subjektivne konotacije i pretvorio načela u objektivne kriterije.

Kada analiziram kako su implementirani u Visual Studio Code, koristim ih u sljedećem smislu:

1. Razmišljati univerzalan: Pristupačnost
2. Napraviti osobni: Mogućnost prilagodbe, proširivost
3. Zadrzi to jednostavan: Logično korisničko sučelje koje ne odvlači pažnju
4. Stvoriti zadovoljstvo: Mogućnost otkrivanja značajki

Naravno, ovo je samo jedna moguća kategorizacija i postoje mnogo preklapanja, na primjer, prilagodljivost također može biti dio “Stvorite užitak” principu, ali kako nam treba nešto opipljivo, držimo se za sada ovo tumačenje.

Dok Windows Dev Center preporučuje da se ta uključiva načela dizajna primjenjuju za aplikacije sustava Windows 10, Microsoft je svoj dizajn tvrtke Microsoft Design posvetio i uključivom dizajnu.

Iako Visual Studio Code nije isključivo za Windows 10, već je cilj softver za više platformi, još uvijek možemo sigurno testirati njegove značajke u skladu s gore navedenim načelima, budući da Microsoft jasno tretira inkluzivni dizajn kao put za izradu softvera koji žele slijediti u budućnosti.

Razmislite o univerzalnom

Ispod “Razmislite o univerzalnom” U načelu, proučit ćemo koliko je Visual Studio Code dostupan za različite skupine korisnika, kao što su korisnici pomoćnih tehnologija (bilo da ih koriste za osobe s invaliditetom ili sklonost), osobe s ograničenim tehnologijama, govornici koji nisu izvorni engleski, itd..

1. Zumiranje

Zumiranje se može jednostavno izvesti pritiskom na Ctrl + = / Cmd + = (Mac) tipkovnički prečac za Povećaj, i Ctrl + - / Cmd + - (Mac) prečac za Smanji, Također možemo pristupiti značajki Zoom preko gornje trake izbornika.

Imajte na umu da od verzije 1.1.1 na tipkovnicama sustava Windows znakovi + i - ne rade na numeričkoj tipkovnici na desnoj strani, samo na tipkovnici za unos teksta (alfanumeričkoj tipkovnici) - što vjerojatno nije najbolje za uključivost.

Značajka Stalna razina zumiranja donekle kompenzira ovo, jer nam omogućuje jednostavno konfiguriranje trajna razina zumiranja u korisničkim postavkama (pročitajte moj prethodni post o tome kako to učiniti).

2. High Contrast Theme

Teme visokog kontrasta olakšavaju obrada vizualnih informacija za korisnike s oštećenjem vida, te su stoga važan element pristupačnosti.

Tamo je zadana tema visoke kontrasta u Visual Studio Code, koju možete postaviti klikom na Datoteka> Postavke> Tema boje izbornika, ali možete preuzeti i druge s Visual Studio Code Marketplace.

Microsoft je uveo teme visoke kontrasta u sustavu Windows 7, a lijepo je vidjeti da oni prate ovu značajku.

3. Navigacija tipkovnice

Pružanje navigacije pomoću tipkovnice bitno je za osobe koje ne mogu koristiti miš zbog vizualnih ili mobilnih poteškoća. Učinkovita navigacija tipkovnicom podrazumijeva korisnike može kontrolirati svaku funkcionalnost softvera pomoću samo tipkovnice.

Visual Studio Code lijepo implementira ovu značajku, i iako ima mnogo zadane veze tipki (pogledajte cijeli popis), korisnici također mogu prilagoditi tipkovničke prečace uz pomoć konfiguracijske datoteke JSON formata.

4. Kartica Navigacija

Navigacija pomoću kartica omogućuje Skoči po različitim područjima Visual Code Code.

Trenutno, od verzije 1.1.1, VS kod ne podržava navigaciju s karticama za sva područja, na primjer gornja traka izbornika nije dostupna na ovaj način. Dobra vijest je da Microsoft priznaje nedostatak ove značajke u trenutnim poznatim problemima u dokumentima.

Tijekom testiranja, otkrio sam da je Urednik, Bočna traka, Bar s prikazom (pogledajte imenovanje područja VS koda), a sve njihove radnje i stavke dostupne su pomoću tipke Tab. Iako korisnici kartice Tab ne mogu pristupiti funkcijama gornje trake izbornika pomoću tipkovnice. Naredba Paleta F1 može nešto zamijeniti, jer sve naredbe koje se mogu naći u gornjem izborniku mogu se pristupiti i tamo.

Važna značajka pristupačnosti navigacije s karticama je preklapanje kartica koje korisnicima omogućuje prebacivanje između dviju funkcionalnosti tipke Tab. Zarobljeni taster Tab omogućuje kretati se kroz različite dijelove VS koda, dok je obično tipka Tab dodaje znak Tab u tekstualnu datoteku otvoriti u području uređivača. Korisnici se mogu prebacivati ​​između ove dvije mogućnosti pritiskom na Ctrl + M ključ.

5. Čitači zaslona

Naravno, pristupačan softver mora biti u potpunosti dostupan korisnicima čitača zaslona. Dokumenti spominju da je tim VS Kodova za razvoj testirao dostupnost čitača zaslona pomoću čitača NVDA zaslona.

Za testiranje koristio sam još dva čitača zaslona, ​​JAWS koji je jedan od najčešće korištenih aplikacija za čitanje zaslona, ​​te Microsoft pripovjedač koji je ugrađeni čitač zaslona na Windows 10.

JAWS čitajte naglas sva područja, naredbe i izbornike, no pripovjedač je imao neke manje probleme sa zadatkom. Primjerice, samo je ispravno čitao gornje stavke izbornika kada sam se pomaknuo preko njih mišem, ali ne kad sam koristio strelicu prema dolje na tipkovnici. To je, međutim, prilično nedostatak pripovjedača, a ne Visual Studio koda, pa možemo sa sigurnošću pretpostaviti da korisnici oštećenog vida mogu pristupiti svim funkcionalnostima VS koda pomoću naprednije aplikacije čitača zaslona..

6. Pristupačnost debagera

Da bi aplikacija bila potpuno pristupačna i uključiva, moramo se pobrinuti i za dijelove koji nam u početku ne dolaze na um. U slučaju Visual Studio Code, Debugger je dobar primjer za to. Tim za razvoj posvećuje pažnju i njegovom uključivanju, stoga podržava i navigaciju po tipkovnici i tipkovnici, a dostupan je i čitač zaslona.

7. Lokalizacija

Sada smo spremni raspravljati o popisima značajki VS kodova pristupačnosti u dokumentima, ali postoje i druge važne stvari koje moramo spomenuti kada govorimo o “Razmislite o univerzalnom” načelo uključivog dizajna. Jedna od njih je lokalizacija, ili drugim riječima podrška za strane jezike kao jezik prikaza, jer mnogi ljudi u svijetu nisu govornici engleskog jezika.

Visual Studio Code je trenutno lokaliziran za 10 različitih jezika prikaza (Engleski, pojednostavljeni kineski, tradicionalni kineski, francuski, njemački, talijanski, japanski, korejski, ruski, španjolski).

Korisnici koji dolaze s tih jezika ne moraju čak ni konfigurirati svoj jezik prikaza, kao VS kod podrazumijevano odabire jezik prikaza operativnog sustava. Ako žele postaviti drugi jezik kao jezik prikaza, mogu jednostavno konfigurirati svoj jezik locale.json datoteka.

Vjerojatno 10 jezika za prikaz nije toliko mnogo, ali također nije loše ako uzmemo u obzir da je VS kod novi softver, a Microsoft će najvjerojatnije više podržavati u budućnosti. Za sada, korisnici čiji jezik nije među podržanim, dobivaju svoj VS kod instaliran na engleskom jeziku.

8. Dostupna veličina

Moderni uređivači izvornog koda nisu stvarno veliki, a Microsoft se također pridružio ovom trendu, jer je Visual Studio Code a manje od 100 MB download, a njegov trag na disku manji je od 200 MB.

9. Razvoj više platformi

Ako želimo uključiv softver, naravno da također treba biti cross-platforma, što znači da mora raditi na različitim operativnim sustavima. VS Kodeks zadovoljava ovaj zahtjev, budući da podržava Windows, OS X i Linux također.

Učinite to osobnim

“Učinite to osobnim” je Microsoftovo drugo načelo inkluzivnog dizajna, a mi ćemo ga pogledati prilagodbe i rastegljivost prema ovom kriteriju, kao što sam to obećao i prije. Visual Studio Code tako lijepo zadovoljava oba uvjeta da sam čak napisao odvojene postove na oba, ovdje o prilagodljivosti, a ovdje o proširivosti.

Ukratko, prilagodljivost se implementira s prilagođene teme i modularizirane postavke konfiguracije JSON formata, dok se rastezljivost postiže prilagođena proširenja koje korisnici mogu preuzeti s Visual Studio Code Marketplace, ili sami kreirati u TypeScriptu ili JavaScriptu.

Više o tehničkoj pozadini pristupa Visual Studio Code proširivosti ovdje možete pročitati.

Prilagodljivost je riješena na način koji je idealan za tehničare koji su tipični korisnici uređivača izvornog koda, jer se značajan dio implementira putem modularizirane konfiguracijske datoteke JSON formata.

Ovo je izvrsno rješenje, jer konfiguracijske opcije nisu skrivene iza ogromne hijerarhije izbornika koju je teško vidjeti. Korisnici, čak i ako nisu stručnjaci za kodiranje, mogu jednostavno uredite svoj običaj .JSON slika, kao Visual Studio Code otvara zadane i prilagođene postavke u dva okna za uređivanje jedan do drugog, omogućujući korisnicima da jednostavno eksperimentiraju s njima.

Konfiguracijske datoteke su modularizirane, dolaze kao logički strukturirana hijerarhija od .JSON datoteka, evo popisa najvažnijih:

1. settings.json za prilagođene korisničke postavke, dostupno putem Datoteka> Postavke> Postavke korisnika izbornik
2. .vscode / settings.json za prilagođene postavke radnog prostora, dostupno putem Datoteka> Postavke> Postavke radnih mjesta izbornik
3. keybindings.json za Prilagođene veze tipki, dostupno putem Datoteka> Preference> Tipkovnički prečaci izbornik
4. javascript.json, php.json, css.json, c.json, i hrpa drugih .JSON za postavljanje različitih programskih jezika prilagođeni isječci korisnika, dostupno putem Datoteka> Preference> Korisnički isječci izbornik
5. launch.json za prilagođene postavke za ispravljanje pogrešaka, dostupno klikom na ikonu zupčanika na gornjoj traci Debug View (lijevo od urednika)
6. .vscode / locale.json za prilagođene postavke jezika prikaza, dostupno upisivanjem Konfiguriraj jezik naredba u paleti naredbi (F1)
7. .vscode / tasks.json za prilagođene postavke Runner zadataka, dostupno upisivanjem Konfigurirajte trkač zadataka naredba u paleti naredbi (F1)

Mislim da se korisnici VS Codea teško mogu žaliti na prilagodljivost, jer je čak i popis opcija bio iscrpan zadatak.

Budući da su konfiguracijske opcije modularizirane, korisnici se moraju pobrinuti samo za njih oni stvarno trebaju, što im pomaže da se usredotoče na zadatke koje žele obavljati. Na taj će način biti ostavljeni intuitivniji tijek rada.

Neka bude jednostavno

Možemo se susresti s Microsoftovim Neka bude jednostavno uključivo načelo dizajna u mnogim drugim mjestima u programiranju i dizajnu, samo razmislite o KISS (Keep It Simple, Stupid) principu dizajna i DRY (Don't Repeat Yourself) principu razvoja softvera. U ovom kontekstu koji se izvodi, zadržat ćemo fokus na jednostavnost korisničkog sučelja.

U pogledu pristupačnosti, jednostavno korisničko sučelje se jednostavno preporučuje zbog korisnika koji imaju kognitivne i intelektualne teškoće. Budući da je Visual Studio Code izvorni kod, to vjerojatno nije softver koji često koriste ljudi koji imaju takvu vrstu oštećenja, ali mogu postojati i neka siva područja.

Jednostavnost nije važna samo zbog njih, iako, kao dobro osmišljeno, logično sučelje također može smanjite krivulju učenja, i povećati brzinu rada, izrada softvera više privlačnom za opću populaciju.

Visual Studio Code također iskorištava poznati psihološki fenomen, učinak puke izloženosti (ili fenomen bliskosti), budući da koristi osnovni izgled koji je sličan izgledu drugih poznatih urednika izvornog koda, kao što je Atom, koristiti.

Iz dokumenata koje možemo upoznati da je to bio napor koji je Microsoft dao ogroman utjecaj na:

VS kôd također pruža korisnicima značajku Side by Side Editing, koja se također može naći u drugim urednicima izvornog koda, a to nije slučajnost. čini proces kodiranja mnogo jednostavnijim, i naravno doprinosi “Neka bude jednostavno” princip uključivog dizajna.

Pored osnovnog korisničkog sučelja, Visual Studio Code ima zanimljive značajke koje je vrijedno spomenuti u članku o inkluzivnom dizajnu, kao što su:

• Intellisense koji korisnicima pruža prijedloge temeljene na kontekstu (backend dio koji koristi umjetnu inteligenciju je također lijepo rješenje)
• viriti (Shift + F12) koji prikazuje potpune definicije funkcija u inline prozoru
• Paleta naredbi (F1) koja omogućuje pristup svim naredbama na istom mjestu.

Napravite užitak

Nije osobito lako pronaći konkretne kriterije koje možemo koristiti za ispitivanje “Napravite užitak” princip uključivog dizajna, pa sam konačno pristao na kriterij mogućnost otkrivanja značajki, budući da je Microsoft ovo načelo definiralo na sljedeći način:

Ovaj izraz može podsjetiti mnoge od vas na mikro trenutke, jednu od Googleove najnovije velike stvari, i stoga pokazati kako vodeće tehnološke tvrtke mogu doći do sličnih zaključaka kada razmišljaju o tome kako premjestiti industriju naprijed.

U inkluzivnom dizajnu to je vrlo važno angažirajte korisnike, i probuditi njihovu znatiželju, da možemo postići najbolje ako možemo pomoći im krenuti naprijed kada su došli do određene točke u svom korisničkom putovanju. Samo u pravom trenutku, ne prije, ne poslije.

Kada govorimo o tome mogućnost otkrivanja značajki, što je svjetovnija manifestacija stvaranja užitka, ona se može povećati stvarima kao što je dobro osmišljena navigacija za uslužni program, pametna dokumentacija i pomoćne informacije koje se pojavljuju samo u pravom trenutku.

Možemo pronaći primjere za sve ove značajke u Visual Studio Code, samo razmislite o gore navedenom IntelliSense i Paleta naredbi, ali označavanje sintakse i prilagođeni isječci koda također može pomoći korisnicima da izvuku najviše iz softvera. Morate sami prosuditi da li vas Visual Studio Code ostavlja s osjećajem užitka.

Za mene, više ili manje mi se svidjelo iskustvo: dobro strukturirana online dokumentacija, jednostavan za navigaciju Visual Studio Code Marketplace, i prilagođene teme boja koje se mogu pregledati u stvarnom vremenu dok se pomičete kroz padajući popis (pristupite mu putem Datoteka> Postavke> Tema boje izbornik).

Završne riječi

Kako je inkluzivni dizajn novo područje, tehnološka industrija je još uvijek u fazi eksperimentiranja. Mislim da je Microsoft napravio značajnu prekretnicu definiranje četiri načela uključivog dizajna.

Kao što smo mogli vidjeti, uspjeli su uspješno implementirati teoriju u praksi u svom novom uređivaču izvornog koda, Visual Studio Code, iako još uvijek postoje neka područja za poboljšanje, kao što je pružanje potpune Tab podrške i globalne značajke pretraživanja i zamjene..

Kao i pristupačnost i inkluzivnost su dijelove korisničkog iskustva, Dobro je saznati više o njima ako želite pratiti najnovije trendove u industriji. Ovdje su resursi koji mogu pomoći:

• Članci o pristupačnosti programa Windows Dev Center
• Priručnik za sveobuhvatni dizajn za Microsoftov dizajn (PDF) (koji se može preuzeti)
• Oznaka pristupačnosti za Hongkiat.com