Muro: Apoiando criativos através de estratégias de UX Design
Como utilizei UX Design para dar voz e autonomia à produção artística independente.
Em alusão ao mais popular expositor de arte mundial, este estudo retrata o processo de desenvolvimento do Muro: marketplace de produções independentes, que propõe democratizar o cenário da arte contemporânea.
Mas qual é o problema?
Ao tratar do cenário da arte, é possível notar o desequilíbrio que privilegia a produção adaptada à lógica econômica de galerias, feiras internacionais e leilões focados no colecionismo, em detrimento da produção experimental, crítica e sobretudo independente, que acontece fora dessa zona de conforto.
O mercado de arte é talvez responsável pelas maiores movimentações financeiras do mundo, e enquanto os gigantes administradores desse fluxo elaboram estratégias para valorizar seus artistas representados, os criativos com pouco ou nenhum recurso precisam enfrentar a invisibilidade no nicho para se expressar à margem desse sistema.
Com a pandemia do Covid-19, o ritmo de produção e consumo de cultura despencou: o isolamento paralisou os eventos e derrubou o preço do mercado, dificultando ainda mais essa perspectiva.
Por outro lado, o crescente movimento digital catalisou um novo tipo de linguagem que incentiva a democratização da produção artística, aproximando o público e evidenciando um novo consumidor, através de alternativas como exposições, galerias e portfólios digitais, formação de coletivos e espaços independentes e popularização de sistemas de crowdfunding:
E como poderíamos promover visibilidade e gerar valor à produção independente nesse cenário?
Segundo estimativa da Hiscox de 2020, o futuro do mercado de arte se mostra positivo para as transações online, portanto, podemos pensar que uma plataforma digital direcionada para a produção independente poderia se popularizar nos próximos anos, democratizando a comercialização artística e promovendo o engajamento da cena.
Conhecendo o usuário
Levantamento de hipóteses
Analisando o cenário, pude esboçar algumas proto-personas e levantar algumas certezas, suposições e dúvidas para começar a encontrar oportunidades para solucionar esse problema:
Priorização
Dispus as hipóteses na matriz abaixo a fim de priorizar as de maior impacto e menor conhecimento:
Pesquisa quantitativa
Priorizadas as hipóteses, elaborei um questionário online sobre a relação dos usuários com a arte independente para encontrar oportunidades e conhecer melhor as minhas personas:
A pesquisa continua aberta e já foi respondida por 105 pessoas até o momento dessa análise. Pude validar (e não validar) as hipóteses levantadas como explico abaixo:
1. Ainda que não compre, há intenção de divulgar e apoiar a cena independente: validada
Oportunidade: Divulgar novas produções, atualizações e eventos para manter e aumentar o engajamento e interesse.
2. A interação social expande a rede de contatos e possibilita aumento das vendas: validada
Oportunidade: Divulgação de trabalho e interação digital para encorajar parcerias.
3. Ao observar resultados das vendas, o criativo iniciante ganha confiança e investe em profissionalização e divulgação: validada
Oportunidade: Investir em promoção de conteúdo técnico, profissionalizar e inspirar novos criativos para solidificar o movimento independente.
4. Aplicativo de celular funciona melhor para comprar e divulgar: não validada
Aqui fui surpreendida! Aprofundei melhor essa questão nas pesquisas qualitativas.
Pesquisa qualitativa
Para validar as hipóteses que ficaram vagas na primeira pesquisa, realizei a algumas entrevistas semi-estruturadas por chamadas de vídeo com 6 usuários de diferentes perfis e pude tirar os seguintes aprendizados:
- O tipo de dispositivo é realmente uma questão para esse tipo de comércio: precisa ser prático, permitir ver o detalhe e também dar segurança nas transações;
- Muitos entrevistados levantaram a questão da linguagem do aplicativo, que precisa conversar com o processo de criação artístico;
Clique para acessar a análise completa das pesquisas no artigo de UX Research desse estudo
Personas
Considerados os pontos levantados nas pesquisas, pude definir as personas, entender melhor suas necessidades e em quais momentos, lugares e de que forma elas poderiam utilizar o Muro como analgésico.
A princípio, existem dois possíveis perfis de usuários que poderiam se beneficiar com a plataforma:
- O comprador
- O vendedor
Entretanto, por não existir diferenciação entre quem pode vender e quem pode comprar, realizei o estudo com uma única persona que poderia transitar pelos dois perfis — o criativo:
Jornadas
Apesar da personalidade do João permitir que ele transite entre dois perfis de usuário, suas jornadas pela plataforma precisam ser determinadas para cada fluxo de tarefas que ele precisa realizar.
Elaborei então duas jornadas:
- A jornada do @ joaos, o criativo que quer cadastrar e vender seu trabalho artístico sem dificuldades;
- A jornada do João, o engajado que quer encontrar obras de artistas e criativos sem passar perrengue;
Destaquei em amarelo as etapas das jornadas que incluem os fluxos com as experiências mais negativas, determinadas para seguir nas próximas etapas de solução.
Também espelhei as jornadas na realidade dos #joãos através do storytelling da pixar:
Alternativas de solução
Para começar a idealizar o Muro, pesquisei sobre as plataformas atuais do mercado para entender o que já acontece e utilizar convenções para diminuir a carga cognitiva dos usuários.
Também aproveitei para fazer um benchmarking e entender de que forma o Muro poderia se se destacar.
Utilizei algumas plataformas como referência:
- ArtMajeur, Blombô e Art Ref funcionam como galerias virtuais, portanto concorrentes do mesmo segmento.
- Instagram é a rede social que melhor funciona atualmente como plataforma de divulgação para os criativos independentes e de pesquisa para os consumidores.
- Enjoei como referência em marketplace de produtos, onde cada usuário cria sua própria “lojinha”.
A partir dessa análise, comecei a levantar algumas alternativas de solução através da técnica do Como Poderíamos:
- CP intermediar as vendas e proporcionar interação entre usuários ao mesmo tempo?
- CP engajar os usuários a utilizar uma nova plataforma em vez das grandes existentes?
- CP promover divulgação e comodidade aos criativos com menos recursos?
Selecionei algumas alternativas e priorizei as mais assertivas, simples e relevantes através da matriz de impacto x esforço abaixo (em destaque) para começar a desenvolver em um primeiro momento:
Lembrando que essa priorização deve ser revista e alinhada com o time de desenvolvedores.
Ideação
Priorizadas as alternativas de solução, foi hora de colocar a mão na massa e começar a desenhar algumas possibilidades para o Muro.
Comecei pelo esboço em 4 etapas: anotei algumas ideias, desenhei como isso poderia funcionar, fiz alguns crazy 8's meio bagunçados até chegar em um esboço que me pareceu mais adequado pra seguir com os fluxos.
Estrutura
Para estruturar as informações e as interfaces da plataforma, tomei algumas decisões baseadas nas alternativas priorizadas, como:
- App Mobile first, buscando trazer a praticidade do dispositivo para o uso diário, definir o conteúdo mais relevante e deixar o design responsivo;
- Timeline personalizada com posts de trabalhos à venda e conteúdo informativo;
- Perfil do usuário como a própria galeria virtual (“lojinha”);
- Interação entre usuários: seguir, curtir, comentar, compartilhar;
- Divulgação gratuita e intermediação de compra e venda com comissão;
- Publicação catalogada: controle de estoque, ficha técnica e documentação;
Fluxo dos usuários
Nesse momento foquei em 3 fluxos principais (em destaque na jornada dos usuários):
- Fluxo de onboarding (ambos os #joãos):
- Fluxo de compra (João, o engajado);
- Fluxo de criação/publicação (@ joaos, o criativo);
Prototipação
Papel
Montei o protótipo de papel na marvel e realizei os primeiros testes para validar minha lógica e me familiarizar com as reais necessidades.
Curiosidade: Montar este protótipo foi um processo bem interessante pois utilizei uma colagem de papéis para reaproveitar elementos que foi até mencionada no instagram do UX Unicórnio como exemplo de escalabilidade e reutilização fora do contexto digital! Obrigada Leandro!
Apesar da interface de baixa fidelidade, os primeiros testes já me trouxeram alguns aprendizados, como:
- Deixar a hierarquia de funções mais claras;
- Botões com textos auxiliares;
- Simplificar os fluxos, principalmente o de publicação;
Wireframes
Depois de algumas versões frustradas, refiz os wireframes no Figma com as marcações de texto e elementos. Os testes que fiz com as versões anteriores me trouxeram alguns aprendizados que pude espelhar nas telas:
- Dar mais destaque aos botões CTA, além do contraste;
- Colocar textos mais curtos e alinhar a linguagem;
- Aumentar as fontes e tamanho dos elementos;
Alta fidelidade
A partir da elaboração mais assertiva dos wireframes e análise dos testes, pude inserir os conteúdos, elementos e cores para montar o protótipo de alta fidelidade:
Teste de usabilidade com Maze
Inseri este protótipo no Maze para realizar os testes de usabilidade e entender se minhas decisões estavam realmente ajudando os usuários a completarem suas tarefas.
Defini duas missões principais:
- Fazer o cadastro e comprar uma fotografia em promoção;
- Criar uma publicação para vender um trabalho;
14 usuários realizaram os testes: 9 completaram a primeira tarefa, 6 completaram a segunda tarefa e 2 desistiram. Essa quantidade de testes permitiu entender os erros mais comuns do design para melhorar a experiência dos usuários:
Análise de heatmaps e testes A/B
O Maze é uma ferramenta incrível que analisa o caminho principal que você determina pra cada tarefa (golden path) e te dá um relatório completo de usabilidade baseado em KPIs como taxa de sucesso, rejeição, duração da tarefa e misclicks em cada uma das telas.
Propositalmente, eu desenhei as telas do fluxo de compra com botões primários e as telas do fluxo de publicação com botões de texto, para fazer um teste A/B discreto e ver o que funcionaria melhor. O resultado foi nítido: os botões primários ganharam de lavada!
Analisei também as telas com maior taxa de erros para revisar e melhorar a experiência com o Muro, e apesar dos erros, os números foram bem positivos:
- Missão 1: média de 1,2 segundos por tela e taxa de 2,5% de cliques errados (boa);
- Missão 2: média de 3,1 segundos por tela e taxa de 22,5% de cliques errados (muito alta);
Design System
Segui a metodologia do Atomic Design para criar elementos reutilizáveis a fim de padronizar as telas, reduzir a carga cognitiva do usuário e facilitar as eventuais alterações. Também busquei deixar o design responsivo, permitindo adaptá-lo a diferentes formatos.
Escolhi o tema escuro, que por ter uma luminosidade menor, não agride os olhos em ambientes mais escuros. Trouxe o amarelo (quase laranja) para a marca e cores primárias devido ao bom contraste com o fundo escuro em diferentes escalas de luminosidade.
Utilizando a psicologia das cores, o amarelo pode remeter a energia, riqueza e diversão. Mas também pode trazer interpretações negativas como agressividade e perigo. Somente os testes poderão nos responder!
Padrões de texto
Os testes foram me permitindo consolidar o tom de voz que utilizei nos textos: divertido, casual, respeitoso, direto e popular.
Algumas palavras ainda estão sendo testadas, mas com os testes realizados já foi possível deixar as funções mais claras para ajudar os usuários a completarem as tarefas.
Busquei deixar os textos legíveis e concisos, tentei evitar expressões muito técnicas e utilizar da hierarquia de tamanhos, pesos e cores para reduzir o esforço de leitura.
Ainda não cheguei na prototipação dos estados vazios, mas gerenciei as expectativas dos usuários com mensagens de erro e caixas de indicação de páginas ainda em construção dos ícones visíveis que ainda não são clicáveis.
Em andamento!
Este estudo está em constante atualização, conforme vou definindo estratégias e aprendendo novas ferramentas e metodologias, fique de olho!
Próximos passos
Dentre os próximos passos estão:
- Atualizar o protótipo com os aprendizados retirados dos testes de usabilidade e testar novamente!
- Cardsorting, para identificar as categorias e montar um cadastro específico para cada tipo de obra e o fluxo de busca;
- MVP e captação de artistas para uma versão beta;
- Landing Page e funil de métricas piratas (AARRR) para avaliar o interesse do público e partir para as estratégias de marketing;
Após a validação desses fluxos, seria interessante explorar as demais etapas da jornada e recursos que requerem maior esforço mas também podem causar grande impacto dentro desse contexto, como:
- Recursos: Criação de blog semanal, exposições virtuais, pacotes de serviços por assinatura, parceria com fornecedores e espaços independentes/ instituições;
- Funcionalidades: Chat, Formulários específicos para adicionar obras de cada categoria, edição de perfil, dashboard de vendas;
- Métricas: Indicadores de performance (KPIs), CTR + Eyetracking e mais testes A/B para melhorar a experiência dos usuários e definir os objetivos, prioridades e acompanhar o desenvolvimento de cada etapa.
Como meu primeiro estudo de caso, saí do zero e posso concluir que estou aprendendo bastante sobre todo o processo de UX Design!
Agradeço à mentoria e suporte do Rafael Frota, Leandro Rezende e toda equipe UX Unicórnio que viabilizou a estrutura para realizar este estudo, à Carolina Gancev pelo apoio e inspiração para começar e muito obrigada a você por chegar até aqui :)
