Prototipação

É um conceito focado no design centrado no usuário onde ideias são validadas e feedbacks são recebidos em um modelo em menor escala do produto que você deseja fazer que pode acontecer em diversos níveis de detalhamento. A ideia da prototipação é de antecipar a natureza do produto sendo a equipe seja capaz de esboçar como o será o sistema de forma ágil e com uma documentação de poucas páginas.

Protótipos tem que ter objetivos específicos ou mais genéricos, senão será algo com custo mas sem valor. O objetivo influenciará no tipo de protótipo que será feito. Dentre os objetivos mais genéricos de um protótipos, podemos citar:

Avaliação e feedback
Apresentação aos stakeholders
Comunicação entre as equipes de desenvolvimento
Testar ideias e incentivar a reflexão.
Responder questões e escolher alternativas de design

Dimensões e Classificações de Protótipos

Um protótipos pode ser de diversos tipos e atingir diversos escopos, ou seja, um protótipo pode ser de diversas dimensões.

Representação

Como o desenho da interação é representado no protótipo.

Prototipação de Baixa Fidelidade

São esboços ou protótipos em papel que não agregam custos mas possuem retorno. Funcionam como brainstorming e possibilitam testes de ideias. Outro detalhe é que esses protótipos são independentes de plataformas e não se preocupam com estética.

Prototipação de Alta Fidelidade

Protótipos desenhados para irem além de demonstração de ideias e ser possível realizar testes de usabilidade neles. Preocupam-se em representar de forma fidedigna atributos do produto para que possa representar o produto em testes e para que os resultados dos testes sejam concretos.

Escopo

O que está incluso no protótipo em termos de funcionalidade e interface?

Protótipo horizontal x Protótipo vertical (Nielsen em 93)

Prototipação horizontal utilizar um maior número de características e as aborda em grau de profundidade pequeno. São muito úteis na avaliação das metáforas e consequentemente da usabilidade do sistema nas etapas iniciais do design.

Prototipação vertical utiliza um menor número de características e as aborda em um maior grau de profundidade. São protótipos muito utilizados em fases mais avançadas do projeto.

Protótipo global x protótipo local

Na prototipação global acontece a representação do sistema inteiro, trabalhando tanto em alto nível quanto baixo, ou seja, pode ter profundidade em algumas partes e superficialidade em outras. Esse tipo de prototipação é utilizado por todo o ciclo de prototipagem e através dele o usuário pode ter uma boa percepção do produto.

Na prototipação local é descrito um detalhe específico do produto e que seja importante o suficiente para potencializar a usabilidade de todo o sistema. É um tipo de prototipação muito usado quando precisa-se otimizar uma característica, possibilitando fazer testes, avaliar alternativas e geralmente é um protótipo revolucionário, sem objetivo de evoluir para o sistema.

Combinações

Combinando os dois tipos de classificação temos o protótipo global e vertical, que são os protótipos funcionais onde é quase o sistema em si. Também há o protótipo global e horizontal, muito usado para se ter uma ideia geral do sistema. E, por fim, há o protótipo local e vertical que são revolucionários e ótimos para ideação.

Lembrando que um protótipo local e horizontal não faz sentido existir, pois teríamos poucas características e pouco detalhamento, não tendo fim algum.

Executabilidade

Se o protótipo é executável ou não para realizar testes de usabilidade e levantar as taxas de erro e demais análises.

Somente Interfaces

Nesses casos, se o escopo contiver somente interface, nós chamamos esse tipo de protótipo de mockup.

Interface e Funcionalidade

São construídos pequenos sistemas que possibilitem avaliar a usabilidade e demais atributos do projeto.

Amadurecimento

Definição quanto ao ciclo ou prazo de vida do protótipo.

Revolucionários

Protótipos descartáveis, feitos apenas para testar a ideia e ser jogado fora. Na fase inicial a ideação acontece é comum ter um grande número de protótipos revolucionários, já que é o período onde as ideias estão surgindo e sendo testadas e filtradas.

Protótipo para Amadurecimento

Protótipos desenvolvidos com intuito de serem aprimorados de acordo com o avançar das etapas do ciclo de desenvolvimento. Comuns de surgirem nas fases finais do processo, onde as ideias estão mais sólidas e estáveis, prontas para serem apenas aprimoradas sem grandes mudanças.

Exemplos de Tipos de Prototipação

Prototipação através de Storyboard (Baixa Fidelidade)(Mockup)

Uma prototipação de baixa fidelidade e no estilo mockup, focando apenas na definição visual. Essa prototipação tem o intuito de definir o fluxo de execução ou navegação através de fluxo de cenas de uma história. Através desse fluxo é definido a jornada do usuário através do sistema. As cenas são compostas por vários protótipos de baixa fidelidade.

Prototipação através de Wireframes (Baixa Fidelidade) (Mockup)

É uma prototipação global e horizontal de sistemas web que busca definir a arquitetura da informação através da disposição básica dos macroblocos na tela. Os wireframes são mockups, ou seja, protótipos que não são funcionais. Eles documentam as características visuais do produto, definem descritivamente a funcionalidade por trás dos controles e ilustram a aparência. As telas prototipadas em baixa fidelidade e são como uma planta baixa do sistema ou site. Sendo assim, um wireframe é composto por:

Conteúdo (textos, vídeos, ícones, animações)
Funcionalidade (controles, botões, alavancas, slides, dials e campos de entrada)
Navegação (como controles que acessam o conteúdo)
Metadados (descrição do wireframe como nome do designer, última modificações, versão e demais detalhes)
Anotações
Descrição de características que não podem ser concluídas com facilidade pelo usuário, o que é importante principalmente quando não há o desginer próximo para prover maiores explicações. Normalmente são anotadas restrições, como o tamanho de um campo, itens condicionais, como comportamentos que acontecem em certas circunstâncias e controles, que são elementos que executam ações.

Durante o desenvolvimento de um wireframe, Mantenha-o simples no início, teste primeiro a metáfora em um layout básico com os locais e espaços de acordo com a importância, locais dos links e o tipo de conteúdo antes de adicionar todos os componentes.

Prototipação através de Sistemas Simples

Programas limitados que servem como protótipos local e vertical e com alta fidelidade. Possuem poucas funcionalidades, focados em capturar feedback de uma funcionalidade ou outra.

Prototipação através de Apresentação de Slides

Não envolve codificação e apresentam as etapas do sistema, sendo um mockup. O que está contido nos slides pode ser desenhos de baixa ou alta fidelidade. Muito designers têm utilizado para apresentar a navegação do sistema devido aos slides darem suporte a referência de páginas através de links internos. Por ser desenvolvido objetivando apresentação e não testes, esses protótipos geralmente são globais e horizontais.

Prototipação através de Maquetes

São protótipos de alta fidelidade em aspectos definidos e são úteis para demonstrar a proporcionalidade do tamanho e peso para capturar as reações dos usuários.