top of page

Visão geral do projeto:

Esse projeto envolveu a criação de um website responsivo, onde eu utilizei as pesquisas sobre o usuário já existentes e apliquei principios de UI ( como o Enriquecimento progressivo ) para criar uma interface consistente experiencia intuitiva mesmo em Computadores de mesa, tablets e nos smartphones

Papel:

Designer exclusivo de UX/UI

Tipo de projeto:

Design responsivo para web

Desafio do projeto:

Projetar um protótipo responsivo da Web do aplicativo Carpoolz

Metodologia:

Como designer de UX, criei um site responsivo do Carpoolz usando pesquisas existentes. Projetei e iterei wireframes para vários tamanhos de tela, garantindo UI consistente e usabilidade em todos os dispositivos.

Lembrando da nossa persona principal

Lembrando da persona

Ronaldo Perfil Pic.jpg

Idade : 34

Educação : Alguns cursos superiores

Cidade natal : Chicago

Família : Esposa e 2 filhos

Ocupação : Empreendedor

Problema identificado: Ronaldo, um pequeno empresário com uma agenda flutuante, precisa de uma solução confiável para garantir que seus filhos cheguem em casa com segurança quando as reuniões atrasam.

Metas

Quer buscar as crianças na escola todos os dias;

Garantir a segurança dos seus filhos.

Frustrações:

Expressa ocasionalmente frustração com os horários dos ônibus Não tem grande literacia digital

Iniciando o design:

Wireframes (Estrutura de arame)

Mantivemos o design consistente, mas eu queria ter certeza extra de que ele ficaria bem em telas maiores. Então, fiz alguns wireframes para testá-lo e garantir que a experiência do usuário fosse suave, não importa o tamanho
Designs de tablets
( 1280x800 )
Menu de login Wireframe.jpg
Menu de login
Menu carpool.jpg
Menu de carona
Main menu.jpg
Menu principal
Menu Bus.jpg
Menu de ônibus
Designs de desktop
( 1920x1080 )
Login.jpg
Menu de login
Menu principal desktop.jpg
Menu principal
Menu de carona.jpg
Menu de carona
Perfil do motorista.jpg
Menu de carona

Após a fase de projeto inicial, os primeiros wireframes digitais foram concluídos

Wireframes de tablet (digital)
Menu de login.png
Log-in
Menu principal do tablet 2.png
Menu principal do tablet 1.png
Menu principal
Menu de carona.png
Menu de carona
Horário de ônibus.png
Menu de ônibus
Drivers profile.png
Perfil do motorista
(Digital) Wireframes de desktop
Menu de login da área de trabalho.png
Menu de login
Desktop main menu 1.png
Menu principal desktop 2.png
Menu principal
Menu de carona desktop.png
Menu de carona
Menu de ônibus desktop.png
Menu de onibus
Drivers profile desktop.png
Perfil do motorista
Projetado com consistência, mantendo o que já era uma ótima experiência e expandindo-a

Transformando os wireframes nos designs finais

Primeiro, os designs dos tablets
Login do tablet final.png
Conecte-se
Menu principal 1.jpg
Menu principal.jpg
Menu principal
Horário de ônibus.jpg
Horários de ônibus Menu
Carona final.png
Menu de carona
Perfil dos motoristas.jpg
Perfil do motorista
Então, os designs de desktop
Menu de login.jpg
Menu de login
Menu principal 1.jpg
Menu principal 2.jpg
Menu principal
Horários de ônibus.jpg
Rotas/Horários de ônibus
Menu de carona.jpg
Menu de carona
Perfil dos motoristas 1.jpg
Perfil dos motoristas 2.jpg
Perfil do motorista
Agora, uma das coisas mais importantes sobre este projeto, ou a mais importante, as conclusões
Takeaways

Aprendi que, embora o design possa permanecer o mesmo em projetos web responsivos para criar uma experiência consistente em todos os dispositivos, há alguns elementos que mudam devido ao layout (por exemplo, de dispositivos móveis para desktop).

Obrigado !
por ler meu projeto

© 2025 por Renatto Inazawa
Toda glória a Deus!

bottom of page