Universidade de S˜ao Paulo
Instituto de Matem´atica e Estat´ıstica
BoraL´a
Sistema de Compartilhamento de Roteiros de Viagem
Fase 3 - Design
Disciplina:MAC5786 Princ´ıpios de IHC Prof. Carlos Hitoshi Morimoto
Andrew Toshiaki Nakayama Kurauchi Alexandre Martins Ferreira de Sousa
Alexandre Morimitsu Vin´ıcius Kiwi Daros
S˜ao Paulo, Brasil 18 de maio de 2012
1 Site do projeto
As fases anteriores do projeto podem ser encontradas em:
http://www.ime.usp.br/˜alemart/mac5786/
2 Parte Individual
Antes de montarmos uma vers˜ao final de design para teste com usu´ario, cada membro do grupo elaborou individualmente prot´otipos de interface. Com essas propostas em m˜aos, foi feita uma reuni˜ao para se discutir os pr´os e contras de cada um dos designs e, com base nessa an´alise, foi decidido quais funcionalidades estariam presentes no prot´otipo para teste, al´em de como seria a mecˆanica de uso delas.
A seguir, ser˜ao apresentados os designs que cada membro do grupo elaborou individual- mente e uma breve descric¸˜ao de sua forma de uso. Tamb´em ser´a indicado como cada uma dessas vers˜oes contribuiu para a definic¸˜ao da vers˜ao para teste com usu´ario.
2.1 Andrew Toshiaki Nakayama Kurauchi
Muitas das caracter´ısticas inclu´ıdas no meu prot´otipo apareceram de forma bastante semelhante em outros prot´otipos desenvolvidos por meus colegas. Minha ideia era facilitar a busca de uma nova localidade e o acesso aos roteiros do usu´ario logado a partir de qualquer tela. Por esse motivo criei a tela de busca (Figura 1), que apresenta um cabec¸alho e um menu a esquerda que estariam presentes em todas as telas do sistema, que ocupariam o espac¸o onde est´a escrito
“Conte´udo”. Na vers˜ao final do prot´otipo a barra de busca em todas as telas foi mantida, e o link para os roteiros foi colocado na parte superior da tela.
Figura 1: Cabec¸alho de busca e menu com acesso aos roteiros presentes em todas as telas Ao realizar uma busca seria mostrada a tela de listagem de resultados (Figura 2). Nessa tela seria poss´ıvel filtrar os resultados e escolher a ordenac¸˜ao. Acabamos esquecendo da ordenac¸˜ao no prot´otipo apresentado ao usu´ario e posteriormente percebemos que isso era importante e adicionamos essa possibilidade no prot´otipo final. Na listagem considerei ser necess´ario apre- sentar somente informac¸˜oes gerais e relevantes (considerei relevante a foto, o nome do item do resultado, custo e avaliac¸˜ao m´edia, com base nos resultados da entrevista ) para n˜ao poluir muito a tela e perder visibilidade. Essa ideia ocorreu de maneira muito semelhante em outros prot´otipos e est´a presente na vers˜ao final (durante a discuss˜ao decidimos que seria interessante mostrar tamb´em o coment´ario de algum dos usu´arios). Al´em disso considerei importante ser poss´ıvel adicionar um item a um roteiro, podendo escolher a qual roteiro adicionar, sempre que um item aparecesse na tela. Essa ideia permaneceu no prot´otipo final, mas ao discutirmos acha-
apresentados em uma sec¸˜ao posterior) para melhorar a visualizac¸˜ao, assim como a opc¸˜ao por um ´ıcone que abrir´a um pop-up com essas informac¸˜oes.
Figura 2: Listagem de resultados de uma busca
Ao clicar em um item da lista uma tela de detalhes (Figura 3) seria apresentada ao usu´ario.
Nessa tela seria poss´ıvel visualizar as informac¸˜oes mostradas na listagem, al´em de mais detalhes dependendo do tipo do item (um hotel mostraria a presenc¸a de lavanderia, internet, entre outros) e a lista de coment´arios e avaliac¸˜oes de outros usu´arios sobre esse item. Seguindo a proposta de sempre ser poss´ıvel adicionar um item a um roteiro tamb´em coloquei essa opc¸˜ao nesta tela.
Como a adic¸˜ao de um novo coment´ario e avaliac¸˜ao pode n˜ao ser uma tarefa agrad´avel julguei ser importante a utilizac¸˜ao de poucos campos. Na vers˜ao final colocamos alguns campos a mais, mas buscando manter a simplicidade, para n˜ao desmotivar o usu´ario a enviar coment´arios. As sugest˜oes de itens semelhantes (no caso hot´eis) n˜ao foi utilizada na vers˜ao final, pois achamos que seria mais uma poluic¸˜ao visual.
Finalmente as ideias da tela de roteiro (Figura 4) foram bastante utilizadas no prot´otipo final.
A ideia era que o usu´ario pudesse arrastar os itens para posicion´a-lo no dia desejado. Na vers˜ao final foi criada uma lista com os itens no roteiro ainda n˜ao adicionados a nenhum item (havia me esquecido desse detalhe). Havia julgado n˜ao ser necess´ario mostrar o total de cada dia caso ele estivesse mostrando todos os seus itens (seria poss´ıvel esconder os itens de um determinado dia e mostrar somente o valor total), mas durante a discuss˜ao vimos que seria interessante o usu´ario ter acesso a essa informac¸˜ao para poder dividir seus gastos ao longo dos dias.
Quando os prot´otipos foram levados para discuss˜ao percebi que n˜ao havia pensado em uma tela inicial. Al´em disso percebemos que apesar de ser um aspecto chave para o funcionamento
Figura 3: Detalhes de um item (no caso, uma hospedagem)
do sistema, nenhum dos prot´otipos possu´ıa uma tela para a criac¸˜ao e edic¸˜ao de informac¸˜oes de um item (cidade, hospedagem ou ponto tur´ıstico). Foi interessante perceber como cada membro do grupo se lembrou de requisitos diferentes obtidos na coleta de dados e como a discuss˜ao nos fez construir um prot´otipo final mais completo.
Figura 4: P´agina de um roteiro de viagem
2.2 Alexandre Martins Ferreira de Sousa
Apresentei um design de car´ater minimalista cuja filosofia era evitar, deliberadamente, a apresentac¸˜ao de dados textuais. Com um estilo de interac¸˜ao inspirado em sistemas de manipulac¸˜ao direta, procurei projetar algo apelativo a usu´arios novatos (que fosse f´acil de aprender e de lembrar), sacrificando entretanto eventuais funcionalidades mais complexas. Procurei tamb´em me afastar de designs similares a sites de venda atuais.
A tela inicial mostra um mapa manipul´avel (translac¸˜ao e escala). H´a tamb´em um campo de busca, ´util para encontrar regi˜oes por meio do nome.
Note, entretanto, que aqui se parte da hip´otese que o usu´ario tenha ao menos uma vaga ideia para onde deseja ir. A interface n˜ao ´e robusta a ponto de satisfazer uma consulta do tipo “quero ir `a praia”, embora se preste a requisic¸˜oes como “quero ir ao Rio de Janeiro”’. Para suprir aquela necessidade, o usu´ario pode procurar sites mais especializados.
Suponha que queiramos ir ao Rio. Digitamos ent˜ao o nome da cidade no campo de busca, ou simplesmente deslocamos o mapa at´e l´a.
Uma vez no Rio (no exemplo, estamos na Barra da Tijuca), o sistema encontra servic¸os e atrac¸˜oes tur´ısticas da regi˜ao. Como se vˆe na figura, utilizamos pistas visuais, tais como ´ıcones diversos e cores, para identificar o que ´e o quˆe, bem como a avaliac¸˜ao do p´ublico (os textos
“m´edio”, “bem avaliado”, etc. n˜aofazem parte da interface).
Na tela acima temos cadastrados: um teatro, um restaurante e dois hostels; cada um por- tando uma certa avaliac¸˜ao, gerada atrav´es dos coment´arios dos usu´arios. Ao clicar num ´ıcone qualquer, pode-se ver detalhes do lugar correspondente: nome, fotos,website, umacurt´ıssima descric¸˜ao, coment´arios dos usu´arios, etc.
Diferentemente dos designs dos colegas, neste n˜ao se pode ordenar os itens (por exemplo por prec¸o). Pode-se, no m´aximo, reconhecer a avaliac¸˜ao de um lugar atrav´es da cor do ´ıcone. O bot˜ao no canto inferior-direito da figura ficou claramente ruim; ademais, faltou um mecanismo para adicionar um novo item ao mapa.
Para adicionar um item ao roteiro, basta clicar em “Add to my travel”.
A tela de roteiro ´e similar `a dos colegas. Para cada lugar a ser visitado, tem-se a data, estimativa de prec¸o, etc. A qualquer momento ´e poss´ıvel voltar ao mapa e adicionar novos itens ao roteiro (o bot˜ao “add new place” ficou mal colocado ali, j´a que existe o link “back to map”).
No design final, ap´os a entrevista com um usu´ario, ganhamos novosinsightsque enriquece- ram a ´area de planejamento de roteiros.
Uma vez feito o roteiro, um mapa ajuda o usu´ario a visualiz´a-lo, j´a que trac¸a as rotas cor- respondentes. Tal roteiro, de todo modo, permanece edit´avel.
Para concluir, os mapas constituem parte central do design proposto. Procurei eliminar dados textuais tanto quanto poss´ıvel e fazer algo minimalista, diferente dos sites de vendas existentes. No design final, feito a partir de uma mistura das diferentes vis˜oes criadas por cada um dos colegas, obtivemos um projeto mais geral, mais flex´ıvel e com mais funcionalidades.
L´a, os mapas n˜ao desempenham papel central, mas ainda se prestam ao usu´ario mostrando, de forma l´udica, informac¸˜oes relevantes sobre os roteiros.
2.3 Alexandre Morimitsu
O prot´otipo desenvolvido foi inspirado principalmente em sites de vendas que permitem a adic¸˜ao de coment´arios por usu´arios, tais como o amazon.com: h´a uma caixa de busca no topo da p´agina, um espac¸o para refinamento da busca na lateral e o conte´udo em si ocupando o corpo da p´agina, como se pode ver na figura 5:
Figura 5: Quatro primeiras telas do prot´otipo
Em cada figura, os n´umeros nos cantos indicam o n´umero da tela e as flechas numeradas indicam o fluxo das p´aginas, isto ´e, para que tela seguimos se clicarmos nos lugares indicados.
Na figura 5, h´a 4 telas, sendo:
• (1) Tela inicial, mostrando cidades, hot´eis, prec¸os de passagem em destaque.
• (2) O resultado de uma busca na caixa de texto e os filtros na lateral da p´agina, que refinam os resultados da busca.
• (3) A p´agina de detalhes de uma cidade, quando uma cidade ´e clicada na tela inicial ou no resultado de busca, exibindo fotos colocadas por usu´arios, coment´arios e opc¸˜ao para visualizar passagens e hospedagens para tal localidade.
• (4) A p´agina de visualizac¸˜ao de prec¸os de passagens, onde o usu´ario pode adicionar a passagem para uma poss´ıvel viagem planejada.
Com relac¸˜ao `as 4 primeiras telas, alguns dos itens se encontravam em todos os outros prot´otipos, tais como a caixa de busca e o refinamento de resultados. A p´agina inicial com destaques foi mantida na vers˜ao final, o que n˜ao ocorreu com a tela de visualizac¸˜ao de prec¸os de passagens. Outra ideia adotada foi a de que m´ultiplas fotos deveriam poder ser vistas ao visualizarmos uma cidade ou hospedagem.
Figura 6: Telas 5 a 8 do prot´otipo As telas de 5 a 8 (figura 6) exibem, respectivamente:
• (5) A p´agina de visualizac¸˜ao de hospedagens, na qual o usu´ario pode adicionar o local onde vai se hospedar em uma poss´ıvel viagem.
• (6) Mostra a tela de perfil de um usu´ario qualquer, podendo-se enviar mensagens privadas ou ver coment´arios feitos pelo mesmo.
• (7) P´agina de detalhes de uma cidade, mostrando fotos e avaliac¸˜oes de outros usu´arios.
• (8) Tela de visualizac¸˜ao de uma viagem, onde ´e poss´ıvel ver a hospedagem e o custo da passagem que foram adicionadas `a ela.
Com relac¸˜ao a estas telas, este foi o ´unico prot´otipo que inclui uma tela espec´ıfica para visualizac¸˜ao de informac¸˜oes de usu´arios, algo que foi inclu´ıdo na vers˜ao final. Por outro lado, a ideia de adicionar uma passagem e uma hospedagem a uma viagem n˜ao era boa e foi algo que foi descoberto na parte de avaliac¸˜ao de prot´otipos e foi substitu´ıdo pela ideia mais flex´ıvel e abrangente de roteiros, que se tornou uma das caracter´ısticas centrais do produto.
Figura 7: Telas 9 a 12 do prot´otipo Por fim, segue a relac¸˜ao das telas finais(figura 7) do prot´otipo:
• (9) ´E a tela do perfil do pr´oprio usu´ario. Ela difere da tela dos outros usu´arios por permitir visualizar as viagens realizadas.
• (10) Tela de visualizac¸˜ao das viagens do pr´oprio usu´ario.
• (11) Mostra uma tela onde ´e poss´ıvel enviar uma avaliac¸˜ao com relac¸˜ao a uma cidade ou hospedagem, onde ´e necess´ario colocar um coment´ario e uma avaliac¸˜ao, al´em da opc¸˜ao de envio de fotos.
• (12) Mostra a tela de troca de mensagens pessoais entre usu´arios, o que permite a troca de informac¸˜oes entre usu´arios
Como dito anteriormente, a ideia de viagens foi descartada, portanto a tela 10 n˜ao foi in- clu´ıda no sistema final. A parte de avaliac¸˜ao est´a presente, mas trata-se de algo integrado `a pagina de visualizac¸˜ao do item em quest˜ao e ´e composta por bem mais informac¸˜oes na vers˜ao final.
Fazendo um coment´ario geral com relac¸˜ao `a avaliac¸˜ao de cada prot´otipo, foi interessante ob- servar como cada integrante tinha uma vis˜ao diferente de como deveria ser o design do sistema e tinha ideias diferentes de como implementar determinadas funcionalidades. Meu prot´otipo, por exemplo, n˜ao inclu´ıa mapa por achar que buscar hospedagens ou outros itens navegando
pelo mapa seria um processo muito oneroso, mas no teste realizado com um usu´ario real foi observado que o mapa era tanto ´util para filtrar itens de uma cidade quanto para exibir um tra- jeto de um roteiro. Al´em disso, este prot´otipo n˜ao inclu´ıa informac¸˜oes de pontos tur´ısticos ou restaurantes, itens que se mostraram essenciais para o diferencial da vers˜ao final do sistema, que permite a criac¸˜ao de roteiros de viagens se utilizando deles.
2.4 Vin´ıcius Kiwi Daros
Figura 8: Tela inicial da proposta do Vin´ıcius
Na tela mostrada na Figura 8, vemos uma proposta de p´agina inicial para o sistema. Os principais elementos ali presentes s˜ao: mapa para visualizar geograficamente os pontos j´a ca- dastrados no sistema; opc¸˜oes v´arias opc¸˜oes de pesquisa j´a na tela inicial; Coluna lateral para a r´apida visualizac¸˜ao dos destinos e pontos tur´ısticos mais comentados e/ou mais recentes. Des- tes, os dois ´ultimos sofreram adaptac¸˜oes e foram inclu´ıdos na vers˜ao de teste com o usu´ario e mantidos na vers˜ao final. O mapa passou a ser um pop-up, mas detalhes ser˜ao mostrados mais
`a frente, e os destaques deixaram de ficar em uma coluna e ganharam o corpo da p´agina inicial.
Um detalhe que inicialmente eu havia achado que seria interessante incluir, mas que vimos n˜ao muito pr´atico ´e a lista“Quem j´a foi para l´a”, ao fim de cada destaque. A ideia era mostrar a miniatura das fotos de todos os usu´arios que j´a tivessem indicado ter ido `aquela cidade ou ponto tur´ıstico. Entretanto, vimos que essa informac¸˜ao n˜ao era t˜ao relevante e ficava redundante, pois ´e poss´ıvel saber quem visitou cada local simplesmente olhando as fotos e nomes nos coment´arios e avaliac¸˜oes.
Na tela seguinte (Figura 9), ´e apresentada uma avaliac¸˜ao que um usu´ario espec´ıfico fez sobre a “Cidade X”, isoladamente dos coment´arios dos outros usu´arios. Basicamente, nessa p´agina ´e poss´ıvel ver mais detalhes referentes `a viagem que oFulanofez, saber as atividades que ele fez por l´a, quanto gastou em cada uma delas, a opini˜ao dele e outros detalhes.
Essa funcionalidade n˜ao entrou diretamente na vers˜ao final, pois ela desempenhava parcial- mente o mesmo papel que a ideia de criac¸˜ao de roteiros, s´o que com utilidade reduzida e menos
Figura 9: Tela relatos da proposta do Vin´ıcius
visibilidade. Assim, optamos por manter apenas a lista de coment´arios de todos os usu´arios juntos e, em separado, os roteiros de cada um deles.
Apesar da funcionalidade em si n˜ao ter vingado, vale ressaltar que uma caracter´ıstica dela foi levantada nas propostas de design de todos os outros membros do grupo e, obviamente, continuou na vers˜ao final. Essa caracter´ıstica ´e a representac¸˜ao visual da avaliac¸˜ao dos usu´arios.
O ´ıcone de indicac¸˜ao comsmiles, nem nenhuma outra proposta nos outros designs foi escolhida, pois optamos por uma alternativa discreta com degradˆe entre vermelho (ruim) e verde (bom).
A terceira e ´ultima tela, exibida na Figura 10, mostra um exemplo de resultado de busca.
Inicialmente, havia pensado em j´a exibir os resultados com um n´ıvel grande de detalhes. Por´em, depois da discuss˜ao sobre os prot´otipos, vimos que seria melhor mostrar os resultados de forma condensada e as informac¸˜oes mostradas na figura ficaram separadas em uma p´agina pr´opria de detalhes de cada resultado.
Na tela final de detalhes de uma cidade, mantivemos a sugest˜ao de listar o que os usu´arios fizeram por l´a, onde se hospedaram e os coment´arios. Entretanto, redefinimos o layout para essas listagens terem melhor visibilidade e escalarem melhor para situac¸˜oes com grande n´umero de itens.
Figura 10: Tela de resultados de busca da proposta do Vin´ıcius
3 Avaliac¸˜ao com usu´ario
Depois que os membros do grupo viram todas as propostas de design, discutiram as vantagens e desvantagens de cada uma e escolheram quais as funcionalidades mais relevantes, foi montada uma vers˜ao de design a ser apresentada a um usu´ario. Essa atividade teve como o objetivo descobrir quais tarefas o design do sistema tornava f´aceis, dif´ıceis, intuitivas ou mesmo se alguma coisa simplesmente n˜ao era usada.
A seguir, falaremos sobre essa avaliac¸˜ao e quais foram as conclus˜oes `as quais chegamos.
3.1 Descric¸˜ao do usu´ario
Assim como na fase de levantamento de necessidades dos usu´arios, nesta terceira fase do projeto n˜ao tivemos oportunidade de encontrar muitos usu´arios com grande experiˆencia em viagens mais longas. Por esse motivo, optamos por fazer o teste de interac¸˜ao apenas com um usu´ario significativo (diferente dos dois outros usu´arios com os quais conversamos na fase anterior).
A pessoa que participou do teste pode ser considerada como representante significativo dos usu´arios do sistema, pois j´a planejou e realizou 3 viagens internacionais de longa durac¸˜ao, al´em de algumas viagens dentro do Brasil.
3.2 Descric¸˜ao do processo de avaliac¸˜ao
No in´ıcio da avaliac¸˜ao foi apresentado o conceito do produto para que o usu´ario soubesse sobre o que se trata o sistema. Al´em disso foi explicado o intuito da avaliac¸˜ao e foi dito que por se tratar de um prot´otipo de papel seria necess´ario que ele assumisse que seu nome era Fulano e que usasse o dedo como cursor e pensasse em voz alta. Foi ent˜ao apresentada a tela inicial do sistema e o usu´ario comec¸ou a utiliz´a-la.
Em determinados momentos o usu´ario teve algumas d´uvidas quanto a o que fazer para atin- gir um determinado objetivo ou quais seriam as consequˆencias de se clicar em um determinado link ou bot˜ao. Nessas ocasi˜oes dissemos que n˜ao pod´ıamos interferir na utilizac¸˜ao e que se ele desejasse era poss´ıvel clicar nos links ou bot˜oes e n´os mostrar´ıamos o resultado.
Ao longo da avaliac¸˜ao o usu´ario encontrou elementos (textos e ´ıcones) confusos e apresen- tou sugest˜oes de melhoria. Essas sugest˜oes s˜ao apresentadas na sec¸˜ao 3.6.
Antes da avaliac¸˜ao foi discutido se a participac¸˜ao dos 4 membros do grupo poderia intimi- dar o usu´ario e se talvez seria melhor menos pessoas participarem desse processo. Entretanto devido a proximidade do usu´ario com os membros do grupo acreditamos que isso n˜ao seria um problema. Por esse motivo todos participaram. Um dos integrantes foi respons´avel por explicar a atividade, tirar d´uvidas e realizar as trocas de tela. Os outros ficaram mais distantes obser- vando as ac¸˜oes e questionamentos do usu´ario realizando anotac¸˜oes. Ao final da avaliac¸˜ao foram realizadas perguntas para compreender melhor a satisfac¸˜ao e frustrac¸˜oes do participante.
3.3 Facilidades encontradas
As seguintes funcionalidades foram utilizadas de forma intuitiva pelo usu´ario, sem que fosse necess´ario explicar para que serviam:
• Navegac¸˜ao pelo mapa da tela inicial para a visualizac¸˜ao de itens que tivessem relac˜ao com a ´area exibida na tela.
• O campo de “Quanto quer gastar” para refinamento de resultados de busca
• O fato de que arrastar os itens nos destinos em vista para as datas adicionaria tais itens
`aquela data do roteiro
3.4 Dificuldades encontradas e soluc¸˜oes apresentadas
O usu´ario sentiu dificuldade para adicionar um item ao roteiro. Inicialmente achou que o ´ıcone
“+” para adicionar o item era para ver mais informac¸˜oes e somente ao clicar percebeu que
ele na verdade servia para adicionar um item a um roteiro. Uma dificuldade semelhante foi encontrada ao tentar remover um item do roteiro: o usu´ario ficou em d´uvida quanto ao ´ıcone
“X” no canto superior direito de cada item. Ele n˜ao sabia se o ´ıcone servia para remover o item da programac¸˜ao dos dias ou se ele removeria o item do roteiro. Percebemos que precisamos escolher ´ıcones melhores, mas ainda n˜ao sabemos qual seria uma opc¸˜ao melhor. Nas outras vezes o usu´ario j´a sabia o que cada ´ıcone significava e n˜ao teve mais problemas.
Em diversas ocasi˜oes o usu´ario teve dificuldade em saber o que era clic´avel e acreditamos que isso seja uma das principais causas de dificuldade encontradas pelo usu´ario. Ap´os mos- trarmos quais eram todos os elementos clic´aveis da tela o usu´ario conseguiu realizar as tarefas com muito mais facilidade. Achamos que isso ´e muito ligado ao fato de termos utilizado um prot´otipo de papel, no qual ´e dif´ıcil representar e diferenciar elementos clic´aveis e n˜ao clic´aveis.
O usu´ario ficou em d´uvida quanto a funcionalidade do bot˜ao de “cadastrar novo local”. N˜ao ficou claro se a p´agina de cadastro servia para adicionar somente cidades ou se era poss´ıvel adicionar hospedagem, pontos tur´ısticos e locais de alimentac¸˜ao. Por esse motivo trocamos o texto do bot˜ao para “Cadastrar novo lugar/estabelecimento”.
Outra confus˜ao gerada por algum texto foi o link para “adicionar outra hospedagem” ou
“adicionar outro ponto tur´ıstico”. A palavra “adicionar”deu a impress˜ao de que o link servia para ir para a p´agina de cadastro e n˜ao para inserir mais um elemento em um coment´ario. Por esse motivo trocamos os textos para “outra hospedagem” e “outro ponto tur´ıstico”.
3.5 Reac¸˜oes e receptividade
1. O participante achou bastante relevante usar o site para planejar viagens
(a) Atualmente ele faz seus planejamentos sem qualquer software especializado
(b) Ele tamb´em pesquisa destinos de viagens por meio de f´oruns de discuss˜ao e de outros sites
(c) A ferramenta especializada de planejamento de roteiros, bem como o mapa com a rota trac¸ada, foram bem recebidos
2. Houve confus˜ao em alguns momentos
(a) Como j´a relatado na sec¸˜ao anterior, alguns recursos n˜ao se mostraram t˜ao intuitivos como t´ınhamos inicialmente imaginado
(b) Entretanto, o usu´ario foi capaz de se recuperar dos eventuais erros sem grandes problemas
3. O participante apresentou boa receptividade para planejar seus roteiros, mas nem tanto para contribuir com conte´udo do site
(a) Ele s´o entraria no site caso estivesse planejando fazer (ou fazendo) uma viagem (b) Popular o banco de dados do sistema ´e algo que ele poderia fazer, nas palavras dele,
“s´o se tiver tempo”
4. Finalmente, ele “n˜ao lˆe textos grandes” e “n˜ao gosta de escrever”.
O participante relatou ter gostado do sistema e que este resolve um problema que ele en- frenta: planejamento de roteiros. Entretanto, notamos que ele teria um perfil muito mais “consu-
3.6 Sugest˜oes
Ao longo da sec¸˜ao de teste, o usu´ario deu opini˜oes sobre o sistema, al´em de algumas sugest˜oes.
Esses coment´arios foram revistos e discutidos depois do teste e os mais relevantes est˜ao listados abaixo:
• Mensagens enviadas privadas e outras notificac¸˜oes do sistema devem ser envidadas para o e-mail cadastrado;
• Uma vez que o login tenha sido feito, deveria haver um redirecionamento autom´atico para a p´agina de roteiro;
• N˜ao estimular que os usu´arios enviem textos longos, mas sim favorecer a escrita em t´opicos ou em campos pr´oprios, como prec¸o, por exemplo.
• Na p´agina de edic¸˜ao de roteiro, em cada um dos dias, seria ´util haver uma distinc¸˜ao entre manh˜a, tarde e noite para ajudar a organizar melhor as atividades - nem que seja apenas trˆes planos de fundo diferentes dentro da caixa de atividades;
• Trocamos o texto de alguns bot˜oes para evitarem desentendimentos e ficarem mais claros quanto ao que faziam. Por exemplo, “Cadastro de novo item” passou para “Cadastrar novo lugar/estabelecimento”;
• Trocar o s´ımbolo “+”, de adicionar um item a Destinos em vista, por algum outro mais significativo.
Em particular para essa quest˜ao, n˜ao conseguimos pensar em nenhum outro ´ıcone melhor.
Por esse motivo, ele foi mantido por hora. Mas continuaremos buscando outra alternativa.
• E importante indicar formas de traslado entre aeroportos e hot´eis ou entre rodovi´arias e´ hot´eis. Nessa quest˜ao, o mais significativo seria opini˜ao de outros usu´arios para saber quais companhias s˜ao boas, quais n˜ao valem a pena e outras dicas;
• Deve-se dar grande foco `a funcionalidade de elaborac¸˜ao de roteiros, pois ´e o diferencial do sistema e os usu´arios a utilizar˜ao tanto na hora de planejar quanto durante suas viagens.
4 Design final
Depois da avaliac¸˜ao com o usu´ario, alguns ajustes foram feitos no design usado no teste, o que resultou na vers˜ao que ser´a apresentada nesta sec¸˜ao.
Para esta vers˜ao foi gerado um diagrama de transic¸˜ao, que ´e apresentado na figura 11.
Figura 11: Diagrama de transic¸˜ao do design final
No diagrama, cada tela ´e representada por uma elipse e associada a um n´umero, que ´e o identificador de cada tela (tal identificador est´a localizado no canto inferior direito das figuras das telas do design final). O cabec¸alho ´e fixo e se localiza no topo de todas as telas. O mapa do roteiro ´e um pop-up que aparece sobre a tela do roteiro.
Cada transic¸˜ao do diagrama representa poss´ıveis ac¸˜oes que o usu´ario pode realizar em cada tela e para qual tela ele ser´a direcionado caso realize tal ac¸˜ao.
4.1 Atividades
Nesta sec¸˜ao, mostraremos como um usu´ario pode realizar as principais atividades no sistema.
Buscar um destino
E poss´ıvel buscar um destino a partir de qualquer tela utilizando a barra de busca no topo da´ p´agina. Exemplificaremos seu uso com a Figura 12. Basta digitar o nome do destino na barra de busca e clicar em “Buscar” e em consequˆencia disso ser´a mostrada a tela da Figura 13.
Figura 12: P´agina inicial
Visualizar avaliac¸˜oes
Na p´agina de detalhes ´e poss´ıvel ver uma avaliac¸˜ao m´edia um pouco abaixo do nome (Fi- gura 14). Para visualizar os coment´arios e avaliac¸˜oes dos outros usu´arios basta descer at´e o final da tela (Figura 15).
E poss´ıvel tamb´em visualizar fotos do local logo abaixo dos detalhes. Para ver mais fotos´ basta clicar nos bot˜oes a direita e a esquerda. Se o usu´ario clicar no link “Envie sua foto!” ser´a poss´ıvel adicionar novas fotos do local.
Abaixo das fotos s˜ao mostradas listas de sugest˜oes de hospedagem, pontos tur´ısticos e alimentac¸˜ao dispon´ıveis no local, sendo poss´ıvel ver mais opc¸˜oes clicando na bot˜ao da direita.
Ao clicar nos links “Hospedagem”, “Pontos tur´ısticos” ou “Alimentac¸˜ao” ser´a apresentada a
Figura 13: Resultado de uma busca
tela de listagem de hospedagem, pontos tur´ısticos ou alimentac¸˜ao, respectivamente, dispon´ıveis na regi˜ao (as telas de listagem e detalhes de hospedagem, pontos tur´ısticos e alimentac¸˜ao s˜ao an´alogas `as telas de listagem e detalhes de cidades).
Fazer uma avaliac¸˜ao
Para fazer uma avaliac¸˜ao basta ir at´e o final da tela de detalhes (Figura 15) e preencher os campos. Para selecionar uma avaliac¸˜ao na barra de cores basta clicar sobre o quadrado desejado.
Al´em disso ´e poss´ıvel escrever o nome de lugares onde se hospedou ou que visitou (o sistema apresentar´a sugest˜oes e o usu´ario pode clicar na que for a opc¸˜ao correta). Ao clicar no link
“outra hospedagem” ou “outro ponto tur´ıstico” um novo campo de texto ser´a mostrado para que o usu´ario possa escrever outros lugares onde se hospedou ou que visitou. Ap´os preencher todos os campos basta clicar em “salvar”. Al´em disso ´e poss´ıvel adicionar uma avaliac¸˜ao ao se criar um novo local (Figura 16).
Adicionar itens a um roteiro
E poss´ıvel adicionar um item a um roteiro a partir de qualquer p´agina que mostre itens adi-´ cion´aveis (cidades, hospedagem, pontos tur´ısticos ou alimentac¸˜ao). Basta clicar no ´ıcone “+”
no canto superior esquerdo do item. Ap´os o clique ser´a mostrado um pop-up ( Figura 17) com a lista de roteiros do usu´ario e um campo que pode ser preenchido com o nome de um novo
Figura 14: P´agina de detalhes
roteiro. Basta clicar no roteiro desejado para adicionar o item a ele.
Editar um roteiro
Para ir para a p´agina dos roteiros ´e necess´ario clicar no item “Meus Roteiros” no cabec¸alho presente em qualquer p´agina ( Figura 18). Na p´agina de edic¸˜ao de roteiro (Figura 19) ´e poss´ıvel excluir um roteiro clicando no link “excluir roteiro” ao lado do nome. Al´em disso as datas de in´ıcio e t´ermino podem ser modificadas e o roteiro pode ser tornado p´ublico selecionando
“Roteiro P´ublico”.
Cada item do roteiro na lista de “Destinos em vista” pode ser arrastado para algum dia para ser inclu´ıdo na programac¸˜ao ( Figura 20). A ordem dos itens na programac¸˜ao tamb´em pode ser modificada da mesma maneira. ´E poss´ıvel tamb´em alterar o gasto estimado com cada item (o que far´a com que o total estimado do roteiro seja recalculado), al´em de avali´a-lo e indicar que j´a foi visitado (alternativamente ´e poss´ıvel selecionar “Marcar tudo como visitado” para indicar que todos os itens do roteiro foram visitados). Para excluir um item do roteiro basta clicar no
´ıcone “X” no canto superior esquerdo de cada item. ´E poss´ıvel esconder ou mostrar os itens de um dia clicando no ´ıcone ao lado do prec¸o total do dia.
Ao clicar em “Veja o mapa de seu roteiro” aparecer´a um mapa ( Figura 21) com um caminho trac¸ado entre as hospedagens do roteiro. Al´em disso os pontos tur´ısticos a serem visitados tamb´em ser˜ao indicados.
E poss´ıvel criar um novo roteiro digitando o nome desejado no campo “Novo”. Para editar´
Figura 15: Coment´arios na p´agina de detalhes
outro roteiro basta clicar em seu respectivo link na esquerda da p´agina.
Cadastrar um novo local
Para cadastrar um novo local basta entrar na tela de cadastro (Figura 16) a partir do cabec¸alho (Figura 18), preencher os campos e clicar em “salvar”. Tamb´em ´e poss´ıvel adicionar fotos clicando no link “Envie sua foto!”.
Enviar mensagem a outro usu´ario
Para enviar uma mensagem a outro usu´ario basta entrar na p´agina de seu perfil (Figura 22) clicando em sua foto ou nome que aparecem em algum coment´ario e clicar no link “Envie uma mensagem para{nome}” (onde “{nome}” ´e o nome do usu´ario do perfil selecionado).
Figura 16: P´agina para cadastro de novo local
Figura 17: Pop-up de adic¸˜ao de item em roteiro
Figura 18: Cabec¸alho presente em todas as p´aginas
Figura 19: P´agina de edic¸˜ao e visualizac¸˜ao de roteiro
Figura 20: Adicionando um item na programac¸˜ao de um dia de viagem
Figura 21: Visualizac¸˜ao do mapa de um roteiro de viagem
Figura 22: P´agina de perfil de um usu´ario