Una piccola introduzione Cos'è un icon set custom e perché conta per il brand
Un icon set custom è una famiglia di icone disegnate su misura per un brand, costruita su griglia condivisa con stile uniforme (linee, riempimenti, angoli), pesi coerenti, esportabili in SVG vettoriale, pensata per restare omogenea tra sito, app, materiali di stampa e social.
Errore tipico: scaricare icone da fonti diverse (Flaticon, Iconfinder, set gratuiti). Stili che non parlano tra loro, pesi diversi, dettagli inconsistenti. Risultato: brand che sembra fatto da 5 designer diversi, riconoscibilità bassa, qualità percepita scadente.
Da Vicenza dal 2008 con oltre 180 progetti seguiti, abbiamo consegnato 40+ icon set custom. Per startup tech, B2B manifatturiero, e-commerce, app mobile, ONLUS. Vettoriali in SVG, riusabili cross-canale, royalty-free al 100%.
Esempi tipici Tre esempi di intervento, in settori diversi
Esempio · settore distribuzione B2B Sito di un distributore di componenti (settore industriale)
Icon set custom di 42 icone per categorie prodotto tecniche, in stile outline 2px su griglia 24px. SVG ottimizzati per uso su sito Astro, libreria Figma per estensione futura. Coerenti con palette istituzionale del brand.
42 icone consegnate
Esempio · settore SaaS B2B Sito di una software house (settore tecnologico)
Icon set per app web di gestione progetti: 36 icone outline + filled per stati interattivi. Pixel perfect a 16px e 24px, ottimizzati per dark mode. Libreria Figma sincronizzata con codice React tramite componenti.
36 icone outline + filled
Esempio · settore servizi alla persona Sito di uno studio professionale (settore consulenza)
Set ridotto di 24 icone per sito istituzionale, in stile minimale outline 1.5px. Dimensione singola a 32px, formato SVG inline ottimizzato per peso minimo. Coerente con typography raffinata del brand.
24 icone minimali
Cosa includiamo Cosa trovi nel nostro icon set
Famiglia coerente, non singole icone slegate. Pronte per dev, esportate nei formati standard.
Studio dello stile
Definire la regola visuale.
Definizione delle regole del set: griglia di base (24px tipica per UI, 32px per touch), peso delle linee (1.5px o 2px), angoli (squadrati o arrotondati), riempimenti (outline puro, riempito, mix). Uno style frame guida tutte le icone successive.
- Griglia di base condivisa
- Peso linee uniforme
- Trattamento angoli definito
- Style frame di riferimento
Disegno delle icone
Una alla volta, sulla stessa regola.
Disegno vettoriale di ogni icona seguendo le regole del set. Dimensioni standard (16, 24, 32, 48px), pixel perfect alle dimensioni più piccole, ottimizzazione SVG per peso minimo. Iterazione su ogni icona finché non si integra coerente.
- Set base 30-50 icone
- Dimensioni multiple (16, 24, 32, 48px)
- Pixel perfect alle piccole dimensioni
- SVG ottimizzati
Varianti e stati
Ogni icona, due versioni minimo.
Per icone usate in interfaccia: versione outline (linea) e versione filled (riempita) per stati attivi/inattivi. Versione monocromatica e colorata se serve. Variazioni di dimensione per contesti diversi (toolbar, lista, hero).
- Outline e filled per icone UI
- Versione monocromatica
- Versione colorata opzionale
- Variazioni dimensionali
Consegna e documentazione
Pronto per dev e marketing.
File SVG ottimizzati, file Figma con libreria componenti, file sorgente vettoriale (.ai, .svg), font icona opzionale (Icomoon o Fontello), documentazione d'uso con esempi su sito, app, materiali stampa.
- File SVG ottimizzati
- Libreria componenti Figma
- Font icona opzionale
- Documentazione d'uso
Il problema Perché icone scaricate da fonti diverse rovinano il brand
Pattern che vediamo prendendo in carico siti con iconografia mista:
- Icone Flaticon mescolate: ogni icona ha stile e peso diverso
- Set free + set premium: dettagli incoerenti tra loro
- Icone outline e filled mescolate: niente sistema visivo
- Pesi delle linee diversi: alcune sottili, altre marcate, caos
- Niente versione SVG: PNG che si pixelano sui retina display
- Niente attribuzione gestita: rischio licenze sui set free
- Nessuna icona personalizzata: brand confuso con altri brand che usano lo stesso set
Il nostro approccio: style frame condiviso, griglia uguale per tutte, peso linee unico, SVG ottimizzati, documentazione d'uso scritta.
I vantaggi Cosa ti porti a casa con un icon set custom
Quello che ti porti a casa
Risultati concreti per imprenditore e ufficio marketing:
- Brand riconoscibile: stesso volto su sito, app, packaging, social
- Niente più rischi licenze: icone tue al 100%
- SVG ottimizzati: peso minimo, scalabili, perfette su retina
- Coerenza visuale garantita: ogni icona parte dalla stessa griglia
- Documentazione d'uso: chi entra nel team usa le icone correttamente
- Asset duraturo 5-10 anni: investimento che non scade con i trend
- Estendibile nel tempo: il set può crescere con regole già definite
Come lavoriamo Le 4 fasi del nostro icon set
1. Style frame
Settimana 1.
- Griglia di base
- Peso linee
- Trattamento angoli
- 3 icone di riferimento
2. Disegno set base
Settimane 2-3.
- 30-50 icone disegnate
- Iterazione coerenza
- Pixel perfect alle piccole dimensioni
- SVG ottimizzati
3. Varianti e stati
Settimana 4.
- Outline e filled
- Versione monocromatica
- Variazioni dimensionali
- Test su contesti reali
4. Consegna e documentazione
Settimana 5.
- File SVG ottimizzati
- Libreria Figma
- Documentazione d'uso
- Coordinamento dev
Strumenti Strumenti che usiamo per l'iconografia
Strumenti standard di settore per disegno vettoriale e ottimizzazione:
- Figma per disegno vettoriale e libreria componenti
- Adobe Illustrator per icone complesse
- SVGOMG per ottimizzazione SVG
- Icomoon o Fontello per font icona opzionale
- Storybook per documentazione componenti
Tecnologie Stack iconografia
Figma
Astro
WordPress
Figma
Astro
WordPress Risultati Cosa garantiamo come output
Quello che ti consegniamo a fine progetto:
- Set di 30-50 icone coerenti tra loro
- SVG ottimizzati pronti per dev
- File Figma con libreria componenti
- Versioni outline e filled per stati interattivi
- Documentazione d'uso con esempi
- Riferimenti reali on-demand durante lo scoping
Quanto costa un icon set custom? +
Servizio su misura: il preventivo dipende dal numero di icone, dal numero di varianti (outline, filled, colorata) e dal livello di documentazione richiesto. Prima cosa che facciamo è una breve discovery call per capire scope e contesto, poi mandiamo un preventivo scritto entro 48-72 ore. Niente listini standard.
Quanto tempo richiede un icon set? +
Per set base (20-30 icone, singola variante): 3-4 settimane. Per set completo (40-50 icone, outline + filled): 5-6 settimane. Iterazione di 1-2 round inclusa.
Posso aggiungere icone dopo la consegna? +
Sì, il set è pensato per crescere. Le regole di stile vengono documentate, e nuove icone possono essere aggiunte mantenendo coerenza. Possiamo gestire estensioni come servizio mensile o on-demand.
Le icone restano mie? +
Sì, royalty-free al 100%. File SVG, sorgenti vettoriali (.ai, .svg), libreria Figma restano del cliente per sempre. Riuso illimitato cross-canale, niente attribuzione richiesta.
Funzionano su sito, app, stampa? +
Sì, sono vettoriali. SVG per web e app (peso minimo, perfetti su retina), versione PDF/EPS per stampa professionale. Stesso file scala da 16px a manifesto 4 metri senza perdere qualità.
Le mostrate prima della consegna finale? +
Sì, lo style frame con 3 icone di riferimento è il primo deliverable, prima di disegnare il resto. Validazione condivisa con il cliente, iterazione, poi via libera per il resto del set.