O papel da prototipagem em produtos digitais
Protótipos são ferramentas que nos ajudam a testar um produto digital ou físico. Com eles, podemos avaliar a disposição dos elementos e a usabilidade, por exemplo. Mas, para cada projeto há um tipo ideal de protótipo, que pode ser de baixa, média ou alta fidelidade. Conheça as opções mais utilizadas pelo mercado de tecnologia e as principais ferramentas de prototipagem de soluções digitais.
Quando se trata de construir produtos digitais, muito se fala da etapa de prototipagem, mas o que alguns designers não sabem, é que a prototipagem não aparece como uma etapa em um momento distinto do projeto. Seja em papel ou no computador, de alta ou de baixa fidelidade, os protótipos são de grande relevância durante todo o processo de construção do produto, facilitando seu entendimento e proporcionando a realização de ações e correções antes de ser lançado ou ir para desenvolvimento, poupando tempo e dinheiro.
Vamos entender quais os tipos de protótipos existem e suas aplicações durante a construção de um produto digital.
Tipos de protótipo
Os protótipos podem ser dos mais variados tipos: digitais ou físicos, de baixa, média ou alta fidelidade. Quando se trata de produtos digitais, o uso de protótipos deve ser realizado desde o início do conceito do produto. Ok, mas você deve estar se perguntando: “Que tipos de protótipos existem e para que servem?”
Protótipos de baixa fidelidade:
Os protótipos de baixa fidelidade podem ser digitais ou mesmo em papel, e têm como principal característica a simplicidade, pois possuem o intuito de proporcionar rapidez de alteração. Podem ser utilizados antes da fase de desenho do layout ou mesmo da definição de um fluxo efetivo do produto, uma vez que, devido a sua velocidade de ser adaptado, pode nortear estas etapas que surgirão futuramente.
O protótipo físico de baixa fidelidade pode ser desenhado em papel, utilizando-se de materiais como post-its, marcadores e outros materiais que possam auxiliar na construção do mesmo. A ideia é que esse protótipo seja rápido e fácil de modificar, sem ser muito rebuscado, já que ele não servirá como um guia de UI, ok?
O protótipo digital de baixa fidelidade possui o mesmo propósito que o modelo físico, ou seja, deve ser simples, sem se ater a complexidades desnecessárias como cores, botões bem desenhados e interações funcionando (hover, drag and drop, animações, etc). Você pode utilizar softwares que permitam “linkar” os layouts que desenhou, ou simplesmente imprimir estes para testar em papel.
O fato é que um layout desenhado em baixa fidelidade proporciona um nível maior de ação, facilitando a mudança de fluxos, experiências e também de arquitetura da informação antes destas telas se tornarem mais robustas.
Protótipos de média fidelidade:
Alguns profissionais costumam dividir os protótipos somente nas categorias de alta e baixa fidelidade, porém é interessante sabermos que pode haver um meio termo, no qual podemos testar características importantes da interface antes de definir completamente como será a tela final. Assim como o anterior, o protótipo de média fidelidade pode ser impresso ou digital, mas apresentando um volume maior de informações e detalhes.
Desenhando wireframes mais complexos, podemos definir estruturas mais relacionadas à realidade do produto. Esse passo é importante, pois ajuda a prever erros que podem acontecer e que anteriormente não foram previstos durante a etapa do protótipo de baixa fidelidade. Desta maneira, podem ser definidos ajustes mais finos na interface, fluxo e arquitetura de informação antes que esses layouts possam seguir para o modelo final.
O protótipo de média fidelidade pode ser físico ou digital, e quando é físico, geralmente é uma impressão do wireframe desenhado. Este modelo não necessita de um meio para ser acessado e permite que o testador possa apontar manualmente suas dúvidas ou sugestões.
O modelo digital, embora necessite de um meio para ser acessado, pode proporcionar uma certa interação ao usuário, podendo apresentar botões clicáveis que permitem a navegação pelos layouts e pequenas interações como modais e mensagens.
Esse modelo é interessante para testar fluxos e interações antes que sejam desenvolvidas já na etapa final do produto, evitando, assim, que haja um esforço maior de reestruturação de comportamentos e fluxos.
Protótipos de alta fidelidade:
São os protótipos que refletem como serão especificamente todos os elementos do produto final, junto com as interações, fluxos e componentes com um grande nível de detalhamento. Que legal! Mas, porque não usamos esse logo no começo? A resposta é que este modelo de protótipo demanda um grande trabalho e possui uma grande complexidade para ser realizado, não sendo facilmente alterado como os modelos anteriores.
Recomenda-se utilizar este protótipo no momento em que toda a arquitetura de informação, fluxo e style guide do produto esteja definido, para que não ocorram surpresas que demandem grandes alterações no produto.
Este modelo de protótipo é ótimo para testar uma funcionalidade do produto antes mesmo de lançá-la, ou verificar pequenos ajustes que podem ser feitos no layout, texto e até mesmo informações que devem ser acrescentadas ou removidas.
Outro benefício é de que há um número maior de possibilidades de interação para testagem oferecidas ao usuário, que terá em suas mãos uma ideia de como o produto será apresentado efetivamente.
Algumas ferramentas de prototipagem
Existem algumas ferramentas que podem ajudar na construção de seus protótipos, sendo alguns voltados para baixa, média e alta fidelidade:
- Miro — Permite criar wireframes simples de baixa fidelidade rapidamente
- Wireframe | cc — Assim como o Miro, permite criar wireframes rápidos e simples.
- Cacoo — ótimo para desenhar protótipos de média fidelidade. Permite o trabalho em simultâneo.
- Figma, Adobe XD, Sketch, Invision, uizard — Ferramentas que proporcionam a criação de interfaces de baixa a alta fidelidade, com grande número de recursos e interações.
Prototipar ou não prototipar?
A resposta é prototipar sim! Cada tipo de protótipo tem seu devido valor, e se utilizados de maneira correta, trazem muitas vantagens para o andamento do produto digital, como por exemplo uma maior assertividade nas definições de layout, fluxo, interações, etc. Essa assertividade ocorre pelo fato de que os protótipos permitem a realização de alterações em várias áreas do produto antes destas serem implementadas, evitando retrabalho e economizando tempo e dinheiro.
Outro fator importante, é de que o cliente, stakeholders e todas as partes interessadas envolvidas no projeto podem ajudar nas tomadas de decisões relacionadas a regras de negócios, bem como ajudar no entendimento de como isso pode influenciar no layout antes mesmo de irem para produção. Já imaginou se em determinado layout algumas informações não devem ser exibidas e acabam comprometendo assim a usabilidade da aplicação e gerando perdas ao cliente? Com protótipos é possível testar e analisar qual o caminho a se seguir para que o produto final seja consistente e relevante no mercado.
Referências:
- IDEO — Why you should start prototyping right now
- ProtoPie — 5 good reasons designers should build more prototypes
- Nielsen Norman Group — Paper Prototyping
- Nielsen Norman Group — UX Prototypes: Low Fidelity vs. High Fidelity
