Como funciona o "Internet of Kicks"

Recentemente fizemos um Hackathon Game Jam de Windows 10 na Universidade Anhembi Morumbi. Nesse evento desenvolvedores tinham o objetivo de portar seus jogos para rodar no Windows 10. Costumo em Hackathons sempre passar a noite acordado e programando e assim sendo uma referência e motivação para aqueles outros desenvolvedores que estão no evento também. Para aqueles que não resistiram ao cansaço o evento disponibilizou pequenos colchões infláveis onde alguns aproveitaram para tirar uma soneca e recuperar as energias.

 

Em hackathons costumo sempre também desenvolver algum case diferente e meu objetivo é sempre terminar no meio da noite, ou seja, bem antes do término do hackathon, até porque como Evangelista fico dando suporte aos outros desenvolvedores durante o evento. Nesse hackathon então eu fiz o que chamei de Internet of Kicks, com a participação honrosa de Caio Chaves e Guilherme Carraro (também Evangelistas Microsoft) e do MSP Vitor Meriat. Nesse projeto de Internet dos Chutes colocamos um sensor dentro de uma bola e conectamos esse sensor no Azure. Chutes das embaixadinhas eram detectados e então enviados para um site no Azure que em Real Time mandava o número de chutes para uma App Windows 10 que estava rodando no meu computador e sendo projetada no telão. Vejam abaixo o vídeo do projeto publicado no meio da madrugada durante o evento 🙂

 

Bom, mostrado o projeto vamos aos detalhes de como tudo funciona:

Sensor
Talvez para a decepção de muitos, o sensor que está dentro da bola é apenas um telefone celular Windows Phone. Digo decepção pois depois do evento muitos desenvolvedores vieram me perguntar qual sensor eu tinha utilizado, imaginando ser algum Arduíno ou coisa do tipo e a minha resposta dizendo que era um telefone não agradou a muitos. Mas por que usei um telefone? Bom, primeiramente porque um telefone Nokia teoricamente aguentaria uns bons chutes e continuaria funcionando o que é fundamental para esse projeto. Em segundo lugar poque um telefone tem tudo o que eu precisava: Acelerômetro, conexão Wi-fi e capacidade de executar aplicativos. Outra dúvida que ficou no ar foi como eu fiz para colocar o sensor dentro da bola? Bom, costumo sempre procurar por soluções mais triviais possíveis mesmo para problemas complexos, então simplesmente, descosturei a bola, esvaziei a câmera (bexiga na língua dos paulistanos) que fica dentro da bola, coloquei o celular dentro da bola (fora da câmera/bexiga) e ao invés de encher a bola novamente com AR, eu simplesmente enchi a bola com folhas de papel e sacolas de plástico. A bola ficou cheia mas não com a mesma característica de uma bola de futebol real, entretanto era perfeitamente possível fazer algumas embaixadinhas com a bola. Usei uma fita adesiva branca para fechar a bola descosturada e pronto: a bola estava sensorizada!

Aplicativo do celular
O celular que utilizei foi um celular já antigo que eu tinha guardado no fundo da minha gaveta, um Lumia 620 que ainda roda Windows Phone 8.0. Sendo assim criei no Visual Studio um projeto Windows Phone 8.0 para rodar o aplicativo no celular. Esse aplicativo basicamente monitora o acelerômetro e quando no eixo Z (vertical ao espaço, não interessando a posição do telefone) ele fica negativo e sofrendo uma forte mudança para positivo, então ele faz um envio de mensagem para o website no Azure. O protocolo de comunicação com o Azure em tempo real aqui é o SignalR. Nesse projeto eu instalei as referências da biblioteca de SignalR simplesmente procurando no Nuget e instalando no projeto. Veja abaixo esse código onde monitoro o acelerômetro:

if (acceleration.Z < -0.8)
{
   caindo = true;
}

if (caindo && acceleration.Z > 1.0)
{
   caindo = false;
   TotalEmbaixadinhas++;
   s.send();
}

O projeto do Visual Studio desse aplicativo pode ser baixado nesse zip.

 

Aplicativo Windows 10
Quando o aplicativo do celular envia para o Azure um chute detectado, o Azure através do SignalR remete a mensagem para todos os clientes conectados. O aplicativo Windows 10 projetado no telão e que mostra o contador das embaixadinhas é esse aplicativo. Esse app só tem a função de receber do Azure quando uma nova mensagem chega e então incrementa um contador na tela. Esse aplicativo também possui um botão para zerar o contador. O código abaixo mostra como é feito esse listener de SignalR no Azure e como é tratada essa notificação no lado cliente.

async private void makeConnection()
{
   try
   {
      var hubConnection = new HubConnection("http://bananasvc.azurewebsites.net");
      chat = hubConnection.CreateHubProxy("ChatHub");
      Context = SynchronizationContext.Current;
      chat.On<string, string>("broadcastMessage",
         (name, message) =>
            Context.Post(delegate
            {
               kicks++;
               tbKicks.Text = "" + kicks;
            }, null)
            );
      await hubConnection.Start();
   }
   catch (Exception ex)
   {
   }
}

Não se assuste com o domínio bananasvc, é que esse servidor de SignalR é o mesmo servidor usado no projeto Internet of Bananas que fiz junto com o Caio Chaves em dezembro do ano passado. Aqui você pode ver um pouco do projeto Internet of Bananas
O projeto do Visual Studio desse aplicativo pode ser baixado nesse zip.

 

Site no Azure
A estrutura no Azure, nada mais é que um web site rodando um demo do SignalR. Esse demo é um chat onde mensagens enviadas para o site são disponibilizadas para todos os dispositivos conectados no site em realtime. No caso do Internet of Kicks, o celular envia uma mensagem qualquer para o site e esse por sua vez manda a mensagem para o aplicativo Windows 10. O conteúdo da mensagem nesse caso não importa, o fato da mensagem chegar no app Win10 é o sinal que teve mais um chute na conta.

O projeto do Visual Studio do site no Azure pode ser baixado nesse zip.

 

Até o próximo projeto Internet of AlgumaCoisa,
Marlon Luz
@marlonluz
#keepCoding

 


Autor: Microsoft Tech