A busca pela perfeição é uma armadilha sutil que muitas vezes leva os designers a um loop infinito de iteração e revisão. Isso é especialmente verdadeiro no mundo dos produtos digitais, onde cada interação e elemento gráfico pode se tornar um objeto de obsessão do design.

Mas, quando recuamos e observamos a natureza interdisciplinar do design de produto digital, é fácil ver como os designers caem na armadilha da perfeição.

Pense em todas as pessoas e funções envolvidas no design de um único produto digital:

• Design Researchers
• Designers de IU
• Arquitetos de Informação
• Designers UX
• Designers de Produto
• Gerentes de Produto
• Estrategistas de conteúdo
• Especialistas em Marca
• UX Copy Writers
• etc.

De uma forma ou de outra, cada uma dessas interseções. Por exemplo, um produto interface de usuário não pode ter sucesso se for experiência de usuário não é considerado. Com a interconexão, vem a pressão para entender como as decisões de design afetam umas às outras: “Se fizermos X, como isso afetará Y e Z?”

Esse tipo de previsão estratégica pode ser valioso, mas também pode causar a estagnação do processo de design e ficar preso no temido ciclo da perfeição: “Precisamos acertar o X antes de executar Y e Z.”

Então, qual é a alternativa? Existe uma maneira de criar, lançar, testar e melhorar rapidamente produtos digitais com base em métricas do mundo real e percepções obtidas de pessoas reais?

Neste guia, abordaremos essas questões através das lentes de protótipos mínimos viáveis e equipar os designers com um processo incrivelmente simples para construir, testar e refinar produtos digitais.

Simule o lançamento com um protótipo mínimo viável

Ninguém sabe de nada ... Nenhuma pessoa em todo o campo do cinema sabe com certeza o que vai funcionar. Sempre é um palpite e, se você tiver sorte, um adivinhado. - William Goldman , Roteirista vencedor do Oscar

As primeiras decisões do processo de design de produto digital são, na melhor das hipóteses, baseadas em suposições. Até que um produto esteja nas mãos de usuários reais, tudo é teórico. Por outro lado, lançar um produto antes que esteja pronto pode prejudicar sua reputação (um erro caro).

E se houvesse uma maneira de simular o lançamento e determinar a viabilidade de um produto bem antes do início de qualquer grande esforço de design?

Este é o valor do protótipo mínimo viável (MVPr), um abordagem de design de produto que requer substancialmente menos tempo e dinheiro do que o mais conhecido 'produto mínimo viável'.

Aqui está uma visão geral do processo de design de protótipo mínimo viável (MVPr):

1. Descoberta
2. Pesquisa
3. Arquitetura de informação
4. Design visual
5. Lançamento
6. Teste

Esperar! Não é esse o processo que todos usam?

Sim, e veremos que, baseando-nos nos princípios básicos das etapas acima, podemos com sucesso ...

• Simule a funcionalidade de um produto real;
• Imitar o lançamento de um produto real; e
• Descubra se vale a pena construir um produto real.

Passo a passo: como construir um MVPr

1. Descoberta: Comece a tomar decisões

Uma ótima maneira de iniciar o processo de descoberta é pesquisar sites, blogs e aplicativos semelhantes à sua ideia. Aprenda sobre suas histórias, seus mercados-alvo, como eles operam, etc. Se você descobrir que nenhum dos concorrentes relevantes faz o que seu protótipo faz, continue avançando.

Esta etapa não requer nenhum conhecimento. O segredo é fazer - avançar da intenção à ação.

Preste atenção especial aos pontos fortes e fracos de seus concorrentes. Como você pode usar o que eles já realizaram (ou não conseguiram) para tornar seu protótipo mais forte?

Depois de 1-2 horas de pesquisa, você deve ser capaz de identificar seus concorrentes mais importantes e aprender os principais aspectos de cada um.

2. Pesquisa: Defina seus usuários

Quem é seu usuário-alvo e por que eles deveriam se preocupar com seu produto? Entender isso é crucial, mas devemos começar com suposições calculadas. É melhor começar com uma visão fortemente opinativa. Não duvide ou tente fazer 'algo para todos'. Não queremos um design diluído.

Em vez disso, observe mais de perto os sites concorrentes encontrados durante a fase de descoberta e permita que o bom senso pinte um retrato de seus usuários em potencial.

Aqui estão algumas áreas práticas de investigação que são facilmente acessíveis na web:

• Visite sites de avaliação e veja o que as pessoas estão dizendo sobre suas experiências com seus concorrentes.
• Siga os influenciadores da indústria do seu produto nas redes sociais e observe como eles envolvem seu público.
• Pesquise artigos de notícias confiáveis ​​que forneçam uma visão detalhada de como seus concorrentes operam.
• Confira as interações de seus concorrentes com seus usuários nas redes sociais.
• Veja se você consegue encontrar algum fórum onde os problemas ou questões de seus concorrentes estão sendo discutidos.

Insights valiosos podem ser obtidos em cada uma dessas avenidas sem um investimento financeiro significativo. Isso é especialmente importante para pequenas equipes de design que trabalham com orçamentos apertados. As grandes marcas gastam muito dinheiro em pesquisa, mas pequenas equipes e freelancers individuais precisam encontrar maneiras de ser mais engenhosos.

3. Arquitetura da Informação: Estruture Seu Protótipo

Como vai protótipo trabalho, e quais são as informações mais importantes para se concentrar?

A maneira mais fácil de começar a responder é analisar sites de primeira linha que são semelhantes ao protótipo que você está construindo. A aparência geral e a experiência do site que você escolher como referência devem ser excelentes.

Comece dividindo o site em pedaços. Quais são todas as páginas relevantes e como são estruturadas visualmente? Não tenha medo de reverter o wireframe do site e recriá-lo com suas próprias informações, cores, imagens, etc.

Por que fazer dessa maneira? Seu site provavelmente funcionará de maneira semelhante a sites concorrentes - você apenas tem objetivos diferentes em mente. Não há necessidade de inventar um sistema complexo se os usuários respondem bem a uma experiência estabelecida.

* Tipo Pro: Ao estudar um site arquitetura de informação , uma técnica útil é fazer capturas de tela e torná-las em tons de cinza para que você não se distraia com o impacto da cor (que pode ser bastante persuasivo).

Depois disso, aproveite os recursos online que permitem aos designers passar rapidamente do zero ao protótipo interativo. Existem toneladas de kits de interface de usuário, modelos HTML, temas WordPress e assim por diante. Não tenha medo de modificá-los para se adequar ao seu protótipo e não se preocupe com a perfeição dos pixels ou código bonito. Nesta fase, ninguém se importa. Eles se preocupam se o seu produto é útil ou não.

Veja como isso funciona usando um UI kit :

O que conseguimos na imagem acima?

• Removemos todas as cores e imagens.
• A barra de navegação não foi alterada.
• A funcionalidade do sistema de filtragem permaneceu a mesma, mas o texto foi alterado.
• Passamos de duas colunas para uma a fim de mostrar melhor as imagens que planejamos usar.

Em menos de uma hora, temos uma base visual para desenvolver ainda mais nosso protótipo.

4. Design visual: reaproveitar recursos de IU gratuitos

A aparência visual do seu protótipo não pode ser separada da maneira como ele funciona. Não se trata apenas de gráficos. O design visual impactante conta uma história e fornece uma experiência com valor real.

Aqui, a consistência visual é fundamental porque ajuda os usuários a se familiarizarem com um produto e a navegar com mais eficiência. Para atingir esse tipo de consistência no início do desenvolvimento do seu protótipo, é inteligente redirecionar os recursos de IU gratuitos.

Trabalhando dessa forma, você não terá que gastar horas desenvolvendo um sistema de design coeso. Tipografia, estilos de botão, iconografia e todos os outros componentes importantes da IU são tratados.

5. Lançamento: Codificar ou não codificar?

É hora de compartilhar seu protótipo com o mundo. Felizmente, é mais fácil do que nunca transformar maquetes em protótipos dinâmicos. Graças a uma série de ferramentas intuitivas, você nem mesmo precisa saber como codificar, mas você deve aprender?

O MVPr sem código

Quando terminar o design visual, incorpore o protótipo em uma página de destino para que os visitantes possam interagir com ele e fornecer feedback geral sobre sua ideia. Neste ponto do processo de design do MVPr, existem várias maneiras de criar um protótipo sem código. Aqui estão suas opções:

Protótipos Básicos

• InVision tem todos os recursos necessários para construir e testar um protótipo básico e oferece uma experiência indolor e sem complicações.

Protótipos de Rich Media

• Para interações, transições e animações sofisticadas, Princípio é bastante útil.

Protótipos 100% realistas

• Framer permite que os designers simulem qualquer experiência de produto digital imaginável. É a opção perfeita quando o protótipo tem que parecer e parecer real em termos de animação nativa e codificação baseada em lógica (Ex: se isto, faça aquilo).
• Webflow fornece o poder de projetar, construir com código e lançar sites responsivos em uma tela 100% o que você vê é o que você obtém.

Clique para ver a imagem em tamanho real.

O MVPr Codificado

O código pode ser um aliado incrível. Sem dúvida, é a melhor maneira de construir seu produto. A principal desvantagem é que você precisa saber como escrever código para experimentar os benefícios da personalização avançada. Sem uma base de conhecimento adequada, a escolha de experimentar o código o deixará lento.

Existem muitos kits de iniciação de código para ajudar a dar o pontapé inicial. Por exemplo, o kit de IU que apresentamos acima tem sua própria versão HTML disponível para download:

6. Teste: aproveite as informações do anúncio

O ingrediente secreto para testar seu protótipo está nas ferramentas que permitem obter o máximo de insight com o mínimo de esforço, ao mesmo tempo em que fornecem valor. Tudo que você precisa é de alguns dólares e alguma solução de problemas paciente.

Uma primeira etapa prática para avaliar o interesse em seu produto é criar um anúncio e direcionar as pessoas encontradas durante a fase de pesquisa. Dependendo do seu público e do tipo de produto que você está desenvolvendo, você pode veicular anúncios no Google, LinkedIn, Instagram ou Twitter. Para produtos business-to-consumer, o Facebook é recomendado.

* Tipo Pro: AdEspresso é um lugar conveniente para exibir centenas de versões de seus anúncios sociais ao mesmo tempo, enquanto coleta análises comparativas úteis.

Exiba anúncios e você aprenderá duas coisas:

1. O número de pessoas que visualizaram seu anúncio
2. O número de pessoas que clicaram em seu anúncio

Depois de confirmar que seu público-alvo está interessado em interagir com seus anúncios, você precisará criar valor para seus primeiros usuários. Veja como:

• Adicione um formulário de “inscrição” e peça aos usuários que forneçam seus endereços de e-mail.
• Acompanhe para que eles saibam quando você estiver lançando.
• Certifique-se de ter seus canais de mídia social ativos e funcionando para que você possa criar botões sociais, permitindo que os usuários divulguem seu produto.

Use esta estratégia e você ganhará:

• Uma lista de endereços de e-mail que podem ser usados ​​para esforços iniciais de marketing
• Pessoas recomendando seu produto para suas redes pessoais e profissionais
• Uma compreensão mais clara de se alguém está ou não animado com seu produto

A primeira vez que você recebe um feedback real, seu produto está no ar. Através deste ciclo de entrega de valor, análise de comportamento e soluções iterativas, você aprenderá o que está funcionando e o que não está, e ficará mais perto de um produto que as pessoas realmente querem usar.

Lance e aprenda com ousadia

O objetivo final do protótipo mínimo viável é este: Mude de suposições de design educadas para feedback real e acionável com velocidade e confiança.

Este é um processo que envolve a incerteza e os passos em falso como oportunidades de melhoria. Acima de tudo, recompensa a ação. Um bom design requer uma tomada de decisão ousada e uma vontade de seguir em frente em face da imperfeição.

Portanto, não se atrapalhe na busca da perfeição e tente não se comparar às mega marcas e seus enormes recursos. Continue dando passos em frente e logo você se encontrará com um produto significativamente polido que as pessoas vão adorar usar.

• • •

Leituras adicionais no Blog de design do ApeeScape:

1. Protótipo com facilidade - um tutorial do InVision Studio
2. Como conduzir uma sprint de design eficaz
3. Quem sabia que o Adobe CC poderia fazer wireframe?
4. Teste de UX para as massas: mantenha-o simples e econômico
5. Mapas da jornada do cliente - o que são e como construir um

Compreender o básico

O que MVP significa?

MVP é um termo de design e desenvolvimento que significa produto mínimo viável. É um método para criar, lançar, testar e melhorar rapidamente um produto antes de aperfeiçoar todos os detalhes.

O MVP é um protótipo?

Mesmo que um MVP não seja um produto “acabado” e exija mais design e iteração de desenvolvimento, ele não é um protótipo. Um MVP, um produto mínimo viável, é um produto ao vivo (site, aplicativo, etc.) que pessoas reais podem usar em cenários do mundo real.

O que é IA em UX?

Em UX, IA significa arquitetura da informação. Como parte padrão do processo de UX, os designers criam arquitetura de informações ao construir produtos. A arquitetura da informação é, como um blueprint, uma representação visual da infraestrutura, recursos e hierarquia do produto.

Qual é o objetivo da arquitetura da informação?

O objetivo da arquitetura de informações é organizar o conteúdo de forma lógica para que as pessoas possam acessar facilmente e usar com eficácia as informações de que precisam. Assim como um blueprint, IA fornece designers (bem como equipes de desenvolvimento e engenharia de produto) uma visão panorâmica de todo o produto.

Quais são os princípios Lean?

O Lean, metodologia de negócio e gestão, assenta em cinco princípios fundamentais: 1. definir valor; 2. mapear o fluxo de valor; 3. criar fluxo; 4. estabelecer tração; e 5. buscar a perfeição.