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.

1. A definição de fidelidade de protótipo

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.

(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.

 

2. Identifique problemas

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 🙂

3. Tenha recursos realísticos

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.

(source: Google Style Imagery)

4. Falhe rápido, e conserte as coisas ainda mais rápido

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:

• Mantenha seu workflow de prototipagem transparente e ofereça updates ao time.
• Comunique claramente e aponte os problemas assim que eles aparecerem.
• Garanta que todos os stakeholders do projeto estarão envolvidos.

5. Use ferramentas diferentes para estágios diferentes da prototipagem

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:

• Sketches: usar papel e quadros de verdade para coletar as primeiras ideias. Evernote pode ser um ótimo assistente para agrupar essas ideias.
• Wireframes e mockups: quando você estiver trabalhando com wireframes e mockups, balsamiq e moqups são ferramentas muito úteis!
• Protótipos: para trazer seus mockups à vida real, ferramentas como InVision, Usersnap e CodePen ajudam você na construção dos seus protótipos ao mesmo tempo em que garantem que nenhuma ideia ou feedback tenha ficado perdido para trás.

Agora é com você

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/