5 dicas para você melhorar os mockups e os protótipos de seu site – iMasters

we are developers
Design & UX
Tem 13 artigos publicados com 16900 visualizações desde 2015
É um gerente de marketing na startup austríaca Usersnap. É especializado em inbound & content marketing. Em seu tempo livre, escreve sobre tendências de marketing e de tecnologia em seu blog. Ele pode ser encontrado no Twitter: @tompeham.
Você já recebeu feedback sobre seu mockup ou protótipo de um site do tipo “Que linguagem é essa? Eu não sei falar ‘lorem ipsum!”.
Já? Então você sabe que não é um sentimento muito bom. Não pela pergunta em si…
Neste artigo, vou te mostrar 5 dicas para que você se previna de receber esse tipo de feedback e como fazer seus mockups ainda melhores.
mockups-1
Jerry Cao escreveu, em um artigo recente, que a chave para um mockup de sucesso pode ser encontrada na definição do nível de fidelidade que será usado no estágio de prototipagem.
Começar com papel e caneta para trabalhar os primeiros rabiscos é uma vitória fácil. Esses esquetes serão bastante genéricos e pouco fiéis. À medida que a fidelidade desses esquetes aumenta, eu recomendo que você use uma ferramenta simples, como balsamiq ou moqups. Deixe ferramentas mais profissionais como Photoshop e similares para quando você for trabalhar em desenhos de alta fidelidade.
A chave aqui é encontrar o timing do esquete de baixa para alta fidelidade.
mockups-2(source: jfarny.com)
Ambos, seja começando muito cedo ou muito tarde nos mockups de alta fidelidade, vão gastar recursos (físicos e de tempo), e você vai arriscar acabar com um protótipo medíocre.
mockups-3
 
Enquanto fazemos esquetes e wireframes, nossa tendência é pensar em soluções antes mesmo de levantar o “problema real”.
O pedido do cliente “faça a logo maior” não é a identificação de nenhum problema.
É uma proposta de solução, apesar de você não estar oferecendo nenhuma informação do problema para a solução. Questionar com vários “porquês” pode ajudar nessas situações.
Hoje, somos treinados para pensar em soluções e em muitas situações essas ideias podem ser muito úteis. Porém, não é realmente de grande ajuda quando você está no meio do processo criativo, desenhando wireframes e mockups.
E a maioria dessas soluções vem em forma de requisições, como “podemos mudar a cor de vermelho para azul”.
Então, se você está buscando muito a “solução” dos seus colegas e clientes, tente levantar alguns porquês. Por exemplo, “você pode me dizer qual é o desafio que você está tentando resolver com isso?”.
Ao ir fundo e descobrir o real problema, você não só vai ter um resultado melhor, mas vai tornar a sua vida de designer e desenvolvedor mais fácil 🙂
Eu sei, imagens e cópias não estarão em sua lista de prioridade enquanto você estiver trabalhando em um novo mockup. Mas deveriam estar. De verdade.
O recurso correto em seu mockup não só vai destruir seu wireframe, mas também trará o design a um novo nível, o design de alta fidelidade.
Além do estágio dos esquetes e do mockup, você (e seus colegas e clientes) deveriam estar trabalhando na linguagem visual do seu novo web app ou site.
Claro, não há necessidade de apresentar imagens padrão ou ilustrações finalizadas nesses mockups.
Há uma grande quantidade de imagens e vídeos de bancos de imagens disponíveis que ajudarão você a tornar seus mockups mais vívidos, definitivamente fazendo a diferença na sua apresentação.
mockups-4(source: Google Style Imagery)
Se você mantiver o workflow dos seus mockups e protótipos estático, você perderá uma enorme quantidade de tempo. Na maioria dos casos, é muito mais eficiente manter tudo simples e leve. Quando você concluir os primeiros esquetes e wireframes, pode fazer a iteração mais rapidamente em passos pequenos, e ter um feedback rápido do processo.
Por isso, eu recomendo:
Não me entenda mal. Já falei em alguns artigos da importância de dados compartilhados e sistemas conectados. No entanto, isso pode ser um grande desafio durante o estágio de prototipagem. Em muitos casos, isso pode até mesmo aumentar a criatividade, ao trocar de ferramentas para tarefas diferentes. Pessoalmente, eu acho este esquema de ferramentas muito útil:
mockups-5
Ser um profissional criativo requer muita expertise. Seus colegas e clientes conhecem muito sobre a audiência e os objetivos estratégicos. Então, vamos criar uma situação onde todos ganhem. E deixe que eles digam quando for o tempo apropriado para você guiá-los de forma a fazer o melhor na fase de prototipagem.
Qual é o seu conjunto de ferramentas quando você trabalha com mockups e protótipos?
***
Thomas Peham faz parte do time de colunistas internacionais do iMasters. A tradução do artigo é feita pela redação iMasters, com autorização do autor, e você pode acompanhar o artigo em inglês no link: http://usersnap.com/blog/prototyping-tips-website-mockups/
De 0 a 10, o quanto você recomendaria este artigo para um amigo?
É um gerente de marketing na startup austríaca Usersnap. É especializado em inbound & content marketing. Em seu tempo livre, escreve sobre tendências de marketing e de tecnologia em seu blog. Ele pode ser encontrado no Twitter: @tompeham.
Fique em dia com as novidades do iMasters! Assine nossa newsletter e receba conteúdos especiais curados por nossa equipe

source