Web Design Critica # 60 Mogo Style

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 è Mogo Style, un sito per l'ordinazione di un logo personale.

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 Mogo Style

Un mogo è lo strumento perfetto per il tuo marchio personale, fatto per le persone che cercano di distinguersi dalla massa. Usali per i tuoi biglietti da visita, e-mail e profili. Personale come una foto ma professionale come un logo. Fai un'impressione incredibile, ogni volta.

Ecco una sezione della homepage:

Impressione iniziale

Prima di tutto, devo commentare il servizio. È un'idea davvero interessante. Quello che fanno è scattare una foto di te e trasformarla in un'illustrazione che è essenzialmente un quadrato simile a un'icona dell'iPhone. Quindi in pratica si tratta di un servizio di avatar digitale che ti offre un'icona personale per Facebook, Twitter, biglietti da visita e altro ancora.

La homepage del sito lo comunica molto bene. Nonostante il fatto che l'azienda abbia un concetto molto particolare, mi ci è voluto solo un secondo per capirlo. Questo è un obiettivo alto come puoi sperare qui e lo hanno inchiodato.

Il design complessivo è pulito e minimale, il che attira davvero la tua attenzione sulla presentazione che spiega il servizio e mostra esempi. Direi che il sito è abbastanza vicino alla perfezione ma ho sicuramente alcune raccomandazioni. Diamo un'occhiata più da vicino.

Allineamento

L'allineamento è una delle poche cose che penso davvero debba essere affrontata. È quasi perfetto, ma io sono un maniaco del controllo quando si tratta di allineamento e l'elemento fuori luogo qui mi infastidisce davvero. Il testo in stile Mogo è allineato con il resto degli elementi, ma il cuoricino è una specie di fluttuare nella terra di nessuno.

Il problema qui è che il logo e il testo sono un'unità visiva. Non li percepisci come due elementi separati ma uno. L'intero logo dovrebbe essere allineato sul sito di sinistra con il resto del contenuto della pagina. La soluzione qui è semplice, basta spostare il logo a destra in modo che il cuore si trovi attualmente nel punto in cui si trova il testo.

La storia

Come ho detto sopra, il sito fa un ottimo lavoro nel comunicare il suo concetto. Questo è in gran parte grazie alla grande presentazione sulla home page, che ti introduce su Mogo Style e su quello che fanno. Ecco le quattro immagini che vedrai, presentate in ordine di apparizione.

La prima cosa che vedi sono alcuni esempi del prodotto che consegnano. In questo caso, l'immagine vale davvero più di mille parole. Non è possibile offrire una spiegazione più chiara del servizio. Avanti, ti impressionano. La prima diapositiva ti interessa ma ora è il momento di comunicare la qualità. Qui sostengono che ogni logo è disegnato a mano. È difficile giustificare il pagamento di qualcuno per incollare la tua foto in un programma di auto-tracciamento ma un'illustrazione personalizzata disegnata a mano è completamente diversa. Le prossime due diapositive sono dedicate a mostrare perché è necessario il prodotto illustrando alcuni casi d'uso.

Il setup qui è un ottimo passo di vendite: ecco cosa vendiamo, ecco perché è fantastico ed ecco perché ne hai bisogno. In qualsiasi momento stai strutturando una presentazione per una home page dovresti tenere a mente gli obiettivi di comunicazione simili.

leggibilità

Ora, dirò che non sono pazzo per la leggibilità del testo sulle diapositive fotografiche. Il designer ha cercato di migliorare la situazione con testo in grassetto e un'ombra esterna, ma potrebbe essere ancora molto meglio. Le foto qui sono semplicemente troppo occupate per leggere facilmente il testo. Se non si dispone di un ampio campo di colore abbastanza solido, quasi non si dovrebbe nemmeno provarlo.

Fortunatamente, la soluzione è quasi sempre facile: se non si dispone di un campo di colori a tinta unita, crearne uno! Una semplice barra nera fa molta strada qui. Per rendere le cose un po 'più accattivanti, ho ridotto l'opacità della barra nera e ho sfocato l'immagine dietro di essa.

Confronta questo testo con l'esempio reale e puoi immediatamente vedere che la leggibilità è stata drasticamente migliorata e sembra ancora piuttosto elegante, forse anche di più.

Il? Impara? Pagina

Saltando verso il? Impara? pagina, vediamo un altro spazio ben progettato, questa volta con un layout molto più lineare contenente tre sezioni principali e una storia di fondo in basso.

Penso che questa pagina sia fantastica, mi piace l'espansione dei dettagli sui punti importanti e l'uso di immagini diverse ma strettamente correlate. Sarebbe stato facile rendere quest'area completamente ridondante con la homepage, ma fa un buon lavoro di stare in piedi da sola.

Sono propenso a pensare che i loghi social dopo ogni paragrafo siano un po 'ridondanti. Visivamente, sembra bello ma concettualmente non c'è davvero molto di un motivo per ripetere questo elemento così tante volte. Penso che questa pagina trarrebbe grande beneficio da una concentrazione leggermente ridotta sui social media e da una maggiore attenzione a indirizzare gli utenti alla pagina di acquisto. A? Prendi il tuo ora? pulsante o qualcosa di simile potrebbe aiutare.

Dov'è la FAQ?

Il mio ultimo commento sul sito è che, dal punto di vista di un designer, non ci sono abbastanza informazioni tecniche sul prodotto. È questo raster o vettore? Se è raster, qual è la risoluzione e la dimensione del file consegnato e viene su uno sfondo trasparente? Quanto è facile cambiare il colore? In che formati di file arriva?

Certo, maggior parte La base di clienti di questo sito non ha la più pallida idea di quali siano queste domande, ma c'è un'area grigia di persone che non sono abbastanza designer, ma che sanno ancora abbastanza per avere domande sul prodotto da consegnare.

Un'altra domanda che viene in mente che tutti chiederanno: qual è il tempo di consegna? Stiamo parlando di ore, giorni o settimane? Penso che ci sia una soluzione semplice ed elegante a tutto questo: una pagina FAQ. Questi sono i prefetti per inserire tutti quei bit di informazioni casuali che alcuni clienti inevitabilmente chiederanno. Serve anche uno scopo importante per i clienti che semplicemente non sono abbastanza informati per fare domande del genere, ma sono perfettamente in grado di comprendere le risposte.

Conclusione

In sintesi, Mogo Style è un ottimo piccolo sito e un servizio davvero unico. La home page comunica molto bene il concetto e richiede solo una leggera regolazione dell'allineamento e forse una rielaborazione del testo sulle diapositive. Il? Impara? anche la pagina sembra ottima ma potrebbe utilizzare poche icone social e qualche altro invito all'azione per quanto riguarda gli acquisti. Infine, penso che il sito trarrebbe grandi benefici da una pagina delle FAQ.

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.