O documento descreve os detalhes de projetos de interação e design visual para: 1) Uma nova loja Milon, incluindo a arquitetura e design. 2) Filtros de produtos em um site da C&A, com explicações sobre como os filtros funcionam e interagem com o usuário. 3) Planejamento UX para o branding da Schumann.

1. Interaction Design / UX / Visual Design
José Erick
Rio de Janeiro, 14 de abril de 2015

2. Arquitetura e Design nova loja MILON
Rio de Janeiro, 15 de dezembro de 2014

20. Filtros de Produtos – Projeto C&A
Rio de Janeiro, 23 de dezembro de 2014

21. Ao abrir a página o Menu de Filtros virá
aberto sem nenhum filtro aplicado.
O botão de “limpar filtros” aparece em
modo DESABILITADO.

22. Ao rolar a página o container é fechado
automaticamente e a barra de filtro volta a
sua configuração normal.
Enquanto o usuário não utilizar
nenhum filtro o botão permanece
DESABILITADO.

23. Ao passar o mouse na barra ela indica
interação no mouseover do botão.
A barra é preenchida pela cor do botão
esquerdo.
A seta vermelha indica a seleção do
botão/barra de filtros

24. Animação GIF Exemplo interação

25. Clicando na barra, o filtro é aberto
novamente e o usuário pode filtrar com
as opções indicadas.
Qualquer alteração de filtro, o botão de
“limpar filtro” entra em modo
HABILITADO.
Os produtos são filtrados
automaticamente e a parcial é indicada
logo abaixo.

26. Rolando a página ou clicando na barra
novamente, ela será fechada com as
alterações feita pelo usuário.

27. Clicando em “LIMPAR FILTROS”, a
página é atualizada sem os filtros e o
botão volta ao modo DESABILITADO.

28. Planejamento UX – Branding SCHUMANN
Rio de Janeiro, 10 de dezembro de 2014

30. Obrigado!