Ogni settimana diamo un'occhiata a un nuovo sito Web e analizziamo il design. Indicheremo sia le aree che sono fatte bene che quelle che potrebbero utilizzare del lavoro. Finalmente, finiremo chiedendoti di fornire il tuo feedback.
Il sito di oggi è Snowden Industries.
Se desideri inviare il tuo sito web in una futura Critica del design, ci vogliono solo pochi minuti. Facciamo pagare $ 49 per criticare il tuo design - molto meno di quanto paghi per un consulente per dare un'occhiata al tuo sito! Puoi saperne di più qui.
Informazioni su Snowden Industries
? Siamo un team di professionisti, ognuno con un set di competenze specialistiche uniche. Amiamo ciò che facciamo e ci piace aiutare i nostri clienti a manovrare attraverso il processo creativo di traduzione delle iniziative di business offline esistenti in esperienze online coinvolgenti. Pianifichiamo, progettiamo, programmiamo, costruiamo e critichiamo i nostri progetti tutto il giorno. Gestiamo i progetti con BaseCamp, fatturiamo con FreshBooks e comunichiamo tramite diversi messenger online come Skype, AIM e Yahoo Chat. Siamo sempre disponibili anche via telefono ed e-mail per aiutarvi attraverso il vostro progetto.
Ecco uno screenshot della homepage:
Impressione iniziale
La mia prima reazione a questo sito è semplice: è fantastico. È attraente, colorato, dinamico, accattivante, ben organizzato; Potrei andare avanti all'infinito. Un serio applauso alla gente di Snowden, hanno fatto un lavoro stellare.
Criticare un sito come questo è sempre difficile perché è così ben fatto. Invece di mettere da parte tutte le cose che sono andate male, discutiamo su cosa è andato bene. Lungo la strada vedremo se riusciamo a trovare aree che potrebbero usare miglioramenti.
CRAP: L'acronimo di Judge Designs By
L'autrice del design Robin Williams (non l'attore) ha esposto da tempo quattro principi di progettazione di base che non solo uso come guida per i miei progetti, ma anche come standard per giudicare altri progetti. Questi principi sono Contrasto, Ripetizione, Allineamento e Prossimità, indicati amorevolmente nella comunità del design come "CRAP".
Per capire perché questo progetto funziona così bene, vediamo come regge in ciascuna di queste aree. Come lettore, questo ti darà informazioni molto importanti su come puoi usare questi principi nel tuo lavoro.
Contrasto
Direi che il contrasto è una delle cose più forti alla guida di questo progetto. È la ragione per cui la pagina attira davvero la tua attenzione e la tiene ferma mentre scorri la pagina. Ecco alcuni esempi:
Si noti quanto sia semplice la tavolozza dei colori qui. Questa è una grande cosa del design che penso che molte persone si perdano. Uno dei migliori consigli che posso darti: se non sei bravo con le combinazioni di colori, tienilo semplicemente stupido! C'è una strategia classica al lavoro qui che vediamo su innumerevoli siti. In primo luogo, sono stati scelti due colori piacevolmente contrastanti, in questo caso, bianco e nero. Semplicemente non diventa più semplice e contrastato.
Dopodiché, un terzo colore, di solito un pop luminoso sotto forma di arancione, rosso o verde, viene introdotto e utilizzato ripetutamente in tutta la pagina per guidare l'attenzione su punti specifici. Quel terzo colore è usato con parsimonia e ti afferra davvero ogni volta che lo vedi. Snowden ha usato una bella arancia per realizzare questo.
Come una tangente completamente fuori tema, si noti che il sito non lo fa sembra un disegno di Halloween. Troppo spesso ascolto designer che danno consigli sconsiderati per evitare combinazioni di vacanze come il rosso e il verde (Natale) o l'arancione e il nero (Halloween) perché gli spettatori assoceranno immediatamente il tuo design a quelle vacanze. C'è una certa dose di verità nell'avviso, ma se usi uno dei colori con parsimonia come fece Snowden con l'arancione, puoi facilmente evitarlo. Se sei un abile designer, dovresti essere in grado di far riflettere gli spettatori sul Natale solo quando lo desideri.
Ripetizione
Mentre siamo a tema di colore, anche quel pop d'arancione è un punto di forza della ripetizione in tutta la pagina. Come ho detto sopra, ovunque tu veda l'arancione, il designer sta cercando di indirizzare la tua attenzione su qualcosa di importante.
Un altro punto intenzionale di ripetizione è attraverso l'uso di cerchi e angoli fortemente arrotondati. In tutta la pagina vediamo cerchi usati come una dichiarazione di design. Ancora e ancora usano lo stesso elemento di base per creare un aspetto estetico forte e coerente.
Raccogliendo questo tema arrotondato, l'organizzazione sul sito è guidata da queste sezioni di grandi dimensioni. Se togliamo il contenuto, è facile vedere qui la ripetizione.
Allineamento
L'allineamento è un aspetto fondamentale ma estremamente importante del tuo design. Questo sito ha un aspetto piuttosto complesso ma gli archi lo fanno apparire un po 'più complicato di quanto non sia in realtà. La natura arrotondata delle sezioni fornisce al layout un'illusione quasi organica, ma se si spoglia il design visivo si può vedere che il wireframe sottostante è una griglia solida.
Questo esempio aiuta davvero a dissipare il mito che i wireframe ti bloccano in strutture di design così rigide che uccidono la libertà creativa. Questo sito ha il massimo di appeal visivo creativo e tuttavia la struttura sottostante è piuttosto semplice e noiosa!
Prossimità
Il principio di prossimità è tale che, se è fatto bene, non dovresti mai notarlo. In altre parole, non presterai mai attenzione al fatto che le cose che appartengono insieme sono insieme, presterai attenzione solo ai problemi, quando qualcosa è fuori luogo o difficile da trovare.
Per questo motivo, la vicinanza sembra ovvia e semplice, ma in realtà è un punto di inciampo per molti designer. Come già detto più volte, la struttura di questo sito è fornita dagli archi di bianco e nero. Questo ha creato dei piccoli e graziosi angoli in cui il progettista poteva disporre di chiare informazioni visive.
Non commettere l'errore di pensare che il layout debba essere completamente indipendente dal design estetico. Questa pagina mostra chiaramente i due che lavorano a stretto contatto e forniscono un potente strumento per implementare la prossimità.
Conclusione
Non esiste una formula magica che puoi seguire ogni volta per un design di successo, ma seguire i principi sopra ti avvicina. I designer dietro a Snowden hanno chiaramente una forte conoscenza della teoria del design di base e di come creare una pagina che sia funzionale e attraente con successo.
Potresti aver notato che non ho ancora dato alcun feedback costruttivo, e ad essere onesto, non sono sicuro di cosa dire. È un progetto solido che io stesso sarebbe estremamente orgoglioso di produrre. L'unica cosa che mi infastidisce è l'uso della sostituzione dei font Cufon. Il font utilizzato è un semplice sans-serif e non sono sicuro che Cufon valga il colpo dell'usabilità. Con Helvetica Neue è possibile ottenere un aspetto simile e alcuni ripiegamenti più sicuri. Inoltre, @ font-face fornisce un'alternativa più amichevole, sebbene alcuni preferiscano il rendering visivo di Cufon. Ad ogni modo, è una questione minuscola con questo sito ed è completamente aperto al dibattito.
Guardati intorno
Prima di andare, fermati al sito e dai un'occhiata in giro. Nota come hanno preso questi solidi principi e li hanno combinati con nuovi layout e idee su altre pagine del sito.
Il tuo turno!
Ora che hai letto i miei commenti, inseriscici e dacci una mano dando al designer qualche ulteriore consiglio. Facci sapere cosa pensi sia importante per il design e cosa pensi possa essere più forte. Come sempre, ti chiediamo anche di essere rispettoso nei confronti del designer del sito e di offrire una consulenza chiara e costruttiva priva di insulti ostili.