Desbloqueando a criatividade do dançarino por meio da música - um estudo de caso do Spotify.

Introdução

A música para dançarinos é essencial porque realça os movimentos de dança com batidas rítmicas e letras. Dançar ao som da música permite que os dançarinos demonstrem seus sentimentos e emoções. O Spotify é a ponte que conecta os dançarinos à música, já que o Spotify é a principal plataforma de streaming de áudio do mundo, com mais de 433 milhões de usuários.

Como usuário e dançarino do Spotify, uso o Spotify por vários motivos. Seja ouvindo música para dançar, encontrando novas músicas para dançar ou coreografando músicas, a fonte de todas as minhas músicas vem do Spotify.

Um aspecto que valorizo ​​como bailarino é a criação de coreografias. Para quem não conhece o termo, coreografia é a sequência intencional de movimentos criados pelos bailarinos para expressar sua criatividade. No entanto, quando uso o Spotify para coreografar, achei muito limitante porque não conseguia ouvir música como queria.

Identificando o problema entre coreografia e Spotify

Portanto, meu problema inicial que pensei ter no Spotify era:

Quando estou no Spotify, quero coreografar a música, para que eu possa efetivamente fazer uma peça de dança e expressar minha liberdade criativa

Mas não posso fazer isso bem porque:

1. O Spotify não permite que eu manipule a música

2. Não consigo encontrar uma música que combine com o que estou sentindo para criar a coreografia

Para saber se outros bailarinos têm o mesmo problema, realizei entrevistas com outros bailarinos que têm experiência coreográfica que defini como tendo coreografado pelo menos 3 peças.

Pesquisa do usuário

️‍♀️Entendendo como os dançarinos coreografam com o Spotify

Em minhas entrevistas, pedi aos usuários que me explicassem como usam o Spotify para coreografar. Aqui estão alguns insights que aprendi:

1. O Spotify faz um ótimo trabalho ao recomendar e ajudar os dançarinos a encontrar músicas para coreografar

O Spotify me ajuda a escolher músicas para coreografar por meio de seu recurso de lista de reprodução aprimorada

2. Os dançarinos precisam fazer um loop constante e ouvir as músicas repetidamente antes de criar movimentos no Spotify

Eu tenho que ouvir a música várias vezes antes de coreografar

Eu ouço uma música como um louco antes de coreografá-la

3. Os dançarinos usarão outras ferramentas fora do Spotify para recursos que os ajudem a coreografar.

Não consigo editar a música no Spotify

Além do Spotify, utilizo o recurso de velocidade de reprodução no YouTube

Eu uso o Garage Band para repetir seções nas músicas

O Verdadeiro Problema

A partir desses insights, percebi que o Spotify realmente faz um ótimo trabalho para a preparação da coreografia. Sendo assim: procurar novas músicas, encontrar uma música para coreografar e ouvir constantemente essa música.

No entanto, também me ajudou a identificar que o problema ocorre no próprio processo de coreografia. Ao ouvir uma música para coreografar, os dançarinos gostariam de repetir certas seções da música, ouvir especificamente as diferentes camadas da música, desacelerar a música, reverter apenas alguns segundos de volta à sua seção. Esses recursos não estão no Spotify e, portanto, descobri que muitos dançarinos usam outras ferramentas, como YouTube, Garage Band e iMovie, para utilizar esses recursos.

Portanto, meu verdadeiro problema era:

Quando estou no Spotify, quero coreografar a música, para que eu possa efetivamente fazer uma peça de dança e expressar minha liberdade criativa

Mas não posso fazer isso bem porque:

1. O Spotify não permite que eu manipule a música

2. Estou restrito a como posso ouvir música no Spotify

✂️A solução: modo de segmento

Minha solução para resolver esse problema foi criar o Segment Mode, um novo recurso no Spotify que permite aos usuários controlar o que querem ouvir e ajudar os coreógrafos a criar movimentos de dança de maneira eficaz para expandir sua criatividade.

O modo de segmento permite que os usuários “segmentem” as seções das músicas que desejam ouvir.

Fluxos Finais:

Como cheguei a esta solução

Chegar a essa solução exigiu que eu realmente entendesse qual parte do processo de coreografia era importante para integrar ao Spotify. Para entender isso, recrutei dois amigos incríveis, Llorenz e Matt, para debater possíveis soluções.

Brainstorming

Depois de organizar diferentes perguntas “How Might We” que abordam diferentes aspectos do Spotify no processo de coreografia e identificar diferentes espaços de solução, fiquei com 3 soluções possíveis. Com cada solução possível, conduzi uma análise SWOT, uma análise de viabilidade/impacto e explorei telas de baixa fidelidade.

1. Recurso de volta de 5/10/30 segundos

2. Adicione carimbos de data/hora à música e faça um loop entre eles

Nesse recurso, os usuários poderão editar o carimbo de data/hora da música para criar seções de uma música. A partir daí, os usuários podem reproduzir a seção com um botão de loop.

3. Gerando timestamps para certas seções da música.

Nesse recurso, o reprodutor terá seções na música que indicarão onde estão os versos, refrão, pontes, etc. Os usuários podem visualizar essas seções tocando na seção ou quando o indicador de depuração passar pela seção.

Escolher uma solução

Depois de considerar cada método de análise e examinar os prós e contras de cada solução em potencial, selecionei: 2. Adicione carimbos de data e hora à música e faça um loop entre eles.

Achei que esse recurso seria o melhor avanço porque permite aos usuários manipular a música e cria novas oportunidades de como eles podem ouvir música no Spotify enquanto coreografam. Os usuários poderiam manipular a música por meio desse recurso, editando onde desejam começar a ouvir determinadas seções da música. Eles também podem ouvir músicas de maneira diferente por meio desse recurso, podendo ouvir músicas em diferentes pontos de partida.

Ao tomar essa decisão, também considerei as respostas em minha pesquisa com usuários e vi que muitas pessoas afirmaram a importância de um recurso de loop durante a coreografia. Esse recurso é melhor do que outros devido à sua capacidade de criar uma nova experiência de audição para os coreógrafos, pois permite que eles ouçam claramente uma seção de uma música continuamente, em vez de retroceder toda vez para ouvir essa seção.

‍Desenhando minha solução‍

Para integrar essa solução aos projetos existentes do Spotify, observei como outras plataformas gravam o áudio.

O que há no mercado:

Percebi que quando os áudios precisavam ser encurtados, eles estavam em formato de onda . O Spotify já possui ondas em seu design que podem ser vistas em seu logotipo ou no compartilhamento de músicas. Portanto, mudei meu design em minhas telas de baixa fidelidade para ser mais relevante para esses designs existentes. Além dessas mudanças, também identifiquei requisitos de funcionalidades importantes para minha solução:

1. Ponto de entrada no recurso
2. Capacidade de ajustar a duração do tempo
3. Uma maneira de parar e continuar ouvindo música
4. Uma maneira de ver onde na música você está ouvindo
5. Um recurso de loop
6. Informações sobre a música que está tocando

Decidi nomear essa solução como “Modo Segmento” para permitir que os usuários segmentem músicas. Para mostrar esse novo recurso, tive que criar um ícone que representasse o que o “Modo Segmento” faz. Escolhi criar um ícone de tesoura porque é um ícone comum associado à edição.

Depois de estabelecer um ícone que funcionará como ponto de entrada, tive que determinar diferentes locais no layout do Spotify para integrar este ícone:

Ter o ícone de tesoura no local A estava em meus designs iniciais por causa da uniformidade da barra inferior (2 ícones de cada lado). No entanto, depois de considerar que o ícone ao lado da barra de tesoura à esquerda se transforma em um indicador de Bluetooth (visto na localização C), decidi alterar o ícone para ficar ao lado do botão de compartilhamento.

Escolhi os locais B e C como os pontos de entrada finais em meu design, pois segmentar a música envolve ouvi-la, portanto, o local mais apropriado seria o reprodutor de música. A opção mais no canto superior direito também tinha os botões relevantes no local C, portanto, seu posicionamento parecia mais adequado na mesma ordem do reprodutor de música. Ter o botão do modo de segmento na tela inicial, na biblioteca ou na barra de pesquisa não me pareceu relevante, pois segmentar uma seção de uma música depende de ouvir música no reprodutor de música.

O Editor de Ondas

Outra parte do design que tive que considerar para o modo de segmento foi a segmentação real de uma música. Eu me inspirei em editores de vídeo e em como eles usam caixas para identificar as seções a serem recortadas. Também brinquei muito com o Spotify; olhando para as interfaces que já existiam para ajudar a guiar meu design para uma página que caberia no aplicativo. Abaixo, tenho telas de média fidelidade dos possíveis editores de segmento que explorei:

Opção 1 : O design seguiu o mesmo design que fiz em meus mock-ups de baixa fidelidade. Acabei não optando por esse design, pois não parecia seguir o fluxo de usuário do Spotify para ouvir música. Além disso, ter que inserir o timestamp exato para segmentar a música é tedioso.

Opção 2: Este design usou um editor de caixa, que achei mais intuitivo de usar. No entanto, não é conciso o suficiente para determinar qual parte da música um usuário deseja segmentar.

Opção 3 : Este design segue o mesmo fluxo que “adicionar uma música à fila” faz no Spotify. Ele atende a todos os meus requisitos de recursos e enfatizei o comprimento do segmento no design. O editor de caixa também é intuitivo, pois segue outros fluxos de vídeo/editor da minha pesquisa de mercado.

Opção 4 : O design é um pouco semelhante à opção 3, porém enfatiza a duração do segmento com as setas acima do controle deslizante.

Acabei desenvolvendo mais a opção 3 . Achei importante ter uma tela diferente para separá-lo do reprodutor de música, pois evitaria interrupções na audição da música. O design também segue os padrões de design existentes no Spotify, portanto, pode ser facilmente implementado no ecossistema de design do Spotify.

️ Ajustando o design final:

A opção 3 teve cerca de 7 mudanças importantes em seu design até atingir sua forma final. Em cada etapa, pensei no objetivo de cada botão e na interação do usuário. Abaixo você pode ver a evolução da opção 3 e as alterações de design que escolhi corrigir:

Correções de projeto:

1. De Medium ➡️High Fidelity, o editor de caixa de ondas passou a ter toda a duração da música. Optei por fazer essa edição por acreditar que ficaria mais intuitivo para o usuário. Também é mais fácil navegar porque esta versão copia elementos de design existentes de editores de vídeo.
2. De Medium ➡️High Fidelity, foi importante incluir a adição do indicador de tempo no ponto em que um usuário estaria esfregando. Isso segue meus requisitos de recursos, além de adicionar uma sensação de precisão para obter o local exato para iniciar/terminar o segmento.
3. Da Tela ➡️Protótipo de Alta Fidelidade, a exclusão dos demais botões do reprodutor de mídia foi importante, pois o usuário não estará utilizando esses botões ao segmentar um trecho de uma música. Portanto, o botão play/pause é a única opção para ouvir o segmento.
4. Na tela ➡️Protótipo de alta fidelidade, foi necessário adicionar um botão pronto para garantir que os usuários pudessem confirmar o segmento que criaram. Antes, eu só tinha um X, o que poderia causar confusão ao sair do modo de segmento.
5. Na tela ➡️Prototype de alta fidelidade, o novo ícone do botão “loop” foi adicionado no canto para permitir que os usuários saibam que podem reproduzir esse segmento indefinidamente. Isso foi integrado anteriormente tocando no botão de repetição 3 vezes, no entanto, através do modo de segmento, você pode ignorar esses toques desnecessários.
6. Da tela de protótipo ➡️Feedback Screens, depois de obter feedback de meus protótipos, muitos usuários usaram a barra de esfregar para tentar localizar onde na música eles desejam segmentar. Portanto, alterei o formato da barra deslizante para permitir que ela manipule o indicador atual no editor de caixa. Ele também segue o formato de depuração padrão ao ouvir a música no reprodutor de música.
7. Da tela de protótipo ➡️Feedback Screens, depois de obter feedback de meus protótipos, muitos usuários expressaram o desejo de poder manipular o editor de caixa em ambos os lados. Portanto, a adição do indicador de tempo foi incluída em ambos os lados.

Os Protótipos Finais

Depois de realizar três entrevistas e levar em consideração o feedback que recebi, montei os protótipos finais da minha solução. Como você pode segmentar uma música de várias maneiras diferentes, criei um protótipo de fluxos possíveis com os quais os usuários interagiriam com o “Modo Segmento”.

Protótipos:

Conclusão

A declaração de missão abaixo é do próprio Spotify, que afirma:

Nossa missão é liberar o potencial da criatividade humana - dando a um milhão de artistas criativos a oportunidade de viver de sua arte e a bilhões de fãs a oportunidade de apreciá-la e se inspirar nela.

Por meio do meu protótipo final, acredito que o Spotify pode oferecer a oportunidade de revelar uma nova faceta da criatividade humana por meio da dança. Ser capaz de fazer um loop de músicas para criar coreografias com eficiência pode liberar o potencial para a criação de mais danças. Afinal, dançarinos também são artistas, criando arte através do movimento.

⏩Olhando para frente

Sei que sempre posso melhorar mais no meu design. Se eu tivesse mais tempo, definitivamente gostaria de explorar maneiras de salvar segmentos, assim como os usuários podem salvar suas “músicas favoritas”. Isso pode abrir tantas possibilidades, pois as frases de efeito no Instagram e no TikTok se tornam muito populares.

Este foi meu primeiro estudo de caso de UX e estou muito grato por ter feito isso em algo que amo. Desejo continuar a crescer em minha jornada de design de produto e estou ansioso pelo meu próximo projeto! Gostaria de agradecer especialmente a todos que me ajudaram nessa jornada, especialmente Emily, Tise e toda a equipe de Digital Product Design.

Não sou afiliado ao Spotify. Este foi um estudo de caso para a aula de Cornell AppDev: Introdução ao design de produto digital. Qualquer feedback ou comentário seria muito apreciado e gostaria de agradecer por ler meu estudo de caso! —Sofia V