Crítica # 29 de Web Design: MadeFreshly
Toda semana, damos uma olhada em um novo site e analisamos o design. Vamos apontar as áreas que foram bem executadas, além daquelas que poderiam usar algum trabalho. Por fim, finalizamos solicitando que você forneça seus próprios comentários.
O site de hoje é MadeFreshly.
Se você deseja enviar seu site para ser apresentado em uma futura Crítica de design, leva apenas alguns minutos. Cobramos US $ 24 pela crítica do seu design - consideravelmente menos do que você pagaria por um consultor para dar uma olhada no seu site! Você pode encontrar mais aqui.
Sobre MadeFreshly
“Um carrinho de compras com bom gosto. As tendências mudam e a sua loja online também. MadeFreshly oferece um novo design para o seu carrinho de compras. ”
Aqui está uma captura de tela da página inicial:
Primeira impressão
Logo de cara, posso dizer que realmente gosto do design do MadeFreshly. Existem várias idéias e peculiaridades interessantes de design aqui que falaremos abaixo. Definitivamente, tenho algumas sugestões para melhorias, mas, na maioria das vezes, é um site atraente criado por designers muito talentosos.
Minha maior dificuldade é provavelmente do ponto de vista conceitual. Essa é definitivamente uma crítica subjetiva, portanto, fique à vontade para ignorá-la completamente, mas acho estranho que o visual do site contradiga a metáfora estabelecida pelo nome do site. “MadeFreshly” pode implicar várias coisas: comida em geral, assados quentes saindo do forno (é aqui que minha mente vai), algo inspirado na natureza ou até algo novo e brilhante.
No entanto, o designer escolheu um leve visual grunge para o site. O fundo é uma textura envelhecida e as manchetes também têm algum grunge aplicado a elas. Novamente, isso cria uma página atraente, mas está em desacordo com o conceito de "Fresco".
O conteúdo sempre deve preceder e determinar o design. Projetar ao redor, ou pelo menos não em contradição, o nome e a metáfora pré-estabelecida de um site ajuda tudo a se unir e simplesmente parecer “certo”.
Como exemplo, confira uma situação muito semelhante no site "Formee", que fornece "formas assadas frescas". O visual é um personagem de chef amigável que reforça o slogan.
Não copie essa idéia, mas você pode considerar como também pode vincular o conceito de "novo" ao visual da página.
O logotipo
Eu acho que o logotipo MadeFreshly é ótimo. O tipo de letra é bastante atraente enquanto ainda se sente único e o efeito de vinco amassado adiciona uma sensação de profundidade ao site. Ótimo trabalho!
O cabeçalho
O cabeçalho é agradável e simples, com uma navegação em texto sem formatação e uma guia de login facilmente perceptível. Pare e observe esta área em tamanho real e verá que há muito espaço flutuando acima desse logotipo.
Não me importo com o espaço em branco e até incentivo os designers a usá-lo de maneira bastante liberal, mas uma grande área vazia é uma maneira muito estranha de começar o site. A solução aqui é simples: reduza esse espaço pela metade e deve ficar ótimo. Você ainda manterá muito espaço, mas não tanto que seja perturbador.
Outro problema que vejo aqui é que o logotipo está em uma estranha posição horizontal. O conteúdo do lado direito da página está alinhado à direita, sugerindo não um layout centralizado, mas justificado. No entanto, o logotipo não está alinhado com o conteúdo à esquerda, nem é centralizado sobre o elemento abaixo dele (outra posição justificável). Em vez disso, flutua desajeitadamente à direita de estar alinhado à esquerda e à esquerda de estar alinhado ao centro.
A correção simples aqui é deslocar o logotipo para a esquerda para que ele se alinhe com o conteúdo abaixo dele. Já está quase lá e só precisa de mais um bom empurrão.
A seção em destaque
A seção abaixo do cabeçalho, à qual estou me referindo arbitrariamente como "a seção em destaque", é a parte da página que realmente chama sua atenção. Ele tem mais peso visual do que o conteúdo ao seu redor, por isso é mais importante e seus olhos são atraídos quase imediatamente (todas as coisas boas).
O botão "criar loja agora" é agradável e brilhante e serve como um forte apelo à ação. Depois de ver o botão, se você der uma outra olhada, seus olhos serão atraídos pela seta, um toque agradável que atrai ainda mais a atenção para um dos elementos mais importantes de toda a página. Você pode considerar adicionar um efeito de foco ao botão como um pouco de impulso ao UX, mas, caso contrário, é um design sólido.
Meu único dilema aqui é o texto da manchete. Por um lado, é atraente e traz uma boa repetição ao texto usado no logotipo. Por outro lado, simplesmente não é uma leitura rápida, simplesmente devido à complexidade do tipo de letra.
Essa é uma daquelas situações em que estética e legibilidade estão em desacordo. Se você alterou a fonte aqui, acredito firmemente que o site seria menos atraente, mas você pode dobrar o número de usuários que realmente lêem o título.
Você pode tentar deixar uma palavra do título no script e converter o restante para algo um pouco mais legível. Assim, por exemplo, "um carrinho de compras com" poderia ser menor e em uma fonte sem serifa simples, enquanto "gosto" poderia ser destacado por um tamanho maior e pelo uso da fonte de script.
Por fim, é aceitável como está atualmente e essas são apenas sugestões a serem consideradas. Seria ótimo executar alguns testes AB nesse elemento para ver se torná-lo mais legível tem algum efeito mensurável nas conversões. Caso contrário, mantenha o script definitivamente.
Seção Três
A parte inferior da página mostra três capturas de tela com as palavras atualizadas, fáceis e eficientes. Isso é cativante e memorável e a seção parece incrível. Adoro que a textura do plano de fundo termine e os quadros em miniatura se sobreponham à nova área. Novamente, o designer está adicionando um pouco mais de profundidade ao seu design para fazê-lo parecer muito mais real e diversificado.
Todos os parágrafos em negrito
Normalmente, nos mantemos na página inicial do Design Critiques, mas desta vez eu dei uma espiada nas outras páginas. Uma coisa que acho que vale a pena destacar é o texto do parágrafo na página "Tour".
A decisão de deixar os parágrafos em negrito simplesmente não está dando certo. As letras parecem apertadas uma contra a outra e são bastante difíceis de ler. Além disso, ao negritar a cópia do corpo, você reduz o impacto de um cabeçalho em negrito (o contraste é fundamental). Eu recomendaria atribuir a este texto o mesmo estilo que o texto em negrito nas três miniaturas da página inicial.
Sua vez!
Agora que você leu meus comentários, participe e ajude, dando ao designer mais alguns conselhos. Deixe-nos saber o que você acha que é ótimo no design e o que você acha que poderia ser mais forte. Como sempre, solicitamos que você também seja respeitoso com o designer do site e ofereça conselhos construtivos claros, sem quaisquer insultos severos.
