Kaip patobulinti savo, kaip kūrėjo, vartotojo sąsają / UX projektavimo įgūdžius

Jei prieš ketverius metus, kai tapau CS absolventu, manęs paklaustumėte, kokį karjeros kelią pamačiau save einančią, tikriausiai būčiau jums pasakiusi „Java“ programinę įrangą ar panašiai. Niekada nebuvau kūrybinga, dažai sutinka drobę, todėl tikrai nesvarsčiau karjeros, susijusios su priekinės dalies kūrimu ir dizainu.

Kaip visi žinome, viskas keičiasi. Per savo karjerą vis labiau domėjausi vartotojo sąsajos kūrimu ir dizainu. Mano darbe pasisekė, kad susidūriau su „front-end“ kūrimu ir man buvo leista investuoti laiko į įgūdžių, būtinų norint būti „front-end“ kūrėju, tobulinimą.

Per pastaruosius 12 mėnesių stengiausi pagerinti savo vartotojo sąsajos / vartotojo sąsajos supratimą tiek dėl asmeninio susidomėjimo, tiek dėl to, kad galėčiau būti efektyvesnis dirbdamas su dizaineriais.

Šiame įraše norėčiau pasidalinti išmoktomis pamokomis, surinktais ištekliais ir padarytomis klaidomis tikėdamasis, kad kiti kūrėjai galės išmokti iš mano kelionės.

Turinys

  • Tai ne tik talentas
  • Žiūrėk, galvok, vogk
  • Sužinokite teoriją
  • Pastatyk ką nors
  • Nepasiduok
  • Ištekliai
  • Išvada

Tai ne tik talentas

Tai man atrodo akivaizdu dabar, bet buvo laikas, kai maniau, kad dizaineriai yra burtininkai, gimę sugebėdami sukurti nuostabiai atrodančias programas ir svetaines.

Pasirodo, kad ne. Jie ką tik sunkiai dirbo tobulindami savo amatą. Lygiai taip pat, kaip išmokti koduoti lengviau kai kuriems žmonėms, yra žmonių, kurie turės natūralų talentą dizainui, tačiau talentas nereiškia daug be sunkaus darbo.

Dizaino galima išmokti. Nepadarykite klaidos, kurią padariau, ir nurašykite save, nes nesate kūrybingi tradicine prasme. Programavimo problemų sprendimas reikalauja kūrybiškumo; galvokite apie dizaino iššūkių sprendimą tuo pačiu būdu.

Žiūrėk, galvok, vogk

Lygiai taip pat, kaip skaitydami gerą kodą, galėsite tapti geresniu kūrėju, mokydamiesi iš to, ką sukūrė kiti, galėsite tapti geresniu dizaineriu.

Kitą kartą apsilankę svetainėje ar naudodamiesi programėle, pažiūrėkite į ją ir tikrai pagalvokite, kodėl ji atrodo ir elgiasi taip, kaip atrodo. Kodėl elementai dedami ten, kur yra? Kodėl tas mygtukas yra tam tikros spalvos? Kodėl jūs turite atlikti veiksmus tam tikra tvarka?

Paimkime, pavyzdžiui, „Medium“ plojimų mygtuką. Kodėl jie tiesiog nenaudojo mygtuko „patinka“, kaip ir visos kitos socialinės žiniasklaidos svetainės? Mano nuomone, tai buvo protingas dizaino sprendimas to nedaryti. Vietoj to, jie gali sustiprinti svetainę valdančios bendruomenės idėją, kruopščiai suprojektuodami sąveiką. Suteikiant straipsniui ar atsakymui penkiasdešimt kartų, vartotojui reikia laiko, tačiau tai padeda realiai susisiekti su žiūrimu turiniu ir jį sukūrusiu asmeniu.

Tokios svetainės kaip „Awwwards“ ir „Dribbble“ man pastaraisiais metais pasirodė neįkainojamos. Daugelis dizaino Aš sukurtų ėmėsi liberalią įkvėpimo iš kitų puikių dizainerių kūrinių.

Sužinokite teoriją

Kai pirmą kartą pradėjau kurti savo dizainą, negalėjau suprasti, kodėl jie atrodė ir elgėsi taip prastai. Srautai buvo nepatogūs, spalvos nesutapo, o išdėstymas buvo nenuoseklus.

Maniau, kad galėčiau tiesiog pereiti tiesiai į savo žinias apie kūrimą ir pagrindines žinias, kaip svetainės turėtų veikti, kaip naudotojas, ir tai bus gerai.

Aš labai labai klydau. Pabaigiau kurti dizainus kūrėjų požiūriu, užuot panaudojusi dizaino teoriją kaip pagrindą.

Kūrėjai žino, kaip svetainė veikia , tačiau dizaineriai žino, kaip svetainė elgiasi ir jaučiasi. Yra didelė spraga, kurią galite užpildyti tik įgiję dizaino žinių pagrindą.

Norėdami įgyti pagrindinį supratimą apie dizaino teoriją, dažniausiai naudojau „Medium“ ir „Udemy“. Žemiau esančiame skyriuje galite rasti nuorodas į mano naudojamus išteklius.

Pastatyk ką nors

Bet kuris kūrėjas ar CS profesorius jums pasakys, kad geriausias būdas tapti geresniu programuotoju yra parašyti kodą. Tas pats principas galioja ir projektuojant.

Nesvarbu, ką kuriate, jei tik iš to mokotės. Laikykite tai tikru projektu: galvokite apie vartotojus. Kurkite vielinius rėmus, maketus ir prototipus. Pakartokite originalų dizainą, kad jį patobulintumėte. Jei norite gauti atsiliepimų apie tai, ką sukūrėte, galite naudoti tokias svetaines kaip „Reddit“.

Galite net susieti jį su savo tobulėjimo įgūdžių tobulinimu. Daugumą mano pastarųjų šalutinių projektų paskatino bendras noras tobulinti žiniatinklio kūrimo ir dizaino įgūdžius. Sukūrę savo projektą, galite jį išplėtoti ir pamatyti abi monetos puses.

Štai keletas idėjų, kaip pradėti:

  • Sukurkite sąveiką. Norėdami įkvėpti, naudokite „Medium“ plojimų mygtuką.
  • Sukurkite programą savo mėgstamai labdaros organizacijai. Pagalvokite apie skirtingus vartotojų tipus: potencialius, retus ir įprastus globėjus.
  • Sukurkite savo CV. Pagalvokite apie spalvas, kurias naudojate, ir ką tai reiškia. Pagalvokite, kaip bus naudojamas jūsų CV . Ar jis bus tiesiog žiūrimas ekrane, ar bus atspausdintas? Kaip tai įtakoja dizainą?
  • Pertvarkykite esamą svetainę. Tai gali būti jūsų vietinis transporto paslaugų teikėjas arba pasaulinis prekės ženklas. Palyginkite savo dizainą su originalu ir pagalvokite apie skirtumus vartotojo požiūriu.
  • Sukurkite kažką fizinio, pavyzdžiui, naują transporto būdą ar galbūt alternatyvą kažkam paprastam, pavyzdžiui, šakute ar kėdė. Manau, kad mąstymas apie kasdienių daiktų dizainą yra tikrai naudingas būdas mąstyti kuriant ką nors intuityvaus.

Nepasiduok

Kai atsigręžiu į tai, ką sukūriau prieš metus, sunku nenusiminti. Bet visi kažkur prasideda. Bus verta to, ką kuriate, pažangos. Kol mokaisi iš to, ką darai, tavo laikas yra gerai praleistas.

Tai gali padėti reguliariai sekti, ką išmokote. Kiekvieną mėnesį atsigręžiu į kai kuriuos dalykus, kuriuos dirbau, ir stengiuosi iš patirties pasisemti kuo daugiau. Net jei norite atpažinti tik nedidelę informaciją, kurią surinkote perskaitę straipsnį, tai vis tiek yra pažanga.

Ištekliai

Žemiau pateikiama nedidelė mano mėgstamų įrankių, straipsnių ir kursų kolekcija. Čia ir čia galite rasti daug daugiau, kurių aš neišvardinau.

Įrankiai

Figma - Projektavimas ir prototipų kūrimas bendradarbiaujant.

„FramerX“ - panašus į „Figma“, bet su pridėtu „React“ ir atrandamais komponentais.

Aušintuvai - atraskite ir sukurkite spalvų paletes.

„WebAIM“ kontrasto tikrintuvas - įsitikinkite, kad jūsų spalvos yra prieinamos.

Archetipas - tipografijos sistemos redaktorius ir generatorius.

Straipsniai

7 praktiniai patarimai, kaip apgauti dizainą

10 apgaulės kodų, skirtų kurti vartotojo sąsajas

10 mažų dizaino klaidų, kurias vis dar darome

Kurkite geresnes formas

Pilnas UX pristatomų prekių sąrašas

Psichologijos principai, kuriuos turi žinoti kiekvienas UI / UX dizaineris

Kaip naudoti spalvas vartotojo sąsajos dizaine

16 citatų, kurias turite perskaityti kaip „UX Designer“

Produkto dizaino principai vienoje kortelėje

Kursai

Vartotojo patirties dizaino pagrindai - „Udemy“

Pilnas programų dizaino kursas - UX, UI ir Design Thinking - Udemy

UXTraining.com

Išvada

Tikiuosi, kad sugebėjai pasiimti ką nors iš mano kelionės. Jei turite dizaino patarimų ar šaltinių, kurie padėjo jums išmokti, norėčiau juos išgirsti atsakymuose.

Ačiū, kad skaitėte!