Ikonografi er en integrert del av et UI-designprosjekt i disse dager. Ikoner har evne til å formidle ideer, funksjoner og betydninger i et felles visuelt språk. La oss undersøke mengden arbeid som går inn i å skape et ikonsett, samt de logiske faser som skal følges når det gjøres.
For formålet med denne artikkelen vil vi jobbe med et ikonsett jeg nylig har designet som heter Uicons.
Nettdesign samfunnet elsker store ressurser. Åpen kilde eller ikke, de gjør våre liv som designere så mye lettere. Før du begynner å lage et eget ikonsett, er det en god ide å se om det finnes en som allerede finnes som passer dine behov.
Så trinn ett er å sjekke eksisterende ikonsett; du kan spare deg tid og energi ved ikke å gjenskape det som allerede er der ute.
Plassering handler om forskjellen mellom det foreslåtte ikonvalget og et av tusen eksisterende ikonsett som allerede er der. Dette følger virkelig av fra vår forskningsfase; uten å vite hva som allerede er tilgjengelig, hvordan vet du at det er en etterspørsel eller behov for det?
Valget av ikoner er stort, og du må bestemme hvilken stil ikonene skal være. Enten de vil være monotone, fullfarge, muti-farge, tredimensjonal, tegneserie, realistisk, silhuetter, håndtegnet eller piksel, velg en stil og hold deg til den.
Før jeg opprettet Uicons fant jeg et behov / ønske om flere lagers vektorikoner som var perfekt for piksler. Jeg ville ha et ikonsett som hadde mer dybde og detalj enn de fleste av de eksisterende monoikonsettene som tilbys, uten å måtte bruke fargeikonene.
Så når du har funnet et poeng av forskjell og valgt en stil, så er det på tide å flytte inn i planleggingsfasen.
Planlegging handler ganske enkelt om å avgjøre hvilke ikoner du vil inkludere i settet ditt. Du må vurdere hvem ikonet ditt vil appellere og deretter lage en liste (best gjort som et regneark) basert på disse parameterne.
Et godt tips er å dele listen din i underkategorier som sosiale medier, filtyper, transport .etc. I tillegg til å holde ting bestilt, finner du dette nyttig i designfasen som å sjekke ut listen mens du går, gjør at du fullfører listen over ikoner mindre skremmende.
Planleggingsstadiet er også den perfekte tiden til å bestemme hvilken størrelse eller størrelser du vil tilby ikonene dine. Vanlige dimensjoner er 16, 32 og 48 piksler, men vi begynner å se flere og flere ikonsett som leveres i skalerbare formater som .CSH (Photoshop formfil) og skriftformater. Mer om formater senere.
I planleggingsfasen er det godt å reflektere over tidligere forskning du gjorde i fase ett. Det er hundrevis av glyfer og ikoner som bør vurderes for et komplett sett - du vil ikke kunne huske dem alle uten noe referansemateriale.
Vær vanskelig på deg selv under planleggingsfasen. Ikke vær redd for å si nei til en ide eller å kaste listen - det kan blåse ut latterlig raskt. Å lage kvalitetsikoner er tidkrevende og å skape et sett på 5000 (for eksempel) vil ikke bare ta for alltid, det er vanskelig for sluttbrukeren å klare seg.
I løpet av de fire månedene som det tok å skape uikoner, fant jeg meg hele tiden å kaste ut og legge til i listen helt til utgivelsen. Selv nå finner jeg meg selv å tenke på hvilke ikoner som skal inkluderes i neste utgave.
Du bør nå få listen din fylt med ideer for dine spark ass ikoner. Nå er du klar til å komme i gang med å designe.
I faser 2 og 3 bestemte du deg for din ikonstil. Din spesifikke stil vil påvirke hvilket program eller metode du bruker til å lage ikonene dine.
I tilfelle av Uicons skapte jeg skalerbare ikoner (vektorer), som brukerne kunne endre størrelse uten tap av kvalitet. De fleste designere bruker Illustrator eller andre vektorgrafikapplikasjoner, men et vektorprogram kan gjøre livet ditt vanskelig hvis du lager håndtegnede pikselikoner. Velg riktig app for jobben.
Nå når jeg sier "inspirasjon", mener jeg ikke "plagiering". Gjør det ditt eget.
Ikoner er grunnleggende former for å gjøre noe gjenkjennelig. Det kan være vanskelig å forestille seg alle ikonene dine og visualisere dem fra bunnen av. Heldigvis har du den undersøkelsen du gjorde i fase 1 og har en liste over referansepunkter for visuell inspirasjon.
Det er godt å leke med alternative designideer for ikonene dine. Det er flere måter å representere en butikk på, for å representere verktøy, for å representere noe. Vær kreativ. I tillegg til å tilby en standard presentasjon av ikonets emne, kan du prøve å tilby et nytt perspektiv. Hvis hver ikondesigner leverte de samme ideene på samme måte, ville UI-verdenen være ganske kjedelig.
Bare fordi du har designet noe, betyr det ikke at den må gjøre det endelige kuttet. Vær selektiv om hva du ender med å slippe ut for publikum. I tilfelle av Uicons var omtrent 10% av ikonene igjen på skjærebunnsgulvet av en eller annen grunn.
Designfasen er åpenbart den mest tidkrevende fasen av hele prosjektet, så det er viktig å ha utholdenhet, holde kraft og konsistens.
Ikke egentlig en dedikert fase, men en over-riding-tilnærming til ikonet ditt. På alle punkter under designprosessen bør du være oppmerksom på å holde ikonet ditt konsekvent i stil og utseende. Hvis du ikke er for bekymret for konsistens under prosessen, vil kontinuitet virkelig bli en dedikert fase som du reviderer alle ikonene dine styling på slutten.
Dårlig oppmerksomhet til konsistens kan føre til ujevne vekter, feil størrelser, feil perspektiver eller bare feil helt. Etter hvert ikon, ta et steg tilbake og se hvordan det passer med de du allerede har opprettet - det kan være lett å velge den merkelige ut.
Du har kanskje valgt å levere ikonet ditt i et vektorformat som .EPS, .AI eller .SVG. I så fall har du kuttet et stykke arbeid ut av prosessen. Du kan være enda smartere og velge å slippe ikonene dine som en skriftfil eller som en .CSH-fil. Enten av disse alternativene vil gjøre en erfaren designer som ditt ikon sett enda mer. Å gå ned denne veien krever litt mer innsats, siden du må konvertere Illustrator-ikonene til et annet format, men det ekstra arbeidet gir store fordeler.
På grunn av min forskjell på utforming av Uicons, hadde jeg litt mer arbeid foran meg på dette stadiet. Mitt ønske var å lage flerlags vektorikoner som var perfekt piksel. Jeg kunne ha gjort multi-layered tingen i Illustrator og forlatt dem slik at folk kunne kopiere og lime inn i Photoshop, men jeg ønsket pixel perfekte vektorer i et rasterprogram.
Photoshop er kjempebra. Det vil si, til du begynner å lage ikoner. Av mange gode grunner tillater Photoshop variasjoner på pikselbredde. Du kan ha en halv pixel eller til og med to tredjedeler hvis du vil. Anti-aliasing som dette kalles, er perfekt for fonter og bezier kurver, men kan frustrere når det gjelder å skape piksel perfekte ikoner.
Uikoner krevde å importere flere vektorformer uavhengig av Illustrator til Photoshop, justere, endre størrelse og styling dem, og optimalisere dem for perfekt piksel ved å øke pekene i trinn for å ende opp med rene kanter.
Gratulerer med å gjøre det så langt! Det er ingen liten oppgave å lage ditt eget ikonsett. Nå som alt hardt arbeid er gjort, trenger du bare å slippe ikonene dine til offentligheten. På dette punktet har du bestemt deg for om du tilbyr dette som et gratis ikon satt til designfellesskapet eller hvis du vil ha liten refusjon for de hundrevis av timene du har brukt til å lage ditt killer ikonsett.
Uansett, du trenger en scene for folk å forhåndsvise og laste ned fra. Det frie alternativet er enklest da du kan bokstavelig talt sende dem til en haug med grafiske ressurssteder og blogger for å publisere, lene deg tilbake og vente på kudos.
Men hvis du ønsker å selge ditt killer ikon sett, har du mer arbeid foran deg. Den enkleste måten å selge dem på er å være vert for dem en av flere designressursområder som GraphicRiver. Nedlastingen og betalingen er tatt vare på for deg, og du har fordelen av deres eksisterende trafikk.
Hvis du er mer proaktiv, er et annet alternativ å lage ditt eget nettsted for å vise og laste ned dine beskjedne priser ikoner. Hvis dette er tilfelle, er det gode alternativer for å hjelpe deg med å ta vare på nedlastings- og betalingssiden av tingene.
Digitale leveringstjenester som Fetch og Quixly gjør det super enkelt å selge ikonet ditt ved å ta vare på bestillingen, last ned og betalingssiden av ting. Du trenger bare å designe og bygge et kjølig nettsted for å vise arbeidet ditt. Alle de tunge teknikkene blir tatt vare på.
Ikonografi som ethvert visuelt språk må være klart og konsistent. Uansett hva du prøver å representere med ikoner, gjør det enkelt og klart, og sjansene dine for universell forståelse vil bli større.