Share
Infinite Skills este o companie de software care dezvoltă materiale de învățare pentru ca oamenii să-și îmbunătățească cunoștințele despre o varietate de aplicații, de la software-ul industrial la programele de procesare obișnuită a textului. Abilitățile Infinite mi-au abordat ideea de a crea o serie de icoane de aplicații care să le însoțească software-ul. Inutil să spun, cu apetitul meu insatibil pentru designul icoanelor și branding-ul a fost jocul!
Proiectul a trebuit să fie evaluat pentru a determina abordarea corectă. De când lansarea acestor aplicații pe magazinul iTunes a fost o nouă acțiune pentru ei, nu aveau nici un parametru de proiectare a pictogramelor pe care trebuia să-l păstrez. Am profitat de această ocazie pentru a diseca problema și pentru a ajunge la cea mai bună soluție posibilă.
În primul rând, și cel mai important, trebuia să decid ce ar fi elementele unificatoare în întreaga campanie de icoane. Știam că va trebui să lucreze ca o familie, dar să fie destul de diferită, astfel încât spectatorul să le recunoască rapid ca titluri diferite de software.
Prin linii deschise de comunicare a fost stabilit că va exista o listă de spălare a titlurilor de software (ceea ce vedeți mai jos este doar o listă parțială). Am avut clientul să-mi trimită titlurile anticipate, astfel încât să pot evalua mai bine tendința de partajare a icoanelor asemănări în cursul creării tuturor icoanelor.
După multă atenție, schițare și deliberare, am decis că ar exista patru elemente de bază care ar distinge fiecare dintre pictograme: litera, culoarea, îmbunătățirea graficului și a fundalului.
Fiecare dintre icoane va fi recunoscută în primul rând printr-o scrisoare mare. Am folosit o serifă sansă și un font aldine, astfel încât pictograma să nu se simtă subțire sau prea aerisită. Litera este rotită în unghi pentru a afișa un aspect mai dinamic.
Deoarece mai multe elemente încep cu litera "F", de exemplu, culoarea ajută în continuare la distingerea unei scrisori duplicate de la o altă aplicație. Adobe Flash și Apple Final Cut Pro sunt exemple excelente.
Fiecare dintre pictograme ar primi, de asemenea, o grafică de îmbunătățire care indică ce vă va învăța titlul de software. În cazul în care titlurile de software au fost mai generice am folosit un grafic generic de consolidare prea.
Textura de fundal este o diferență subtilă care nu este destinată să fie observată la prima vedere. Atunci când este posibil, fiecare textură de fundal preia direcția de la software. În Final Cut Pro, fundalul este format din vedete care coincid cu filmul, camera, filmele etc..
După ce m-am decis cu privire la ceea ce ar fi diferențiate articolele am fost mutat la prelucrarea wireframes pentru fiecare dintre icoane. Am vrut să îmi ofer cea mai bună ocazie de a armoniza icoanele, având în vedere că am lucrat mai întâi la mai multe cadre.
Acest lucru a făcut foarte clar cu privire la elementele care trebuiau finisate pentru a lucra mai îndeaproape ca o unitate. De obicei, lucrul la două sau trei pictograme a oferit o bază bună pentru a determina similitudinea. În plus, pe măsură ce icoanele au fost terminate, m-am referit întotdeauna la ele, astfel încât să fiu sigur că păstrez chiar și cele mai mici detalii.
Deoarece literele pentru fiecare icoană au variat, trebuia să fiu creativă și flexibilă în ceea ce privește grafica însoțitoare. Uneori o scrisoare era într-adevăr largă, iar alteori scrisorile erau cu adevărat înalte. Pentru a compensa această diferență am implementat două tipuri de grafică. Elementele lungi și slabe se vor desfășura sub un unghi de la stânga sus la dreapta jos. Dacă un articol corespondent nu era subțire și neted, l-am desenat într-o formă mai pătrată și l-am așezat în fața literei. A fost important să observăm folosirea fiecăruia dintre aceste evenimente, astfel încât una să nu fie utilizată excesiv asupra celeilalte.
Când creați o serie de pictograme, este important să vă asigurați că pictogramele arată că aparțin împreună. Există mulți factori care afectează executarea cu succes a acestui lucru, inclusiv: subiect, orientare și suprafață, pentru a numi câteva.
De multe ori există parametri care trebuie lucrați în jur. Un parametru pe care l-am întâlnit în timpul acestui proiect a fost acela că clientul dorea să utilizeze o clădire în pictograma AutoCad și o cameră în pictograma Photoshop for Photographers. După cum știți foarte bine, o clădire diferă în detaliu de ceva atât de mic ca un aparat de fotografiat.
Pentru Photoshop pentru fotografi am atras multă detaliu pe care l-ați vedea într-o cameră foto. Desigur, oarecum distilat în jos având în vedere faptul că piesa rezultată este o icoană. Contrastează cu o clădire. Pentru a încorpora clădirea de care aveam nevoie pentru ao ilustra în așa fel încât să aibă suficientă detaliu pentru a citi ca o clădire, chiar dacă scara este mult mai mică. După cum am spus, am dezbrăcat clădirea până la elementele de bază care trebuiau incluse pentru ca aceasta să fie recunoscută ca atare - ferestrele, elementele de pe acoperiș și ornamentele au fost esențiale care ar rămâne.
Competențele Infinite știau că vor produce conținut pentru anumite segmente din cadrul unui grup de utilizatori. De exemplu, au un titlu de software care este mai general și este orientat spre utilizatorii Photoshop. De asemenea, au creat o altă versiune specială pentru fotografi. În mod tipic, versiunea este notată de un snipe (cuvinte scrise sub un unghi peste marginea ceva), dar în acest caz clientul prefera un grafic complet nou - o cameră.
Este de la sine înțeles că icoanele trebuie să vină ca o unitate. Cu toate acestea, este de asemenea important ca spectatorul să nu piardă interesul de a vizualiza elementele, deoarece acestea se plictisesc de execuția lor. Având în vedere acest lucru, am făcut un punct pentru a crea iluzia unor suprafețe diferite pe fiecare dintre articolele însoțitoare în comparație cu litera pe care a fost lângă.
Nu există nici o regulă tare și rapidă, care trebuie să fie abordată în acest fel de icoane, mai degrabă o licență artistică pe care am exercitat-o. În unele cazuri este doar ilogic să creați iluzia unei alte suprafețe, cum ar fi în pictograma Microsoft Excel unde se așteaptă ca o diagramă de bare să fie reflectorizantă, dar pe pictograma Adobe Illustrator veți observa că stiloul are un aspect plastic plin în timp ce "I" are un aspect foarte reflectant. Acest lucru aduce un interes mai mic și ajută la afișarea obiectului într-o lumină mai realistă.
În timp ce fiecare icoană durează câteva ore de la început până la sfârșit, am oferit o privire mai mare asupra creării unei porțiuni a uneia dintre pictograme. Sper că v-ați bucurat să citiți despre procesul meu și veți lua câteva informații pe care le-ați găsit de ajutor și le veți aplica proiectelor proprii.
Time Lapse App Crearea de pictograme de la Jonathan Patterson pe Vimeo.
Accentsconagua