taynara santos
product designer | ux/ui designer
home deslogada | meudna
A meuDNA é uma empresa que foi criada em 2019 e que pertence a Mendelics. A missão é aumentar a qualidade de vida das pessoas através da informação genética personalizada.
Os produtos eram vendidos individualmente: Origens, Saúde, Bochechinha e Covid e o objetivo agora era mudar para um modelo de planos de assinatura mensal, trimestral e anual, no qual cada um virá com um combo de testes
sobre: projeto real desenvolvido durante meu período como colaboradora da empresa meuDNA
atuação: ux/ui design | product design
ferramentas: figma | notion
data: 2022
sobre o projeto
Objetivo: Redesenhar a Home deslogada para comportar o novo modelo de negócios definido: plano de assinatura.
Justificativa: A home deslogada é a porta de entrada dos usuários e clientes, ela precisa passar os principios da marca e principalmente como tudo funciona. A home antiga estava mostrando os testes separados, mas era preciso atualizá-la para mostrar as novas assinaturas.
Metodologia: Double Diamond. O método auxilia na geração de soluções mais assertivas, visto que seu processo permite manter o foco, seguindo uma estrutura linear de pensamento no desenvolvimento do projeto.
processo de design
fonte: PM3
Descobrir
-
Requerimento dos times
-
Benchmarking
-
Matriz CSD
Desenvolver
-
Wireframe
-
Design Critiques
-
UI
Definir
-
User Flow
-
User Task
-
Definição de feature
Entregar
-
Handoff
descobrir
-
Requerimento dos times
Definimos os times que estão mais envolvidos na jornada dos usuários e perguntamos: O que não pode faltar na nova home?
-
Ícone de acesso aos resultados
-
Destaque para "Enviar sua amostra"
-
Área do Blog
-
Falar sobre nosso propósito como empresa
-
Newsletter
-
Melhorar área de Na mídia
-
Benchmarking
Para essa etapa foi analisado os sites de marcas concorrentes diretos e indiretos da meuDNA, tanto quanto sites de ramos diferentes a fim de buscar referências visuais
concorrentes
referências
-
Matriz CSD
Matriz CSD foi aplicada no início do projeto e atualizada frequentemente no decorrer do desenvolvimento.
definir
Nessa etapa foi aplicado algumas técnicas para dar escopo ao projeto e entender quais features entrariam e o que queríamos que os usuários fizessem. As técnicas utilizadas foram: user flow, user task e definição de feature.
user flow
user task
definição de feature
![user task e feature].png](https://static.wixstatic.com/media/11d1e2_93d2a6bc2fa944f7bbba630b70b580b6~mv2.png/v1/fill/w_597,h_385,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/user%20task%20e%20feature%5D.png)
desenvolver
-
wireframe
Antes de começar a expressar alguns layouts para a home, foi necessário realizar alinhamentos com as equipes envolvidades para definir a estrutura base do site, uma vez que o objetivo da home (além de comportar o novo modelo de negócios) é resolver os requerimentos feitos anteriormente.
-
Sessões de design critique
Durante o processo de criação da interface foram realizadas algumas dinâmicas de design critique com a equipe de Design.
-
Interface
Ao final foi possível atender a 7 dos 9 requerimentos solicitados:
-
Destaque para "Enviar sua amostra"
-
Falar sobre nosso propósito como empresa
-
Newsletter
-
Melhorar área de Na mídia
-
Melhorar estrutura narrativa
-
Nova Identidade Visual
-
Melhoria na estrutura do conteúdo para SEO
-
Ícone de acesso aos resultados
-
Área do Blog
entregar
-
Handoff
Antes de enviar o design para desenvolvimento foi feito um alinhamento com o time para definir quais informações eram cruciais para que eles avançassem mais asserivamente com o projeto, além de deixar bem documentado quais eram as especificações que a equipe de Conteúdos solicitou.
componentes e especificações de design
especificações da equipe de Conteúdo
Obrigada!
Caso tenha alguma dúvida sobre o projeto, me mande um email: tspaula94@gmailcom :)
