Professionaalse kasutajaliidese kujundamise juhend

Autor: Randy Alexander
Loomise Kuupäev: 25 Aprill 2021
Värskenduse Kuupäev: 16 Mai 2024
Anonim
Canva (juhend)
Videot: Canva (juhend)

Sisu

Karjääri alustades olin veebidisainer. Töötasin neli aastat veebidisaini alal, alustades väikeettevõtete saitidest ja liikudes lõpuks suuremate klientide juurde. Sain teada, et mind ei huvitanud graafiline disain ega ka suuremate kaubamärkide nimel töötamine. Mind huvitasid rohkem veebilehtede visuaalne kujundus lehekülgede kujundamise mustrite, inimeste vormidega suhtlemise viisi ja tajutud jõudluse suhtes.

Ulmelisi filme vaadates vaataksin liideseid. Ja kui mängisin videomänge, jälgisin, kuidas menüüd olid paigutatud. Kui mõni neist omadustest kõlab teile tuttavalt, võite olla südames ka kasutajaliidese disainer.

Lõpetasin oma agentuuritöö ja asutasin oma ettevõtte. Proovisin oma LinkedIni lehel kokku võtta oma uue karjäärieesmärgi: teha võimalikult hea tarkvara. Vabakutselisena alustamisest on möödas neli aastat ja mu teekond pole seiskunud. Nendel päevadel aitan juhtida väikest kasutajaliidese disainifirmat nimega Mono. Tervitasime hiljuti oma neljandat meeskonnaliiget.


Selles artiklis tahan kirjeldada, mis tunne on olla kasutajaliidese disainer, sealhulgas seda, mida töö täpselt hõlmab, kust leida parimaid õppevahendeid ja kuidas oma käsitööga paremini hakkama saada.

Mida teeb kasutajaliidese disainer?

Leian, et üldiselt saate kasutajaliidese kujundaja töö jagada nelja kategooriasse. Suhtlete kliendiga, uurite, kujundate ja prototüübi ning suhtlete arendajatega. Vaatame kõiki neid etappe üksikasjalikumalt.

Kliendisuhtlus

Kliendisuhtlus seisneb kliendi probleemi mõistmises. Eesmärk on tutvuda oma kliendi äriga, nii et projekti algus tähendab tavaliselt palju rääkimist. Alustades ei ole alustamise ajal liiga palju teada oma kliendi domeenist - saate vaadata tema ettevõtet värskelt, samal ajal kui näete võimalikke disainilahendusi.


Selleks, et olla hea kasutajaliidese kujundaja, peate suutma lõpuks mõelda koos oma kliendi ettevõttega. Näiteks võib teie klient olla lennunduses. Nende heaks töötamine teeb lõpuks selle valdkonna kohta üsna teadlikuks. Niisiis, näpunäide teie enda õnne jaoks on valida tööstused, kus töötate targalt, nii et te ei saa lõpuks olla ekspert milleski, mis teid ei huvita või mis teid ei huvita.

Projekti ajal ei peatu suhtlemine. Disainerina esitled oma tööd pidevalt. Oleme oma ettevõttes kaugmeeskond, seega pole meil palju isiklikke kohtumisi. Selle asemel kasutame videokonverentside kaudu ekraani jagamist palju. Suhtlusvahendeid nagu Skype ja Slack kasutatakse iga päev.

Kasulik on kombineerida sünkroonset ja asünkroonset suhtlusmeetodit. Kõne on suurepärane, kui vajate kiiresti palju teavet, kuid peate samal ajal läheduses olema. Me peame Slacki oma virtuaalseks veejahutajaks ja kasutame keerukate disainiprojektide haldamiseks Basecampi. HTML-i ja CSS-i abil prototüüpide kujundamisel kasutame koodi vahetuks arutamiseks GitHubi väljaandeid.


Uuringud

Lisaks kliendisuhtlusele teete palju uuringuid. See võib hõlmata väliuuringuid, töötubasid kliendiga, konkursi analüüsimist või strateegia määratlemist - sisuliselt kõike muud, mis aitab teil käsitletavast probleemist aru saada.

Teadustöö on see, mis teavitab teie disainivalikuid. See on artikkel, mille olete kunagi lugenud, või see uus asi, mille Apple just välja andis. Kui on aeg selgitada, miks tegite konkreetse kujunduse valiku, toetab teie uurimistöö teid.

Uuringud võivad olla väga laiad. Testin sageli uusi seadmeid uurimise eesmärgil või registreerun uue veebirakenduse kasutajaliidese uurimiseks.

Kujundus ja prototüüpimine

Disainerina veedate tõenäoliselt suurema osa ajast disaini ja prototüüpide loomisega. Kasutajaliidese disainiprojektiga saab edasi liikuda mitmel viisil, alates visandamisest kuni detailse kujundamiseni ja lõpetades kodeerimisega.

Kasutatav meetod sõltub suuresti projekti tüübist. Mida te kujundate? Kas see on veebisait või nimetaksite seda pigem rakenduseks? Kas see kasutab kohalikku tehnoloogiat? Kas see on ümberkujundamine või alustate nullist?

Meie ettevõttes ei ole fikseeritud protsessi, kuid enamik projekte järgib sama umbkaudset järjekorda: need algavad visandite ja traatvõrkudega, jätkuvad üksikasjaliku visuaalse ja interaktsioonilise kujundusega ning lõpevad prototüübiga.

Disaineritena veedame palju aega oma tööriistadele mõeldes. Ehkki suurepärased tööriistad on olulised, pole need siiski kõige olulisemad. Adobe Creative Suite'i ja selliste rakenduste nagu Sketch oskuslik kasutamine on samaväärne võimalusega kasutada joonistamiseks pliiatsit või maalimiseks pintslit. Ikka peate maali tegema.

Nagu öeldud, on tervislik huvi tööriistade vastu hea. Mulle meeldib proovida uusi tööriistu, mis aitavad mul olla produktiivsemad. Minu lemmik vektoritöötlustööriist on Illustrator, kuid suurem osa mu visuaalsest kujundustööst tehakse tänapäeval Sketchis. Teised meeskonnaliikmed on üle läinud uuematele tööriistadele, nagu Affinity Designer.

Tööriistad on väga isiklik valik. Niikaua kui saame hõlpsalt koos töötada, on kõigil vabadus ise valida. Et oleks lihtsam oma disainilahendustest klientidega rääkida, valmistame InVisioniga prototüübid. Täpsema prototüübi loomiseks kasutame aga HTML-i ja CSS-i. Kõik vajalik tööriist sõltub tööst, mida soovite sellega teha.

Arendaja suhtlus

Kasutajaliidese disaineri töö on sageli unustatud osa arendaja suhtlus. Tänapäeval ei pääse sa lihtsalt oma disainilahenduste saatmisest arendajatele ja lootuses, et need rakendatakse õigesti. Parimad disainerid teavad, et väljakutse pole disaini loomine, vaid selle edastamine - mitte ainult sidusrühmadele, kes peavad oma heakskiidu andma, vaid ka arendajatele, kes peavad selle rakendama.

Kujundusest teavitamine toimub mitmel kujul: üksikasjalikud spetsifikatsioonid, varade pakkumine, disaini ühine ülevaade. See, mida on mõtet igal juhul pakkuda, sõltub suuresti sellest, kas projekt on kohalik või veebirakendus.

Traditsiooniline lähenemine on varade kuvamine ekraanikujunduste kõrval. Ekraani kujunduste abil saab näha, kuidas kujundus tervikuna välja näeb, samas kui varad on kasutamiseks valmis ikoonide PNG-d ja SVG-d, nii et arendajad ei pea graafikatoimetajaga tegelema.

Oleme oma ettevõttes rohkemate toodete pakkumise pooldajad. Kujunduste järjepidevuse säilitamiseks kasutame komponentide stiilijuhendeid. Veebiprojektiga tegeledes edastame üksikasjalikud HTML-i ja CSS-i komplektid, mis on jupphaaval dokumenteeritud ja valmis rakendamiseks. Usun, et disainisilma omamine tarkvaraarenduse igas etapis on ainus viis saavutada oma eesmärk luua maailmatasemel tarkvara.

Veeb vs omarakendused

Platvormile (nt iOS või Android) natiivrakenduse kujundamisel peate kinni pidama teatud juhistest. Veebi jaoks disainimisel pole nii palju juhiseid. Tavaliselt juhtub see, et teie kliendil on oma brändi jaoks graafiliste juhiste komplekt, mis määrab, kuidas asjad peaksid välja nägema.

Need juhised kipuvad siiski olema kohandatud veebisaitide turundamiseks ja seal leiduv ei pruugi alati kaasa tuua häid kasutajaliidese otsuseid. Fonte valitakse pigem turunduslikel põhjustel, mitte loetavuse huvides. Värvid võivad olla julged ja silmatorkavad, mis toimib reklaamikampaanias, kuid mitte rakenduses, mida igapäevaselt kasutate. Neid juhendeid tuleb tõlgendada.

Veebi jaoks on vähe kasutajaliidese juhiseid. Võiksite väita, et veeb on eri stiilide sulatusahi. Kui teete midagi, mis tundub rohkem rakenduse kui veebisaidina, peate teadma selliste laialdaselt kasutatavate raamistike kohta nagu Bootstrap ja ZURB Foundation. Raamistik hakkab määrama, kuidas asjad peaksid välja nägema, sest te ei soovi ratast uuesti leiutada. Ja see on ilmselt hea asi.

Meie ettevõttes meeldib meile kasutada Bootstrapi. See pakub mõistlikke vaikimisi suurusi tavaliste kasutajaliidese elementide jaoks, nagu nupud, andmetabelid ja modaalid.

Veebikujunduses piirab teid rohkem veebi tehniline võimekus. Varem oli keeruline veebisaidil lihtsaid visuaalseid õitsenguid nagu ümarad nurgad rakendada. Need päevad on ammu möödas - nüüd saate vabalt joonistada kasutajaliideseid, kus on palju varje, üleminekuid, animatsioone ja isegi 3D-d.

Kujundajana on protsessi realiseerimine juhtida brauseris protsessi ja kujundust. Ma pole näinud, et paljud kasutajaliidese disainerid võtaksid üle omakeelse rakenduse kasutajaliidese programmeerimise, kuid veebirakenduse HTML-i ja CSS-i tegev disainer on tavaline nähtus. Kui saate oma disainilahendusi kodeerida, on teil kodeerimata eakaaslaste ees eeliseid ja minu jaoks on see ainus viis veebi toimimise tõeliseks mõistmiseks.

Veebipiirangud

Varsti avastate, et kõiki õpitud ägedaid trikke ei toeta kõik brauserid ja see on veebi kujundamise reaalsus. Hea on järgida tuntud põhimõtteid, nagu järkjärguline täiustamine, kus laadite võimaluse korral täiustatud sisu, kuid mõelge ka sellele, kuidas sisu laguneb.

Viimasel ajal on populaarseks muutunud sinepi lõikamine. BBC veebimeeskonna meister on see, et tuleb teha vahet heade ja halbade brauserite vahel ning pakkuda piiratud kogemusi halbadele brauseritele. Kuid see töötab tõesti ainult sisusaitidel.

Rakendusetaoliste kogemuste osas piiravad paljud arendamise hõlbustamiseks tuge ainult mõne juhtiva brauseriga. Kahjuks toob see meid tagasi 1996. aasta olukorda, kus vajate sisu vaatamiseks kindlat brauserit.

Oma oskuste täiustamine

Niisiis, kuidas end kiiresti areneva veebitööstusega kursis hoida ja oma oskusi parandada? Vaatame mõnda erinevat meetodit oma oskuste suurendamiseks ...

Platvormi tundmine

Suur osa disaineri arsenalist on platvormi tundmine. Peaksite teadma mitmesugustest opsüsteemidest ja sellest, kuidas inimesed neid kasutavad. Kujundajatena kipume kasutama Mac-e, kuid siis on lihtne unustada, et enamik inimesi seal kasutab oma töö tegemiseks Windowsi kaste.

Tunnen, et saate millestki tõeliselt aru ainult siis, kui kasutate seda ise. Eelistan disainimiseks kasutada oma Maci, kuid veedan palju aega erinevate muude platvormide arengule järele jõudmiseks. Mul on Maci virtuaalmasinatena installitud mitu Windowsi eksemplari. Olen olnud hõivatud Windows 10 uute versioonide testimisega, kasutades Microsofti Insideri programmi, et kontrollida kasutajaliidese erinevaid muudatusi.

Ostan regulaarselt ka uut riistvara, et selle toimimist testida. Ostsin Apple Watchi lihtsalt platvormi testimiseks. Müüsin siis selle maha, sest tundsin, et see ei lisa minu elule nii palju.

Lisaks võib veebi vaadelda kui oma opsüsteemi. See areneb pidevalt, igal nädalal lisatakse igale brauseri müüjale uusi funktsioone. Äärmiselt tasub teada brauserite tehnilistest aspektidest, eriti CSS-i ja graafikavõimaluste kohta. Peate teadma, mis on SVG ja WebGL ning kuidas saate veebianimatsioonide API-d kasutada.

Iga platvorm areneb aja jooksul ja kasutajaliidese kujundajana on teie ülesanne olla kursis. Lõppude lõpuks ei ela ükskõik, mida te kavandate, eraldi, vaid see on osa suuremast tarkvara ökosüsteemist.

Minge tagasi põhitõdede juurde

See, millega me täna vaeva näeme, ei erine nii palju sellest, millega me vaevlesime 20 aastat tagasi. Raamatutes on terve hulk häid nõuandeid. Alustuseks proovige Jason Friedi ja Matthew Lindermani veebikaitselist disaini ning Steve Krug ei pane mind mõtlema.

Kui te ei tea sellistest mõistetest nagu modaalsus ja taskukohasus, peate sellest lähemalt lugema. Peaksite saama selgitada, mis on Fittsi seadus. Gestalti lähedusseadus? See on UI disaini leib ja või.

Saage inspiratsiooni mängudest ja filmidest

Kasutajaliidese disainerina kasutan oma töö tegemiseks muid inspiratsiooniallikaid. Mängudest leian palju inspiratsiooni. Mõned mängud on väga keerulised ja kasutajaliidese disainerid on pidanud lahendama samad keerulised liidese probleemid nagu äriprojektidega tegelev kasutajaliidese disainer.

Mängud võivad tähendada ka trende. Colin McRae Rally menüüdest leitud minimalism meenutab mulle iOS7 suunda. Mõnes mõttes ilmus nüüd trendikas kasutajaliidese animatsioonikujundus mängudes aastaid tagasi. Üleminek skeuomorfismilt paljaste, funktsionaalsete liideste ja lameda kujundusega on olnud ilmne ka mängudes. Võrrelge 2006. aasta unustust 2011. aasta Skyrimiga. Mõlemad mängud on RPG-d samas sarjas, kuid erinevus on silmatorkav.

Ka Marveli filmide futuristlikud liidesed nagu Raudmees on olnud minu jaoks inspiratsiooniks. Need pole küll täpselt kasutatavad näited, kuid panevad mind rohkem arvutustele tervikuna mõtlema. Kas tahame ekraanide tulevikku või tahame, et ekraanid kaoksid? See on ilmselt hea küsimus, kui poseerida disainereid täis pubis.

Sa kasvad disainerina läbi raske töö, visaduse, kaaslastega rääkimise ja kohutavalt palju lugemise. Umbes aasta tagasi lugesin New York Timesis tükki 80ndatesse eluaastatesse jõudnud inimestest, kes jätkavad oma käsitöö lihvimist. Tunnen, et hakkan alles alustama. Aga sina?

Populaarsuse Saavutamine
10 meeletut kõrvitsa nikerdust
Edasi

10 meeletut kõrvitsa nikerdust

Arma tan eda või vihkan, Halloween on iin hä ti ja tõeli elt. ee on aeg aa ta , ku tuhanded noored (ja mitte nii noored) ebaühtla ed riietuvad oma lemmik hirmutavak tegela ek ja k&...
Palju õnne sünnipäevaks Milton Glaser
Edasi

Palju õnne sünnipäevaks Milton Glaser

U A di ainilegend Milton Gla er oli vaid vii aa tat vana, kui ta mõi ti pliiat i jõudu ja omaenda kujutlu võimet, muute elle palja tu e ehmatavak karjäärik , mi on haaranud k&...
Twitter tutvustab nuppu Jälgi
Edasi

Twitter tutvustab nuppu Jälgi

Twitter on avaliku tanud nupu Jälgi, mi näeb välja ja töötab pigem nagu tema olema olev Tweet-nupp, kuid ka utaja vahetuk jälgimi ek , mitte teabe jagami ek . Twitteri Br...