Progettare icone può essere molto divertente. Ma una volta che hai un buon set, cosa fai con loro?
Le icone non sono solo link in miniatura per Facebook o Instagram, ma possono essere spunti completamente interattivi che aiutano gli utenti a guidare un progetto e forniscono una scintilla visiva in più. Le icone possono essere piccole o grandi, in bianco e nero o colorate, piatte o intricate. Indipendentemente dallo stile che ti piace, l'uso efficace delle icone può migliorare l'usabilità e il valore estetico di quasi tutti i progetti di design.
1. Aggiungi interesse visivo
Non tutte le immagini saranno un paesaggio mozzafiato. A volte le immagini non sono sufficienti.
L'iconografia divertente può contribuire ad aumentare l'interesse per queste foto poco interessanti. Usa le icone per migliorare il contenuto della foto, fornire un ulteriore bit di informazioni e fornire un segnale di interazione.
Prendiamo l'esempio sopra per una clinica dentistica (certamente, non il concetto visivo più interessante.) Il design è fresco, luminoso e invitante. L'icona semplice accanto al viso è una nuova idea dell'idea della lampadina? - nota i piccoli denti. L'equilibrio tra la parte chiara dello schermo a sinistra e l'icona bianca luminosa aiuta anche a disegnare l'occhio attraverso il design. Il resto del sito utilizza anche altre icone minuscole per la navigazione.
2. Crea interazione
Le icone non devono adattarsi a posizionamenti specifici per incoraggiare l'interazione dell'utente. (Troppi modelli usano l'icona a tre colonne / combinazione di testo nello scroll.
Le icone possono effettivamente essere l'elemento che guida l'interattività. Abbina l'iconografia e la parallasse per far scorrere gli oggetti sullo schermo. Layer icone con immagini o un altro sfondo per creare un elemento che è un po 'inaspettato.
Boone Selections crea una scena di viaggio per i suoi vini usando l'iconografia in un modo che ti fa venire voglia di scorrere. L'icona dell'aeroplano viaggia su un aereo seguendo le frecce sullo schermo (che reagiscono allo scorrimento). Ogni icona line-art viene visualizzata come un disegno mentre l'utente scorre verso quella parte dello schermo. I movimenti sono semplici, classici e molto efficaci.
3. Usa animazione
Nessuno ha mai detto che le icone debbano essere elementi statici. Animali!
Ma non impazzire. Le migliori animazioni di icone si riferiscono al contenuto dell'icona stessa. I movimenti non dovrebbero essere troppo veloci perché possono essere un po 'inquietanti. I movimenti non dovrebbero essere troppo lenti perché gli utenti potrebbero mancarli. C'è un punto debole nel mezzo dove il movimento delle icone offre un po 'di gioia.
Sweet Punk lo fa brillantemente. L'icona è la? Vecchia lampadina? che si usa ovunque, ma con un timbro di personalizzazione. Nota l'interno del bulbo - è una fiamma. Poi c'è una divertente azione al passaggio del mouse mentre la lampadina rimbalza con un vortice di idee. Inoltre, il motivo circolare attorno alla lampadina si sposta delicatamente e sembra rispondere ai modelli di passaggio del mouse.
4. Creare cluster di icone
Grappoli di forme interessanti, schizzi o icone altrimenti realizzate a mano possono rendere una visione interessante. Il concetto viene visualizzato comunemente su siti Web che distribuiscono pacchetti di icone (come quello sopra), ma ha un'applicazione più ampia.
Considera righe di icone - gioca con il loro utilizzo sotto o sovradimensionato per un impatto maggiore - quando ti manca una buona visuale. Le icone possono funzionare come collegamenti o solo immagini che si trovano da sole. I cluster possono includere solo due o tre icone o tre volte tanto. Lascia che il tuo contenuto guidi quel processo decisionale.
Ciò che è bello usare le icone in cluster è che puoi davvero pensare fuori dagli schemi e fare qualcosa di creativo. L'altro bonus? Puoi anche iniziare con un pacchetto di icone se lo desideri e personalizzare le icone per renderle personali. Qualsiasi opzione può essere molto divertente e darti un modo per provare qualcosa di completamente diverso.
5. Combina con Trendy Elements
Le icone dovrebbero essere solo una parte di una strategia di progettazione per un progetto. Pensa ai tuoi contenuti e abbina l'iconografia a un altro elemento di tendenza per creare un'estetica moderna.
La cosa bella dell'uso delle icone è la flessibilità dello stile. Le icone si presentano in apparenza in ogni forma e forma, dalle linee d'arte, dagli stili basati su schizzo ai disegni a taglio piatto per elaborare minuscole opere d'arte. Dopo aver definito uno stile di progettazione per un progetto, creare un set di icone che corrisponda al tono visivo.
Il sito Web di History of Icons lo fa magnificamente. Il sito mostra come gli stili di icone si sono evoluti nel corso degli anni - che è un caso di studio di per sé se stai cercando una maggiore ispirazione - ma ogni icona è collocata all'interno di un elemento contenitore in uno stile di progettazione materiale, con livelli piuttosto piatti, tattili movimenti, tipografia pulita e colori brillanti.
6. Metti un tocco stravagante su di esso
Per alcune icone, ci sono design standard che vorrete usare in modo che gli utenti sappiano esattamente cosa fanno questi elementi. Questo può includere icone per i collegamenti social media, ricerca, carrelli della spesa e frecce di navigazione. Non dovresti mai sacrificare l'usabilità per un nuovo design.
Ma puoi dare il tuo tocco stravagante a questi stili di icone standard. Cambia il colore, modifica la forma o ridisegna le icone nel tuo stile. Il trucco è fare qualcosa che si sente unico mantenendo il riconoscimento visivo in modo che gli utenti non si interroghino su cosa significhi l'icona.
I semplici cambiamenti possono fare molto. Questo tipo di regolazione può aiutare elementi comuni a diventare parte del tuo design e della tua storia visiva.
Little Puds & Co. lo fa in un modo assolutamente affascinante. Le icone comuni nell'angolo in alto sono identificabili, ma assumono il colore del branding del sito web. Le icone sembrano un po 'più morbide di quanto non farebbero nelle normali tavolozze dei colori di Facebook e Instagram e sembrano corrispondere allo stile più estroso e infantile usato in tutto il design.
7. Creare schizzi personalizzati
Le icone possono essere tele artistiche in miniatura in sé stesse.Mentre le tendenze dell'iconografia si orientano maggiormente verso il rendering di super art, line art, lo sketch dettagliato può fornire una grande opzione personalizzata che è la tua.
Ogni set abbozzato a mano sarà diverso. Non esiste un modo reale di categorizzarli se non quello di trovare qualcosa che possiedi. Le icone di schizzo sono spesso parte dell'identità del marchio che le utilizza.
Infinity Foods utilizza questo stile meravigliosamente nel suo design. (Dovresti davvero andare in giro per vedere l'intero set di icone.) Lo stile di schizzo inizia con il logo e lo stesso dettagliato stile a matita viene usato per ogni elemento dell'icona nel disegno.
Conclusione
Mentre le icone potrebbero essere uno degli elementi meno pensati in un progetto di design, possono essere uno dei più interessanti. Una buona iconografia può unire un progetto in un modo che gli conferisca quel tocco di raffinatezza e raffinatezza.
Il bello del lavorare con le icone è che un buon set basato su vettori può essere utilizzato in vari modi e con dimensioni diverse. Interessato a prendere migliaia di icone per un prezzo di abbonamento affare? Creative VIP ti ha coperto!