Ombre

Le ombre aggiungono profondità, contrasto ed enfasi visiva ai componenti, contribuendo a migliorare l'usabilità e l'aspetto generale dell'interfaccia

Fondamenti

Metadati e link per approfondire

Obiettivi principali

Le ombre servono a:

  • creare gerarchia: le ombre sono usate per elevare visivamente gli elementi principali della pagina rispetto a quelli secondari, con lo scopo di guidare l'interazione e mettere in risalto gli oggetti più importanti di un'interfaccia;
  • migliorare la leggibilità: le ombre separano gli elementi dallo sfondo, migliorando la leggibilità del testo e la comprensione delle informazioni;
  • aggiungere realismo: le ombre creano un'impressione di profondità e realismo, mettendo in risalto visivo gli elementi primari dell'interfaccia.

Come usare le ombre

Per garantire coerenza e uniformità, segui alcune buone prassi nell'uso delle ombre:

  • altezza e diffusione: usa ombre con un'altezza e una diffusione adeguate in base alle dimensioni e all'importanza dell'elemento. Elementi più grandi o più rilevanti possono richiedere ombre più pronunciate;
  • direzione: mantieni una direzione coerente per le ombre all'interno dell'interfaccia, per evitare incoerenze visive. Ad esempio, le ombre potrebbero essere posizionate generalmente in basso a destra per creare un aspetto uniforme;
  • evita un uso eccessivo: applica le ombre con parsimonia per evitare un aspetto confusionario o caotico.

Esempi di ombre

Anteprima:
Inizio anteprima:Fine anteprima.