top of page

Prime Video Redesign

Cover Prime Video - Head.png

Meu cargo

Product Designer

Objetivos

O objetivo deste projeto é realizar um estudo completo para propor quaisquer modificações de design ou propor alguma nova funcionalidade em um produto/site já conhecido. Este produto deve se concentrar na interface web/desktop e você pode escolher um site mais complexo ou um software/aplicativo web.

Solução

Redesenho da página principal e do conteúdo da série e do filme.

Método Usado

Amazon Prime - Method-01-01-01.png

Secondary Research

Antes de tudo, fiz pesquisas secundárias para entender os problemas disponíveis no amazon prime e depois fiz algumas hipóteses que descobri depois se eram ou não com os problemas do usuário ao longo do processo.

Amazon Prime Video

Um serviço da amazon de streaming com produções originais de estúdios amazon e conteúdos exclusivos produzidos por outros canais. Disponível desde 2006 como assinatura Prime. Hoje tem cerca de mais de 150 milhões de assinantes em 2020, espalhados por todo o mundo, exceto Irã, China Continental, Coréia do Norte, Síria e Cuba.

O serviço principal contempla mais do que uma plataforma de streaming, são livros, músicas, frete grátis e algumas vendas exclusivas.

Reviews

Li algumas reviews em três plataformas: na própria Amazon, a Trustpilot e o Reclame Aqui. Em geral, as reclamações foram sobre compras não autorizadas, cancelamento de conta e problemas de acesso na plataforma, a qualidade do som e a quantidade de filmes antigos, somando-se à publicidade dentro da plataforma mesmo que seja comprada. Mas na Amazon, há comentários como este:
Comment 01.png
''I have been using products on TV and cell phones, I find it little interactive, sometimes I want to watch something and it is confusing to identify new programming from old, everything is mixed up and I end up spending more time trying to find something than watching it.
In Echo, it's even easy, when asking to open the APP, some recommendations come and I end up watching some of those.''

Benchmark

Eu comparei os dois grandes concorrentes da Amazon (e também a própria Amazon). Analisei principalmente o que os usuários consideram de positivo e negativo em cada uma dessas plataformas de acordo com a Trustpilot e Reclame Aqui, seu rate e o que precisava ser corrigido de acordo com os Princípios da Norman.
Amazon Prime - Benchmark-01.png

Análise Heurística

Essa análise me ajudou a entender tecnicamente o que a plataforma tem que precisa ser aprimorada e com isso, também pude gerar hipóteses para validar ou não após a pesquisa quantitativa e qualitativa aplicada.
Amazon Prime - Heuristic Analysis-01-01.
Amazon Prime - Heuristic Analysis-01-02.
Amazon Prime - Heuristic Analysis-01-03.

Survey

Não descobri o perfil do usuário durante minha secondary research (foi bem difícil), além disso, tive algumas hipóteses, mas apliquei uma pesquisa para entender um pouco do perfil do usuário e também sobre os quandos e comos. Foi respondido por 8 usuários. Isso me ajudou a conhecer melhor o tipo de usuário que eu precisaria para recrutar para a entrevista.
A maioria dos problemas dentro da plataforma eram sobre a interface, divisão e publicidade.
Amazon Prime - Survey Data-01-01-01.png

Entrevistas

As entrevistas foram aplicadas com 4 usuários com perfil definido de acordo com os dados coletados da pesquisa.
Liferay - Entrevistas e teste de usabili
Eu os entrevistei usando o zoom e gravei com a aprovação do uso de dados. Após esse processo transcrevi cada entrevista e tageei as partes principais que destacavam seus problemas e depois comparei para entender os problemas comuns em torno do vídeo principal. Abaixo você pode ver essas tags:

Teste de Usabilidade #1

Fiz testes de usabilidade com esses quatro usuários para ver como eles usavam a plataforma e também para ver se condizia com o que falaram na entrevista.
Para isso, dei a eles uma tarefa:
'' Pesquise na página principal uma série de comédia ou filme que você nunca assistiu e clique nele e no final me diga se gostaria de assistir ''

Os principais problemas no teste foram em torno de:

 

  • O conteúdo exibido na página principal;

  • Falta de categorias;

  • Eliminação dos botões e a seleção de temporada;

  • Falta de pausas na página principal

  • Problemas de slides.

Hipóteses

Então, resolvi fazer uma planilha com a hipótese que eu tive que validar de acordo com o que os usuários falaram nas entrevistas e na pesquisa.
Hypothesis.png

Estabelecimento do Problema

Com a validação da hipótese e todos os dados coletados nas entrevistas, pude analisar e sintetizar tudo para estabelecer o problema.
Os usuários não encontram conteúdo e em um curto período de tempo no amazon prime video, ficam confusos e frustrados durante a navegação.

Pain points:

 

  • Informações exibidas na página principal;

  • Ausência de breaks entre os conteúdos;

  • Destaques que precisam chamar mais atenção;

  • Mais acessibilidade;

  • Repensar a estrutura da arquitetura da informação;

  • Adicionar configurações às legendas;

Personas

Amazon Prime - Personas-01.png
Amazon Prime - Personas-02.png

Mapa da Experiência

Os usuários falaram muito sobre os demais concorrentes nas entrevistas paralelamente aos problemas da plataforma Prime Video, por isso achei que o mapa de experiência me ajudaria a analisar melhor os pontos de contato, sentimentos, expectativas, ações e dúvidas no caminho do usuário antes do decisão de compra, durante e após o uso para ter uma visão holística da experiência, não apenas do processo de uso.
Amazon Prime - Experience Map-01-01.png

Arquitetura da Informação

Com esse mapeamento, comecei a desenvolver minha arquitetura de informação analisando o estado real e depois fiz algumas mudanças no que os usuários disseram e nos problemas que relataram. O principal problema disso era a página principal e a aba de categorias, que não existe.
Amazon Prime - Information Architecture-

Moodboard & Style Guide

Moodboard - 1.png
Amazon Prime - Style Guide.png
Amazon Prime - Style Guide.png

Wireframes

Main Page Front-01.png
Main Page Back-01.png
Series-01.png
Movie-01.png

Visual Design & Protótipo

Usei o Figma para criar um design visual e também o protótipo, clique aqui para experimentar.

Concentrei-me em criar quebras entre as seções, criação de categorias na guia série e guia filmes um novo menu de usuário, destaques de originais amazon e conteúdo de canais, uma parte dedicada a um conteúdo de usuário '' personalizado '' como Minha lista, Visto pela última vez e você pode gostar, por exemplo.

Também mudei muito a exibição da série e do filme para ficar mais fácil de entender, dividir, com mais acessibilidade (principalmente no tamanho das fontes) e com as informações destacadas nos lugares certos e não ao mesmo tempo.

O display de vídeo também sofreu algumas alterações para ficar mais limpo e seguir com o novo padrão de visual desenvolvido. Então eu coloquei as legendas com vários controles, mantive o X-Ray e coloquei os 10 segundos também.

Prime Video - First Scree Mockup.png

Teste de Usabilidade #2

Fiz um teste de usabilidade para validar ou não as melhorias que fiz, para ouvir os usuários e entender se a direção do projeto resolve seus problemas. Para isso, usei o zoom, para coletar esses dados.
A tarefa que dei foi:
'' Navegue pela plataforma e escolha algum filme ou série dramática, depois assista.''
Os problemas da experiência em torno da navegação, localização de conteúdo, acessibilidade, arquitetura da informação, quebras de conteúdo na página principal e configurações de legendas foram em sua maioria resolvidos, mas precisam de alguns pontos a serem melhorados. Além disso, as consequências dessa melhoria geraram um sentimento positivo dos usuários e um bom feedback, afinal, alguns deles disseram que poderiam passar mais tempo por se tratar de conteúdo '' mais organizado ''. Portanto, os objetivos do negócio também foram cumpridos.

Ajustes

Após o teste de usabilidade aplicado e etiquetado, criei os novos pontos problemáticos que mais foram comentados e o que fazia sentido com os dados coletados.

Pain points:

  • Um botão de voltar na exibição de séries e filmes;

  • Ajuste de X-Ray;

  • Diminuir o tamanho do botão de pausa/reprodução na exibição do vídeo;

  • Uma cena em modo hover ao mover no tempo do vídeo.

Protótipo Validado

Fiz os ajustes também no Figma, clique aqui para testar.
Mockup 3.png
Mockup 2.png
Mockup 4.png
Navegação através do protótipo

Conclusão

Foi interessante entrevistar um perfil diversificado de usuários que tantas coisas diferentes para dizer, mas ao mesmo tempo próximas umas das outras opiniões. Aprendi muito com os usuários e com o conhecimento ao longo do caminho, estudando e aplicando novas técnicas e ferramentas para mim.
Fiz as melhorias pensando no usuário e nos objetivos da Amazon, assim como queria aumentar e fortalecer a marca do prime com o icônico e não utilizado botão de play de círculo azul.

Obrigada :D

bottom of page