Recentemente, um desembarque tecnológico de especialistas do Grupo M.Video-Eldorado pousou no local do Product Camp Russia (& EE) 2021 do 10º aniversário . Foi um evento muito legal, brilhante e incomum para o nosso presente evento pós-pandemia.
Dezenas de gerentes de produto de empresas líderes de tecnologia se reuniram no local da conferência para compartilhar suas experiências com colegas de diferentes negócios e partes do planeta.
Um dos relatos mais brilhantes do encontro foi o discurso de Andrey Pchelintsev - Chefe de Produtos Principais "M.Video", que falou aos participantes do fórum sobre as peculiaridades do redesenho do site da empresa em termos de utilização da abordagem de produto.
A seguir vem a narração em primeira pessoa. Dúvidas, pensamentos, ideias e sugestões são aceitos nos comentários a esta publicação. Bem vindo a bordo!
Olá eu sou...
Olá a todos, sou ─ Andrey Pchelintsev, Chefe de Produtos Principais M.Video. Fazemos parte do Grupo M.Video-Eldorado , um dos 10 maiores vendedores de eletrônicos do mundo.
Os produtos CORE da M.Video-Eldorado são nove equipes de produtos trabalhando no site da empresa e no aplicativo móvel.
No contexto da crise provocada pela pandemia do coronavírus, nosso Grupo está se transformando de forma muito dinâmica, desenvolvendo ativamente canais online. Já temos mais de 50% de share online, o que exige muito do site e do aplicativo mobile.
O que é um produto e o que o redesenho tem a ver com ele?
Em todos os níveis de nosso negócio, nos esforçamos para praticar uma abordagem de produto. O que é, em teoria, está escrito em uma variedade de fontes (tyk, tyk, tyk). Mas, como se costuma dizer, "era bom no papel, mas eles se esqueceram dos desfiladeiros e andaram sobre eles". Com base neste artigo, gostaria de compartilhar com vocês minha experiência e os obstáculos preenchidos no processo de trabalho em projetos atuais.
Acredito que seja impossível desenvolver sistemas online complexos e modernos com foco na interação com o cliente fora da abordagem do produto. Portanto, o produto é o elo central em qualquer alteração que seja feita.
O que é um produto? Em nosso entendimento, um produto é uma experiência holística do usuário que é decomposta em quatro componentes:
- Certas funcionalidades técnicas;
- A combinação resultante de design e usabilidade;
- Preenchendo conteúdo;
- Monetização de longo prazo.
O redesenho do site é um passo estratégico, é um trabalho para mudar a aparência e funcionalidade do site. E o redesenho em si corresponde às características do produto e, na minha opinião, deve ser realizado no âmbito da abordagem do produto.
Quando um redesenho é necessário?
Obviamente, redesenhar é uma atividade muito séria e é importante entender por que é necessário, qual a razão disso. Na minha opinião, qualquer um dos parâmetros apresentados na ilustração abaixo, mesmo individualmente, pode causar um redesenho.
Novamente, qualquer um dos parâmetros acima pode levar a um redesenho.
Tínhamos o conjunto completo. O site não atendia a nenhum dos parâmetros e era uma barreira séria para o desenvolvimento de negócios online. Na primeira fase, atualizamos a interface do site.
Operação falhou!
Você sabe quantos redesenhos têm sorte? Quantos estão falhando? Mais de 85% dos casos de redesenho falharam!
Não há uma explicação única de por que isso está acontecendo. Para mim, explico isso pela enorme complexidade das mudanças que devem ocorrer e o "diagnóstico" incorretamente estabelecido para o redesenho.
Visto de fora, pode parecer extremamente fácil alterar o design do site, mas isso é verdade apenas para sites pequenos. O redesenho de um grande site como o M.Video é um sério desafio, pois existem dezenas de diferentes tipos de páginas, inúmeros elementos interconectados e os mais sérios requisitos de UI / UX.
Parece, de fora, o que é difícil pegar e fazer um redesenho ─ alterar o visual, elementos de estilo, fontes, etc., é possível alterar a funcionalidade em algum lugar ─ trabalho bastante padrão na alteração do produto.
Questões de pedido
Como você aborda um redesenho? Vamos dar uma olhada nas etapas principais e definir a sequência. Na minha opinião, tudo deve ser semelhante ao apresentado na ilustração abaixo.
Vamos examinar um pouco mais detalhadamente em ordem de magnitude. E compare os planos com o fato.
Portanto, à esquerda está uma ordem detalhada das etapas na ordem do redesenho. Tudo é mostrado aqui em etapas.
Vamos dar uma olhada em nosso caso à direita. Não somos únicos e no caso do nosso redesenho lançamos, é claro, torto.
Dividi todas as etapas em 3 áreas - vermelha quando fizemos tudo errado, amarela quando tentamos consertar tudo e verde quando fizemos bem. Acabei de entrar na empresa no final do bloco vermelho.
Não crie expectativas e conceitos de design sem analisar e moldar uma visão
Vamos falar um pouco sobre o estabelecimento de metas usando nosso exemplo. Tudo começou com o fato de que criamos as expectativas erradas, tanto em termos de dinheiro quanto de tempo. Além disso, não tínhamos uma compreensão da complexidade de mudar do site atual para um novo site e, portanto, não tínhamos uma estratégia para mudar para um novo site. Não tínhamos respostas inequívocas às principais questões:
- Como vai ser?
- Mudamos imediatamente o novo para o antigo ou fazemos página por página?
- Damos a oportunidade de mudar para o antigo, etc.
Inicialmente, não havia compreensão do redesenho em si. Mas já havia expectativas sérias superestimadas tanto em termos de dinheiro e tempo do processo quanto em termos dos recursos necessários.
Acabei de entrar na empresa nesta fase. Ainda me lembro do slide central de toda a apresentação sobre a venda de um novo site dentro da empresa, o fundo vermelho do preenchimento e os números brancos no incremento de vários bilhões de rublos desde a criação do novo site.
Claro, esses números estão diante dos olhos de todos há muito tempo e expectativas incorretas foram inicialmente criadas. Houve uma criação constante de alguns conceitos de design, sua edição e discussão, embora não houvesse análises normais, nenhuma pesquisa, nenhuma compreensão das dores dos usuários, nenhuma análise competitiva e, o que é muito importante, nenhuma visão.
Acredito que a visão é um elemento-chave na construção de um produto online e construir um produto na ausência de visão e estratégia é como navegar sem velas em uma direção desconhecida.
Nunca é tarde para começar a fazer as pazes
Após imersão na situação, ficou claro que:
A. Precisa ser corrigido;
B. O problema de mudar para um novo site era muito mais sério e era impossível permitir experiências diferentes do cliente por um lado e, por outro lado, não havia desejo de repetir o visual do site desatualizado.
À medida que mergulhamos em detalhes, analisamos e pesquisamos, uma abordagem foi escolhida - ir para um novo local por meio de um redesenho. O objetivo do redesenho foi o CJ mais perfeito para as páginas recém-criadas do site, ou seja, uniformidade:
- malha;
- fontes;
- elementos de estilo;
- elementos comuns (cabeçalho, rodapé, etc.);
- cores e outras coisas.
Uma estratégia básica de movimento foi escolhida. Além disso, foi formulada a visão e a estratégia de produto do site, que designou o "ponto B". Foi um elemento-chave que formou a imagem de um resultado único para todos os participantes do processo.
Mas ter uma visão, claro, é bom, mas ainda teve que ser plantado no conceito de design, de todas as formas possíveis de lobby, para defender o que se chama de “vender”.
Globalmente, em uma grande empresa, a fase de venda é uma fase fundamental, uma vez que existem expectativas de stakeholders de diferentes níveis, por um lado, e um grande número de interessados na funcionalidade, exibindo quaisquer elementos, por outro. E ligar todas essas expectativas e "desejos" entre si e também com a visão / conceito é uma tarefa absolutamente não trivial. Além disso, é importante não apenas vendê-lo uma vez, mas também manter as expectativas no futuro, sincronizando as expectativas.
Gastamos uma quantidade significativa de tempo nesta atividade, simultaneamente realizando pesquisa, desenvolvimento, ajustando o trabalho conforme necessário, já que muitos trabalhos estavam ocorrendo em paralelo devido a um início incorreto.
Mesmo que a "abertura" seja perdida, há uma chance de ganhar o "final do jogo"
Graças à zona laranja, onde “dirigimos” as etapas corretas, criamos uma visão, estratégia, conceitos, recebemos argumentos sobre como estávamos indo e iniciamos o desenvolvimento, fomos capazes de alinhar atividades progressivamente e abordar a última etapa de forma bastante correta organização do processo.
Estávamos sistematicamente prontos para a fase de pilotagem, conduzindo a pilotagem em fases, coletando métricas, validando a implementação, fazendo ajustes, se necessário, gradualmente nos aproximamos para lançar tudo corretamente para os alimentos.
Durante o trabalho, surgiram muitas curiosidades e insights, por exemplo, esquecemos algum objeto, mas o acompanhamento sistemático das métricas nos ajudou a dar conta de tudo.
Como entender que "deu tudo certo"? Veja as métricas!
O foco principal do redesenho foi voltado para a melhoria do processo de seleção. Nós não tocamos na cesta e check-out. Nossa métrica de linha de base, que inicialmente aprimoramos, foram as vendas online.
Outra métrica que examinamos inicialmente, é claro, foi a conversão total do processo de “seleção” para a cesta de compras e as microconversões por estágios de CJ. E, é claro, analisamos a verificação média. Essas são métricas de primeira ordem muito básicas; em geral, o número de métricas monitoradas excedeu várias dezenas.
Avaliação do utilizador
Além das métricas de negócios, as métricas de lealdade eram importantes para nós - NPS, CSI, que medimos usando o widget de feedback UX. O widget nos fornece dados quantitativos e qualitativos, o que nos permite receber informações em dinâmica.
Como recebemos centenas de milhares de respostas, todos os "outliers" estatísticos são suavizados, o que torna os dados bastante representativos. Agora, medimos o CSI em cada estágio da jornada do cliente, o que também dá um ótimo alimento para a mente.
Se você olhar essas métricas de acordo com os resultados do redesenho, então crescemos 15-25% dependendo da seção do site. Isso é muito considerando, novamente, que recebemos centenas de milhares de comentários e classificações de usuários. É muito difícil aumentar este indicador mesmo em 5%.
Não se esqueça das métricas técnicas
Observamos de perto a velocidade de carregamento do site. Aumentá-lo foi um dos objetivos do redesenho. Fizemos um redesenho nos "ossos" do antigo local, gradativamente incorporando um novo à infraestrutura. Como parte da atualização do design, a velocidade de carregamento também melhorou.
No e-commerce, a velocidade de carregamento afeta diretamente as principais métricas. De acordo com uma pesquisa da Amazon, cada 100 ms extras de downloads reduzem as vendas em 1%. O Google tem dados semelhantes - a cada 500 ms, eles reduzem a quantidade de tráfego em 20%. Também temos estudos internos onde essa dependência se expressa.
Durov, devolva a parede!
Você provavelmente pode adivinhar qual é a reação mais popular às atualizações? "Coloque tudo de volta como estava, seu novo e terrivelmente estranho." Isso geralmente é dito por 99,9% dos usuários ortodoxos. Faça o que fizer, ainda haverá pessoas que querem o "design antigo", tudo bem. É importante rastrear e responder corretamente ao feedback.
Normalmente, ao redesenhar, os usuários têm a oportunidade de retornar à versão anterior do site. Não fizemos de propósito. Em primeiro lugar, estávamos confiantes de que as soluções propostas são muito melhores para os clientes do que antes. É claro que se trata de "alucinações" na íntegra e é muito difícil prová-lo. Mas a pesquisa, as métricas que coletamos, confirmaram passo a passo que estávamos certos.
Em segundo lugar, implementamos uma série de mudanças técnicas que proporcionaram ao cliente uma melhor experiência de usuário. Terceiro, conforme o piloto foi sendo desenvolvido, analisamos o feedback do usuário. Qualquer redesenho é uma dor para o cliente. Normalmente, muitos usuários começam a se ressentir e pedir para devolver tudo como estava. Vimos que havia muito poucas mensagens desse tipo. Portanto, quanto mais avançamos, mais ousados nos tornamos em nossas intenções.
Nossas expectativas de métricas com base nos resultados do piloto eram estáveis, ou seja, nós, condicionalmente, queríamos ir “a zero” em termos de métricas. Mas as métricas do produto no final do piloto foram significativamente mais altas do que no site antigo, o que deu confiança no caminho certo.
Houve também um entendimento de que o formato, o design que existia, era inadequado. E com certeza vamos mudar isso. Portanto, decidimos que não ofereceríamos um retorno ao site antigo. Nesse caso, sairíamos do site antigo e finalizaríamos a interface. Foi uma jogada arriscada. Graças a Deus não tivemos que usar um pára-quedas reserva.
Muesli claro
Tendo passado pelo caminho espinhoso do caminho do antigo para o novo, gostaria de compartilhar brevemente com vocês pequenas teses que vivi em pleno desenvolvimento.
1. A velocidade e o design do site estão interligados.
2. Testes de usuário e ferramentas para rastrear o sistema operacional instantâneo dos usuários são a chave para o sucesso.
3. Faça o que fizer, ainda haverá pessoas que vão querer o "design antigo", isso é normal, você precisa ser capaz de obter feedback e responder.
4. Não há necessidade de esperar por um estado "ideal", implemente! Pelo menos para um piloto, fazer experimentos, coletar métricas ali, o estado ideal em ambientes de teste não é garantia de resultado.
5. Após a "conclusão do redesenho", o trabalho no redesenho não para.
6. As métricas são as melhores amigas do produto e da equipe.
Obrigado pela atenção!
ZY Ainda precisamos de programadores legais! Vá para uma reunião!