10 näpunäidet ikoonide kujundamiseks, mis ei ime
Peaaegu iga disainer mõtleb tänapäeval rakenduse kujundusele. Iga rakenduse üks väiksemaid funktsioone on ikoon, mida kasutatakse selle tähistamiseks iga mobiilseadme ekraanil ja rakenduste poodides. Suurepärase ikooni kujundamine on midagi enamat kui lihtsalt logo kasti panemine. Teil on vaja midagi, mis paistab silma kõigi teiste rakenduseikoonide seas.
Hea ikooni saab kasutada mitmel viisil - rakenduste, sotsiaalmeedia ja isegi väiksemate trükitud projektide või visiitkaartide jaoks. Ja selleks on vaja vaid pisut kujundamist ja kavandamist.
1. Tee seda hõlpsasti loetavaks
Ikooni peab olema lihtne lugeda. (Ja me ei räägi tekstist.) Visuaalne loetavus on võtmetähtsusega.
Ikoon peaks sisaldama visuaali, mis on kaubamärgi või hõlpsasti arusaadava tõttu hästi äratuntav. Mõelge näiteks arvuti töölaua ikoonidele. Ikoonide lihtsuse tõttu teate, kus asjad asuvad - dokumendid salvestatakse kaustadesse, muusikat mängitakse nupust nootide kujul ja pilte hoitakse kohas, mis näeb välja nagu Polaroid-foto.
Visuaalse loetavuse osas on kaubamärgi kujundamisel suur osa kaalumisel. Suurtel majapidamisbrändidel on sageli ikoonid, mis on osa nende logost või ikoonilisest pildist. Inimesed kipuvad neid elemente kohe ära tundma, isegi väikeste mõõtmetega. Uute või väiksemate kaubamärkide või ikoonide kontseptsioonide puhul võib see olla pisut karmim ning disainerid võivad optimaalse efekti saavutamiseks kasutada ka teisi tehnikaid.
2. Mõelge ikoonile, mitte pildile
Ikoon ei ole karbis olev foto. Ikoon võib sisaldada pilti, kuid võib olla ka teksti esitus, logomark või nende elementide kombinatsioon.
See peab lihtsalt olema väga visuaalne ja äratuntav. Enamik logosid ei sisalda tegelikke fotosid, vaid on idee graafilisem esitus. (Seda kontseptsiooni rõhutab vajadus luua vektoripõhine ikoon.)
Pilti võib väikestes suurustes raskeks lugeda ja see võib kasutaja telefonis või muus seadmes eksisteerida muude ikoonide taustal. Graafilisem kujutis võib sageli omada visuaalset kaalu.
Ülaltoodud Macy kaubamaja mobiilirakenduse ikoon on selle heaks näiteks. Punase kasti keskel asuvat suurt valget tähte on lihtne tuvastada. Ikoon erineb ettevõtte allkirjaikooni tavapärasest käsitlusest, kuna ikoonile rõhu lisamiseks on värv ümber pööratud. Punane taust paistab paljude kasutajate taustpiltide taustal tõenäoliselt rohkem kui valge.
3. Vältige sõnu
Üks asi, mida ikoonides ei näe, on sõnakasutus. Asjaga täidetud ikoonil pole lihtsalt piisavalt ruumi lugemiseks ja mõistmiseks.
Rusikareeglina vältige teksti täielikult, kui see pole teie logo osa. Isegi logo osaks olevat teksti tuleks enne peamises logo kujundamisel hoolikalt läbi mõelda.
Ikoon peaks olema kujundatud viisil, mis loob sõnadeta identiteedi. Lisaks pidage meeles, kui palju ikoone kasutatakse nende seadmete taustal, kus nad kuvatakse. Enamik sisaldab tegeliku ikooniploki all kirjeldava teksti rida.
Näiteks Design Shacki ikoon on see, mis kasutab ühte tähega d koos veebisaidile vastavate värvi- ja tüüpi töötlustega. See ühtne bränding ja hõlpsasti loetav kiri loovad visuaalse sideme ja ühenduse ilma sõnadeta.
4. Kasutage erksat värvi
Kas soovite, et teie ikoon paistaks silma? Minge julgelt värviga. Erksad värvivalikud aitavad teil rakendusel erineva taustaga silma paista ja köidavad kasutajate tähelepanu.
Viimane asi, mida ikoonikujundusest soovite, on see, et see seguneks kõigi muude saadaolevate võimalustega. See muudab sinise - eriti taeva- ja mereväe toonid - värviks, mida tõenäoliselt soovite vältida, kuna seda kasutavad paljud teised ikoonid.
Kui sinine on teie peamine logo või kaubamärgi värv, proovige seda mõju jaoks siduda millegi erksamaga. Mõelge "uuele neutraalsele", nagu laimiroheline, või valige hooajaline toon, näiteks ereoranž sügisel või ereroosa kevadel.
5. Töötage välja sümbol või lihtne logo
Tõenäoliselt on teil oma brändi logo, kuid ikoonide puhul on oluline ka sümbol. Sümbol võib olla logo või pildi lihtne graafiline kujutis või katkend.
See peab lihtsalt olema terav ja meeldejääv. Rohkem kaubamärke ühendab ikoonilisi sümboleid oma tavapärasesse kaubamärki ja logosse, et luua täielik ühendus väiksemate ikoonide ja suuremate disainiprojektide vahel.
Mõelge sõnumite ja fotode jagamise rakenduse Snapchatile. Kummitussümbol on muutunud nii äratuntavaks, et see võib ilmuda kasutatavate ikoonidena, teistes värviskeemides ja kujundites ning isegi eraldiseisva pildina stendil. See on toimiva sümboli ehe näide.
6. Pidage meeles skaala
Kuigi enamik meist mõtleb ikoonidele kui pisikestele asjadele meie telefonides või lauaarvutites, pole ikoon alati väike. See peaks olema kavandatud viisil, mis muudab selle kasutatavaks olenemata suurusest.
See on eriti oluline pidevalt muutuva digitaalse maastiku, võrkkesta ekraanide arvu suurenemise tõttu ning seetõttu, et erinevad platvormid ja seadmed võivad kuvada erineva suurusega ikoone.
Ehitage see suureks ja vähendage seejärel.
7. Looge vektorvormingus
Mastaabi ja suuruse osas on oluline kaaluda ka vormingut. Ikoon tuleb luua vektoripõhise kujunduse abil.
Vektorpildi omamine annab teile vabaduse teha muudatusi ja salvestada mitmesuguste seadmete, suuruste ja vaateavade ikoon ilma palju üksikuid pilte loomata. Kuna reaalsus on selline, vajate mitmesuguste projektide jaoks mitu ikooni versiooni.
Vektori eeliseks on paindlikkus. Kuid saak on olemas. Paljude rakenduste või platvormide puhul peate tõenäoliselt üleslaadimiseks salvestama koopia mittevektorvormingus.
8. Mõelge disainikastist väljapoole
Viimastel kuudel on olnud palju ikoone, mis kasutavad ühevärvilist tausta valge taustaga ikoonil, lameda kujunduse tehnikaid ja pikki varje. Kuigi need suundumused võivad olla lõbusad, ärge takerduge disainikarpi. Tehke oma ikooniga midagi muud.
Kui kõik teised töötavad kandiliste servadega, kaaluge midagi ümaramat. Lisage taustale tekstuuri vihje, et see eristuks kõigist ühtlastest värvitoonidest. Ärge tundke, et peate oma ikooni modelleerima vastavalt sellele, mida kõik teised teevad.
9. Muutke see mustvalgeks
Seal on lõbus väike trikk, mida disainerid on aastaid kasutanud, et katsetada väikesemahuliste disainilahenduste tõhusust - muuta see ühevärviliseks. Kui teie kujundus edastab sama sõnumi värviga või ilma, töötab see tõenäoliselt. Kui ikoon vajab lugemiseks värvi, jätkake paranduste tegemist.
Isiklikult alustan peaaegu iga disainiprojekti mustvalgelt ja siis hakkan hiljem värvi lisama. See on visand arvutikontseptsioonist. Kui visandate selle paberile ja see töötab enne, kui hakkate tõesti värvi lisama, on ideel tõenäoliselt kindel raamistik.
10. Mõtle väljakule
Teie ikoon ja ruudukujulises raami kõik osad peavad samuti ruudukujuliselt sobima. See ei tähenda, et kujundus või pilt peaks olema täpselt ruudukujuline, kuid iga ikooni põhikuvasuhe on võrdse kõrguse ja laiusega.
Seega, kui teil on sümbol, mis on ülalt vertikaalne või horisontaalne, on teil vaja moodust, kuidas täita selle ümber olev ruum nii, et see ei läheks taustal kaduma. Valige kontseptsioon, mis täidab olulise osa ruumist, mis on enamasti ruudukujuline. (Isegi ümardatud ümmarguse ikooni kõrgus ja laius on võrdsed.)
Järeldus
See võib kõlada klišeena, kuid hea ikooni kujundamise võti on olla… hästi… ikooniline. See on nii lihtne.
Kujundus lihtsust, värvi ja visuaalset äratundmist silmas pidades. Mõelge liidestele ja praegustele suundumustele, nii et teie kujundamine sobiks standarditega. (Kas te ei kavandaks tänapäeval iOS-i mobiilirakenduse jaoks skeuomorfset ikooni?) Ja nautige; ikoon on kasutaja ukseava teie digitaalse liidese juurde.
Pildiallikad: Ash Kid, Casey Fleser, Roland Tangalo, Gustavo da Cunha Pimenta ja Microsiervos Geek Crew.
