Conţinut
Când mi-am început cariera, eram designer de web. Am lucrat în design web timp de patru ani, începând cu site-uri de afaceri mici și trecând în cele din urmă la clienți mai mari. Am aflat că nu mă interesează designul grafic și nici nu lucrez pentru nume de marcă mai mari. Mă interesa mai mult modelele de paginare, modul în care oamenii interacționau cu formularele și lucruri precum performanța percepută, decât designul vizual al unei pagini web.
Când mă uitam la filme SF, mă uitam la interfețe. Și când jucam jocuri video, observam felul în care erau amenajate meniurile. Dacă vreuna dintre aceste trăsături vi se pare familiară, s-ar putea să fiți, de asemenea, un designer de interfețe.
Am renunțat la slujba de agenție și am început propria mea companie. Pe pagina mea de LinkedIn, am încercat să rezum noul meu obiectiv de carieră: să fac cel mai bun software posibil. Au trecut patru ani de când am început să lucrez ca independent, iar călătoria mea nu s-a oprit. Zilele astea ajut să conduc o mică companie de design UI numită Mono. Recent l-am întâmpinat pe cel de-al patrulea membru al echipei noastre.
În acest articol, vreau să descriu cum este să fii un designer de interfață, inclusiv ce presupune exact munca, unde să găsești cele mai bune resurse de învățare și cum să te îmbunătățești la meseria ta.
Ce face un designer UI?
Consider că, în general, puteți împărți munca unui designer de interfață utilizator în patru categorii. Comunicați cu clientul, cercetați, proiectați și prototipați și comunicați cu dezvoltatorii. Să analizăm mai detaliat fiecare dintre aceste faze.
Comunicarea clientului
Comunicarea clientului se referă la înțelegerea problemei clientului. Scopul este de a face cunoștință cu afacerea clientului dvs., astfel încât începutul unui proiect constituie de obicei o mulțime de discuții. Este bine să nu știi prea multe despre domeniul clientului tău atunci când începi - poți să te uiți la afacerea lor într-un mod nou, în timp ce ai în vedere soluții de proiectare posibile.
Pentru a fi un bun designer de interfață, trebuie să poți gândi în cele din urmă la afacerea clientului tău. De exemplu, clientul dvs. ar putea fi în aviație. Lucrul pentru ei vă va face în cele din urmă destul de informat despre această industrie. Așadar, un sfat pentru propria fericire aici este alegerea industriilor pentru care lucrați cu înțelepciune, astfel încât să nu ajungeți să fiți un expert în ceea ce nu vă pasă sau nu vă interesează.
În timpul unui proiect, comunicarea nu se oprește. Ca designer, vă veți prezenta lucrările în mod constant. La compania noastră suntem o echipă îndepărtată, deci nu avem multe întâlniri în persoană. În schimb, folosim intens partajarea ecranului prin videoconferință. Instrumente de comunicare precum Skype și Slack sunt folosite în fiecare zi.
Este util să combinați metode de comunicare sincrone și asincrone. Un apel este excelent dacă aveți nevoie de multe informații rapid, dar trebuie să fiți în același timp. Ne gândim la Slack ca la „răcitorul nostru virtual de apă” și folosim Basecamp pentru a gestiona proiecte complexe de design. Când proiectăm prototipuri folosind HTML și CSS, folosim Problemele GitHub pentru a discuta codul direct.
Cercetare
Pe lângă comunicarea cu clienții, veți face multe cercetări. Aceasta ar putea include studii de teren, ateliere cu clientul, analiza concurenței sau definirea unei strategii - în esență, aproape orice vă ajută să înțelegeți problema la îndemână.
Cercetarea este cea care informează alegerile dvs. de proiectare. Este un articol pe care l-ai citit odată sau acel lucru nou pe care tocmai l-a lansat Apple. Când este timpul să explicați de ce ați făcut o anumită alegere de proiectare, cercetarea dvs. vă sprijină.
Cercetările pot fi foarte ample. Testez adesea dispozitive noi în scopuri de cercetare sau mă înscriu la o nouă aplicație web pentru a studia interfața utilizatorului.
Proiectare și prototipare
Ca designer, probabil că vă veți petrece cea mai mare parte a timpului făcând lucrări de proiectare și prototipare. Un proiect de proiectare UI poate merge mai departe în orice fel de moduri, de la schițe, la proiectare detaliată, până la codificare.
Metoda pe care o utilizați depinde în mare măsură de tipul de proiect. Ce proiectezi? Este un site web sau preferați să-l numiți aplicație? Folosește tehnologie nativă? Este o reproiectare sau începi de la zero?
La compania noastră nu există un proces fix, dar majoritatea proiectelor urmează aceeași ordine brută: încep cu schițe și fireframuri, trec la un design vizual și interacțiune detaliat și se termină cu un prototip.
În calitate de designeri, petrecem mult timp gândindu-ne la instrumentele noastre. Deși instrumentele grozave sunt importante, ele nu sunt cel mai important lucru. A putea utiliza Adobe Creative Suite și aplicații precum Sketch în mod competent este echivalentul a putea folosi un creion pentru a desena sau o pensulă pentru a picta. Încă trebuie să faceți pictura.
Acestea fiind spuse, un interes sănătos pentru instrumente este un lucru bun. Îmi place să încerc noi instrumente care mă pot ajuta să fiu mai productiv. Instrumentul meu preferat de editare vectorială este Illustrator, dar cea mai mare parte a lucrărilor mele de proiectare vizuală sunt realizate în Sketch în aceste zile. Alți membri ai echipei au trecut la instrumente mai noi precum Affinity Designer.
Instrumentele sunt o alegere foarte personală. Atâta timp cât putem lucra cu ușurință împreună, fiecare este liber să-și aleagă propriile. Pentru a face mai simplu să vorbim despre proiectele noastre cu clienții, realizăm prototipuri cu InVision. Cu toate acestea, pentru prototipuri mai avansate, folosim HTML și CSS. Instrumentul de care aveți nevoie depinde de sarcina pe care doriți să o faceți.
Comunicarea dezvoltatorului
O parte deseori uitată a muncii unui designer UI este comunicarea dezvoltatorului. În zilele noastre nu puteți scăpa doar de a trimite design-urile dvs. către dezvoltatori și de a spera că vor fi implementate corect. Cei mai buni designeri știu că provocarea nu constă în crearea designului, ci în comunicarea acestuia - nu numai părților interesate care trebuie să-și dea aprobarea, ci și dezvoltatorilor care trebuie să-l implementeze.
Comunicarea unui design vine sub mai multe forme: specificații detaliate, furnizarea de active, revizuirea proiectului împreună. Ceea ce are sens să se livreze în fiecare caz depinde în mare măsură de faptul dacă proiectul este nativ sau o aplicație web.
Abordarea tradițională este de a livra active lângă design-urile ecranelor. Proiectele de ecran pot fi folosite pentru a vedea cum va arăta designul în ansamblu, în timp ce activele sunt PNG-uri și SVG-uri de pictograme gata de utilizat, astfel încât dezvoltatorii nu trebuie să se ocupe de un editor grafic.
La compania noastră suntem susținătorii livrării mai mult decât atât. Folosim ghiduri de stil pentru componente pentru a ne menține coerența în proiectarea noastră. Când avem de-a face cu un proiect web, livrăm seturi detaliate de HTML și CSS, documentate bucată cu bucată, gata de implementare. Cred că a avea un ochi de proiectare în fiecare fază a dezvoltării software-ului este singura modalitate de a-mi atinge scopul de a crea software de clasă mondială.
Aplicații web vs native
Când proiectați o aplicație nativă pentru o platformă (de exemplu, iOS sau Android), aveți tendința de a respecta anumite linii directoare. Când proiectați pentru web, nu există atât de multe îndrumări. Ceea ce se întâmplă de obicei este că clientul dvs. are un set de linii directoare grafice pentru marca sa, care determină modul în care ar trebui să arate lucrurile.
Cu toate acestea, aceste linii directoare tind să fie adaptate în funcție de site-urile de marketing și ceea ce există nu duce întotdeauna la decizii bune de interfață cu utilizatorul. Fonturile tind să fie alese din motive de marketing, nu din motive de lizibilitate. Culorile pot fi îndrăznețe și izbitoare, care funcționează într-o campanie publicitară, dar nu și într-o aplicație pe care o folosiți zi de zi. Aceste ghiduri trebuie interpretate.
Există puține linii directoare pentru web. Ați putea susține că webul este un melting pot de diferite stiluri. Dacă creați ceva care pare mai mult o aplicație decât un site web, trebuie să știți despre cadrele utilizate pe scară largă, cum ar fi Bootstrap și ZURB Foundation. Cadrul începe să stabilească cum ar trebui să arate lucrurile, deoarece nu doriți să reinventați roata. Și acesta este probabil un lucru bun.
La compania noastră, ne place să folosim Bootstrap. Oferă dimensiuni implicite sensibile pentru elementele UI comune, cum ar fi butoane, tabele de date și moduri.
În designul web, sunteți mai constrâns de capacitățile tehnice ale web-ului. Obișnuia să fie că ar fi dificil să implementezi înfloriri vizuale simple precum colțurile rotunjite pe un site web. Aceste zile au dispărut de mult - acum sunteți liberi să desenați interfețe cu multe umbre, tranziții, animații și chiar 3D.
În calitate de designer, este mult mai realist să preia controlul asupra procesului și proiectării în browser. Nu am văzut mulți designeri de interfețe care să preia programarea UI a unei aplicații native, dar un designer care face HTML și CSS dintr-o aplicație web este o întâmplare obișnuită. Dacă îți poți codifica propriile modele, vei avea un avantaj față de colegii tăi care nu codifică, iar pentru mine este singurul mod de a înțelege cu adevărat cum funcționează webul.
Constrângeri web
În curând veți descoperi că nu toate trucurile interesante pe care le învățați sunt acceptate în fiecare browser și aceasta este realitatea proiectării pentru web. Este bine să urmați principii binecunoscute precum îmbunătățirea progresivă, unde încărcați conținut îmbunătățit ori de câte ori este posibil, dar vă gândiți și la modul în care conținutul se degradează.
Recent, „tăierea muștarului” a devenit populară. Campionat de echipa web a BBC, aceasta implică diferențierea între browserele „bune” și „rele” și furnizarea unei experiențe limitate browserelor „rele”. Cu toate acestea, chiar funcționează numai pentru site-urile de conținut.
Când vine vorba de experiențe de tip aplicație, mulți oameni limitează asistența doar la câteva browsere de vârf, pentru a facilita dezvoltarea. Din păcate, acest lucru ne aduce înapoi la situația din 1996 în care aveți nevoie de un anumit browser pentru a vizualiza conținut.
Îmbunătățirea setului de abilități
Deci, cum poți să fii la curent cu industria web în mișcare rapidă și să-ți îmbunătățești abilitățile? Să ne uităm la câteva metode diferite pentru a vă îmbunătăți abilitățile ...
Cunoașterea platformei
O parte importantă a arsenalului unui designer este cunoașterea platformei. Ar trebui să știți despre diferitele sisteme de operare și cum le folosesc oamenii. În calitate de designeri, avem tendința de a folosi Mac-uri, dar este ușor să uităm că majoritatea oamenilor de acolo folosesc cutii Windows pentru a-și face treaba.
Simt că poți înțelege cu adevărat ceva numai dacă îl folosești singur. Prefer să folosesc computerul Mac pentru a proiecta, dar petrec mult timp recuperând evoluția diverselor alte platforme. Am mai multe copii ale Windows instalate pe Mac-ul meu ca mașini virtuale. Am fost ocupat să testez noi versiuni de Windows 10 folosind Programul Microsoft Insider pentru a verifica diferitele modificări din interfața de utilizare.
De asemenea, cumpăr în mod regulat hardware nou pentru a testa cum funcționează. Am cumpărat un Apple Watch tocmai pentru a testa platforma. Apoi l-am vândut pentru că am simțit că nu adaugă atât de mult la viața mea.
În plus, web-ul poate fi văzut ca propriul său sistem de operare. Este în continuă evoluție, cu noi funcții adăugate la fiecare furnizor de browsere în fiecare săptămână. Este extrem de util să cunoașteți aspectele tehnice ale browserelor, în special în ceea ce privește abilitățile CSS și grafice. Trebuie să știți ce sunt SVG și WebGL și cum puteți utiliza API-ul Web Animations.
Fiecare platformă evoluează în timp și, ca proiectant de interfață cu utilizatorul, este sarcina dvs. să rămâneți la curent. La urma urmei, orice proiectați nu trăiește izolat, ci face parte dintr-un ecosistem software mai mare.
Reveniți la elementele de bază
Ceea ce ne luptăm astăzi nu este atât de diferit de ceea ce ne luptam acum 20 de ani. Există o mulțime de sfaturi bune în cărți. Încercați Defensive Design for the Web de Jason Fried și Matthew Linderman și Don't Make Me Think de Steve Krug pentru început.
Dacă nu știți despre concepte precum modalitate și accesibilitate, trebuie să citiți. Ar trebui să puteți explica ce este legea lui Fitts. Legea Gestalt a proximității? Acesta este pâinea și untul designului UI.
Inspiră-te din jocuri și filme
În calitate de designer de interfețe, mă bazez pe alte surse de inspirație pentru a-mi face munca. Găsesc o mulțime de inspirație în jocuri. Unele jocuri sunt foarte complexe, iar designerii de interfețe au fost nevoiți să rezolve aceleași probleme de interfață complexe ca și designerul de interfețe care lucrează la proiecte de afaceri.
Jocurile pot însemna și tendințe. Minimalismul găsit în meniurile Colin McRae Rally îmi amintește de direcția iOS7. Într-un fel, designul animației UI, care este acum la modă, a apărut în jocuri cu ani în urmă. Trecerea de la skeuomorfism la interfețe goale și funcționale și „design plat” a fost evidentă și în jocuri. Comparați Oblivion 2006 cu Skyrim din 2011. Ambele jocuri sunt RPG-uri din aceeași serie, dar diferența este izbitoare.
Interfețele futuriste din filmele Marvel precum Iron Man au fost, de asemenea, o inspirație pentru mine. Nu sunt tocmai exemple utilizabile, dar mă fac să mă gândesc mai mult la calcul în ansamblu. Vrem un viitor al ecranelor sau vrem ca ecranele să dispară? Aceasta este probabil o întrebare bună de pus într-un pub plin de designeri.
Crești ca designer prin muncă grea, perseverență, vorbind cu colegii tăi și citind foarte mult. În urmă cu aproximativ un an, am citit în New York Times o piesă despre oameni până la 80 de ani, care continuă să-și perfecționeze meseria. Simt că încep doar. Și tu?
