Vamos ao nosso guia de prototipação para performances emergentes. Já explico o que é isso. Pode passar. O que é um protótipo? Em grego, prototipon significa uma forma primitiva. É uma tentativa de testar a materialização do conceito antes desse conceito estar completamente maduro. Então não espere a ideia ficar madura para você construir um protótipo. Porque, na verdade, ela vai se tornar madura quando você construir o protótipo. Provavelmente a sua ideia é muito ruim. E a hora que você começar a tentar construir alguma coisa em cima da sua ideia, aí você vai ver que "putz grilas, aquela ideia não estava funcionando, não vai funcionar nunca". Aí você vai mudar e melhorar essa ideia. Mas enquanto você trabalha no mundo abstrato, no mundo das ideias, você não vai ter resistência nenhuma, porque é a sua própria mente que está trabalhando. Você obviamente ama suas ideias, você é apaixonado, assim como seus filhos e filhas. Você vai querer que eles se desenvolvam para todos os lados. Mas a verdade é que nem sempre o mundo é tão brilhante quanto a gente imagina. Então o protótipo serve para você ver a resistência do mundo. Não é a versão final. Fique claro isso. O protótipo é sempre de propósito mal feito, incompleto, indefinido, estranho. Tudo isso são estratégias de propositais para que o protótipo ajude a desenvolver o conceito. Por que não construir a versão final? Porque você nunca sabe o que o Coringa está prestes a fazer. Por isso que o carro do Batman, Tumblr, ele era um protótipo. E ele acabou explodindo no segundo filme, porque o Coringa botou uns caminhões muito loucos ali. E aí o que o Coringa fez? Quem que lembra como ele explodiu o carro do Batman? Então o carro do Batman estava atrás do Coringa, o Coringa estava quase sendo pego pelo Batman, e o que o Coringa faz? Ele tira uma bazuca com um míssil e joga o míssil no... É claro que o carro do Batman não estava preparado para isso, ele explode. Só que o Batman, mais perto, ele tinha preparado um plano B. Então o que ele faz? A hora que ele vê que o carro dele está destruído, aperta um botão, aí o carro solta os pedaços assim, e sai a moto por baixo do carro, e aí ele continua correndo atrás do Coringa. Mais tarde o Coringa fala "putz, que eu não sei onde que ele consegue esses brinquedos, né?" Então basicamente o Batman, ele tem várias armas novas que ele vai testando, são protótipos da empresa, né? Que, enfim, estavam sendo destinados ao uso militar, mas que o próprio Batman acaba testando ele mesmo. O protótipo costuma ser chamado de Coisa, Gambiarra, Parada, Trubisco e outros nomes indefinidos. Isso não é ruim, é bom você chamar o seu protótipo de Coisinha. Por quê? Porque você está querendo dizer para você e para as pessoas que estão próximas, isto não é final, isto é uma coisa em definição, isto é algo que está se transformando e eu não sei o que é. Isso é bom, é bom que você não saiba. Você faz o protótipo não para você dizer como tem que ser, é para você saber, descobrir como é a coisa. Então o protótipo não é uma visualização do seu conceito completo. Isso aqui é um protótipo que eu fiz para um sistema de controle, ou melhor, monitoramento de entrada de pessoas em salas no último conferência, no caso a Conferência de Cidades Inovadoras da FIEP era um sistema com RFID e tal, então eu peguei um leitor de RFID bem simples e a gente prototipou, tosco, com materiais bem caseiros um modelo de entrada e saída de sala para poder ver o efeito que isso tinha numa visualização de cidade. O protótipo é uma pergunta que só pode ser respondida pela construção do mesmo. Então o protótipo não é uma resposta, é uma pergunta, a resposta é o que acontece com o protótipo quando as pessoas começam a utilizar. Então ele não é uma solução. Perguntas típicas que o protótipo, que geram o protótipo, que motivam a construção do protótipo. Como é que será que vai ficar isso aqui depois que juntar todas as ideias diferentes do conceito? Será que elas encaixam? Será que vai ficar legal? Como será a aparência? Como é que vai ser? Vai ser bonito? Vai ser feio? Vai ser bagunçado? Como é que vai ser isso? Como será a sensação de interagir com esse serviço, com esse produto, com essas funcionalidades? Como é que será que as funcionalidades de fato vão funcionar na prática? Será que vai funcionar? Essa é a pergunta chave. Será que funciona? Se você começa a fazer um protótipo, já com a certeza que vai funcionar, então nem faça. Porque o protótipo é uma pergunta, como eu disse, você vai perder tempo. Faz o produto final, quebra a cara, depois põe no mercado, vê que ninguém usou. Se você usa protótipo é uma visão humilde, que pode ser que você não esteja correto nas suas hipóteses, nas suas funções. Respostas que você pode ter após testar um protótipo. As partes do conceito não encaixavam, não ficavam bom, ficavam estranhos, Frankenstein ficou horrível, é muito difícil de usar, confuso, e você chega com a visão "ah, não funciona, vou fazer outra coisa, vou materializar esse conceito de outra maneira". Então hoje, se você tiver a oportunidade de fazer vários protótipos, vai ser muito melhor. Porque vocês vão testar diferentes maneiras de materializar o conceito e talvez com isso vocês consigam uma ideia melhor, uma materialização melhor do que se tivesse feito apenas uma. Então ele é uma maneira de você explorar o que é possível. Veja aqui um exemplo de protótipo feito para o controle do Playstation 1. Quantos protótipos foram feitos? Então esse aqui é o primeiro protótipo que a equipe fez e aqui é o último. Um, dois, três, quatro, cinco. Não foram feitos nessa ordem necessariamente, porque às vezes você explora vários protótipos ao mesmo tempo, mas a tendência foi do projeto, foi vindo aqui pra cá. Por que? Por que fazer tantos protótipos? Pra ver a qualidade da pega, pra ver se era rápido pra você acionar, pra ver que tipos de jogos que ficaria bom, que tipo de jogos não ficaria bom, pra testar a longo prazo, como é que fica câncer, se ficar bastante tempo com aquele dedo ali. Então vejam que esse controle hoje virou mais ou menos que o padrão. Ele influenciou todos os outros controles. O controle do Xbox segue muito essa linha ainda. O Wii, que eu acho que realmente é muito diferente, não seguiu essa linha, mas o Xbox seguiu, e outras máquinas de consoles menores. Então ele realmente foi um dos grandes projetos de controles de video game, foi esse do Playstation, graças à prototipação. Então prototipação não é um protótipo só, prototipação é um processo iterativo. Quer dizer, você faz um protótipo, testa, aprende com ele, faz outro protótipo, testa, aprende com ele, faz outro protótipo. Então se você for fazer só um protótipo, tudo bem como exercício de sala, a gente não tem muito tempo. Mas se você for num projeto real, faça o protótipo já pensando que você vai fazer vários, do contrário você vai aprender muito pouco. Quem que pode testar o protótipo pra você? Você mesmo, né? Você que desenhou o protótipo, você pode testar. Mas é claro, é limitado, a tendência é que você seja enviesado, você fala "é, tá uma beleza, tá uma adorei, olha que legal, até materializou, deu certo". Beleza, pode fazer isso, pode, mas no começo é melhor você pedir pra outra pessoa. Pra que? Um outro designer já vai trazer uma visão mais crítica, já vai analisar outros aspectos que você não tava vendo. Melhor ainda um usuário, uma pessoa que não conhece o seu projeto, que vai avaliar aquele protótipo como se fosse a primeira vez que ele interagisse com aquele produto ou serviço. Então ele vai ser mais crítico e possivelmente mais confuso também. E um testador automático também é possível. Então você pode, por exemplo, nesse caso aqui, é uma máquina de apertar botões. Isso aí é pra ver se aquele teu teclado ali ele aguenta mais de mil apertadas de botões por segundo, ou coisas do gênero. Existem testadores automáticos digitais, você pode botar o protótipo lá pra ver se ele gera muitos mensagens, erros, bugs, por aí vai. É uma maneira de testar o protótipo também. O que pode ser mensurado com protótipos? A carga de trabalho do usuário, ou seja, quanto fadiga física aquilo provoca, ou fadiga mental. Qualidade da pega, se você tiver um objeto físico, o protótipo é fundamental pra você ver se encaixa na mão da pessoa. É muito triste você montar um produto físico que quando chega no mercado a pessoa simplesmente não consegue encaixar, botar a mão, ali apertar o botão. Então tem que fazer protótipo pra produto físico, pra testar pega. O tempo que leva pra pessoa executar uma tarefa, isso digital é fundamental, as vezes as pessoas não tem, não querem perder tempo com o processo, então você mensura quanto tempo demora. Os erros, quantas vezes a pessoa clica no negócio ali, "ah, não era o que eu esperava", pode mensurar quantas vezes a pessoa tem erro. A compreensão, se a pessoa entende que isso aqui é um apagador e não uma careta. A emoção, a empolgação de "nossa que legal, uma louça digital, uau". Não, talvez seja "que legal, louça digital". "Putz, esse negócio aqui eu acho muito estranho, eu tô com medo, acho que vou usar isso aqui, não vai dar certo". Então todas essas reações são muito importantes pra testar no protótipo e talvez seja o motivo pelo qual isso aqui não é utilizado, essa louça aqui, porque não foi feito um teste de protótipo com relação a emoção, ela funciona, é usável, é, mas eu acho que muito professor deve ter medo desse negócio aqui. Satisfação, depois de usar, é satisfatório, eu já usei uma dessa, achei horrível, a sensação é que, tipo, é muito lento. O único problema, o principal problema disso aqui é que eu faço assim, daqui a dois segundos ele desenha a minha pra mim. Então eu nem uso. É muito... não acompanho meu raciocínio, meu pensamento, então o professor fica puxando pra trás. Então por que não usar o quagney que tá aqui do lado, né? Esses testes são importantíssimos pra ver que, de repente, eu não precisava investir tanto dinheiro numa tecnologia como essa que acaba vendo elefante branco. Tipos de protótipos. Eu vejo três tipos. Protótipo formal, protótipo estrutural, protótipo funcional. Protótipo formal, ele quer avaliar a forma, se a forma é bonita, se ela é bacana, se ela encaixa na mão, não tava como ir montando, como fica a distribuição do que vai pedindo, o conteúdo. Isso é chamado modelo volumétrico na arquitetura, no design de produto, modelo em escala, principalmente na arquitetura, render no design de produto, quando se faz isso digital, usando um aplicativo 3D. Protótipo estrutural. Ele serve pra testar um processo, pra ver se as coisas, como elas se desenrolam de acordo com uma estrutura de ações, de sequências. Conhecido como Mockup, modelo estrutural na arquitetura, cenário, quando você imagina uma história, como é que o produto, o serviço vai se desenrolar de acordo com a história. Caso de uso, é uma espécie de um protótipo estrutural. Protótipo funcional, ele já é uma prova de conceito, uma simulação, algo que você consegue realmente apertar e a cola sai. É meio tosca, meio chunchado, pode ser uma gambiarra que faz a cola sair, mas você consegue tirar a cola dele dentro, ele funciona. Você tem uma sensação de funcionalidade, e por isso você consegue avaliar o uso, propriamente dito, a função. Exemplos. Aqui são alguns protótipos formais que eu já construí em vários projetos. Isso aqui é um rendering de um gabinete de HD portátil transparente, e a ideia de ser transparente é que você sabe que tem um HD ali dentro, e você sabe que se você cair no chão você vai perder seus dados, porque a maioria das pessoas, no começo, quando eu criei isso aqui, não sabiam que aquele negócio portátil, HD portátil tinha um HD dentro mesmo. O nome era HD, mas as pessoas jogavam de qualquer jeito e tal, e putz, caia no chão, perdia todos os dados. Aqui você tem um controle remoto de televisão, que eles imaginam que tem um Smart TV, eles fizeram de massa de modelar, estão testando a pega para ver se você controla que gestos dá para fazer para você controlar a TV. Isso aqui é um jogo de tabuleiro, estou avaliando se a ideia é de ter construção de um hospital a partir de peças de tabuleiro que se encaixam em cima da outra, se isso é atrás pessoas, eu estava testando isso, eu não estava testando regras, e na hora as pessoas imediatamente ficaram interessadas nessa característica estética de como se construia um objeto. Então aqui eu avalei a forma, principalmente, e aqui o fim mais comum, que é o layout de um site. O layout normalmente não é clicável, você não pode clicar aqui e entrar nos links, não, isso aqui é só uma imagem que eu fiz no Photoshop para mostrar como vai ficar o resultado final. A forma, então, um protótipo formal. Aqui são protótipos estruturais, aqui você vê um protótipo de como as pessoas vão entrar numa área de pronto atendimento de um hospital e como elas vão ser direcionadas para diferentes partes desse pronto atendimento de acordo com a gravidade da doença que eles têm. Então aqui o bonequinho de Lego a gente fazia a direcionamento e testava para ver se a pessoa ia ficar confusa, se ela saía a entender que estava indo para qual lado, para o outro lado, se fazia sentido essa distribuição, um protótipo estrutural. Aqui você tem um jogo que simula a estrutura de interação no Facebook, como que as mensagens são distribuídas, como é que o like afeta o compartilhamento dos posts, posts são post-it, as conexões de amizade são esses fios e o like eram umas adesivinhas que a gente colocava no post. Aqui você vê uma coisa bem comum, que é um protótipo de papel, para você testar a estrutura de interação, a sequência, de maneira que você pode rapidamente modificar, porque é só um rabisco na tela, isso aqui provavelmente vocês vão fazer se vocês quiserem fazer um serviço digital, um produto digital. Aqui por fim o wireframe, planta baixa de uma página de website ou um software. Você só define os elementos estruturais, aqui vai ter texto, aqui vai ter imagem, qual imagem não sei, não interessa, só estou colocando aqui porque eu sei que aqui vai ter uma imagem, eu estou querendo focar na estrutura e não na forma e não na função. Os próximos protótipos são funcionais, eles testam a usabilidade, então aqui você tem um protótipo funcional de um sistema de identificação do perfil ayurvédico da pessoa, então tem três douches, a pessoa respondendo perguntas e aí conforme respondia as perguntas uma das áreas aqui ficava mais preenchida nessa espécie de gráfico de pizza manual e aí você dizia se era vata, pita, capa, que são as categorias da medicina rivegica. Então era funcional, mas era de papel e o produto final era pra ser de papel mesmo. Isso aqui é um protótipo feito com um pocket PC, na época em flash, que é uma plataforma que hoje não se usa mais para prototipar, mas na época ainda era utilizada, é basicamente um jogo, um livro digital interativo que a criança passa o dedo em cima e aí ele vai lendo pra criança, vai verbalizando o que ela está lendo. Eu fiz isso pro meu filho, na verdade, esse jogo e usei um pocket PC porque era o que eu tinha na época de touchscreen. Aqui você vê nossos estudantes do HPC, a equipe do HPC, tentando montar um protótipo funcional de uma espécie de esponja que sugaria todas as plasmas e toxinas que o corpo exala numa ferida pra a ferida não ficar muito infeccionada, pra ficar limpa, eles estavam criando uma espécie de esponja e aqui eles tinham um pedaço de zopor que representava um buraco no corpo de uma pessoa. Eles tinham uma ideia de que essa esponja funcionaria tal qual, eles estavam testando se ela funcionaria tal qual, um esfregão, ela entra e gira ali. Afinal, quando eles acabaram descartando essa ideia, você já dá pra sentir a dor. E aqui é um protótipo funcional de uma de um bracelete pra cegos poderem identificar cores nos objetos, então eles passariam e aí falaria qual que é a cor do objeto. Isso foi feito com o LEGO Mindstorms, que é uma plataforma de programação da LEGO bem simples. Então o que quer dizer performance emergente? Isso aí é uma categoria, um conceito teórico que eu utilizo pra agregar informação, interação e experiência. Quando você quer projetar informação, focalize em protótipos formais. Quando você quer projetar interação, focalize em protótipos estruturais. E quando você quer proporcionar experiências marcantes que as pessoas levam pra vida, focalize em protótipos funcionais. Mas é claro, você pode também fazer os três. Materiais que você pode usar pra prototipação? Primeiro e mais importante, o corpo. Você pode prototipar qualquer coisa com o corpo, é impressionante, vocês já vão ver uns vídeos daqui a pouco. Uma pessoa pode fazer o papel de uma tecnologia, é a maneira mais rápida de prototipar alguma coisa. Massa de modelar, polypropileno, LEGO, papel, post-it, barbante, cola quente, papel Arduino, que é uma placa programável de input/output, muito fácil de utilizar. InVision é um web app que você pode construir um protótipo de interface visual clicado muito rapidamente. E o Adobe Experience Design, que é uma ferramenta bem robusta pra projetar todos os aspectos visuais de um software ou um website. Então, basicamente eu advogo uma proposta de um processo de prototipação que evolui de low-tech de ferramentas de baixo nível de tecnologia, como essas coisas que vocês estão vendo aqui, pra chegar no high-tech. Se a gente fosse fazer uma prototipação high-tech, não daria tempo nessa aula. Mas se alguém tiver experiência já com o InVision, com o Adobe Experience Design, pode utilizar hoje na aula. Mas eu imagino que vocês não têm, a maioria não têm, então, portanto, utilizem os materiais low-tech e pense que futuramente vocês poderiam converter isso em materiais high-tech depois de validar se realmente aquilo ali tem valor. Se não entregar valor, pra que fazer o high-tech que demora mais tempo, dá mais trabalho? Teste primeiro com o low-tech. Então, técnicas específicas aqui que eu vou passar pra vocês de prototipação que economizam tempo de desenvolvimento. Basicamente, todas as três técnicas são técnicas de enganar. Como enganar as pessoas de aquele protótipo é o produto ou serviço que você está oferecendo e fazer a pessoa se sentir com a sensação de que ela está usando, mesmo que ela não esteja de fato. São técnicas de imaginação. Mágico de ossos é uma pessoa, ela faz o papel do processador, do computador, então, por exemplo, você dá um papel assim pra... Digamos que aqui o protótipo é esse aqui, são duas opções que você tem. Vamos fazer um exemplo de mágico de ossos. Tem duas opções, qual você escolhe? Acabamos de prototipar uma interação que tem uma escolha entre dois botões e uma resposta. Então, fizemos isso, eu fui o mágico de ossos, ela foi o usuário nesse exemplo. Isso dá pra fazer não só com papel, dá pra você fazer com movimentos, braços, utilizada a imaginação do usuário pra que ele entre no lugar do usuário mesmo. A fantasia guiada é um pouquinho diferente. Na fantasia guiada, eu como mágico de ossos, não faço nada. Não tem mágico de ossos. Na fantasia guiada, eu dou um objeto pro usuário, e eu diria, digamos que você quisesse matar uma pessoa, como você faria? Agora ela já se imaginou e tal. Agora, digamos que pra matar uma pessoa, primeiro, você precise tirar um pouco de sangue do seu próprio corpo, porque essa arma funciona com seu próprio sangue. Como é que você faria? Ela tentou várias coisas, ela tentou botar aqui, tentou fazer aqui. E esse cabo aí? O que você faria com esse cabo? Veja, eu não estou dizendo como ela tem que fazer. O que você faria com esse cabo? Nada? Então, digamos assim, meu protótipo é o seguinte, digamos que a minha ideia fosse esse cabo aqui, ele entra dentro do corpo da pessoa, eu boto aqui na minha artéria, eu vejo sei lá o que, e aí, só atira enquanto estiver conectado na minha artéria. Cada vez que eu aperto o botão, tira 200ml de sangue. Então, digamos que esse seja o meu produto. Eu quero saber se isso gera valor, professor, ou não. Então, isso aqui é a fantasia guiada. É claro que é um protótipo de um produto para refletir, não é? É um produto para ser utilizado de fato. É edição de vídeo, é outra maneira de se enganar, talvez a mais fácil de todas. Se você pega e faz um corte, no vídeo você consegue parecer que o negócio está funcionando. Então, ao invés de mostrar o protótipo, você grava o vídeo e faz uma pessoa fingir que ela está usando, e depois você mostra para alguém que realmente é um, alguém que pode dar um feedback mais real, você mostra o vídeo e pergunta, você usaria, você faz sentido isso que está acontecendo no vídeo? Beleza, faz, não faz. Vamos ver alguns exemplos, então? Primeiro tem um vídeo tutorial que faz parte do programa Renault Experience, que a gente da agência desenvolveu no ano passado, que ainda está continuando, que é um tutorial de dois minutos sobre as melhores práticas de prototipação. , é, deixa eu me atar aqui. Não, aqui não, deixa eu pegar. Você reconhece? Pode ficar muito, hein? Oi. É, é complicado isso aí. Deixa eu ver. Diminui antes de dar o play aqui. Opa, é difícil aqui. Desculpem nosso, é que não fizeram o protótipo aqui do sistema, vamos ver. Esse sistema é muito ruim, sempre dá problema, mas para o outro lado... A posição que estava vendo eu fiz isso. Uma ideia tem que voltar. É, eu queria te perguntar. E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí? E aí?