Design III: protótipos e testes | Kara Hodecker | Skillshare

Velocidade de reprodução


  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

Design III: protótipos e testes

teacher avatar Kara Hodecker, Product Design Leader

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Aulas neste curso

7 aulas (37 min)
    • 1. Projeto de introdução e curso

      1:01
    • 2. Preparo para protótipos

      6:51
    • 3. Escrever um script de teste de usuário

      10:33
    • 4. Construa um protótipo

      9:10
    • 5. Recrutar usuários e executar testes

      3:17
    • 6. Revise e avalie resultados

      4:10
    • 7. Iterate e pensamentos finais

      2:23
  • --
  • Nível iniciante
  • Nível intermediário
  • Nível avançado
  • Todos os níveis

Gerado pela comunidade

O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.

820

Estudantes

1

Projeto

Sobre este curso

Bem-vindo à lição final desta série de três partes de cursos de design iOS. Durante toda esta série, cobrimos os conceitos básicos de design, interação e design visual de experiência do usuário, tudo isso se relacionam ao design para dispositivos móveis. Agora que você ganhou o conhecimento e as ferramentas para criar um aplicativo bonito e intuitivo, você vai colocar seus desenhos ao teste com usuários reais. No final da série, você deve se sentir confiante nas suas habilidades de design para iOS com as ferramentas e técnicas que você aprendeu.

Esse curso é ótimo para designers de qualquer nível de habilidade. Neste curso, você vai aprender a usar o InVision para fazer prototipagem, para que nenhuma experiência prévia seja necessária.


O que você vai aprender

Na terceira e última classe da série, vou caminhar para você como usar o InVision para criar um protótipo de cliques do aplicativo que você criou nas duas aulas anteriores. Os tópicos que vamos abranger incluem:

  • Como se preparar para seu protótipo. Você vai criar uma conta do InVision e salvar as telas que você vai usar para criar o protótipo.
  • Como escrever um script de teste de usuário. Você vai definir o palco para seus testadores e determinar quais fluxos você gostaria de testar.
  • Construindo um protótipo. Você vai obter instruções passo-a-passo sobre como montar um protótipo clique.
  • Recrutar usuários e executar testes. Vamos ver como seu trabalho duro já pagou! Você vai aprender a realizar testes e quem seus usuários devem ser.
  • Avaliar seus resultados. Saiba diretrizes para avaliação, takeaway chave e seus próximos passos para o sucesso do seu aplicativo.


O que você vai fazer

Esse projeto para toda a série será criar seu próprio aplicativo de viagem ou repensar um já existente. Para este terceiro curso, seu entregável será um protótipo de cliques do seu aplicativo para iPhone. Você também vai escrever um script para orientar seus testadores de usuários através do seu protótipo.


Outros cursos nesta série

Conheça seu professor

Teacher Profile Image

Kara Hodecker

Product Design Leader

Professor

I'm currently designing at Panorama Education in Boston, MA. Previously, I spent five and half years at Evernote, where I led a team of product designers who were responsible for the core app experiences for both mobile and desktop. Prior to that, I had the opportunity to work with some incredibly talented designers at Yahoo!, Odopod, and Hunt & Gather.

Outside of work, my time is spent balancing between being with my two daughters and my patient husband, and pushing myself in CrossFit classes. I also love traveling whenever I get the chance, ice cream, and coffee way more than I probably should. You can also find me on dribbble, twitter, and linked in.

Visualizar o perfil completo

Nota do curso

As expectativas foram atingidas?
    Superou!
  • 0%
  • Sim
  • 0%
  • Um pouco
  • 0%
  • Não
  • 0%
Arquivo de avaliações

Em outubro de 2018, atualizamos nosso sistema de avaliações para melhorar a forma como coletamos feedback. Abaixo estão as avaliações escritas antes dessa atualização.

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui cursos curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

Faça cursos em qualquer lugar com o aplicativo da Skillshare. Assista no avião, no metrô ou em qualquer lugar que funcione melhor para você, por streaming ou download.

Transcrições

1. Projeto de introdução e curso: Oi, todo mundo. Eu sou cuidadoso. Ho Decker e eu somos gerente de design de produtos na Evernote. Bem-vindo à terceira e última aula no meu design IOS. A Siri é desta turma. Vamos nos concentrar em prototipagem e testes de usuários. Não é um requisito toe ter tomado as duas classes anteriores sobre você ex e design visual antes deste, mas você vai criar um projeto mais completo entre as três classes. Para o seu projeto, você criará um protótipo clicável de um aplicativo para iPhone usando designs que você já criou. Você pode usar designs das duas classes anteriores na Siri, ou pode ser um aplicativo para iPhone de sua escolha, algo que você criou sozinho. Em seguida, você usará esse protótipo para fazer testes de usuários para ajudar a validar suas decisões de design. Esta classe lhe dará as ferramentas para criar facilmente um protótipo direito, um script de teste de usuário e realizar testes de usuário. Vamos começar 2. Preparo para protótipos: se você tem seguido esta série de classe do que bem-vindo de volta. Se sua nova recepção e eu esperamos que você tire algo desta aula antes de começarmos , vamos explicar por que é tão importante protótipo. Provavelmente você tem um aplicativo bem projetado e bem pensado neste momento, mas como você deve saber se é realmente um ótimo aplicativo? É por isso que obter validação de outros é fundamental. prototipagem pode ajudá-lo a testar seu aplicativo muito mais rapidamente do que criar um aplicativo totalmente funcional. Mesmo que você não esteja planejando fazer isso, ainda é uma maneira muito rápida de testar seus projetos. Você também pode ver quais escolhas de design você fez foram bem-sucedidas e o que pode não estar funcionando tão bem que você será capaz de identificar o que não faz sentido para os usuários e se há algum fluxo confuso. Além disso, fazer com que os usuários testem seu protótipo lhe dará feedback crítico que você pode usar para fazer alterações e melhorar seu aplicativo. Há um monte de realmente grandes ferramentas de prototipagem por aí em algum lugar, muito simples, e outras podem ser bastante complexas e permitem que você construa um protótipo que é quase tão bom quanto o real para nossos propósitos. Vamos nos concentrar em uma ferramenta que eu uso o tempo todo no trabalho chamada Envision. Se você ainda não ouviu falar, esta ferramenta de prototipagem baseada na Web é incrível. É tão fácil e rápido transformar seus designs em algo com o qual as pessoas podem interagir. Não há nenhuma citação envolvida Onley alguns passos rápidos para lançar um protótipo juntos. Vamos começar configurando nosso primeiro projeto de prototipagem. Se ainda não tiver uma conta, inscreva-se. É de graça. Agora vou guiar-te a preparar o teu projecto. Tudo bem, então o que eu fiz aqui foi em frente e puxou o site da visão. E como eu disse, esta é uma ferramenta de prototipagem da Web, então não há nada que você precise realmente baixar. Não há software. Tudo é feito diretamente no site, que é ótimo. Portanto, se você não tem uma conta, você vai querer clicar nesta inscrição gratuitamente. E você pode ir em frente e criar uma conta gratuita para iniciar seu projeto. Tenho uma conta, então vou entrar aqui, certo? E então a primeira coisa que eu vou ver é uma espécie de tela em branco e eles estão me dizendo que eu não tenho nenhum protótipo vazio, ativo, e então eu posso ir em frente e começar a criar meu 1º 1 super simples. Então eu vou em frente e clicar no grande Plus e eu tenho esta janela para ser capaz de criar um novo protótipo. Eso meu aplicativo ao longo, este produto tem sido redesenhando o aplicativo Southwest iPhone, então eu vou chamar este aplicativo Sudoeste. E então o que eu faço aqui é tipo selecionado. Então eu vou descer e clicar no iPhone, mas é muito legal. Você pode ver todas as coisas diferentes que você pode criar um protótipo chão. E todos esses modelos diferentes são realmente otimizados para essas coisas. Então, quando eu escolher o iPhone, ele vai caber perfeitamente no meu iPhone. Eu também posso escolher retrato ou paisagem. É um pouco mais relevante para um iPad ou algum tipo de tablet, porque provavelmente no telefone, você vai usar retrato. Então vamos ficar com isso e eu tenho uma conta de negócios dois. Então eu vou apenas ir em frente e clicar em minha conta pessoal grande e dizer criar projeto. Então agora que eu preciso realmente adicionar coisas ao meu protótipo, eu vou para a próxima etapa onde eu vou voltar para a loja de fotos e exportar algumas das minhas telas. Eso que enfraquecem foram capazes de adicioná-los ao nosso produto. Então nós vamos empurrar para cima aqui, e eu tenho todos os meus arquivos todos já abertos e você pode ter todos os seus projetos visuais em um de nosso solo superior. Eu dividi o meu em três para as telas diferentes que eu tenho só porque é um pouco mais fácil para mim neste momento. Mas, você sabe, usar a bússola de camada ou algo assim é uma ótima maneira de fazer isso. Hum, e o que eu quero fazer é realmente ir para exportação de arquivos rápida como PNG maneira super rápida. Eu poderia ir direto ao meu desktop e dizer, “Diga aquele cara e lá vamos nós. Hum, então isso vai salvar toda a coisa. Uma coisa que é realmente útil está em nossos projetos. Adicionamos esta barra de navegação aqui à barra de status. Então o que eu gosto de fazer é realmente desligar isso porque a visão realmente adiciona essa barra de status no protótipo também. É algo que é controlado pela Apple. Então, quando você está usando o protótipo, hum , no iPhone, então se você tem essa camada ativada na loja de fotos e isso está na sua tela real, ele meio que vai aparecer, e então algo mais é vai aparecer em cima dela. Então é mais fácil se desligarmos isso e então eu posso realmente ir em frente e exportar isso novo e apenas receber aquele cara assim. Se alguém passar, faça isso. Este não tinha. Ótimo. Este que desligará a barra de estado. E isso só vai tornar as coisas um pouco mais fáceis para nós. Não temos que voltar e fazer isso depois. Parece que guardei o outro no lugar errado. Deixe-me voltar e exportá-la novamente. Não te quero lá dentro. Quero seu intestino. Ok, então agora eu tenho toda a minha tela guardada. Você iria em frente e faria isso por todos os seus pecados. Você provavelmente tem muito mais do que três, mas porque eu só tenho três para o meu projeto de estadia completa. Só vou trabalhar com eles. Hum, então agora o que eu quero fazer assim. Eu só quero meio que gosto de organizar as coisas. E então eu fiz essa pasta de telas de aplicativos de viagem, e o que eu quero fazer é apenas jogar minhas telas aqui, e assim eles são um pouco mais organizados. Você também vai notar que eu tenho eles apenas salvos como o que os arquivos do Photoshop foram chamados. E assim você pode fazer o que quiser aqui. Mas é muito bom ter algum tipo de maneira organizacional de nomear suas telas diferentes , porque quando você está dentro, imaginem , imaginem é assim que eles serão enviados. Então você quer ter certeza de que sabe o que está procurando. Então isso foi como na tela um. Você pode não saber o que isso significa, mesmo que eles dêem uma prévia. Mas é por isso que temos, tipo, o voo do livro e, em seguida, aqui selecionar cidade, esse tipo de coisa partida. Então você quer continuar e ter uma pequena organização adiantada só vai te ajudar depois. Então essa é a primeira parte, e vamos para a próxima 3. Escrever um script de teste de usuário: primeiro lugar. Escrever um script para usuários pode parecer um passo assustador ou até mesmo necessário, você pode pensar. Mas é tão simples. Por que eu deveria me incomodar? Você realmente não deveria simplesmente jogar um protótipo em alguém e deixá-los ir em frente, entanto. Sim, há momentos durante os testes em que você deve deixá-los correr soltos, mas queremos realizar nossos testes em um ambiente mais controlado. Comece puxando seus quadros de arame, seus fluxos de usuário e até mesmo suas simulações. Se você tiver fluxos de usuário, metade do seu trabalho já está concluído. Você vai querer testar esses fluxos para ver se os usuários passam por eles e ver se eles fazem sentido. Então você pode construir seu roteiro em torno disso. Há seis componentes principais em um script de teste do usuário. Estes incluem um teste de introdução. Configure um cenário, uma série de tarefas ou etapas, perguntas e comentários. Você usará esses componentes como a estrutura para seu script. Ao escrever o documento criado script para digitar tudo neste exemplo, eu estou usando sempre sabe, que é uma ótima plataforma para manter tudo junto. Você pode até organizar todas as suas telas, quadros de fio, scripts de teste e muito mais juntos. O Google Docks também é outra ótima opção. Agora vamos dar uma olhada no meu script de teste de exemplo. Certo, então aqui está o meu exemplo. O guião. Você pode ver como eu organizei o documento em cada um dos seis componentes porque vamos estar compartilhando isso com cada testador. Quero torná-lo o mais claro e fácil de seguir o nosso possível. A primeira parte aqui é a introdução. Este serve é uma pista para o seu protótipo e diz ao testador o que exatamente eles estarão fazendo. Deixe-os saber qual é o seu aplicativo e, possivelmente, por que você está construindo ele. Em seguida, você vai querer incluir um resumo rápido de como o teste irá funcionar. Você pode incluir o máximo de informações aqui é que você quer, mas tente mantê-lo breve para que o testador não é realmente sobrecarregado imediatamente. Em seguida, a configuração. Isto é realmente apenas aqui para reiterar o que você abordou na introdução e apenas um formato mais digerível. Você pode ser mais descritivo aqui se quiser, ou você pode mantê-lo muito breve. O próximo é o cenário. Isso deve ser retirado diretamente de suas jornadas e fluxos de usuário, mas é bom adicionar um pouco mais de detalhes novamente. Seja tão descritivo quanto você quiser, então eu vou ler meu cenário aqui caso você não possa realmente vê-lo, é no meio do verão e você quer planejar uma visita neste outono a um amigo que mora em Boston. Você tem datas flexíveis para viajar, então você quer olhar em volta para um bom negócio. Você gosta de voar Sudoeste, então você vai procurar um vôo neste aplicativo. Eu também adicionei este pouco por favor lembre-se, esta é uma simulação do aplicativo Sudoeste e não vai se comportar como um aplicativo totalmente funcional . Nem todos os botões, Air Tabal. E para começar de novo, saia do protótipo e reabra. É bom incluir aquele pouco, por favor, lembre-se, porque muitas vezes as pessoas são como Oh, yeah, yeah, yeah, é um protótipo. Mas então eles fazem um pouco rápido por aí, oh, essa coisa não está funcionando ou tipo, por que eu não posso tocar nisso? Então, apenas um pequeno lembrete é bom incluir Tudo bem, então esta próxima parte esta vai ser realmente a carne do nosso teste, embora estes são os passos e tarefas que você terá os seus testadores passando. Então o que eu fiz aqui foi realmente criar uma pequena tabela. Isso é que tipo de bom usar o Evernote porque é até mesmo rápido fazer isso, hum, bem aqui. Então, se eu realmente clicar aqui, há este pequeno ícone de tabela bem aqui em cima para que eu possa decidir quantas tabelas eu quero adicionar . Legal. Então, a principal tarefa é reservar um voo de São Francisco para Boston. E então o que você quer fazer é dividir isso em etapas e você quer reiterar aos usuários que você realmente quer que eles passem por um de cada vez lentamente. Você não quer que eles se apressem e comecem a tocar em tudo e passar, porque queremos que eles façam uma pausa em certas partes. Então, por exemplo, nesta etapa um, abra o protótipo antes de tocar em qualquer coisa. Descreva seus sentimentos da primeira tela que você vê. O que você iria tocar para começar? Então estamos dizendo ao usuário aqui, OK, basta olhar para esta coisa pela primeira vez. Deixe-me saber o que você acha. Você sabe, eles podem ser qualquer coisa de design visual para que eles possam dizer como, oh, você sabe, eu realmente não gosto dessa cor. Ou eles podem dizer, oh, uau, isso parece realmente ótimo. Acho que quero o dedo do pé. Sabe, eu adoraria usar esse aplicativo. Qualquer tipo de feedback é incrível. E então tome notas, como eles estão indo. Hum, mas então, você sabe, nós perguntamos a eles, o que você iria tocar para começar? Então não estamos dizendo para ir em frente e fazê-lo ainda faz o que você iria tocar? Então esse tipo de permite que eles falem em voz alta e que você saiba, tipo, ok, eu acho que eu faria isso. E também, vamos você saber, imediatamente. Hum, eles estão realmente fazendo a coisa certa, ou há algumas coisas diferentes que eles podem tocar e que podem realmente prejudicá-los do que você quer que eles façam? Então uma coisa, uma vez que eles terminem o primeiro passo, você pode guiá-los ou se eles sentem apenas, você sabe, OK, eles leram isso e eles responderam a pergunta, Hum, e eles podem seguir em frente. Então, para o segundo passo, eu estou dizendo Ok, toque no botão de vôo do livro para que, você sabe, eles vão em frente e fazer isso, e então nós estamos meio que parando de novo e dizendo, tudo bem, O que você esperava ver na tela? Então, um deles apertou aquele botão, sabe? Isso fez o que exatamente? Que eles estavam pensando que iria dilatar e eles acham que algo está faltando? E então eu adicionei algumas outras perguntas aqui que eu quero que eles olhem através de uma resposta antes que eles estão seguindo em frente. Novamente, você sabe, notei que a cidade de partida já está preenchida como São Francisco. Isso representa sua localização atual. Isso é útil para você? Deixe-os responder a pergunta e quantos detalhes quiserem. Se eles não estão te dando uma tonelada e você quer gnomo ou se sentir livre para tipo de como pop lá dentro e fazer algumas outras perguntas ou apenas tentar levá-los para o mesmo ou depois disso , você pode dizer, OK, agora toque nos dois locais para que você possa guiá-los através. Mas é bom perguntar: “ Ei, o que você iria tocar?” Mas é bom perguntar: “ Ei, Ei, Então você quer, hum, tê-los continuar por este caminho e novamente, como tudo isso, vai ser muito, muito personalizado para o seu próprio aplicativo. Isto é apenas eu estou te dando este exemplo para apenas tipo de fazer você passar, hum, que tipo de coisas você poderia dilatar. E assim você sabe. Ok, vá em frente, escolha Boston sua parte de trás da tela de reservas, e então nós realmente dizemos continuar como você normalmente faria, para escolher as datas e o número de passageiros Então você não precisa ser realmente explícito a cada passo se houver muitas etapas repetitivas que você deseja que elas façam. Hum, mas você pode ir em frente e apenas, você sabe, dizer Tudo bem, legal. Continue indo e depois detendo-os novamente. Quando? Quando estiverem prontos para parar. Então, passo seis aqui. É como se mudasse o dia da partida do voo? Se quiser comparar preços, em referência, podemos ir até aqui, abrir esta tela. em referência, podemos ir até aqui, E assim, você sabe, você está esperando que eles vão identificar algo nesta área de como eles poderiam mudar a data. E então nós dissemos, você acha que há informações suficientes sobre cada voo apresentado? Então, receba seus comentários sobre a forma como você fez o design de informações sobre esse tipo de coisa. Então, você sabe, ele não tem todas as informações. Não tem nada, , sobre quanto tempo é a escala. Por exemplo, isso é suficiente para eles? Eles queriam ver mais? Então, recebendo tudo isso, todo esse feedback vai ser muito útil. Tudo bem, então vamos continuar até eles terminarem com seu protótipo. Agora, a última parte vai ser as nossas perguntas de acompanhamento. Um feedback do Zwolle Lazar. Você pode agrupar essas coisas se quiser. Ou você pode mantê-los separados, dependendo de quantas perguntas você tiver. E se há coisas muito específicas que você quer colocar no feedback. Então, alguns exemplos das perguntas de acompanhamento que tenho aqui são, em geral, como você classificaria a conclusão desta tarefa? Você quer dar-lhes uma escala de classificação de algo como muito difícil, muito fácil. Você sabe, preenchendo o meio, hum, mas peça-lhes que escolham um desses e, em seguida, fazê-los apenas elaborar sobre por eles deram essa resposta. Em seguida, você concluiu a tarefa com sucesso, sim ou não? Você quer perguntar aos testadores se eles fizeram isso, e é realmente bom saber se eles, você sabe, eles são impressão. Tipo, eles acham que eles concluíram as tarefas com sucesso? Porque eles podem ter feito uma tarefa diferente ou, hum, não ter seguido completamente a coisa que você queria que eles dissessem. Então, é bom saber sua impressão de Eu acho que eu terminei com sucesso? A seguir é qual é a sua impressão geral do aplicativo. Então deixe-os ir, você sabe, o que eles quiserem adicionar lá e você se vê usando este aplicativo? Isso também é importante porque, você sabe, eles podem pensar como, Oh, sim, isso é fácil de usar ou o que não. Mas, hum, se eles não usassem o aplicativo, é meio importante para você entender o porquê, e talvez isso esteja completamente bem. Talvez eles não sejam o tipo certo de pessoa para usar esse aplicativo. Talvez odeiem a Southwest Airlines por alguma razão, então não são a pessoa alvo, mas é de qualquer maneira. Talvez odeiem a Southwest Airlines por alguma razão , então não são a pessoa alvo, É bom saber, hum, hum, se eles usariam ou não seu aplicativo e, em seguida, em nossa parte de feedback no último bit. É uma espécie de embrulhar. Há mais alguma coisa que eles gostariam de compartilhar? E você sabe disso. Você pode continuar, abrir com, um, um, adicionar qualquer outra coisa que eles quiserem. Se houver outras perguntas específicas, agora é a hora de fazê-las. E isso vai encerrar seu de testede usuário. Então, agora que fizemos, escrevemos nosso roteiro, a próxima parte é que vamos em frente e realmente construir nosso protótipo. 4. Construa um protótipo: Tudo bem. Neste ponto, você tem seu design salvo, e você escreveu seu script para testes de usuários. Então agora vamos em frente e carregar as telas para visualizar e começar a construir o fluxo. Certo, então vamos voltar à visão aqui, e assim diz “drag drop”. Literalmente. Isto é, tipo, a coisa mais fácil do mundo. Vamos abrir nossa pasta, pegar nossas telas, destacar um shopping, jogá-lo lá. Feito incrível. Então esta é a primeira parte, e agora o que eu quero fazer para ver aqui. Então esta é a primeira parte, Esta é esta vista é a minha tela. Então isso vai mostrar tudo o que eu enviei. Como eu disse, você provavelmente terá um monte. Como eu disse, Então eles estão todos aqui. Eu também posso, se eu quiser ir em frente e renomear qualquer uma dessas telas se eu quiser, hum, e vamos realmente entrar em algo como uma tela de exibição. Legal. Então agora eu posso ver um minuto esta pequena estrutura do iPhone. Você também pode ver que eles adicionaram a barra de status que eu estava falando antes. É por isso que escondemos essas camadas do Photoshopped e o que eu quero fazer na verdade. Então isso é como o velho olhar certo. Se eu entrar na configuração C, posso escolher. Se eu entrar na configuração C, Então isso é apenas para, tipo, se eu estou vendo este protótipo na web, eu posso dizer, você sabe, é um menino ou um telefone preto? então Eentãoeu posso escolher se é um iPhone Plus, se é um cinco ou se é um quatro. Nós projetamos nossas telas para o iPhone 6. A espada vai em frente e usar isso. Vou deixá-la preta só para que os nossos desenhos se destacem. Outra coisa que eu posso mudar é o estilo da barra de status, então eu posso tornar o fundo transparente e legal, então isso vai ficar bem em cima de nossos projetos. Eu também poderia mudar se eu quisesse ser ... esse é o pano de fundo. Um transparente. Se eu quisesse ser a cor escura ou os criminosos, vamos deixar essa luz. cor escura ou os criminosos, Parece ótimo. Então, vamos salvar rapidamente perfeito. Ok, então esta vista em que estou aqui é o modo de pré-visualização. Eu tenho alguns outros modos aqui, então nós temos o modo de construção, que nós vamos entrar em seguida. Temos modo de comentário, e então temos o modo histórico. Não vamos falar sobre esses dois agora, não muito relevante para nós, mas este modo de construção vai ser o mais relevante. Então o que eu posso fazer é clicar sobre isso. Então meu amigo Shell foi embora, mas o que me resta é a tela. E então eu tenho essa pequena dica de ferramenta que está me dizendo para clicar e arrastar para criar pontos quentes. Então, ah, ponto quente é simplesmente eu vou criar uma caixa. Vai parecer algo assim. Sou apenas para fins de pré-visualização. E isso seria quando alguém está usando o protótipo, esta seria a área que eles podem tocar na área que está ativa. Então, se eu me afastar, posso cancelar aquele cara. Certo, então o que você vai querer é decidir. Olhando para trás para o seu fluxo. Hum, onde você precisa de pontos quentes? Então, o que os usuários devem ser capazes de clicar em cada coisa? Então, por exemplo, para mim, existem outras opções t escolher um voo de ida ou um voo de várias cidades. Mas você sabe o que eu realmente não quero testar isso. E então eu simplesmente não vou colocar nenhum ponto quente lá porque isso não é algo com que eu preciso que meus usuários interajam. Vamos deixar isso na ida e volta, e está tudo bem. Mas talvez eu queira testar o que acontece quando eles clicam no De até as datas. Se eu quiser puxar esses menus para cima e então, é claro, como o botão de busca de vôos, eu vou querer ser capaz de interagir com todas essas coisas e talvez até mesmo o botão Voltar. Isso vai ser importante quando as pessoas estiverem navegando. Então, para o meu protótipo, porque eu só tenho algumas telas, , a primeira coisa que eu quero fazer é e você pode fazer seus pontos quentes maiores do que a área real se você quiser Teoh. Mas este é um lugar muito bom que alguém será definitivamente capaz de clicar. Então eu vou para o destino selecionado e então eu tenho um monte de opções aqui. Então eu posso, você sabe, externamente, Earl, como muitas dessas coisas, hum, não são super relevantes agora. Mas o que eu realmente quero fazer é ir para a tela do protótipo. Então, estes areiam as telas que eu enviei. E assim quando eu clico neste ponto quente o que eu que tela eu quero vir para cima é a cidade selecionada . Então, vamos clicar nisso. E agora tenho algumas opções. - Onde? Que gesto eu quero? Então é quando o usuário toca dois toques, desliza e aqui é simplesmente um toque, e depois a transição. Eu tenho algumas opções diferentes para, e isso meio que mostra essa pequena animação aqui do que está acontecendo, Pop, hum, o que eu quero fazer para este, porque é meio que para mostrar isso A coisa está chegando por cima. O dissolver. Não é perfeito, mas vai ser uma transição agradável, porque é como se desvanecesse. Então isso é tudo bem. Por enquanto, não há realmente uma maneira de imitar as transições reais do iPhone a partir de um clique através protótipo, mas este é o melhor que podemos fazer quando ele funciona muito bem. Um pouco deste salvamento. Ok, então agora eu ainda estou na tela. , O que Aiken Dio é,na verdade, para que eu possa ver aqui é clicar no dedo do pé e arrastado para criar pontos quentes . Você passar o mouse sobre os pontos quentes é Shift clique para navegar. Então, se eu manter pressionada a tecla Shift e eu clique, então isso vai abrir a tela que eu acabei escolher Legal. Então agora o que eu quero dizer é decidir onde eu quero pontos quentes nesta coisa? , Teoricamente, eu deveria ter a palavra. A cidade de Boston está aqui? Então eu posso escolher isso. Hum, mas vamos dizer que a pessoa já escolheu, e então eu posso fazer um ponto quente neste x aqui e dizer que o que eu queria fazer é voltar para a luz do livro porque eu quero voltar e mostrar que eu escolhi, hum que eu escolhi algo. Então, de novo, vamos ter torneira. E eu vou ter um dissolver para a mesma transição. Talvez eu queira ter se eu tiver mais telas, talvez queira que essa caixa de busca faça algo. Talvez eu queira ter se eu tiver mais telas, Talvez eu queira destacar uma dessas rosas para fazer algo assim você pode realmente ter muitospontos quentes. Talvez eu queira destacar uma dessas rosas para fazer algo assim você pode realmente ter muitos Como você quer dentro do protótipo alguém um clique turno para voltar. E então o que eu também vou fazer é em um ponto quente no botão de busca de vôos. E agora eu quero que isso vá para a nossa última partida de tela porque esta tela que eu tenho aqui , é como um Ziff. O usuário já preencheu todas essas coisas. Hum, e clique em deixe-me também proteger estas torneiras de ar. E então o que eu quero fazer é empurrar para a esquerda é um desses padrões padrão. Então, para dizer o que vai mover as telas para aqui, Alexeev. Legal. Então eu trouxe meus dois pontos quentes. E teoricamente, se você está fazendo algo assim,pode fazer muito sentido não ter essas coisas preenchidas. E teoricamente, se você está fazendo algo assim, Então você terá tela diferente. Então, digamos que você tenha um. Isso é tudo. As coisas vazias já estão pré-povoadas? E então você poderia realmente fazer o usuário clicar em todas essas coisas e fazer escolhas, hum, para ser capaz de selecionar qual destino eles estão indo Teoh quando eles estão partindo esse tipo de coisa e então você só precisa de uma tela com cada um deles preenchido. Então agora, eu vou procurar voos no turno clique Cool desde a terceira tela. Então daqui, o que eu provavelmente faria é dizer ok, vamos, você sabe, fazer um ponto quente se o usuário clicar neste aqui para mostrar o que vai acontecer novamente. Eu não tenho essas telas agora, mas você passaria e faria todo esse processo com tudo aqui. Eu também iria girá-lo. Botão é muito irritante aqui. Eu também escolheria isso de volta, mas em, hum para ser capaz de voltar no protótipo se o usuário se perder ou se eles só querem voltar e verificar algo novamente. Então, uma coisa que é legal que você pode fazer é dizer, tela anterior na Siris, hum, hum, ou voltar para a última tela visitada, então eu poderia apenas clicar nela e um novo empurrão, certo? Seguro. A outra coisa que eu posso fazer com este ponto quente é que eu não tenho que fazê-lo, você sabe, tão pequeno. Não tem que ser esperanças. Não tem que ser exatamente assim. Eu posso realmente fazer esse cara realmente grande de modo que é apenas muito fácil para o usuário para superar , especialmente se não há outros pontos quentes perto dele. 5. Recrutar usuários e executar testes: estão certos. Neste ponto, seu protótipo está pronto, e agora vem a parte divertida de começar a testar. Mas agora você precisa descobrir exatamente com quem você deve testar seu aplicativo. Então aqui estão algumas sugestões. Primeiro, quero que voltes aos utilizadores que fizeste na primeira classe. Esta é uma ótima maneira de identificar o tipo de pessoa que você idealmente testaria. Você pode pensar em alguém que você conhece que é semelhante a cada pessoa? Se você não criou nenhuma pessoa, basta pensar no tipo de pessoa que você pode ver usando seu aplicativo em seguida. É fácil perguntar às pessoas que você já sabe que amigos, familiares ou até mesmo colaboradores podem ser um ótimo recurso. E essas pessoas devem ser realmente honestas com seus comentários. Mesmo que seja negativo, tudo bem lembrá-los disso também. Uma dica é tentar perguntar a qualquer um que é processo de design sênior. Até agora, é melhor manter os testadores um pouco no escuro para que eles possam ser mais subjetivos. Lembre-se de que você pode compartilhar link para o seu protótipo para qualquer pessoa. Testar pessoalmente é ótimo, mas se você não pode fazer isso acontecer, testes remotos funcionam muito bem também. Você pode até configurar algo como um Google sair se você quiser interagir com a pessoa, um, remotamente ou eles poderiam apenas fazê-lo por conta própria e enviar seus comentários de volta para você. Finalmente, se você está pronto para ele, Chai recrutar estranhos Uma ótima maneira de fazer isso é dirigindo para baixo seu café favorito , preparando uma mesa e ver se você pode comprar alguém uma bebida em troca de alguns minutos de o seu tempo. Uma dica é tentar a tarde ou início da noite para melhor sorte, uma vez que a corrida da manhã geralmente é passageiros e eles não vão realmente ter tempo para dar. Então, como funciona o processo de teste? Uma vez que você tem seu primeiro testador, você vai dar a eles uma cópia do seu script para começar. Eles precisarão instalar o protótipo em seu telefone, e você pode dar a eles um resumo rápido de como o teste funcionará. Certifique-se de lembrá-los que este é apenas um clique através do protótipo e não vai funcionar como um aplicativo normal. no telefone deles. Quando o testador está pronto para começar, deixe-os mover através das tarefas e os passos por conta própria, tentando ajudá-los ou responder perguntas a menos que não realmente preso e não pode avançar. Se você está testador não está realmente dizendo muito, você pode dar a eles um empurrão que vai ser realmente útil se eles podem falar seus pensamentos em voz alta como eles vão. Não vai ser útil para ninguém se eles estão sentados lá, silenciosamente tocando nas coisas e não dizendo, porque você realmente quer saber o que está passando pela cabeça deles estabelecendo essas expectativas no início de um teste, vai tornar as coisas mais fáceis e muito mais suaves. Quando os testadores terminarem de passar pelo fluxo, peça-lhes que respondam às suas perguntas de acompanhamento, seja fazendo você mesmo e tomando notas, ou apenas peça-lhes que escrevam as próprias respostas. E, finalmente, não se esqueça de agradecer-lhes pelo seu tempo. Então você quer repetir, Repita este processo com a gente. Muitos testadores, como você pode gerenciar mais, é sempre melhor para uma visão holística. Mas tente apontar para pelo menos cinco. Depois de obter uma quantidade razoável de testadores, a próxima coisa que você vai querer fazer é reunir todos os seus resultados no feedback que você recebeu. Vamos dar uma olhada nisso na próxima unidade. 6. Revise e avalie resultados: depois de concluir o teste do usuário. O próximo passo é reunir todos os comentários que você recebeu e as notas que você tomou e começar a dar sentido a tudo isso. Primeiro, mantenha todos os seus comentários em suas notas juntos em um só lugar. É por isso que eu realmente enfatizo usando sempre saber desta forma você pode ver a leitura em conjunto, e torna muito mais fácil de procurar encontrar estrutura organizacional que funciona melhor para você. Criei uma nota para cada usuário que contém suas respostas em seus comentários, bem como minhas próprias notas da sessão de teste. Então este exemplo que você pode ver aqui, isso é apenas uma nota e eu realmente vou recuar para mostrar a você nota alguma aqui. Então isso é basicamente eu tenho uma nota para cada usuário. Só estou chamando eles de usuário. Um BCG pode colocar seus nomes lá, se você quiser. Hum, mas assim eu posso realmente acompanhar. Posso ter as respostas para as perguntas deles. Posso adicionar qualquer outra nota que eu precise aqui. Tenho o meu guião na mesma. Então eu tenho como caderno. Onde todas as minhas coisas estão juntas. Então, sim, eu tenho meu script de teste de usuário, e então eu tenho, como todo o resto para meus esboços de projeto, quadros de arame, personas, tudo, mesmo como as telas finais. Então essa é uma ótima maneira de se manter organizado. Uma vez que tudo está junto, lido através de tudo. Uma vez que pode ter sido alguns dias desde o seu teste, pegue uma folha de papel e anote as coisas que se destacam para você de cada teste. Destaque as principais frases livres de seus testadores. Respostas. Aqui você pode vê-lo. Você pode começar a ver padrões comuns emergindo, por exemplo. Talvez a maioria das pessoas comentou sobre a forma como você colocou as informações em uma tela específica . Ou talvez várias pessoas realmente gostem de alguma iconografia que você usou em seus projetos. Tudo isso é importante notar, mas tente prestar atenção especial a qualquer feedback negativo em lugares onde os usuários podem ter tropeçado. Tente descobrir o que está causando essa confusão. Você pode estar pensando. Bem, é um fluxo tão simples. Por que o usuário não entende? E isso pode ser realmente fácil de pensar porque você está tão perto de seu aplicativo, você sabe, ele por dentro e por fora. Mas se você cavar um pouco mais fundo, você pode se surpreender ao ver. Talvez as coisas não sejam simples. Eles parecem. Enquanto estiver analisando todos os seus comentários, não deixe de levar algum tempo para fazer isso com cuidado e cuidado. E aqui estão algumas dicas para lembrar ao fazê-lo. Primeiro feedback em muito. Alguns usuários podem pensar que um fluxo é incrivelmente fácil, e spot em outros pode ser totalmente confuso, e alguns podem simplesmente não ter uma opinião em tudo. Nem todo mundo vai ter a mesma reação. Está tudo bem e totalmente normal. Em seguida, em geral, você quer respeitar as regras da maioria. Se a maioria das pessoas se sente de uma maneira, é provavelmente escolhido bastante preciso. Mas isso sendo dito, nem sempre é o caso, então tipo de você precisa usar a sauna caso a caso. Outra coisa a considerar é garantir que você não tire conclusões precipitadas muito rapidamente. Só porque o usuário faz uma sugestão não gosta de um aspecto particular ou um pouco confuso com algo. Isso não significa que você precisava ir imediatamente e fazer uma mudança. Em vez disso, tente morrer apenas seus comentários e ver se há outro problema subjacente. Ou às vezes seus pontos simplesmente não são baladas. Finalmente, teste do usuário às vezes pode ser um processo doloroso. Na verdade, pode ser muito difícil ver os usuários reagindo negativamente ou simplesmente não entendendo o que você tem trabalhado tanto. Tente não se deixar desencorajar. Não é nada pessoal para você, e é exatamente por isso que testes de usuários são tão valiosos. Você economizará tempo para si mesmo sendo capaz de melhorar seu aplicativo rapidamente. Então, agora que você digeriu todos os seus comentários, vamos para a nossa unidade final. 7. Iterate e pensamentos finais: agora que você passou e teve tempo para digerir o feedback dos testes de usuários, é hora de fazer um plano para as próximas etapas. Descubra o que faz sentido mudar em seus designs, o que deve ser ajustado e o que está funcionando bem, tente não estar muito ligado a um elemento de design específico. Se não está funcionando, há sempre espaço para melhorias. Vá em frente e faça qualquer alteração em seus designs. Algumas dessas alterações podem ser ajustes pequenos e simples que são fáceis de atualizar e outras podem fazer com que você precise projetar para reprojetar telas completamente novas ou criar um fluxo totalmente novo. Leve algum tempo para resolver tudo isso. Depois de salvar seus designs revisados, você pode voltar à visão para atualizar seu protótipo. É muito fácil trocar telas existentes por uma nova versão. Basta entrar no modo de construção e simplesmente Dragon deixou cair a nova tela em cima da antiga. Você pode ter que ajustar seus pontos quentes se as coisas se movimentaram um pouco, mas esses ar realmente fácil de mover para. Além disso, se você encontrar com mais de uma solução possível com base no feedback dos usuários, considere criar vários protótipos. Desta forma. Você pode testar rapidamente algumas idéias para ver o que vale a pena perseguir e o que não está funcionando. Finalmente, com seu protótipo atualizado em mãos, comece outra rodada de testes de usuários. Tente encontrar alguns novos testadores que não viram a versão anterior. Também é útil. Dedo. que os testadores anteriores experimentem a nova versão para que você possa ver como eles reagem às suas alterações Se eles tiverem feedback positivo. Isso é uma grande garantia de que você está indo na direção certa. Se não, provavelmente ainda há algumas torções que você tem que resolver. Continue e lembre-se que o design é um inter de processo. Com tudo o que aprendeu ao longo desta série, estou confiante de que você vai acabar com um aplicativo incrível. Finalmente, eu só quero dizer muito obrigado por tomar o tempo para participar do meu design IOS. Aulas da Siri. Espero que você tenha tirado algumas coisas novas dessas aulas, e por favor, não hesite em entrar em contato e fazer perguntas ou fornecer qualquer feedback sobre como posso melhorar. Obrigado mais uma vez