CASE REAL


2024

Redesenhando o aplicativo
de uma membership club

Redesenhando o aplicativo
de uma membership club

Duração

2 meses

Responsabilidade

Arquitetura da informação, Interface das telas

Ferramentas

Figma, Adobe Photoshop

Equipe

2 Products designers, 3 Desenvolvedores

Grade de benchmarking listando empresas como samsung, apple, amazon, lg, google, wavio, square glow, bellman & symfon e sonic alert.

Visão geral

A Resid Club é um clube de membros que é a chave para um universo de exclusividade e sofisticação.
No aplicativo os membros podem reservar hospedagens e experiências exclusivas para a classe A, além de ganhar colecionáveis ao realizar uma reserva. Os colecionáveis tem como objetivo aumentar o engajamento dos usuários e gerar um senso de comunidade.

Contexto

Os stakeholders solicitaram o redesenho das telas da primeira proposta, que foi criada por outra equipe. O objetivo era ter uma versão do design com mais apelo visual para valorizar os produtos e construir uma percepção de maior valor da marca.

Objetivo esperado

Valorizar os produtos ofertados pela Resid e melhorar a usabilidade no aplicativo.

Interface anterior

Interface anterior

Já existia uma interface desenhada por outro profissional, presente na imagem abaixo, porém o design não atendeu as expectativas dos stakeholders.

Já existia uma interface desenhada por outro profissional, presente na imagem abaixo, porém o design não atendeu as expectativas dos stakeholders.

Já existia uma interface desenhada por outro profissional, presente na imagem abaixo, porém o design não atendeu as expectativas dos stakeholders.

Grade de benchmarking listando empresas como samsung, apple, amazon, lg, google, wavio, square glow, bellman & symfon e sonic alert.

Análise da usabilidade e estética

Análise da usabilidade
e estética

Com o objetivo de valorizar os produtos da Resid, eu analisei a usabilidade e estética, identificando melhorias e outros ajustes necessários.

Com o objetivo de valorizar os produtos da Resid, eu analisei a usabilidade e estética, identificando melhorias e outros ajustes necessários.

Com o objetivo de valorizar os produtos da Resid, eu analisei a usabilidade e estética, identificando melhorias e outros ajustes necessários.

Pontos negativos da interface

O design do aplicativo não tem grande apelo visual

O design do aplicativo não tem grande apelo visual

Principalmente na tela inicial os cards das experiências tem pouco destaque para as imagens, mas elas poderiam ter mais destaque.

Grande uso de texto corridos, dificultando a leitura rápida

Grande uso de texto corridos, dificultando a leitura rápida

Na tela de detalhes sobre o hotel ou experiência temos dois textos longos que não atraem o usuário para ler o conteúdo.

Pouca exibição dos colecionáveis no aplicativo

Pouca exibição dos colecionáveis
no aplicativo

Os colecionáveis só eram visíveis no perfil do usuário e em nenhum outro momento no fluxo.

Falta de padronização nos tamanhos e espaçamentos

Falta de padronização nos tamanhos
e espaçamentos

Ao longo do aplicativo tempos diversos tamanhos de fonte utilizados, sem um padrão claro.

Soluções propostas

Maximizar o potencial das imagens no app

Maximizar o potencial das imagens
no app

Explorar mais o uso das imagens e a qualidade delas, aumenta o número de acessos únicos por dia e a quantidade de interação no funil de conversão.

Tornar os textos objetivos e usar recursos visuais

Tornar os textos objetivos e usar recursos visuais

Aumentar a escaneabilidade dos textos e usar recursos visuais como foto e ícones ajuda na clareza e diminui a demanda de chamados ao suporte.

Exibir os colecionáveis em momento relevantes no app

Exibir os colecionáveis em momento relevantes no app

Exibir os colecionáveis em pontos chave aumenta o engajamento do usuário e o senso de comunidade dele.

Padronizar os tamanhos de fontes e espaçamentos

Padronizar os tamanhos de fontes e espaçamentos

Fontes inconsistentes e espaçamentos irregulares tornam o texto difícil de ler, cansando os olhos e prejudicando a compreensão.

Mapeando fluxos incompletos no aplicativo

Mapeando fluxos incompletos no aplicativo

Para garantir que a solução estava contemplando todos os fluxos, eu estruturei o mapa do aplicativo, porém com um pequeno fluxo para demonstrar a relação entre as páginas e conteúdos.
A partir desse mapa, identifiquei telas que faltavam dentro do fluxo e que foram acrescentadas.

Após realizar a análise e lista as melhorias, estruturei o mapa do aplicativo, como um sitemap porém com um pequeno fluxo para demonstrar a relação entre as páginas e conteúdos antes de iniciar o desenho das telas.

Também foram acrescentadas novas telas que não haviam sido feitas anteriormente.

Para garantir que a solução estava contemplando todos os fluxos, eu estruturei o mapa do aplicativo, porém com um pequeno fluxo para demonstrar a relação entre as páginas e conteúdos.
A partir desse mapa, identifiquei telas que faltavam dentro do fluxo e que foram acrescentadas.

Jornada atual 1º Problema 2º Pesquisa destaque negativo "Não tem legenda em todos os videos/canais", 3º Atendimento em destaque vermelho "a empresa não possui atendimento por texto, dificuldade de distinguir ou entender algumas palavras em português", 4º Visita técnica chega em destaque vermelho "depende de terceiros, precisa estar com o celular", 5º recebe visita com destaque vermelho "depende de terceiros, dificuldade de distinguir ou entender palavras em português, app não identifica quem está falando"
Jornada atual 1º Problema 2º Pesquisa destaque negativo "Não tem legenda em todos os videos/canais", 3º Atendimento em destaque vermelho "a empresa não possui atendimento por texto, dificuldade de distinguir ou entender algumas palavras em português", 4º Visita técnica chega em destaque vermelho "depende de terceiros, precisa estar com o celular", 5º recebe visita com destaque vermelho "depende de terceiros, dificuldade de distinguir ou entender palavras em português, app não identifica quem está falando"
Jornada atual 1º Problema 2º Pesquisa destaque negativo "Não tem legenda em todos os videos/canais", 3º Atendimento em destaque vermelho "a empresa não possui atendimento por texto, dificuldade de distinguir ou entender algumas palavras em português", 4º Visita técnica chega em destaque vermelho "depende de terceiros, precisa estar com o celular", 5º recebe visita com destaque vermelho "depende de terceiros, dificuldade de distinguir ou entender palavras em português, app não identifica quem está falando"

Estabelecendo hipóteses e métricas de sucesso

Focamos o redesign em gerar impactos positivos para a Resid, porém a execução e a validação do projeto foram limitadas pela falta de tempo para pesquisa, de acesso a dados e de envolvimento após o lançamento.

Um design pouco atrativo para os produtos resultará em um alto bounce rate.

A principal tela do aplicativo exibe todos os produtos ofertados e caso as fotos e o design não tenham um forte apelo visual, a tendência é que os usuários deixem o aplicativo.

Teste A/B entre o design atual e a nova proposta e acompanhar o bounce rate, taxa de cliques e o índice de satisfação

Exibir o brinde colecionável na tela do produto vai aumentar o LTV

Atualmente o colecionável só aparecia na tela que exibia todos os colecionáveis que a pessoa já havia ganhado e perdíamos a oportunidade de exibir na tela do produto que a pessoa ganharia aquele brinde ao fazer a compra.

Acompanhar o LTV com o aplicativo em produção após a atualização com essa mudança.

Do visível ao memorável, elevando o padrão visual e a retenção do clube

Do visível ao memorável, elevando o padrão visual
e a retenção do clube

Todos os pontos de contato com o cliente devem ser refinados e o aplicativo deve estar no mesmo nível das experiências que oferecem offline. Ao elevar o padrão visual de cada interface, transformamos a jornada do nosso público para que cada interação seja memorável.

O novo design atua como uma vitrine estratégica, elevando o apelo visual dos produtos para reduzir
o bounce rate e aumentar o desejo de conversão.

O novo design atua como uma vitrine estratégica, elevando o apelo visual dos produtos para reduzir o bounce rate e aumentar o desejo de conversão. Onde imagens de alta fidelidade e textos objetivos facilitam a visualização e a escolha das experiências

A vitrine com melhores experiências e hotéis, confira em todos os detalhes

A vitrine com melhores experiências e hotéis,
confira em todos os detalhes

O novo design atua como uma vitrine estratégica, elevando o apelo visual dos produtos e o desejo em experimentar as experiências exclusivas e hotéis com o conforto do seu lar, para que o bounce rate reduza e a conversão aumente

O novo design atua como uma vitrine estratégica, elevando o apelo visual dos produtos para reduzir o bounce rate e aumentar o desejo de conversão. Onde imagens de alta fidelidade e textos objetivos facilitam a visualização e a escolha das experiências

Tela inicial

Antes

Tela inicial

Depois

Explore cada vantagem e detalhe exclusivo para uma escolha impecável

Explore cada vantagem e detalhe exclusivo para uma escolha impecável

Unimos informações objetivas a um visual impactante que destaca o que há de mais valioso em cada produto, tornando as vantagens irresistíveis ao primeiro olhar.

O novo design atua como uma vitrine estratégica, elevando o apelo visual dos produtos para reduzir o bounce rate e aumentar o desejo de conversão. Onde imagens de alta fidelidade e textos objetivos facilitam a visualização e a escolha das experiências

Produto

Antes

Produto

Depois

Eternize sua jornada com a Resid colecionando ativos digitais exclusivos

Eternize sua jornada com a Resid colecionando ativos digitais exclusivos

O ganho de colecionáveis exclusivos gamifica ao premiar a aquisição de hotéis e experiências com ativos digitais, esse recurso pode elevar o LTV, criando uma barreira de valor que consolida a retenção e a fidelidade no aplicativo a longo prazo.

O ganho de colecionáveis exclusivos gamifica ao premiar a aquisição de hotéis e experiências com ativos digitais, esse recurso pode elevar o LTV, criando uma barreira de valor que consolida a retenção e a fidelidade no aplicativo a longo prazo.

Colecionáveis

Antes

Produto

Depois

Próximos passos

Próximos passos

O aplicativo foi lançado, mas infelizmente não atuei nos próximos passos que ele possa ter dado, porém se eu tivesse participado teria feito as seguintes evoluções:

O aplicativo foi lançado, mas infelizmente não atuei nos próximos passos que ele possa ter dado, porém se eu tivesse participado teria feito as seguintes evoluções:

1

Monitorar métricas de funil

Monitorar métricas

Implementar e analisar eventos para identificar problemas na jornada que foi desenhada sem a contribuição do usuário e entender se o fluxo faz sentido ele.

2

Validação do aplicativo

Com a implementação dos eventos, acompanharíamos as métricas para validar as hipóteses de conversão e retenção pós-lançamento.

3

Pesquisa com usuários

Realizar testes de usabilidade e entrevistas com usuários reais para entender a percepção de valor dos ativos digitais, garantindo ele tenha cumprido seu objetivo.

Aprendizados

Aprendizados

O aprendizado é contínuo e cada projeto me proporciona novas experiências e compartilho alguns dos principais aprendizados que tive nesse projeto:

A pesquisa secundária foi importante para desenvolver o projeto, confira as principais descobertas:

1

1

Exploração de versões

Explorar possibilidades de telas em algumas versões até chegar na versão final foi importante para garantir a valorização dos produtos

2

2

Não se limitar ao que foi pedido

Os stakeholders tinham uma expectativa e fomos além da estética, mapeamos a jornada e revisamos a interface para entregar uma solução com embasamento teórico

Os stakeholders tinham uma expectativa e fomos além da estética, mapeamos a jornada e revisamos a interface para entregar uma solução com
embasamento teórico

Quer marcar um papo?

Entre em contato

ENTRE EM CONTATO ENTRE EM CONTATO

Copyright by Luciana Vitória

Quer marcar um papo?

Entre em contato

ENTRE EM CONTATO ENTRE EM CONTATO

Copyright by Luciana Vitória

Quer marcar um papo?

Entre em contato

ENTRE EM CONTATO ENTRE EM CONTATO

alignuxdesign@gmail.com

Linkedin

Copyright by Luciana Vitória

Quer marcar um papo?

Entre em contato

ENTRE EM CONTATO ENTRE EM CONTATO

Copyright by Luciana Vitória

Create a free website with Framer, the website builder loved by startups, designers and agencies.