Sabemos que um protótipo de interface deve ser estruturado sobre os requisitos dos usuários do projeto, sobre os modelos mentais deles, sobre os contextos de uso, a usabilidade e as ideias da equipe do projeto.
Portanto, é preciso pensar estrategicamente em cada tela e em cada elemento da interface, então resolvi fazer uma passo a passo para vocês.
Passo 1
Analise as necessidades e os requisitos dos usuários para a sua interface, bem como os contextos de uso relacionados ao projeto.
Coloque-se no lugar do usuário e imagine qual o passo a passo de suas ações para alcançar seus objetivos nos contextos identificados.
Anote esse passo a passo e, em seguida, pense em ideias de como auxiliar o seu usuário a alcançar seus objetivos com mais facilidade por meio de uma interface.
Se possível, execute essa etapa em uma equipe de projeto. Quanto mais ideias e discussões neste momento, melhor.
Passo 2
Desenhe algumas telas da interface e pense nos elementos que cada uma delas deve conter para que os usuários consigam alcançar seus objetivos.
Se quiser, faça as telas e os elementos separados de forma que consiga movê-los e reorganizar a interface. Não se preocupe com as dimensões corretas e com o acabamento visual aqui e, se possível, faça isso em equipe também.
Primeiras etapas da prototipação
Passo 3
Analise suas ideias com o card sorting e com os requisitos do projeto, então, junto com sua equipe, defina qual a melhor ideia e qual a melhor organização da interface para seguir em frente.
Este é o momento de fazer ajustes e de testar, então não tem problema nenhum mover as coisas do lugar, tirar e acrescentar elementos ou até mudar toda a lógica da interface. Este é o melhor momento para isso.
Passo 4
Faça um protótipo de baixa fidelidade, wireframes, de preferência rápido, com base nas etapas anteriores, e avalie.
Se possível, já faça uma inspeção dos requisitos e dos princípios de usabilidade ou heurísticos (avaliação heurística) e um teste com usuários.
Protótipo de baixa fidelidade
Passo 5
Analise os resultados das avaliações e dos testes e faça ajustes na sua interface. Se forem necessários muitos ajustes, faça-os nos próprios wireframes, pois, no protótipo de baixa fidelidade, é mais rápido e fácil de ajustar. Feito isso, teste novamente.
Se forem necessários poucos ajustes, você já pode avançar para um protótipo de média fidelidade, especificando alguns elementos a mais, com um pouco de refinamento visual e com a definição de nomes de botões e elementos.
Dica: não tenha medo de errar e de ajustar aqui, aproveite que neste momento ainda é rápido e barato fazer isso.
Análise de resultados
Passo 6
Após desenvolver o protótipo de média fidelidade, teste-o com usuários novamente ou ao menos faça uma avaliação heurística e verifique as necessidades de melhorias.
Você pode prototipar apenas uma parte mais importante da interface se quiser, dependendo do prazo e dos objetivos do momento.
Se necessário, pode voltar e prototipar em baixa fidelidade algumas partes com ajustes para testar novamente antes de avançar.
Passo 7
Faça os ajustes e, se as definições já estiverem avançadas, desenvolva o protótipo de alta fidelidade.
Este já deve ter todos os detalhes da arquitetura da informação, identidade visual, como cores, formas e ícones do produto final, nomes e formatos de cada elemento da interface, definições de navegação e de comportamentos da interface em cada tela, transição e elemento, inclusive das micro interações.
Passo 8
Teste o protótipo de alta fidelidade com usuários finais.
Nessa etapa, a avaliação com usuários é fundamental para certificar a boa usabilidade e a aceitação do produto no mercado.
Dica: ainda é possível fazer ajustes nesta etapa e, se necessário, faça-os, volte e teste novamente até que a interface fique adequada.
Teste de protótipo de alta fidelidade.
Dica: Não lance o produto precipitadamente. Se você perceber que ajustes ainda são necessários, mas não os fizer, você pode lançar o produto no mercado correndo um grande risco de várias pessoas o descartarem já no primeiro uso, o que o fará perder clientes já no início, os quais depois serão difíceis de recuperar. Então, teste e ajuste até ter certeza que está tudo bem!
Continue pesquisando e monte seu protótipo, porque só com a prática você vai aperfeiçoar seus conhecimentos.