Saltar para o conteúdo

N.º 01

Use Case UX*

Um site para a GRIP., uma loja de skate e um grupo de skaters do Porto, concebido com a metodologia de design thinking.

Cliente
GRIP.
Ano
2021
Áreas
Design UX/UI, Design web

*a atualizar

GRIP. é uma loja de skate e um grupo de skaters do Porto. Começou no final dos anos 90 como uma pequena loja de roupa e de skates e não parou de crescer desde então.

SOBRE O PRODUTO

O objetivo era criar um site que partilhasse os valores da marca e a cultura do skate. Com esta plataforma digital, pretendiam aumentar o volume de vendas (loja online), tornar-se uma referência entre os skaters do Porto, reunir uma comunidade de skaters na cidade e, a médio/longo prazo, ter uma marca de roupa com coleções próprias.
A Grip quer diferenciar-se dos principais concorrentes pela proximidade aos clientes e pelo aconselhamento técnico na venda.

Portátil com a página inicial da loja de skate GRIP: um skater a meio de uma manobra sob «Skateboards with style», por cima dos destaques «In need of Support?» e «Learning to Skate?»

DESIGN THINKING

Neste projeto usei a metodologia de design thinking – o design thinking é uma metodologia que promove uma abordagem ao design centrada no ser humano. Ajuda a estimular o pensamento criativo e estratégias que levam os designers a criar produtos fáceis de usar, que ajudam a resolver um problema concreto.
Divide-se em cinco fases específicas:

- Empatia
- Definição
- Ideação
- Protótipo
- Teste

É importante notar que estas fases não seguem necessariamente um percurso único, definido e linear. As diferentes fases podem despertar novas ideias ou revelar novas descobertas na jornada do utilizador, que por sua vez inspiram novas iterações de fases já concluídas.

FASE 1: EMPATIA

Nesta fase inicial do projeto consultei especialistas na matéria – falei com as partes interessadas da GRIP e realizámos entrevistas a utilizadores – e mergulhei no ambiente físico da loja. Fiz uma análise da concorrência e estudei os produtos dos concorrentes para avaliar os seus pontos fortes e fracos.

FASE 2: DEFINIÇÃO

FASE 3: IDEAÇÃO

FASE 4: PROTÓTIPO

Wireframes (versão para computador)
Ao longo das várias etapas de design, usei wireframes de média fidelidade antes de desenhar um protótipo mais completo e funcional.

Wireframes inclinados, em tons de cinzento, do site da GRIP: página inicial, loja, carrinho, início de sessão, os workshops «Learning with the GRIP» e o processo de marcação «Technical Check-up»

FASE 5: TESTE

Animação num mockup de portátil que percorre a loja online da GRIP: página inicial, loja e filtro para principiantes, a página de produto de um Penny board e, depois, os passos de carrinho, início de sessão, morada, pagamento e validação