6
O Soongz é uma Rede Musical que complementa as redes sociais, permitindo que as pessoas compartilhem e ouçam músicas junto com seus amigos. Nesta rede, o usuário descobre o que seus amigos estão escutando, compartilha playlists, cria salas de bate-papo musicais (rádios) e pode até criar um programa de locução de rádio ao vivo. Baseado no seu comportamento na rede, o site é capaz de oferecer as melhores sugestões de músicas, artistas, álbuns e rádios que combinam com seu estilo, para tornar a experiência de ouvir música cada vez mais agradável e social - uma forma de se expressar na internet.
Com suas características sociais, o Soongz promove uma aproximação entre músicos e ouvintes, tornando-se uma grande oportunidade para fortalecer o vinculo do artista com seus fãs. Isso já se mostrou bastante eficaz na primeira versão deste projeto, quando ainda se chamava TwitRadio.
O projeto foi desenvolvido utilizando Grails 2.0, e uma característica técnica interessante é termos implementado nele as técnicas de Big Pipe e Prime descritas pelo Facebook como responsáveis pela melhoria de desempenho.
Com suas características sociais, o Soongz promove uma aproximação entre músicos e ouvintes, tornando-se uma grande oportunidade para fortalecer o vinculo do artista com seus fãs. Isso já se mostrou bastante eficaz na primeira versão deste projeto, quando ainda se chamava TwitRadio.
O projeto foi desenvolvido utilizando Grails 2.0, e uma característica técnica interessante é termos implementado nele as técnicas de Big Pipe e Prime descritas pelo Facebook como responsáveis pela melhoria de desempenho.
Comentários
Simplesmente Fantástico.
Poderia compartilhar um pouco de sua experiência ao desenvolver esse projeto?
Que plugins utilizou, se teve alguma dificuldade. Se possível, claro.
Um abraço e parabéns!
Poderia compartilhar um pouco de sua experiência ao desenvolver esse projeto?
Que plugins utilizou, se teve alguma dificuldade. Se possível, claro.
Um abraço e parabéns!
27/02/2012 16:57
Olá Romário, tudo bem?
Obrigado pelos elogios. O projeto ainda está em desenvolvimento e muita coisa vai melhorar. Algumas informações técnicas mais detalhadas:
- Para autenticação e autorização, utilizamos SpringSecurity. A princípio, nós mesmos implementamos a integração com as redes sociais, mas estamos migrando agora para SpringSocial que tem uma arquitetura bem preparada para lidar com o login multi-rede que é necessário neste projeto;
- Nós tivemos alguma dificuldade para implementar o Big Pipe, que requer que a gente faça flush parcial da resposta para ir renderizando no browser enquanto continua o processamento de outros pedaços da tela. No fim, descobrimos que o problema foi que o SiteMesh captura o "flush" da response (não fazendo nada), o que é bem compreensível uma vez que ele precisa de todo leiaute processado para poder aplicar os leiautes padronizados. Após desabilitarmos o sitemesh para as páginas que queríamos que tivessem resposta imediata, foi tudo ok.
- A gente teve um cuidado especial para garantir que o player não parasse de tocar enquanto o usuário navega. Para isso, nós capturamos com javascript o click nas âncoras (tags a) que tivessem um atributo rel específico criado por nós, e substituímos esses cliques por chamadas assíncronas. Para dar a impressão de load do browser (e ser compatível com browsers inferiores) nós implementamos a mesma técnica do facebook de ajax através de iframe. Uma vantagem dessa técnica de usar tags html para representar as chamadas ajax foi que o site continuou sendo "crawlable" pelo robô do google, continuando assim nosso site navegável.
- Para o back multi-browser funcionar na aplicação ajax, nós usamos uma versão modificada do History.js. Para carregamento assíncrono e dinâmico dos javascripts, nós usamos require.js.
- Foi feita uma implementação do lado server que garante que se o agente não tiver suporte a javascript, nós respondemos com uma versão html do site (que não toca música mas é navegável). Juntamente com a técnica das tags âncora, isso garante mais uma vez o site 100% navegável por crawlers.
- Para a base de músicas, utilizamos o MusicBrainz, que é um banco de dados mundial de músicas, opensource e disponível. Outra característica interessante do MusicBrainz é o suporte a AcoustID que permite tirar fingerprint das músicas e identificá-las automaticamente. Esse serviço nós ainda estamos implementando.
- Para streamming das músicas, utilizamos um servidor separado na amazon com Wouza Media Server. O player no browser é flash (apenas quem toca a música), mas estamos implementando a versão html5 para dar suporte a celulares.
Enfim, tem muita coisa bacana nova que usamos nesse projeto, e alguns plugins novos que criamos. Em breve devemos publicar uma boa parte deles de volta para a comunidade.
Obrigado pelos elogios. O projeto ainda está em desenvolvimento e muita coisa vai melhorar. Algumas informações técnicas mais detalhadas:
- Para autenticação e autorização, utilizamos SpringSecurity. A princípio, nós mesmos implementamos a integração com as redes sociais, mas estamos migrando agora para SpringSocial que tem uma arquitetura bem preparada para lidar com o login multi-rede que é necessário neste projeto;
- Nós tivemos alguma dificuldade para implementar o Big Pipe, que requer que a gente faça flush parcial da resposta para ir renderizando no browser enquanto continua o processamento de outros pedaços da tela. No fim, descobrimos que o problema foi que o SiteMesh captura o "flush" da response (não fazendo nada), o que é bem compreensível uma vez que ele precisa de todo leiaute processado para poder aplicar os leiautes padronizados. Após desabilitarmos o sitemesh para as páginas que queríamos que tivessem resposta imediata, foi tudo ok.
- A gente teve um cuidado especial para garantir que o player não parasse de tocar enquanto o usuário navega. Para isso, nós capturamos com javascript o click nas âncoras (tags a) que tivessem um atributo rel específico criado por nós, e substituímos esses cliques por chamadas assíncronas. Para dar a impressão de load do browser (e ser compatível com browsers inferiores) nós implementamos a mesma técnica do facebook de ajax através de iframe. Uma vantagem dessa técnica de usar tags html para representar as chamadas ajax foi que o site continuou sendo "crawlable" pelo robô do google, continuando assim nosso site navegável.
- Para o back multi-browser funcionar na aplicação ajax, nós usamos uma versão modificada do History.js. Para carregamento assíncrono e dinâmico dos javascripts, nós usamos require.js.
- Foi feita uma implementação do lado server que garante que se o agente não tiver suporte a javascript, nós respondemos com uma versão html do site (que não toca música mas é navegável). Juntamente com a técnica das tags âncora, isso garante mais uma vez o site 100% navegável por crawlers.
- Para a base de músicas, utilizamos o MusicBrainz, que é um banco de dados mundial de músicas, opensource e disponível. Outra característica interessante do MusicBrainz é o suporte a AcoustID que permite tirar fingerprint das músicas e identificá-las automaticamente. Esse serviço nós ainda estamos implementando.
- Para streamming das músicas, utilizamos um servidor separado na amazon com Wouza Media Server. O player no browser é flash (apenas quem toca a música), mas estamos implementando a versão html5 para dar suporte a celulares.
Enfim, tem muita coisa bacana nova que usamos nesse projeto, e alguns plugins novos que criamos. Em breve devemos publicar uma boa parte deles de volta para a comunidade.
28/02/2012 15:10
Aprenda Groovy e Grails com a Formação itexto!
Newsletter Semana Groovy
Os melhores blogs de TI (e em português) em um único lugar!
