Share
Iconografia este o parte integrantă a oricărui proiect de design UI în aceste zile. Icoanele au capacitatea de a comunica idei, funcții și sensuri într-o limbă vizuală comună. Să examinăm cantitatea de muncă care are loc în crearea unui set de pictograme, precum și fazele logice care trebuie urmate atunci când faceți acest lucru.
În scopul acestui articol vom lucra cu un set de pictograme pe care l-am conceput recent numit Uicons.
Comunitatea de design web iubește resurse mari. Open source sau nu, ne fac viața ca designeri atât de ușor. Înainte de a începe crearea unui set de pictograme proprii, este o idee bună să vedeți dacă există unul care există deja și care se va potrivi nevoilor dvs..
Deci, pasul unu este de a verifica seturile de pictograme existente; ați putea să vă salvați timp și energie, fără a recrea ceea ce este deja acolo.
Plasarea reprezintă punctul de diferență dintre setul dvs. de pictograme propus și una dintre mii de seturi de pictograme deja existente. Acest lucru reiese cu adevărat din faza noastră de cercetare; fără a ști ce este deja disponibil, de unde știi că există o cerere sau nevoie de ea?
Alegerea stilurilor de icoane este vastă și va trebui să decideți ce stil vor fi icoanele voastre. Indiferent dacă vor fi mono-ton, plin de culoare, muti-culoare, tridimensionale, desene animate, siluete realiste, trase manual sau pixeli, alegeți un stil și stick cu el.
Înainte de a crea Uicons am găsit o nevoie / nevoie de pictograme vectoriale multi-strat, care au fost pixel perfect. Vroiam un set de pictograme care avea mai multă adâncime și detalii decât majoritatea seturilor existente de pictograme mono oferite, fără a fi nevoie să folosiți icoane de culoare plină.
Deci, odată ce ați găsit un punct de diferență și un stil ales, atunci este timpul să treceți în faza de planificare.
Planificarea este pur și simplu să decidă ce pictograme doriți să includeți în setul dvs. Veți avea nevoie să vă gândiți la cine vă va atașa setul de pictograme și apoi să creați o listă (cea mai bună realizată ca foaie de calcul) pe baza acelor parametri.
Un sfat bun este să vă împărțiți lista în subcategorii cum ar fi mass-media sociale, tipurile de fișiere, transportul .etc. Pe lângă păstrarea lucrurilor ordonate, veți găsi acest lucru util în faza de proiectare, deoarece verificarea listei pe măsură ce vă deplasați va face completarea listei dvs. de pictograme mai puțin descurajante.
Stadiul de planificare este, de asemenea, timpul perfect pentru a decide în ce mărime sau dimensiuni veți oferi icoanele dvs. Dimensiunile obișnuite sunt 16, 32 și 48 de pixeli, cu toate acestea, începem să vedem tot mai multe seturi de pictograme livrate în formate scalabile, cum ar fi .CSH (fișierul formatelor Photoshop) și formatele de fonturi. Mai multe despre formate mai târziu.
În timpul fazei de planificare, este bine să reflectați asupra cercetării anterioare pe care ați făcut-o în prima fază. Există sute de simboluri și icoane care ar trebui să fie luate în considerare pentru un set complet - nu le veți putea aminti fără toate materialele de referință.
Fii greu pentru tine în timpul fazei de planificare. Nu vă fie frică să nu răspundeți unei idei sau să nu scăpați lista - se poate emite ridicol de repede. Crearea de pictograme de calitate necesită mult timp și crearea unui set de 5000 (de exemplu) nu va dura doar pentru totdeauna, este dificil pentru utilizatorul final să gestioneze.
În timpul celor 4 luni de când a fost nevoie să creez Uicons, m-am trezit constant și m-am lăsat pe lista până la lansare. Chiar și acum, mă mai găsesc gândindu-mă la ce pictograme să includ în următoarea versiune.
Acum ar trebui să aveți o listă populată cu idei pentru pictogramele dumneavoastră. Acum sunteți gata să începeți proiectarea.
În fazele 2 și 3 ați decis asupra stilului dvs. de icoană. Stilul dvs. specific va influența ce aplicație sau metodă folosiți pentru a vă face icoanele.
În cazul lui Uicons, am creat icoane scalabile (vectori), pe care utilizatorii le-ar putea redimensiona fără pierderi de calitate. Cei mai mulți designeri folosesc Illustrator sau alte aplicații grafice vectoriale, însă un program vectorial vă poate face viața dificilă dacă creați icoane pixel desenate manual. Alegeți aplicația potrivită pentru lucrare.
Acum, când spun "inspirație", nu vreau să spun "plagiat". Faceți-vă propriul dvs..
Icoanele sunt forme de bază aranjate pentru a face ceva recunoscut. Poate fi dificil să vă imaginați toate pictogramele și să le vizualizați de la zero. Din fericire, aveți cercetarea pe care ați făcut-o în faza 1 și sunteți în posesia unei liste de puncte de referință pentru inspirația vizuală.
Este bine să jucați cu idei de design alternative pentru icoanele dvs. Există mai multe modalități de a reprezenta un magazin, de a reprezenta instrumente, de a reprezenta orice. Fii creativ. Pe lângă oferirea unei prezentări standard a subiectului pictogramei dvs., încercați să oferiți o nouă perspectivă. Dacă fiecare designer de icoane a dat aceleași idei în același mod, lumea UI ar fi destul de plictisitoare.
Doar pentru că ai proiectat ceva nu înseamnă că trebuie să faci tăietura finală. Fii selectiv cu privire la ceea ce vei ajunge la public. În cazul lui Uicons, aproximativ 10% din icoane au fost lăsate pe podeaua camerei de tăiere, dintr-un motiv sau altul.
Faza de proiectare este, evident, faza cea mai consumatoare de timp a întregului proiect, deci este important să avem rezistență, putere și consistență.
Nu este într-adevăr o fază dedicată, ci o abordare inedită a setului de pictograme. În toate punctele din timpul procesului de proiectare trebuie să fiți conștienți de menținerea setului dvs. de pictograme consecvent în stil și aspect. Dacă nu sunteți prea îngrijorat de consecvență în timpul procesului atunci continuitatea va deveni într-adevăr o fază dedicată în timp ce vă revizuiți toate simbolurile icoanelor la sfârșitul.
Atenția slabă la consistență poate duce la greutăți inegale, la dimensiuni greșite, la perspective greșite sau la greșeli cu totul. După fiecare pictogramă, faceți un pas înapoi și vedeți cum se potrivește cu cele pe care le-ați creat deja - poate fi ușor să alegeți unul ciudat.
Este posibil să fi ales să livrați setul de pictograme într-un format vectorial, cum ar fi .EPS, .AI sau .SVG, caz în care ați tăiat o bucată de lucru în afara procesului. Puteți fi chiar mai inteligent și alegeți să eliberați pictogramele ca fișier de font sau ca fișier .CSH. Oricare dintre aceste opțiuni va face un designer cu experiență, cum ar fi setul de pictograme chiar mai mult. Mersul pe acest drum necesită un efort mai mic, deoarece va trebui să vă convertiți icoanele Illustratorului într-un alt format, dar munca suplimentară oferă avantaje masive.
Din cauza aspectului meu de diferență în proiectarea lui Uicons, înainte de mine, am avut o treabă mai mult în acest stadiu. Dorința mea a fost să creez icoane vectoriale multi-layered pixel perfect. Aș fi putut face lucrul cu mai multe straturi în Illustrator și i-aș fi lăsat așa ca oamenii să copieze și să lipsească în Photoshop, dar am vrut vectorii perfect pixeli într-un program raster.
Photoshop este minunat. Aceasta este până când începeți să creați icoane. Din motive foarte bune, Photoshop permite variante în funcție de lățimea pixelilor. Poți avea jumătate de pixel sau chiar două treimi dacă vrei. Anti-aliasing așa cum se numește, este excelent pentru fonturi și curbe bezier, dar poate fi frustrat când vine vorba de crearea icoanelor perfect pixel.
Uicons a cerut importarea mai multor forme vectoriale independent de Illustrator în Photoshop, alinierea, redimensionarea și styling-ul acestora, apoi optimizarea acestora pentru perfecțiunea pixelilor prin creșterea incrementării căilor prin incrementare până la marginile curate.
Felicitări pentru a face acest lucru departe! Nu este o sarcină mică ce creează propriul set de pictograme. Acum, că toată munca grea se face, trebuie doar să eliberați pictogramele pentru public. Prin acest punct, ați decis dacă oferiți acest lucru ca o pictogramă gratuită stabilită comunității de proiectare sau dacă doriți o mică rambursare pentru sutele de ore pe care le-ați cheltuit pentru crearea setului de pictograme criminal.
În orice caz, aveți nevoie de o scenă pentru ca oamenii să le previzualizeze și să le poată descărca. Opțiunea gratuită este cea mai ușoară, deoarece puteți să le trimiteți literalmente către o grămadă de site-uri cu resurse grafice și bloguri pentru a le publica, stai pe spate și așteptați pentru kudos.
Cu toate acestea, dacă doriți să vindeți setul de pictograme pentru ucigași, aveți mai multă muncă înainte de dvs. Cea mai ușoară modalitate de a le vinde este să găzduiți unul dintre site-urile de resurse de design precum GraphicRiver. Descărcarea și plata sunt asigurate pentru dvs. și aveți avantajul traficului de site-uri existent.
Dacă sunteți mai proactiv, o altă opțiune este să vă creați propriul site web pentru a afișa și a descărca pictogramele cu prețuri modeste. În acest caz, există opțiuni excelente pentru a vă ajuta să aveți grijă de partea de descărcare și plată a lucrurilor.
Serviciile de livrare digitale, cum ar fi Fetch și Quixly, fac foarte ușor să vindeți setul de pictograme, având grijă de partea de comandă, descărcare și plată a lucrurilor. Trebuie doar să proiectați și să construiți un site răcoros pentru a vă afișa munca. Se ocupă toate lucrurile grele de tehnologie.
Iconografia ca orice limbaj vizual trebuie să fie clară și concisă. Orice ați încerca să reprezentați cu icoane, păstrați-o simplă și clară și șansele dvs. de înțelegere universală vor fi mai mari.
Accentsconagua