Kotisivu » Toolkit » Microsoft Inclusive Designin vaikutus Visual Studio -koodiin

    Microsoft Inclusive Designin vaikutus Visual Studio -koodiin

    yleismaailmallinen, tai kattava muotoilu on uusi muotoilufilosofia Microsoft näyttää ottavansa äskettäin melko vakavasti ohjelmistokehityksessä. Sisältävä muotoilu ottaa käyttöön seuraavan tason, koska se näkee saavutettavuuden paljon laajemmasta näkökulmasta. Kun testasin Microsoftin uutta lähdekoodieditoria, Visual Studio -koodia, kysymys miten he toteuttivat teorian käytännössä luonnollisesti nousi mielessäni.

    Tämä viesti ei ole tarkoitettu vain kuvaukseksi Visual Studio Code -ohjelman esteettömyysominaisuuksista, kuten virallisista asiakirjoista löytyy, mutta pyrkii olemaan tapaustutkimus siitä, mitä kiinnittää huomiota, kun haluat suunnittele kattava sovellus tulevaisuudessa.

    Koska voimme olla varmoja siitä, että osallisuus on pian sekä ohjelmistojen että web-suunnittelun vaatimus, ei tietenkään altruistisista syistä, vaan koska se tuo monia uusia käyttäjiä pöydälle.

    Microsoftin neljä sisällyttävän suunnittelun periaatetta

    Windows Dev Center asettaa saataville ohjelmistosuunnittelun Käytettävyys-luokan sisällä, ja he julkaisivat myös monia suuria artikkeleita aiheesta. Microsoftin neljä sisällyttävän suunnittelun periaatetta Tässä artikkelissa käsitellään lyhyesti (alla lyhyesti).

    1. Ajatella yleismaailmallinen.
    2. Tee se henkilökohtainen.
    3. Pidä se yksinkertainen.
    4. Luoda ilahduttaa.

    Jos olet lukenut alkuperäisen artikkelin, näet periaatteet selitetään tavalla, jota ei aina ole helppo testata ilmaisuja kuten "emotionaalinen yhteys", "herättää ihme", ja "maaginen". Joten haluaisin mieluummin pysyä maanläheisenä, poistaa nämä subjektiiviset merkitykset ja muuttaa periaatteet objektiivisiksi kriteereiksi.

    Käytän niitä seuraavassa mielessä, kun analysoin, miten ne on toteutettu Visual Studio-koodissa.

    1. Ajatella yleismaailmallinen: Helppokäyttöisyys
    2. Tee se henkilökohtainen: Mukautettavuus, laajennettavuus
    3. Pidä se yksinkertainen: Häiriötön, looginen käyttöliittymä
    4. Luoda ilahduttaa: Ominaisuuksien havaittavuus

    Tietenkin tämä on vain yksi mahdollinen luokittelu, ja siellä on monet päällekkäisyydet, esimerkiksi muokattavuus voi olla myös osa “Luo iloa” periaatteessa, mutta koska tarvitsemme jotain konkreettista, pidämme kiinni tästä tulkinnasta nyt.

    Vaikka Windows Dev Center suosittelee näitä kattavia suunnitteluperiaatteita sovellettavaksi Windows 10 -sovelluksiin, Microsoft on myös omistanut Microsoft Design -sivuston sisällyttävään suunnitteluun.

    Vaikka Visual Studio -koodi ei ole pelkästään Windows 10 -käyttöjärjestelmä, vaan se on tarkoitettu a monialainen ohjelmisto, Voimme silti turvallisesti testata sen ominaisuuksia edellä mainittujen periaatteiden mukaisesti, koska Microsoft käsittelee kattavaa suunnittelua selvästi ohjelmistosuunnittelupolkuina, joita he haluavat seurata tulevaisuudessa.

    Ajattele Universal

    Alla “Ajattele Universal” Periaatteessa tarkastelemme Visual Studio -koodin saatavuutta eri käyttäjäryhmille, kuten aputeknologioiden käyttäjät (käyttävätkö ne vammaisuuteen tai mieltymyksiin), henkilöt, joilla on rajallinen teknologia, englanninkieliset puhujat jne..

    1. Zoomaus

    Zoomaus voidaan helposti suorittaa painamalla Ctrl + = / Cmd + = (Mac) pikanäppäin Lähennä, ja Ctrl + - / Cmd + - (Mac) pikavalinta Loitontaa, ja voimme myös käyttää Zoom-toimintoa päävalikkorivin kautta.

    Huomaa, että versiossa 1.1.1, Windows-näppäimistöissä + ja - merkit eivät toimi numeronäppäimistössä oikealla, vain kirjoitustoiminnolla (aakkosnumeerisella) näppäimistöllä - joka ei luultavasti ole paras sisällyttämisen kannalta.

    Pysyvä zoomaustaso-ominaisuus kompensoi jonkin verran tätä, koska sen avulla voidaan helposti määrittää a pysyvä Zoom-taso Käyttäjäasetukset (lue minun läpikäyvä viesti siitä, miten tämä tehdään).

    2. Korkea kontrasti -teema

    Suuret kontrasti-teemat helpottavat visuaalisen tiedon käsittely näkövammaisille käyttäjille, ja siksi ne ovat tärkeä osa saavutettavuutta.

    Siellä Korkea kontrasti -teema Visual Studio -koodissa, jonka voit asettaa napsauttamalla Tiedosto> Asetukset> Väriteema Voit myös ladata muita Visual Studio Code Marketplace -sivustosta.

    Microsoft esitteli korkean kontrastin teemoja Windows 7: ssä, on mukavaa nähdä, että ne seuraavat tätä ominaisuutta.

    3. Näppäimistön navigointi

    Näppäimistön navigoinnin tarjoaminen on välttämätöntä niille, jotka eivät voi käyttää hiirtä visuaalisten tai liikkuvuushäiriöiden vuoksi. Tehokas näppäimistön navigointi merkitsee, että käyttäjät voi hallita kaikkia toimintoja ohjelmistosta käyttämällä vain näppäimistöä.

    Visual Studio Code toteuttaa hienosti tämän ominaisuuden, ja vaikka sillä on monia ennalta määritetyt avaimen sidokset (katso koko luettelo), käyttäjät voivat myös mukauttaa pikanäppäimiä JSON-muotoisen kokoonpanotiedoston avulla.

    4. Välilehti Navigointi

    Tab-navigointi mahdollistaa hypätä kaikkialla eri alueilla Visual Studio -koodin.

    Tällä hetkellä versiosta 1.1.1 alkaen VS-koodi ei tue välilehtien navigointia kaikilla alueilla, esimerkiksi ylävalikkorivi ei ole käytettävissä tällä tavalla. Hyvä uutinen on, että Microsoft tunnustaa tämän ominaisuuden puuttumisen asiakirjojen nykyisissä tiedoissa.

    Testin aikana huomasin, että toimittaja, Sivupalkki, Näytä palkki (katso VS-koodin alueiden nimet), ja kaikki niiden toiminnot ja kohteet ovat käytettävissä Tab-näppäimellä. Vaikka välilehden käyttäjät eivät voi käyttää päävalikkorivin toimintoja näppäimistön kanssa. Komentopaletti F1 voi korvata jonkin verran, koska kaikki ylimmässä valikossa olevat komennot ovat käytettävissä myös siellä.

    Tärkeä välilehden navigoinnin ominaisuus on välilukko, jonka avulla käyttäjät voivat vaihtaa Tab-näppäimen kahden toiminnon välillä. Pysäytetty Tab-näppäin mahdollistaa liikkua VS-koodin eri osien välillä, normaalisti Tab-näppäin lisää Tab-merkin tekstitiedostoon avaa Editor-alueella. Käyttäjät voivat siirtyä näiden kahden ominaisuuden välillä napsauttamalla Ctrl + M-näppäimen sitomista.

    5. Näytön lukijat

    Käytettävissä olevan ohjelmiston on tietenkin oltava täysin käytettävissä myös näytönlukijan käyttäjille. Asiakirjoissa mainitaan, että VS-koodin dev-tiimi testasi näytönlukijan saatavuutta NVDA-näytönlukijalla.

    Testattavaksi käytin kahta muuta näytönlukijaa, JAWSia, joka on yksi yleisimmin käytetyistä näytönlukuohjelmista, ja Microsoft Narrator, joka on Windows 10: n sisäänrakennettu näytönlukija.

    JAWS luki ääneen kaikki alueet, komennot ja valikot, mutta kertomalla oli joitakin pienempiä ongelmia tehtävän kanssa. Esimerkiksi se lukee vain ylimmän valikon kohdat oikein, kun siirrin niitä hiirellä, mutta ei silloin, kun käytin näppäimistön Down-nuolta. Tämä on kuitenkin pikemminkin puute Narratorista, ei Visual Studio -koodista, joten voimme varmasti olettaa, että näkövammaiset käyttäjät voivat käyttää kaikkia VS-koodin toimintoja käyttämällä kehittyneempää näytönlukulaiteohjelmaa.

    6. Debugger Accessibility

    Jotta sovellus olisi täysin saatavilla ja kattava, meidän on myös huolehdittava osista, jotka eivät todennäköisesti tule ensin mieleemme. Visual Studio -koodin tapauksessa Debugger on hyvä esimerkki tästä. Dev-tiimi kiinnitti huomiota myös siihen, että se sisältäisi myös sen, joten se tukee myös välilehti- ja näppäimistön navigointia ja sen näytönlukijaa.

    7. Lokalisointi

    Nyt olemme valmiita keskustelemaan esteettömyysominaisuuksien VS-koodiluetteloista asiakirjoissa, mutta on muitakin tärkeitä asioita, joista meidän on mainittava, kun puhumme “Ajattele Universal” suunnitteluperiaatteella. Yksi näistä on lokalisointi tai muut sanat vieraan kielen tuki näyttökielenä, koska monet maailman ihmiset eivät ole äidinkielisiä englanninkielisiä.

    Visual Studio -koodi on tällä hetkellä lokalisoitu 10 eri kieli (Englanti, yksinkertaistettu kiina, perinteinen kiina, ranska, saksa, italia, japani, korea, venäjä, espanja).

    Näiltä kieliltä tulevien käyttäjien ei tarvitse edes määritellä näyttökielensä VS-koodina poimii käyttöjärjestelmän oletuskielen oletusarvoisesti. Jos he haluavat asettaa toisen kielen näyttökieleksi, ne voivat helposti määrittää niiden kielen locale.json tiedosto.

    Todennäköisesti 10 näyttökieliä ei ole niin monta, mutta se ei myöskään ole huono, jos otamme huomioon, että VS-koodi on uusi ohjelmisto, ja Microsoft todennäköisesti tukee enemmän tulevaisuudessa. Tällä hetkellä käyttäjät, joiden kieli ei ole tuettujen joukossa, saavat VS-koodinsa englanniksi.

    8. Käytettävissä oleva koko

    Nykyaikaiset lähdekoodieditorit eivät ole kovin suuria, ja Microsoft on myös liittynyt tähän suuntaukseen, koska Visual Studio Code on a alle 100 Mt ladata ja sen levynjälki on alle 200 Mt.

    9. Monitasoinen kehitys

    Jos haluamme osallistavaa ohjelmistoa, sen on tietenkin oltava myös cross-platform, mikä tarkoittaa sitä, että sen on toimittava eri käyttöjärjestelmissä. VS-koodi täyttää tämän vaatimuksen, sillä se tukee Windows, OS X ja Linux yhtä hyvin.

    Tee se henkilökohtaiseksi

    “Tee se henkilökohtaiseksi” on Microsoftin toinen osallistavan suunnittelun periaate, ja me tarkastelemme sitä muokattavuutta ja laajennettavuus tämän kriteerin mukaisesti, kuten lupasin aiemmin. Visual Studio -koodi täyttää molemmat vaatimukset niin hienosti, että olen kirjoittanut jopa erilliset viestit molemmille, tässä muokattavuudesta ja täällä laajennettavuudesta.

    Lyhyesti sanottuna muokattavuus toteutetaan mukautetut teemat ja modulaariset JSON-muotoiset kokoonpanoasetukset, ulottuvuus saavutetaan mukautetut laajennukset että käyttäjät voivat ladata Visual Studio Code Marketplace -sivustosta tai luoda omia joko TypeScript- tai JavaScript-ohjelmistossa.

    Voit lukea lisää Visual Studio Codein laajennettavuuden lähestymistavasta.

    Räätälöitävyys ratkaistaan ​​tavalla, joka sopii erinomaisesti sellaisille teknologiasta kiinnostuneille ihmisille, jotka ovat lähdekoodin toimittajien tyypillisiä käyttäjiä, sillä merkittävä osa siitä toteutetaan modulaariset JSON-muotoiset kokoonpanotiedostot.

    Tämä on hyvä ratkaisu, koska kokoonpanovaihtoehdot eivät ole piilossa valtavan valikkohierarkian takana, jota on vaikea nähdä. Käyttäjät, vaikka he eivät ole koodaavia asiantuntijoita, voivat helposti muokata omaa tapaansa .json tiedostot, Visual Studio Code avaa oletusasetukset ja mukautetut asetukset kahdessa editoripaneelissa vierekkäin, jolloin käyttäjät voivat kokeilla niitä helposti.

    Konfigurointitiedostot on moduloitu, ne ovat loogisesti jäsennelty hierarkia .json tiedostoja, tässä on luettelo tärkeimmistä:

    1. settings.json varten mukautetut käyttäjäasetukset, saatavilla Tiedosto> Asetukset> Käyttäjäasetukset valikko
    2. .vscode / settings.json varten mukautetut työtilan asetukset, saatavilla Tiedosto> Asetukset> Työtilojen asetukset valikko
    3. keybindings.json varten Custom Key Bindings, saatavilla Tiedosto> Asetukset> Näppäimistön pikavalinnat valikko
    4. javascript.json, php.json, css.json, c.json, ja joukko muita .json tiedostoja eri ohjelmointikieliä varten mukautetut käyttäjäpätkät, saatavilla Tiedosto> Asetukset> Käyttäjän palat valikko
    5. launch.json varten mukautetut Debugger-asetukset, pääset klikkaamalla hammaspyörän kuvaketta Debug Viewin ylärivillä (editorin vasemmalla puolella)
    6. .vscode / locale.json varten mukautetut näyttökielen asetukset, pääset kirjoittamalla Määritä kieli komento komentopaletiin (F1)
    7. .vscode / tasks.json varten mukautetun tehtävän juoksijan asetukset, pääset kirjoittamalla Määritä Task Runner komento komentopaletiin (F1)

    Mielestäni VS-koodin käyttäjät eivät voi valittaa muokattavuudesta, sillä jopa vaihtoehtojen luettelointi oli tyhjentävä tehtävä.

    Koska konfigurointivaihtoehdot ovat modulaarisia, käyttäjien on vain huolehdittava niistä he tarvitsevat todella, joka auttaa heitä keskittymään tehtäviin, joita he haluavat suorittaa. Niinpä ne jäävät intuitiivisemmaksi työnkuluksi.

    Pidä se yksinkertaisena

    Voimme tavata Microsoftin Pidä se yksinkertaisena Sisustussuunnittelun periaate monissa muissa ohjelmoinnin ja suunnittelun paikoissa, ajattele vain KISS (Keep It Simple, Stupid) -suunnitteluperiaatetta ja DRY (Don't Repeat Yourself) -ohjelmiston kehittämisperiaatetta. Tämän käynnissä olevan kontekstin osalta keskitymme käyttöliittymän yksinkertaisuus.

    Helppokäyttöisyys, helppokäyttöinen käyttöliittymä suositellaan yleensä saavutettavuuden kannalta, koska käyttäjillä on kognitiivisia ja henkisiä vammaisia. Koska Visual Studio Code on lähdekoodieditori, se ei luultavasti ole sellaista ohjelmistoa, jota usein käyttävät ihmiset, joilla on tällainen häiriö, mutta myös harmaita alueita voi olla.

    Yksinkertaisuus ei ole tärkeää vain niiden vuoksi, mutta hyvin suunniteltu, looginen käyttöliittymä voi myös olla alenna oppimiskäyrää, ja lisätä työn nopeutta, tehdä ohjelmistosta houkuttelevampi myös väestölle.

    Visual Studio -koodi myös hyödyntää tunnettua psyhologista ilmiötä, pelkkä altistumisen vaikutus (tai tuntemus ilmiö), koska se hyväksyy perusasettelun, joka on samankaltainen kuin muut tunnetut lähdekoodieditorit, kuten Atom.

    Asiakirjoista, joiden avulla voimme tietää, että se oli pyrkimys, Microsoft on vaikuttanut valtavasti:

    VS-koodi tarjoaa käyttäjille myös Side by Side Editing -ominaisuuden, joka löytyy myös muista lähdekoodien muokkaajista, eikä se ole sattumaa, kuten se tekee koodausprosessista paljon yksinkertaisemman, ja tietysti edistää “Pidä se yksinkertaisena” mukaan lukien.

    Perusliittymän lisäksi Visual Studio -koodilla on viileitä ominaisuuksia, joita kannattaa mainita sisällyttävää muotoilua koskevassa artikkelissa, kuten:

    • Intellisense joka tarjoaa käyttäjille kontekstiin perustuvia ehdotuksia (keinotekoista älyä käyttävä backend-osa on myös mukava ratkaisu)
    • Kurkistaa (Shift + F12), joka näyttää täydelliset funktionmääritykset inline-ikkunassa
    • Komentopaletti (F1), joka tekee kaikki komennot käsiksi samassa paikassa.

    Luo Delight

    Ei ole erityisen helppoa löytää konkreettisia perusteita, joita voimme käyttää tarkastelemaan “Luo Delight” suunnitteluperiaatteella, joten päätin lopulta ominaisuuksien havaittavuus, Microsoft määritteli tämän periaatteen seuraavasti:

    Tämä sanamuoto voi muistuttaa monia teistä mikro-hetkiä, joka on yksi Googlen uusimmista suurista asioista, ja näin ollen näyttää, miten johtavat teknologiayritykset voivat tulla samankaltaisiin johtopäätöksiin, kun he ajattelevat, miten teollisuutta voidaan siirtää eteenpäin.

    Osallisessa suunnittelussa se on erittäin tärkeää osallistua käyttäjiin, ja herättää heidän uteliaisuutensa, että voimme saavuttaa luultavasti parhaan, jos me auttaa heitä eteenpäin kun he saavuttivat tietyn pisteen käyttäjän matkalle. Vain oikeaan aikaan, ei ennen, ei jälkeen.

    Kun puhumme ominaisuuksien havaittavuus, mitä enemmän ilmeinen ilmentymä luo iloa, sitä voidaan lisätä esimerkiksi hyvin suunnitellulla hyödyllisyysavulla, älykkäällä dokumentaatiolla ja tukevilla tiedoilla, jotka tulevat esiin vain oikeaan aikaan.

    Voimme löytää esimerkkejä kaikista näistä ominaisuuksista Visual Studio -koodissa, mieti vain edellä mainittuja IntelliSense ja Komentopaletti, mutta syntaksin korostus ja mukautetut koodinpätkät voi myös auttaa käyttäjiä hyödyntämään ohjelmistoa. Sinun on arvioitava itse, onko Visual Studio Code -palvelun käyttö miellyttävä.

    Minulle itselleni tunsin enemmän tai vähemmän kokemusta: hyvin jäsennelty online-dokumentaatio, helppokäyttöinen Visual Studio Code Marketplace, ja mukautetut väriteemat joka voidaan esikatsella reaaliaikaisesti, kun selaat pudotusluetteloa (pääset sen kautta Tiedosto> Asetukset> Väriteema valikko).

    Lopulliset sanat

    Koska kokonaisvaltainen muotoilu on uusi ala, teknologiateollisuus on edelleen kokeiluvaiheessa. Mielestäni Microsoft on tehnyt merkittävän virstanpylvään määrittelemällä osallistavan suunnittelun neljä periaatetta.

    Kuten olisimme nähneet, he onnistuivat toteuttamaan teorian käytännössä uudessa lähdekoodieditorissaan, Visual Studio -koodissa, vaikka joitakin kenttiä on vielä parannettavissa, kuten täyden Tab-tuen ja maailmanlaajuisen haku- ja korvaustoiminnon tarjoaminen.

    Koska sekä esteettömyys että kattavuus ovat osa käyttäjäkokemusta, se voi olla hyvä idea oppia lisää niistä, jos haluat pysyä uusimpien teollisuuden suuntausten kanssa. Tässä on resursseja, jotka voivat auttaa:

    • Windows Dev Centerin helppokäyttöisyysartikkelit
    • Microsoftin Design Inclusive Design Toolkit -opas (PDF) (ladattava)
    • Hongkiat.com esteettömyysmerkki