UX/UI • 2020

E-commerce para empresa de paisagismo

Visão geral

A Plantiar é um empresa recifense que oferece produtos e serviços no segmento de paisagismo.

Este é um projeto experimental e exploratório com o intuito de entender o que a empresa oferece e o seu público, buscando soluções para a venda de seus produtos online.

Problema

A empresa possui loja física, mas não tem um modelo sólido de venda online, utiliza apenas alguns recursos do aplicativo WhatsApp Business. Deixando de atuar em um espaço existente no mercado e sofrer limitações nos negócios durante a pandemia.

1/4

Pesquisa

Reunião inicial com os diretores

O objetivo dessa etapa do processo foi entender junto com a parte interessada, quais seus produtos e serviços, quais os objetivos de negócios, o atual posicionamento de marca e o que eles sabiam sobre seus clientes. Fizemos juntos algumas atividades como: User Centered Canvas e Proto-Persona.

Entrevista com usuários

Com objetivo de confirmar as suposições dos diretores, descobrir comportamentos e explorar as preferências e frustrações dos usuários nas suas experiências com plantas e compras online, as entrevistas foram realizadas com dois grupos.

O primeiro grupo com 04 pessoas entre clientes e potenciais clientes, baseadas na proto-persona. Elas precisavam atender três requisitos: gostar de paisagismo, possuir plantas e fazer compras online.

O segundo grupo com 03 pessoas que não tinham muita experiência com plantas, mas que gostariam de ter. Esse segundo grupo foi escolhido para descobrir outros comportamentos, com menos viés em comparação com quem já tem experiência com plantas.

Card sorting

Esse exercício foi escolhido para entender o que os usuários sabem sobre essa categoria de produtos, e como eles as dividem, ajudando a construir a arquitetura da informação.

Análise de competidores

Foram analisados cinco e-commerces competidores (diretos e indiretos) para descobrir pontos fortes e fracos.

Questionário online

A intenção primaria do questionário foi buscar dados quantitativos, mas também aprender mais sobre os clientes que não foram entrevistados, através de perguntas abertas como:

"Quais expectativas você teria ao entrar em um site ou aplicativo de paisagismo? O que você gostaria ou esperaria ver?"

"Qual a parte mais difícil em compras online?"

2/4

Síntese

Mapa de afinidade

Nessa etapa o objetivo foi agrupar similaridades em comportamentos, preferências e frustrações dos clientes.

Com intuito de organizar todas as descobertas e encontrar os pontos mais "quentes" da pesquisa.

Formulando questões

Questionamentos chave foram formulados para serem respondidos na próxima etapa do projeto, utilizando a técnica "How Might We".

3/4

Ideação

Respondendo questões (HMW)

Exercício realizado com uma participante convidada, no intuito de explorar possíveis soluções para problemas e expectativas dos usuários, descobertas durante a pesquisa.

Matriz 2x2

Pensando em um mínimo produto viável, foi feito um exercício de priorização com o auxílio de uma desenvolvedora. Avaliando assim, a viabilidade de desenvolvimento das possíveis soluções e o valor para os usuários.

4/4

Implementação

Fluxo de tarefas

Antes de estruturar o conteúdo, decidi entender e mapear as principais interações que os usuários vão ter na interface.

Mapa do site

Baseado nas necessidades do fluxo de tarefas e nos resultados da pesquisa, como no exercício card sorting, iniciei o estudo da arquitetura da informação a partir do mapa do site.

Wireframe

Para explorar e visualizar possíveis soluções de design de forma rápida, antes de partir pra alta fidelidade, recorri ao papel e caneta, como de praxe, fazer Wirefremes.

Guia de estilos

As decisões sobre tipografia e cores foram baseados na identidade visual da marca (existente) para manter consistência visual.

Esses elementos foram trabalhados para aplicação web, e a estrutura da interface baseada em grid e espaçamentos usuais (padrões de design).

Também foi checado pontos básicos de acessibilidade e usabilidade, adicionado/ajustando alguns elementos necessários, como cores de interação e sistema.

Design de Interface Web (UI)

Próximos passos