Controle Remoto - Conecta

http://corais.org/anovainteracao/node/843#comment-1241

Proposta anexa.

Bacana!

Bem clean, gostei.

Será que precisa ter as setas? Já vi muita gente se batendo com a ordem de opções em menu de DVD.

Se vcs conseguissem reduzir as opções de seleção para no máximo 4 por tela, poderiam usar algo como o controle de teletexto. São quatro botões, cada um de uma cor. Vejam um exemplo.


Soft buttons me parecem bem mais fáceis de compreender do que uma seta que indica um movimento não correspondente (vc aponta pra frente e a seta vai pra cima pq o plano da tela e o plano do controle remoto são perpendiculares, o mesmo problema é o motivo pelo qual os mouses são tão difíceis de aprender pela primeira vez).

Nesse vídeo antigo mostra uma maneira bem analógica de controlar o teletexto em 2:32, tipo aquela idéia que dei pra vocês anteriormente de usar controles mais físicos, tangíveis.


Dêem uma olhada nesse jogo que mostra várias possiblidades para controles remotos e seus pontos positivos e negativos:
http://www.eng.cam.ac.uk/inclusivedesign/index.php?section=casestudies&p...

A forma como você ativa o comando de voz pode ser melhor explorada em termos de gestualidade e háptica. Quando eu aperto o botão onde eu devo falar? O que fazer com o costume de falar no microfone ou no telefone de gancho? Acredito que dá pra propiciar isso pelo formato do controle. Vejam o projeto Social Mobiles da IDEO

Segue nova proposta em anexo.

A proposta para as cores neste controle é de que o sistema se comporte apresentando opções dele de acordo com as cores. O que acham?

Seria uma cor para cada funcionalidade???

Gostei do *falar

Eu acho melhor tentar usar o padrão europeu de quatro cores. Mas isso significa que só poderão haver 4 opções por tela. Tem que verificar se os fluxos encaixam.

Uma alternativa a considerar é o uso de formas geométricas diferentes para cada botão, tal como no caso do Weemote. Assim fica mais fácil de identificar se a percepção visual estiver diminuída por algum motivo (baixa iluminação ambiente ou daltonismo).

O que faz o botão selecionar?

Eu ainda acho que um botão falar assim do nada vai ficar estranho. Talvez ele possa estar do lado. Vejam esse controle da KPN, operadora de tv a cabo holandesa. É um dos controles mais fáceis de usar e bonitos que eu já usei.

Eu estou pensando em como vamos conciliar as cores com todas as funcionalidades que temos, e tbm como selecionar os usuarios online/offline....

Como ja tenho uma prévia do wireframe vou enviar p/ vcs, assim fica mais facil, pensar nos dois junto (controle + navegacao).

Vou criar outro post para a parte de AI...

Detalhe que percebi aqui, vcs vão precisar de um teclado numérico para ajustar os horários de tomar o remédio ou então voltar à idéia das setinhas pra subir e descer e selecionar os números, o que eu considero extremamente complexo. É um dos principais motivos pelos quais os videocassetes ficavam com o relógio piscando sem nunca ninguém ter configurado. 

O ideal é que tivesse algum controle que se parecesse com um relógio. Algo circular, que inclusive pudesse ser usado para outras coisas, como por exemplo, selecionar amigos. Vejam esse exemplo da lâmpada multi-colorida da Philipps.

E quando for cadastrar os remédios, ao invés de escrever os nomes dele, podia tirar uma foto do remédio hein? Aí o alarme mostra a foto na hora de tomar, não tem erro de fazer confusão!

A maior dificuldade que sinto em conciliar o controle e a interface é no sentido de selecionar determinada funcionalidade.

Dúvidas/Exemplos:

Na home, como selecionar determinada pessoa?

No cadastrar lembrete de remédio, como selecionar que agora vou digitar a hora e agora vou digitar os minutos?

Outro caso diferente da seleção de O QUE vou fazer agora é COMO vou fazer agora.

Exemplo:

No cadastrar lembrete de remédio, vou informar a hora através de um botão semelhante ao de rádios mais antigos para aumentar o volume, onde seguro o botão e giro (imagem anexa).

O que acham desta sugestão? Atenderia somente o caso das horas e minutos? Ou poderíamos utilizar isso como um meio de selecionar algum recurso no sistema?

Após uma reunião com a Simone, definimos questões de interação entre Interface x Controle.

Definimos um modelo onde a interface não fica presa as opções do controle, podendo assim futuramente acrescentar novas funcionalidades no Conecta.

Em anexo segue a proposta do novo controle e abaixo segue descrito o funcionamento das opções:

• Botão “Cancelar ou Voltar”: Serve para cancelar quando entrou em determinado recurso ou para voltar a página anterior.
• Botão “Selecionar”: Serve para confirmar a seleção de determinado item ou entrar em determinado recurso.
• Botão “Falar”: Serve para enviar um comando de voz para o Conecta, no mesmo botão esta embutido o microfone do controle.
• Botão Circular: Este botão foi criado baseado no conceito dos telefones antigos, onde era necessário girar um círculo com o dedo para chegar ao número desejado. Este botão servirá como a função “Tab” e “Shift + Tab” do teclado para navegação dentro das páginas, onde será possível navegar (para direita e para esquerda) dentro das opções disponíveis nas interfaces do Conecta para utilizar os recursos.
• Ergonomia: O controle terá uma largura de 5 milímetros para facilitar segurar o aparelho com os dedos indicadores e um espaço livre do canto inferior esquerdo até o meio onde encaixará o dedo polegar esquerdo da pessoa para fixar melhor o aparelho. O outro dedo polegar ficará no círculo para navegar entre as opções disponíveis do aparelho.

Daron acho que faltou aquele botão para alterar entre "Meus amigos" e "Funcionalidades", lembra??

Simone, aquele botão para alterar entre as funcionalidades deixou de existir quando foi criado o "dial".

Fred, quanto ao protótipo, será possível testarmos desta forma? Será que gravar um vídeo girando o dial (gostei do termo) e apresentarmos uma interface num layout final mudando as opções não ficaria mais claro para demonstrarmos este conceito?

Meu medo é de tentar fazer estes testes agora e não termos tempo para fazer o restante do projeto.

Uma coisa é teste, outra é apresentação.

Eu sugeri o teste porque vocês estão introduzindo um novo conceito de controle remoto para um público específico. Se não houver validação com esses usuários, será discutível se os usuários entendem ou não. O teste pode também indicar caminhos para aperfeiçoar o controle.

Mas é uma decisão de vocês fazer o teste ou não!

É, este é o meio pelo qual provaremos a aceitação do nosso conceito.

Vamos ver o que conseguiremos fazer para este teste.

As interfaces podem ser Wire?

Podemos levar o Conecta + Interfaces + controle e utilizar como se fosse na televisão das pessoas?

Daron mas se nao colocarmos o botao para alterar entre "Meus amigos" e "Funcionalidades", o usuário tera que percorrer por TODOS os usuarios para chegar ate as funcionalidades..... se ele tiver muitos amigos isso vai ficar bem ruim....

O sistema permitiria ilimitado o número de pessoas, mas pelas pesquisas vejo que não passarão de 12 pessoas.

Creio que podemos limitar o sistema para 20 amigos. O que acham?

Esta aceleração que o Fred comentou e a possibilidade de ele girar para a esquerda e direita é o que permitirá ele chegar mais rápido no objetivo final dele, desta forma o TODOS não serão muitos, o controle terá um botão a menos e a navegação dá-se em um só lugar.

Quanto a técnica do Mágico de Oz gostei.

Vamos ter que pensar em como montar o protótipo do controle para que ele consiga colocar o dedo, girar e pressionar os botões.

Quanto a interface,

Podemos definir somente umas 2 ou 3 tarefas para o teste? ou deve atender todas as funcionalidades?

Teremos que pensar num ítem de "Seleção" que quando a pessoa for girando no controle vamos mudando o item de lugar na interface estática (exemplo: esta na Home, com o primeiro amigo selecionado, a pessoa gira para a esquerda 3 pontos, o amigo selecionado agora será o 3º depois do primeiro amigo). Correto?

Eu acho que não há a necessidade de limitar o número de amigos, se vamos usar um dial com aceleração. Isso é diferente de um knob com posições definidas, como o do seletor de volume acima.

O de aceleração poderia ser usado com uma interface circular, não necessariamente no canto da tela, mas serve como exemplo:

De repente sai alguma idéia interessante pensar num dial de telefone antigo hackeado pra controlar a TV, tipo esse aqui hackeado pra twittar. Tenho que confessar que o barulho do dial voltando pra posição é algo que está firmemente impregnado na minha memória. Apesar de ser muito mais trabalhoso do que apertar um botão, o esforço criava uma conexão mais forte com a tarefa. A gente prestava mais atenção ao discar. Tinha menos ligação errada naquela época.

Pro protótipo vocês podem tentar usar um aparelho desses se encontrarem num antiquário.

O objetivo desse teste é verificar esse modelo de input, sendo assim, não há a necessidade de testar todas as funcionalidades, que acreditamos já estar testadas pela sonda cultural, certo? Na verdade eu acho que talvez nem precise de tarefa.

Uma possibilidade também é fazer um teste do tipo fantasia direcionada. http://www.corais.org/node/106 Você coloca um telefone desses do lado, cola os botões confirmar, selecionar num canto e pede pra pessoa imaginar como controlaria a televisão com isso.

Agora estamos chegando no nível de interação que eu dizia que vocês precisavam pensar mais!

Achei mto legal esse dial com aceleracao do video...
Tbm acho que nao precisa limitar os usuários.

Mas estou preocupada qto a data de entrega..  Fred, o Goncalo disse que ja é mes que vem e o Thiago conversou com a Rosa, e nosso prazo é dia 10 de outubro, que dá os 30 meses (turma A10).

Mandei email la tbm e ninguem responde...... sabe como ficou isso??

A informação que eu tinha como coordenador era 30 meses, não sei se mudou. Eu acho que como vocês já ultrapassaram o prazo inicial que vocês estavam almejando, agora resta terminar o trabalho o mais bem feito que puderem. Atrasado e incompleto coisa boa não é! Se vocês tem o prazo até outubro é tranquilo.

#Rotação Acelerada

A rotação acelerada pode ser implementada como esta proposto o controle hoje, vai depender da velocidade colocada no momento de girar a roleta (roda roda roda, roda roda roda, rodouuu! - Silvio Santos).

#Prazo

Simone, será que teria como conversar com a Rosa aí em Curitiba?

Caso não seja até o proximo dia 25 podemos nos reunir um final de semana para juntarmos interfaces + controle e aplicarmos juntos as técnicas Mágico de Oz ou Fantasia Direcionada.

Silvio santoss kkkkkkkkkkkkkkkkkkk... decadencia, mas gostei da comparacao rsrsrs

Daron eu mandei email para a Rosa e Goncalo..... assim que eles me responderem eu encaminho p voce e ja sabemos a data....

Se for mais pra frente podemos fazer esses testes com mais tranquilidade, e podemos nos reunir depois do feriado, que tal??

Aproveitando o gancho que vocês começaram a discutir sobre o controle nos Wireframes, gostaria de sugestões para criação do protótipo do Controle.

O que utilizar para criar o botão de Rotação (que também permitirá a Rotação Acelerada)?

Alguma sugestão para o material a utilizar para fazer o controle e conseguir criar aqueles espaços que ficarão os dedos (ergonomicamente falando)?

Quanto aos botões, sugestões?

Desde já, Obrigado!

Eu fiz um workshop com a M4U anos atrás em que separei em duas equipes com a mesma tarefa: projetar um controle remoto gestual. Uma equipe tinha que usar massa de modelar, a outra só papel e lápis. A equipe da massa de modelar explorou muito mais as possibilidades e de uma forma bem mais lúdica do que a equipe do papel, que se concentrou bastante nos detalhes. Moral da história: o material escolhido vai influenciar também o tipo de idéia que você vai ter.

Até agora acredito que vocês tem se concentrado muito em especificar as funcionalidades no nível do detalhe. Acredito que se esse protótipo for mais lúdico vocês podem talvez ter algo novo, especialmente se conseguirem que o usuário se sinta à vontade para redesenhar o protótipo, refazer a massinha, enfim, co-criar.

Eu acredito que com papelão cortado e um fósforo como eixo dê pra fazer o dial, mas se tiver algum telefone antigo por perto, vale à pena colocá-lo na frente da televisão e ver o que acontece. Eu sugiro juntar um monte de material numa mesa, tipo ateliêr e ver o que sai daí!

Importante ter em mente o conceito de propiciação: o que essa forma propicia fazer? Aí vai criando e refletindo. Uma conversa com o material! Isso é design, o resto é documentação.

Sei que já definimos o modelo do controle e até montei o primeiro protótipo com as massinhas de modelar (posto aqui em breve), mas ontem em conversa com o Dr. Roberto Pereira - Unicamp apresentei nosso controle e ele e ele encaminhou o trabalho de um colega do Doutorado que fala sobre:

Título: Artefatos e linguagens de interação com sistemas digitais contemporâneos : os anéis interativos ajustáveis para a televisão digital interativa

Estou anexando imagens retiradas da tese.

A proposta consiste numa série de anéis coloridos que permitem a identificação de gestos através de reconhecimento de imagem. 

É bacana que o projeto foi desenvolvido com a participação de usuários também, mas eu acho que o controle de vocês me parece mais viável. Esses aneis propõem um estilo de interação muito pouco familiar. Acredito que possa ser útil para aplicações específicas, mas dificilmente pegaria para a população em geral. 

O legal do controle de vocês é que ele se aproveita do que as pessoas já conhecem sobre controles remotos e estende o modelo de interação, principalmente pensando o movimento dainterface gráfica ao mesmo tempo que pensa a interação física. 

Anexo duas imagens e dois videos do protótipo do controle do Conecta.

O protótipo foi construído com massinha de modelar, papelão, tampas de plástico para fazer o dial e um brinco para prender as tampas do dial.

O protótipo ficou acima do tamanho esperado, logo os affordances criados para tal não serviram para a forma projetada (verificar a forma como os usuários seguraram o controle).

Sugestões?

Eu curti o prototipo Daron, acho que podemos seguir nessa linha. Em relacao a como ele segurou o controle, ao assistir o video eu imaginei que pudessemos fazer no mesmo molde de uma paleta (aquela de pintura) onde encaixa o dedo... acho que ficaria mais firme, seguindo a anatomia da mão.

O Daron me pediu exemplos de poderia ser apresentado o protótipo funcional. Encontrei esse aqui, de um controle remoto usando acelerômetro, que não funcionaria para o público de vocês, já que tremedeira nas mãos é um sintoma comum entre pessoas da terceira idade. Mas achei que ficou bem apresentado como é a interação do controle com a interface. Acredito que vocês poderiam fazer um vídeo nessa linha também. Não precisa que o protótipo funciona como o dele, usando arduino e talz, pode ser tudo fake, Mágico de Oz, mas tem que fazer sentido do ponto da interação.

Para a banca, como vocês são dois, vocês podem fazer Mágico de Oz também, mas o ideal é que vocês fizessem um protótipo com Arduino para o controle remoto, o que não seria muito difícil já que atualmente possui apenas três botões e um potenciômetro. A gente pode converter o input da arduino em pressionamento de teclas do teclado e usar em praticamente qualquer aplicativo num laptop, que seria a televisão simulada. Posso orientar vocês nessa parte técnica também se desejarem. 

Pensando bem, não sei se o Mágico de Oz seria suficiente pra banca. Pro vídeo de demonstração sim, mas pra banca não sei. Vocês terão que descobrir um jeito de saber o que a pessoa está apertando no controle remoto e mudar a interface bem rápido. No final vocês tem que ter um protótipo que a banca possa usar sozinha, possa colocar o controle na mão, selecionar um amigo e enviar uma mensagem por exemplo. Essa é a única maneira de avaliar a experiência que vocês projetaram. 

Atualizei a página sobre Mágico de Oz com vários exemplos, de qualquer forma. 

Outra possibilidade que não exige muita programação é abrir um mouse e usar seus componentes no controle. Como são apenas três botões do controle remoto, é só comprar três botões grandes numa loja de eletrônica (ou arrancar de um produto eletrônico estragado) e conectá-los com um fio até os contatos dos botões soldados no mouse (primeira foto). Quanto ao dial, é um pouco mais complicado, teria que encontrar engrenagens que transferissem a rotação em 90 graus para o sensor X ou Y do mouse (segunda foto).

Coloca isso tudo dentro de uma caixa de chocolate, enrola com um papel bonitão e pronto! 

Conecta o mouse num laptop rodando um aplicativo em tela cheia e que ao pressionar cada botão do mouse faça a função desejada. Isso daria pra fazer no Flash.

Design Orientado a Gambiarra, mas funcional.

Conforme novas definições para o Layout do Conecta foi necessário adaptar o controle já criado.

Anexo o novo modelo.

O que acham deste botão "Trocar"?

Sugestão Fred:

Não estou curtindo esse botão Trocar. Ele acaba sendo um botão que não terá função na maior parte das telas. Acredito que talvez seja possível usar o botão Cancelar/Voltar para trocar de modo (amigo ou funcionalidades). Eu diria que tem um terceiro modo aí que é o de configurações.

Resposta Daron:

Se conseguirmos fazer sem o botão trocar também acho que seria uma boa, mas teremos que repensar em como podemos fazer isso, porque dependendo do caso terei que pressionar 2 / 3 vezes o botão "Cancelar / Voltar".

Exemplo: Caso estiver selecionado uma opção que posso fazer com determinado usuário, terei que cancelar uma vez [1ª pressionada] para voltar ao modo de seleção de usuário e outra para voltar ao modo onde tenho as funcionalidades [2ª pressionada].

Primeira tentativa de transformar o mouse em controle não foi bem sucedida!  #fail

Algumas dúvidas na hora da criação:

Preciso colocar em uma caixa de papelão a placa do mouse?

Como faço paraligar os botões do Controle com os botões na placa do mouse?

O dial vai ter que ter alguma ligação do giro dele com o scroll do mouse, alguma sugestão de como fazer?

Basicamente o botão é um circuito aberto. Você só precisa fechá-lo para ativar. Se vc conectar as soldas dos botões embaixo da placa, vai ver que ativa o botão da mesma forma que apertá-lo. Então o que você precisa fazer é soldar um fio em cada um dos contatos e conectá-lo num outro botão, que vai ser o do controle. Existe a opção de fazer isso sem solda se vc tiver espaço suficiente entre o botão e a placa, mas não dá pra ver isso na foto que você mandou.

Estou anexando uma foto em que foi feita a opção de solda. Tirei desse hack de mouse. Quanto à rodinha vc vai ter q fazer algum esquema de transferência de força, tipo engrenagens de relógio. Anexei um exemplo. Vai depender do que você tem à mão. Tenta pegar aparelhos estragados que tenham motores, tipo impressora.

No final de semana iniciei outra tentativa de montar o Controle com base no mouse.
Procurei ajuda em algumas eletronicas e infelizmente não podem me ajudar.

Consegui alguns materiais para iniciar as atividades (engrenagens, circuítos, fios, soldador, outros - foto anexa).

Ainda preciso:

* Definir em que será a base (peguei um auto-falante de carro que pretendo cortar e fechá-lo de alguma forma).

* Comprar botões.

* Montar o dial (estou pensando em reutilizar o do protótipo com massinha, Fred, o que acha?)

Pretendo adiantar algumas coisas durante a semana e se  não conseguir até o final de semana vou procurar alguém que possa ajudar.

Se você conseguisse fotos em melhor resolução, eu poderia ajudar mais, Rafael. Ou então podemos marcar um Skype.

O protótipo em massinha acho que não vale à pena usar e acho que você deveria guardá-lo talvez pra mostrar na banca. É sempre bom ter um histórico, imagina se o produto vira realidade e você pode mostrar que tosco era o primeiro protótipo. No caso do Palm Pilot, o protótipo era um toco de madeira. 

O que eu não vi aí nessa foto são os botões. No alto-falante tem algum botão que dê pra você retirar e usar? Tem que ver se consegue trazer o botão inteiro, com o case de acionamento. O ideal mesmo era comprar esses botões na loja de eletrônica, como eu sugeri no comentário 35.

Daron tbm podemos combinar de se reunir em um fds para tentar fazer o protótipo.

A experiência com o controle do Conecta será o mais proximo do real possível. (=

No final de semana consegui ajuda de um borracheiro que se empolgou com a idéia do Conecta e resolveu ajudar.

Começamos pela montagem da estrutura que vai suportar o controle. Para isso montamos um molde de Fibra (Foto01 à Foto03).

Após secar a fibra foi revestido a mesma com massa (massa para carro). Esta massa permitirá depois deixarmos o controle com um melhor acabamento (Foto 04 à Foto 07 + Vídeo "Suporte do Controle").

No final o suporte do controle revestido de massa foi colocado para secar (Foto08).

Em paralelo com o suporte do controle também esta sendo experimentado as soldas e montagem do circuíto que vai funcionar o controle  (apoio de um colega de trabalho). Neste protótipo foi colocado o eixo do dial ligado direto ao contador de passos do circuíto, desta forma não se faz necessário o uso de engrenagens (Foto09).

No próximo sábado será juntado o suporte do conecta com o circuíto e seus componentes.

Genial!

Antes disso teve aquela sessão de prototipação via Skype em que o Daron abriu um monte de aparelho na casa dos avós deles pra ver como é que ia fazer o mecanismo do dial. Anexo uma foto. 

O projeto está indo muito bem, mostrando Design Livre na prática: o Daron aprendeu com o borracheiro sobre como fazer acabamento com fibra e o borracheiro aprendeu sobre design de interação. E quem está acompanhando este blog aprendeu as duas coisas!

Agora é fazer o acabamento e pensar em como utilizar a entrada dos dados no protótipo funcional, enfim, a programação. Tem que verificar se no Flash ele consegue ler a posição da mousewheel através de uma variável.

To acompanhando o projeto, este tópico está cada vez mais 'quante' :D Tem mais vídeos do borracheiro (qual o nome?)? Fiquei muito curioso, muito legal mesmo o/

Controle do Conecta "conectando" e manipulando a interface Circular proposta no Layout deste projeto.

@Gonzatto, vou conseguir uma foto do Zé Borracheiro para você.

O nome dele é Jucelino, popular Zé.

Ficou showwwww

Só tenho um palpite... nao seria melhor o botao de confirmar ser o primeiro (canto esquerdo)?? pq parece que voce se confundiu ao clicar, pode ser tbm porque está tudo preto, podemos pintar esses botões tbm (azul, verde, vermelho), posso fazer isso aqui em ctba qdo vc vier para o curso.

Mas ficou bem legal, ta funcionando!! rsrs

Parabenssss Daronnnnnnn e ao Ze borracheiro :)

O projeto tá ficando muito massa mesmo. Talvez dê pra explorar o controle na identidade visual do projeto, como se fosse um ícone, tipo o shape do iPod. Concordo que pintar os botões é importante, mas isso é fácil. Não vai precisar queimar mais dedo nenhum!

Parabéns ao Diego também, que tá fazendo o protótipo funcional!

Compartilho aqui uma foto com melhor qualidade do controle do Conecta Externo e Interno.

Teste de Usabilidade com o Conecta (Controle + Interface):

Certo Fred.

Ate tinha escrito Teste de Experimental ao invés de teste de usabilidade. Obrigado pela dica.

Em anexo uma imagem do uso do protótipo funcional (Conecta: Controle Manipulando a Interface).

Bacana! A imagem ficou cortada. Não tem como colocar a imagem inteira?