Un set di icone per un sito o un'app: come pianificarlo e ordinarlo

Le icone sono le piccole immagini che dicono alle persone dove toccare: home, carrello, consegna, assistenza, profilo. Quando arrivano da pacchetti gratuiti diversi, il sito sembra rattoppato, con linee spesse accanto a linee sottili e angoli arrotondati accanto ad angoli vivi. Un set coordinato risolve il problema e rende rifinito anche un sito semplice. Ecco come pianificarlo.

Prima di tutto, faccia un elenco

Percorra il suo sito o la sua app e annoti ogni punto in cui un'icona sarebbe utile:

• Menu principale: home, catalogo, ricerca, carrello, account.
• Funzioni o vantaggi: consegna rapida, pagamento sicuro, resi, assistenza.
• Contatti e azioni: telefono, email, posizione, condividi, scarica.

Descriva ogni icona in poche parole, per esempio «consegna: un piccolo furgone» o «resi: una scatola con una freccia». Più l'elenco è chiaro, meno modifiche serviranno dopo.

Quante icone servono

• Circa 4: una landing page con tre o quattro vantaggi, oppure una breve presentazione.
• Circa 8: le sezioni e le funzioni principali di un piccolo sito.
• Circa 16: un set completo per un'app o un sito più grande con molte sezioni.

Di solito conviene ordinarne qualcuna in più di quelle che servono oggi. Le icone disegnate più tardi, con un ordine separato, sono più difficili da abbinare esattamente.

Scelga un solo stile

Scelga uno stile e lo mantenga per tutto il set:

• Outline: linee sottili, leggero e moderno, ottimo per interfacce pulite.
• Pieno: forme piene, facili da leggere anche in formato molto piccolo.
• Bicromatico: due tonalità dello stesso colore, con un po' più di carattere.
• 3D: volumi morbidi e ombre, adatto a landing page vivaci.

Se ha già qualche icona che le piace, condivida un link, così le nuove seguiranno lo stesso aspetto.

Colori

Usi i colori del suo marchio e li indichi come codici esadecimali, per esempio #1A73E8, se li ha. Di solito bastano un colore principale e uno d'accento. Se non ha ancora colori di marca, una palette neutra funziona su qualsiasi sfondo.

Le dimensioni piccole decidono tutto

Un'icona in un menu spesso è larga solo 24 pixel. A quella dimensione i dettagli spariscono, quindi vincono le forme semplici:

• Un'idea per icona. Un furgone per la consegna, non un furgone con una strada, un orologio e una scatola.
• Niente testo all'interno. Le parole diventano illeggibili quando l'icona è piccola.
• Simboli familiari. Una lente per la ricerca e un carrello per gli acquisti si capiscono ovunque.

Cosa riceve e come usarlo

Un set tipico arriva come file PNG separati su sfondo trasparente, così ogni icona si può mettere su qualsiasi colore. Il PNG è un formato raster: va bene per siti, app e slide, ma non è un file vettoriale da ingrandire senza limiti. Se le serve una favicon, un convertitore online gratuito trasforma un PNG in un file ICO in un minuto.

In sintesi

Un elenco chiaro, il giusto numero di icone, un solo stile e i colori del suo marchio: così un set risulta coerente su ogni schermo. Se preferisce farsi disegnare il set, ordini un set di icone: invia l'elenco delle icone, lo stile e i suoi colori e riceve 4, 8 o 16 icone coordinate come file PNG separati su sfondo trasparente. Il pagamento viene sbloccato solo dopo che lei ha accettato il lavoro.