Reestruturação do Site da 360 Suítes
Refatoração do layout Web e Mobile do site da 360 Suítes.
Sobre
Ao iniciar no time da 360 Suítes, meu principal desafio foi reposicionar a marca no ambiente digital de acordo com as novas estratégias e ambições da empresa, e ampliar o volume de reservas realizadas pelo site próprio, reduzindo a dependência de OTAs como Airbnb, Booking e outras.
Atuei como único designer da 360 Suítes, sendo responsável por todo o ciclo de design, da conceituação estratégica à entrega final.
Solução
Para atingir esse objetivo, foi conduzido um redesign completo do site, além da evolução de produtos já existentes, sempre com foco em usabilidade, clareza da informação, eficiência operacional e alinhamento com as diretrizes de negócio da empresa.
Antes do início do projeto, a 360 Suítes já possuía presença digital e operava com volume relevante de reservas, porém o site apresentava inconstâncias e falta de padrão. Como peso de títulos, textos e descrições.
O design era visualmente confuso, com excesso de cores, contrastes inadequados e pouca consistência entre telas, o que transmitia uma percepção amadora e desalinhada com o posicionamento que a empresa desejava alcançar.
Problema
- Falta de padronização em tamanhos de fonte.
- Espaçamentos de cards diferentes.
- Exagero no tamanho de alguns elementos.
- Falta de contraste nas informações em texto da hero section.
Solução
- Alteração do sistema de busca para um card vertical e adição de dois botões buscar por localização e selecionar edifícios.
- Padronização de elementos com base no desenvolvimento de design system.
- Proposta de design mais clean e profissional.
Meu papel como UX Designer
Atuei de ponta a ponta em todas as frentes do projeto. Minhas responsabilidades incluíram:
Condução de reuniões com stakeholders para levantamento de requisitos e definição de prioridades de negócio.
Tradução de objetivos estratégicos em soluções de UX e UI.
Estudo de mercado e benchmarking com players nacionais e internacionais, como Airbnb e Booking.
Criação de fluxos, wireframes, layouts de alta fidelidade e protótipos navegáveis.
Alinhamento contínuo com desenvolvedores, Product Owner, Tech Lead, time de suporte e diretoria.
Apresentação de soluções, coleta de feedbacks e ajustes iterativos, garantindo viabilidade técnica e cumprimento de prazos.
Pesquisa, Benchmarking e Padronização
Foi realizado um estudo aprofundado de mercado, analisando como grandes plataformas de hospedagem estruturam suas interfaces, e conduzem o usuário até a conversão.
O foco foi entender padrões consolidados de layout e aplicar as melhores práticas de design utilizando também heurísticas de usabilidade.
- Início do desenvolvimento do Design System, focado em padronização e escalabilidade do sistema.
- Design clean, profissional e atemporal.
- Uso reduzido de cores e contrastes excessivos.
- Maior clareza em preços, nome e endereço do apartamento e facilitação de escaneabilidade de outras informações relevantes.
Telas Finais
Com os componentes e tokens de design definidos, iniciamos a construção das telas finais no Figma, seguindo os requisitos mapeados e os wireframes. Todas as telas e fluxos de navegação foram projetados e detalhados de forma responsiva.
(Esse é um exemplo do arquivo no Figma com as telas divididas por etapas para facilitar o entendimento do fluxo e realiazação de handoff para os desenvolvedores)
O principal problema avaliado nesse card de apartamento, eram os ícones parecidos e sem nenhuma descrição, aumentando o esforço cognitivo dos usuários para tentar entender o que significava. Outro ponto também era a falta de informação clara sobre o apartamento e o corte na descrição.
Retiramos os ícones para colocar informações mais relevantes e de fácil entendimento com ícone+texto. Colocamos todas as comodidades disponíveis no apartamento em um modal que abre a partir do botão 'mostrar comodidades'.
