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 è Oomph. Entriamo e vediamo cosa pensiamo!
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.
A proposito di Oomph!
? Oomph è il posto go-to per le carte di plastica con aplomb. Lavorando con alcuni dei marchi più famosi al mondo, le nostre piccole gemme di plastica hanno raggiunto più di 20 milioni di persone, non male in cinque anni. Qualunque sia la carta che stai cercando, possiamo aiutarti. E se non riesci a trovare il design della carta perfetto nella nostra galleria, mettiti in contatto. Le possibilità in plastica sono infinite e ci piace provare qualcosa di nuovo.
Ecco uno screenshot della homepage:
Estetico
Subito posso vedere che adoro l'estetica di questo sito. È selvaggio, pazzo e divertente mentre trasmette perfettamente l'idea dietro le carte.
Come puoi vedere, ci sono tutti questi grafici pazzi, lucidi e colorati che spingono davvero l'idea che le carte di plastica siano qualcosa di bello ed eccitante. Questo potrebbe altrettanto facilmente essere un sito molto pulito, dall'aspetto Apple, con un'enfasi sulle foto drammatiche delle carte, ma questo rende il prodotto un po 'più personale e accessibile.
genere
Un'altra cosa che mi piace di questo sito è la tipografia. Il font principale è chiamato? BrothersBold ,? mostrato sotto con WhatFont.
C'è molto da amare qui. Il carattere tipografico è perfettamente leggibile e trasmette un tocco audace e maschile. Inoltre, le curve tagliate comunicano una sorta di? Taglio? sento che è perfetto per un business che essenzialmente muore tagli di plastica.
A parte questo, quasi tutto nella pagina è Helvetica. Questo è un bene perché un carattere così unico e interessante richiede un carattere tipografico complementare che sia così semplice e chiaro da leggerlo senza pensarci. Helvetica si adatta a questa descrizione come il tipo di carattere più ubiquo e forse più invisibile del pianeta.
La griglia
La home page di Oomph è esposta molto chiaramente su una griglia rigorosa. La griglia ha una larghezza di 1.020 px ed è abbastanza coerente dalla parte superiore alla parte inferiore della pagina.
Come puoi vedere, il costrutto principale qui è il layout a tre colonne che occupa il centro della pagina. Ricorda, tre è un numero magico, quindi questo rende il layout perfettamente bilanciato e presenta la giusta quantità di contenuti.
Una cosa da notare qui è quanto sia equilibrato lo spazio bianco in tutto il design. Ovviamente, un sistema a griglia ti darà una bella spaziatura orizzontale, ma devi essere intenzionale a far corrispondere quel ritmo verticalmente.
Non risponde
Anche se il sito si carica e sembra trovare su un dispositivo mobile, non è in alcun modo ottimizzato per la visualizzazione mobile. Sul mio iPhone, devo fare un sacco di pizzicare e panning per capire cosa sta succedendo.
Dato che il sito aderisce a una griglia così bella e rigorosa, è sicuramente un candidato ideale per il design reattivo. Un anno fa, stavo semplicemente assegnando punti bonus ai progetti reattivi per uno sforzo extra, ma ora sta cominciando presto ad essere qualcosa che mi aspetto di vedere, almeno su un certo livello.
Il design reattivo è un affare complicato, ma i veri grattacapi provengono dai siti di pubblicazione pesante di contenuti. Per un sito statico come questo, il design reattivo o almeno ottimizzato per i dispositivi mobili è un compito meno impegnativo e più un'aspettativa di base.
Gerarchia di comunicazione
Altrettanto critico quanto il design visivo della pagina è la struttura della comunicazione e il modo in cui viene presentata. In realtà, questo è davvero il nucleo di ciò che il design è e perché lo abbiamo. Il buon design struttura le informazioni in modo logico e attraente.
Il sito di Oomph ha una comunicazione molto ben strutturata. Subito, quando carico la pagina, questo è il primo titolo che vedo:
Nota che c'è un piccolo trucco visivo qui. Il titolo dice: Plastica fantastica. Carte di Oomph ,? ma a colpo d'occhio, la parola raggruppamento che vedo è? Carte di plastica.? Questo è esattamente ciò di cui tratta Oomph, quindi questo è un home run nel design della comunicazione.
Domande
Una volta che hai avuto quella prima occhiata in giro e hai avuto l'idea che questa è una compagnia di carte di plastica, la tua prima inclinazione sarà di passare ad alcune domande:
- Che tipi di carte fanno?
- Quanto costano?
- Chi è Oomph? Qual è la storia lì?
Tutte queste domande sono prontamente risolte, in primo luogo, come vedrai: la navigazione principale.
Questo è criticamente importante per il tuo design. Cerca sempre di prevedere le domande che gli utenti avranno e poi cerca di decidere il primo posto in cui cercheranno di trovarle.
Esperienza di acquisto
L'esperienza di acquisto qui è davvero liscia. Il sito non sembra affatto un tipico negozio online ingombrante. Mi sento come se stessi sfogliando l'offerta del prodotto e prima che io lo conosca, sono al secondo passaggio del processo di acquisto. Il percorso per acquistare è così naturale e tutto è presentato così bene: nessun segreto, nessun prezzo o costo nascosto, ecc.
Opinioni complessive
Nel complesso, penso che Oomph abbia un sito davvero solido. L'estetica visiva è stupenda, il layout è perfetto e la gerarchia della comunicazione è di prim'ordine. L'unica vera lamentela che ho è la mancanza di ottimizzazione mobile. A parte questo, è sicuramente uno di quei siti che spendo l'intero articolo a completare piuttosto che criticare!
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.