Landing Page

UIUX Designer

Akira ENEM

Complete redesign of the landing page focusing on content updates, improving the user experience, and increasing the perceived value of the platform.

Framer

Landing Page

SEO

Web Design

Project Overview

The previous landing page had inconsistencies between communication and the actual product. There were sections with “coming soon” and demonstrations of features that did not exist on the platform, which created misalignment and potential loss of credibility.

The goal of the redesign was to align promise and delivery, improve the user experience, and better structure the communication of the platform's actual features.

01 | The Problem

Why wasn't the landing performing strategically?

Apesar do interesse gerado nas redes sociais, não existia uma experiência estruturada que organizasse as informações de forma estratégica. O visitante entendia que se tratava de nutrição e treino, mas não compreendia claramente o diferencial, o método ou o próximo passo.

Confiança Fragmentada

As informações sobre formação, metodologia e serviços não estavam organizadas para construir credibilidade de forma progressiva.

Proposta de Valor Pouco Clara

O conceito de acompanhamento integrado existia, mas não estava estruturado visualmente para demonstrar sua força.

Conversão Única e Limitada

Não havia múltiplos caminhos de entrada para usuários com diferentes níveis de intenção.

02 | The Strategy

Redesigning for Coherence, Clarity, and Value

O projeto iniciou com uma etapa de briefing junto aos responsáveis pela Nutrian, com o objetivo de entender o modelo de negócio, os serviços oferecidos e o posicionamento da marca. A principal necessidade identificada foi transformar o site em um canal estruturado de aquisição, capaz de apresentar os serviços com clareza e direcionar o usuário para ações como contato ou compra.

Benchmark

A partir disso, foi conduzida uma análise de mercado para entender como outras marcas da área estruturam suas ofertas, comunicação e presença digital. Esse estudo permitiu identificar padrões, oportunidades de diferenciação e boas práticas aplicáveis ao projeto.

A análise mostra que a maioria dos concorrentes foca em nutrição esportiva, geralmente associada à performance ou emagrecimento isolado. Poucos estruturam uma abordagem integrada que combine alimentação, treino e acompanhamento contínuo.

A Nutrian se diferencia ao integrar nutrição e treino em um único sistema, oferecendo uma proposta mais completa e acessível para o público geral. O foco em transformação progressiva, aliado a uma comunicação mais humanizada e uma jornada digital estruturada, fortalece o posicionamento e potencializa a conversão de novos clientes.

Referências de Design

Durante essa etapa, foram buscadas referências visuais em plataformas como Dribbble e Behance, com o objetivo de explorar diferentes estilos e abordagens de layout. A partir dessas referências, foram selecionados elementos e seções específicas que serviram como base para a construção do design, permitindo combinar boas práticas e soluções já consolidadas no mercado.

Esses insights visuais orientaram as decisões iniciais de interface, que posteriormente foram estruturadas em wireframes com apoio de ferramentas de IA, possibilitando validar a organização das seções e a hierarquia das informações antes da execução final.

Direção Estratégica

Desenvolvi um guia de marca, definindo o posicionamento da Nutrian, as persona, a direção visual e o tom de voz, garantindo consistência entre identidade, conteúdo e experiência.

Posicionamento

A Nutrian é uma marca de transformação corporal que une nutrição e orientação prática para ajudar pessoas comuns a terem resultados sustentáveis, sem dietas extremas.

Persona

Direção Visual

A direção visual do projeto foi construída para transmitir leveza, naturalidade e acolhimento, com uma estética limpa, moderna e próxima da vida real. O verde é utilizado como base, representando saúde e equilíbrio, enquanto o roxo aparece como destaque, trazendo percepção de valor e transformação.

Tom de Voz

Foi definido um tom de voz acolhedor, simples e profissional, buscando criar conexão e segurança desde o primeiro contato. A comunicação parte de uma abordagem empática, mostrando que a pessoa não precisa passar pelo processo sozinha, respeitando seu ritmo e evitando qualquer ideia de extremos ou cobranças excessivas.

Ao mesmo tempo, mantém um posicionamento profissional, utilizando termos corretos, mas sempre explicados de forma clara e acessível, sem complexidade desnecessária. As mensagens são diretas, com frases curtas e objetivas, facilitando o entendimento e tornando a experiência mais leve, o que contribui para gerar confiança e aumentar a conversão.

Articles as a Strategic Differential

A Nutrian busca transmitir leveza, vida real e proximidade. Escolhi a Nunito para títulos por ser mais arredondada e trazer um acolhimento, e a DM Sans traz uma clareza e confiança. As cores já estavam definidas para a marca, então apenas defini as Gray Colors necessárias para complementar.

Arquitetura da Informação e Ideação

Com a estratégia definida, foi estruturada a arquitetura do site, organizando o conteúdo em múltiplas páginas. Antes da construção visual, foi definida a estrutura detalhada das páginas, organizando o conteúdo seção por seção e estabelecendo a ordem das informações, a narrativa e a distribuição dos pontos de conversão. Essa etapa permitiu validar a lógica de navegação e o fluxo de leitura antes da execução.

Wireframing e Estruturação de Layout

Os wireframes foram desenvolvidos com apoio de ferramentas de IA, permitindo explorar rapidamente diferentes possibilidades de layout. Essa etapa foi focada em validar a hierarquia de informação, o posicionamento de CTAs e a organização dos blocos, garantindo que a estrutura fosse clara e orientada à ação.

Articles as a Strategic Differential

Em breve estará disponível!

Updated and Trust-Oriented Landing Page

KIUNE

Design de posts e materiais físicos

Conteúdo

Redes Sociais

UI Design

UI

AKIRA ENEM

Redesign completo da Landing Page

Web Design

Landing Page

LP

Figma

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