I dettagli del design minimalista
Il minimalismo è una tendenza che non morirà mai. Non importa quante volte restiamo incantati da progetti straordinariamente intricati, ci sarà sempre qualcosa nella semplicità che ci lascia come catturati.
Oggi esamineremo alcuni degli aspetti chiave del minimalismo nel web design insieme ad alcuni esempi di designer che hanno capito bene.
Esplora risorse di progettazione
Cosa non lo è
È quasi sempre una buona idea esplorare ciò che non è qualcosa all'interno di una discussione di ciò che è. Esaminare gli opposti ci fornisce un punto di contrasto e aiuta a modellare la definizione. In sostanza, il minimalismo è una deviazione dal superfluo visivamente. Tavolozze di colori riccamente diversificati ed elementi complessi vengono dimenticati a favore di semplici colori solidi e linee di base.
Considera i due esempi seguenti. Questi siti rappresentano una chiara alternativa alla mentalità minimalista. Sono visivamente abbastanza occupati e possono richiedere un minuto per essere esplorati prima che tu abbia la sensazione di avere una buona comprensione di ciò che sta accadendo nella pagina.
Questo li rende cattivi disegni? Assolutamente no. Sebbene molti designer preferiscano chiaramente stili specifici, assegnare istruzioni di valore a un determinato metodo è utile quanto dire che il blu è meglio del verde o che sinistra è meglio di destra; semplicemente non c'è verità in queste affermazioni e non si ottiene nulla nella discussione di tali possibilità.
Se sei un designer professionista dovresti essere in grado di estrarre qualsiasi numero di stili di design per soddisfare la volontà e la personalità del tuo cliente. La risposta alla domanda su cosa non sia il minimalismo è che non è un approccio intrinsecamente migliore alla progettazione di siti Web. La chiave diventa quindi non decidere se preferisci occuparti, minimalista o qualsiasi altro numero di stili di progettazione, ma imparare a implementare efficacemente ogni metodo. Esaminiamo alcune aree su cui concentrarsi quando si crea un design minimalista.
Tipografia
La tua scelta di tipografia gioca un ruolo enorme nell'efficacia del tuo design minimalista. Scegli caratteri semplici e puliti con un alto livello di leggibilità. I caratteri sottili sono spesso usati per trasmettere il minimalismo ma non limitarti a questa idea poiché un carattere spesso è un ottimo modo per mostrare un oggetto importante come un titolo.
Allo stesso modo, puoi persino realizzare un solido design minimalista con un carattere di script complicato. Prova a mantenere la tua pagina e altra tipografia il più semplice possibile mentre usi uno script per attirare l'attenzione su una singola area della pagina.
Risorse addizionali
40 font minimalisti e di alta qualità gratuiti
70 esempi di tipografia minimalista
Allineamenti di griglia forti
La mia implementazione preferita del minimalismo è quando ha fatto lo scopo di aumentare l'usabilità. Un buon web design minimalista spesso si concentra sulla riduzione della pagina a un numero minimo di sezioni ed elementi separati in modo tale che la navigazione dei contenuti sia quasi nulla di qualsiasi tipo di curva di apprendimento o confusione visiva.
Ciò si traduce molto spesso in allineamenti basati sulla griglia facilmente evidenti. I nostri occhi hanno molta familiarità con questo schema di contenuti e di solito non hanno problemi a risolverli rapidamente. Inoltre, c'è qualcosa nel tuo cervello che vuole semplicemente che gli oggetti si allineino correttamente e in modo prevedibile. È piacevole vedere una pagina con un forte allineamento sia in verticale che in orizzontale. Al contrario, c'è una sorta di dissonanza visiva e psicologica quando non siamo in grado di identificare immediatamente un modello chiaro nella disposizione degli elementi in una pagina.
Risorse addizionali
La griglia CSS da 1 KB
ZURB CSS Grid Builder
Contrasto
Se hai un design minimalista nelle opere e sembra che manchi qualcosa, le probabilità che aggiungano un po 'di contrasto miglioreranno notevolmente il design. Se maneggiato da una mano esperta, il contrasto è la chiave di tutto il buon design (difenderò fino in fondo questa affermazione generale). Nel web design minimalista, la pagina è talmente ridotta che non c'è altro da fare che un contrasto intelligente.
Il contrasto è un concetto che tutti comprendiamo intrinsecamente, ma rendervene conto può migliorare drasticamente i tuoi progetti. Dai un'occhiata al design semplice di seguito:
Non c'è davvero molto da fare qui per quanto riguarda il colore e le belle immagini. Tuttavia, il design è piuttosto attraente a causa del forte uso del contrasto. L'intestazione e l'area del contenuto sono chiaramente separate e immediatamente riconoscibili per quello che sono (il piè di pagina usa lo stesso trucco). La copia sulla pagina differisce per dimensioni e audacia per attirare la tua attenzione sulle parti del messaggio che il designer ha ritenuto importanti.
La pagina sopra usa sfumature di grigio per la differenziazione, ma puoi usare altrettanto facilmente colori diversi per ottenere la stessa cosa.
Ricorda solo che esiste un'enorme differenza tra colori contrastanti e contrastanti. Solo perché due colori sono molto diversi non significa che i tuoi occhi percepiranno la differenza come piacevole. Assicurati di avere la tua teoria dei colori prima di prendere decisioni drastiche.
La cosa principale da ricordare con il contrasto è detta al meglio dall'autore del design Robin Williams: "Don't be a wimp!" Ciò che intendeva con questo è che un po 'di contrasto non va molto lontano. Se hai intenzione di rendere qualcosa di più grande in modo che si distingua, rendilo molto più grande. Se vuoi renderlo più audace, rendilo davvero audace! Dovresti essere in grado di dire in un istante se il contrasto è presente. Lo vediamo spesso quando il testo è in grassetto. A volte la differenza tra il testo in grassetto e il testo normale è così lieve che devi davvero guardare per vedere la differenza! In questo caso, il testo in grassetto non serve a nulla e dovrebbe essere uguale al resto per evitare confusione visiva.
Lo spazio bianco
Ripensa agli esempi pieni all'inizio di questo articolo. Questi designer hanno scelto di riempire quasi ogni centimetro dello schermo con qualcosa di visivamente interessante. Il minimalismo ha di nuovo l'approccio opposto. Offre ai componenti principali della pagina un ampio spazio di respirazione che li distingue.
Lo spazio bianco rende lo spettatore a proprio agio e meno claustrofobico. Aiuta anche il progettista ad avere il controllo su dove si desidera guardare lo spettatore. Alcuni designer insistono sul fatto che gli spettatori leggeranno ogni pagina da sinistra a destra seguendo uno schema z. Questo semplicemente non è vero in tutti i casi. Notate come il designer sopra ha usato spazi bianchi e un'immagine luminosa per attirare gli occhi sull'immagine dello schermo del computer. I tuoi occhi iniziano al centro dell'immagine, non in alto a sinistra!
Questo ha tutto a che fare con il contrasto, come menzionato sopra, e il volume di spazio occupato da un determinato oggetto rispetto allo spazio bianco attorno ad esso. Per avere un'idea della giusta quantità di spazio bianco da utilizzare durante l'esecuzione di un layout iniziale, spesso converto gli oggetti che posizionerò sulla pagina in forme estremamente semplici in Illustrator. Quindi posso mescolare e ridimensionare rapidamente gli oggetti senza essere distratto dal loro contenuto. Fare layout in questo modo ti costringe a pensare all'equilibrio della tua pagina prima ancora di avvicinarti a elementi estetici più complessi.
Come puoi vedere, il layout Jolicloud è abbastanza equilibrato e attraente se visto in questo modo. L'unica cosa che mi dà fastidio è che i collegamenti di navigazione non si allineano con il lato destro del contenuto. L'ho esagerato un po 'nella versione semplificata per renderlo più facile da vedere, ma è sicuramente così anche nell'immagine originale. Ancora una volta vediamo il vantaggio di ridurre la pagina a forme di base in quanto diventa immediatamente evidente che i collegamenti di navigazione sono posizionati in qualche modo in modo scomodo (né allineati al centro né allineati a destra ma da qualche parte nel mezzo).
Altri articoli sul minimalismo
Non riesci a ottenere abbastanza minimalismo? Dai un'occhiata ai fantastici articoli e siti di seguito:
- 21 risorse appositamente per gli amanti del minimalismo: Vandelay Design
- Vetrina di disegni puliti e minimalisti: Smashing Magazine
- Minimalismo sul Web: design ispirazione e temi WP: tutorial 9
- 20 bellissimi temi minimalisti di WordPress: sei revisioni
- 25 bellissimi design minimalisti per siti Web: Vandelay Design
Conclusione
Ciò chiude la nostra discussione sul minimalismo nel web design. Fateci sapere cosa ne pensate di questa tendenza nei commenti qui sotto. Assicurati anche di includere qualsiasi link ai tuoi siti preferiti che esemplifichi il minimalismo nel web design.