UNIVERSIDADE FEDERAL DE MINAS GERAIS Processos de Criao em Mdias Digitais

RELAT RI! DE AN"LISE DE INTERFACE

Augusta Deluca Lucas Afonso Sepulveda Nina Rocha Patrcia Campos de Freitas Com#$icao Socia% & '( Perodo

)e%o *ori+o$te ,-.,/,

SUM"RI!

INTR!DU01! AVALIA01! *EUR2STICA Uma )re3e Descrio do M4todo Lista de Pro5%emas E$co$trados INSPE01! SEMI TICA Uma )re3e Descrio do M4todo Sig$os Re%e3a$tes Meta%i$g#sticos Est6ticos Di$7micos Com8arao/Verso Re3isada das metame$sage$s 9#%game$to dos A3a%iadores C!NCLUS1! ANE:!S

.; INTR!DU01!

O presente trabalho

uma an!lise do site "a#inha$com$br$ O site tem a fun%&o possvel criar uma *va+uinha, -este

b!sica de fornecer uma plataforma de arrecada%&o de dinheiro para fins m'ltiplos( de acordo com o dese)o do usu!rio$ Atrav s do site um pra0o de tempo preestipulado$ O site tem um la1out bem simples e a op%&o de fa0er um cadastro para criar uma va+uinha est! centrali0ada na p!gina inicial( ao lado de um vdeo ilustrativo sobre o "a#inha$ Atrav s do lin# de *Fa%a seu registro,( o usu!rio p!gina de cadastro e( com este concludo( redirecionado para uma redirecionado mais uma ve0( para a p!gina processo re+uer um cadastro pr vio. e divulg!/la de modo a atingir o valor dese)ado em

de cria%&o da va+uinha$ O processo de cria%&o possui apenas duas p!ginas( uma delas com +uatro abas( e finali0ado o preenchimento de dados( h! uma outra p!gina com a va+uinha pronta$ O processo todo e2igidos do +ue o usual$ A p!gina inicial( assim como as demais( possui um design simples( bem simples e possui menos p!ginas e dados

predominantemente nas cores verde e branco( sem muitas ilustra%3es / h! apenas a va+uinha logo do site no cabe%alho / e com apenas alguns cones de sites da imprensa online +ue )! publicaram algo sobre o "a#inha$ Na p!gina inicial h! uma lista com as va+uinhas mais recentes( coment!rios de usu!rios( lin#s para mat rias e os lin#s essenciais de informa%&o( como contato( d'vidas( redes sociais( registro e login$ Para analisar todo o conte'do acima descrito de forma mais detalhada( ser&o reali0adas uma an!lise heurstica das p!ginas inicial( de registro( de cria%&o da va+uinha e da va+uinha pronta assim como uma inspe%&o semi4tica das mesmas( de modo a apresentar considera%3es acerca da usabilidade e da comunicabilidade do site$ Com o intuito de nortear a an!lise( foi selecionado um tipo de usu!rio especfico$ O grupo optou por analisar sob a 4tica de um )ovem entre 56 e 78 anos com e2peri9ncia de uso de :ebsites$ Como o site tem uma fun%&o muito especfica( escolhemos analisar como esta se desenvolve( e os dois m todos de an!lise ser&o aplicados a cada uma das seis interfaces pelas +uais um usu!rio tem +ue passar desde sua entrada no site ; sua va+uinha pronta$ O grupo de avaliadores formado conta com +uatro )ovens de vinte anos( estudantes de Comunica%&o Social< todos usu!rios fre+uentes de internet( com conhecimento pr vio da linguagem utili0ada< sendo +ue dois deles possuem tamb m contato pr vio com o site "a#inha$com$br$

,; AVALIA01! *EUR2STICA

Uma )re3e Descrio do M4todo A avalia%&o heurstica um m todo de avalia%&o de =>C( criado por ?a#ob Nielsen(

+ue visa encontrar problemas de usabilidade em interfaces$ No momento da avalia%&o s&o levados em conta determinadas diretri0es( chamadas heursticas( +ue s&o consideradas ideais para uma melhor intera%&o entre o sistema e o usu!rio$ @stas heursticas s&oA visibilidade do estado do sistema< correspond9ncia entre o sistema e o mundo real< controle e liberdade do usu!rio< consist9ncia e padroni0a%&o< reconhecimento -em ve0 de memori0a%&o.< fle2ibilidade e efici9ncia de uso< pro)eto est tico e minimalista< preven%&o de erros< a)uda no reconhecimento( diagn4stico e repara%&o de erros< e a)uda e documenta%&o$ @ste um con)unto inicial +ue serve como base( no entanto os avaliadores podem ampli!/lo e criar novas diretri0es de acordo com suas necessidades$ Antes de come%ar necess!rio +ue os avaliadores fa%am um reconhecimento do

conte2to da an!lise -usu!rio( domnio( diretri0es consideradas( etc$. Feito isto( cada avaliador deve inspecionar as telas selecionadas( identificando as viola%3es(( o local da viola%&o e a severidade( devendo redigir tamb m uma descri%&o do problema e uma possvel solu%&o$ Por 'ltimo( os avaliadores se re'nem e fa0em uma consolida%&o dos resultados( construindo em con)unto um relato de resultados$

Lista de Pro5%emas E$co$trados Primeira Tela

Problema I: Reconhecimento em vez de memorizao LOCAL: Barra superior do menu SEVERIDADEA Problema pe+ueno EXPLICAO: A barra superior do menu n&o ficar est!tico no bot&o do menu$ RECOMENDAOA @2plicitar a locali0a%&o do menu e o manter fi2o ao inv s de flutuante$ evidente e fi2a( e sim flutuante$ Para usu!rios

mais desatentos( pode haver dificuldade na locali0a%&o do menu( +ue aparece apenas se o mouse

Problema II< Projeto esttico e minimalista LOCAL: Cai2a de te2to *O +ue est! acontecendo no "a#inhaC,

SEVERIDADE: Problema grande EXPLICAOA Nesta cai2a de di!logo s&o mostradas ao leitor todas atuali0a%3es e atividades do +ue outros usu!rios est&o fa0endo no site( desde cria%&o de va+uinhas a atuali0a%3es de dados no perfil$ Algumas dessas informa%3es s&o desnecess!rias ao usu!rio( pois ele n&o conhece o usu!rio +ue est! atuali0ando os seus dados( o +ue torna essas atuali0a%3es irrelevantes$ RECOMENDAO: Danter nesta cai2a apenas as atuali0a%3es de cria%&o e contribui%&o de va+uinhas$ Problema III: Reconhecimento em vez de memorizao LOCAL: Cli+ue a+ui( lin# das Eltimas "a+uinhas criadas( abai2o da cai2a de te2to *O +ue est! acontecendo no "a#inhaC, SEVERIDADE: Problema pe+ueno EXPLICAO: Fodos os hiperlin#s da p!gina em forma de te2to est&o destacados na cor verde( e2ceto este$ O usu!rio s4 percebe +ue a palavra *AGH=, como um lin# ao passar o cursor do mouse sobre ela$ RECOMENDAO: Destacar( como nos outros lin#s da p!gina( o lin# em verde

Segunda Tela
Problema I: Consistncia e adronizao LOCAL: Cabe%alho da p!gina SEVERIDADE: Problema pe+ueno EXPLICAO: O cabe%alho de menu varia da p!gina inicial para a p!gina de cadastro( o +ue pode gerar estranhamento ao usu!rio e a sensa%&o de +ue foi redirecionado para um outro site RECOMENDAO: Padroni0ar os cabe%alhos de todas as p!ginas do site

Terceira Tela
Problema I: Corres ondncia entre o sistema e o mundo real LOCALA Eltima cai2a de preenchimento do primeiro passo o cadastro da va+uinha$ SEVERIDADEA Problema grande EXPLICAO: A falta de imagem n&o impede o usu!rio de continuar o cadastro( mas ele pode se sentir impedido de conseguir incorporar uma imagem pelo fato do te2to de apoio usar o termo HRL( da linguagem Ieb +ue n&o conhecido por todos os usu!rios$ Al m disso( o usu!rio pode +uerer colocar um ar+uivo salvo no computador como imagem da va+uinha$ RECOMENDAOA Hsar uma linguagem compreensvel para o maior alcance de usu!rios( para

+ue se)a possvel a incorpora%&o de imagens de domnio e2terno e acrescentar a op%&o de selecionar um ar+uivo do pr4prio computador$

Problema II: !le"ibilidade e e#icincia do uso LOCALA Fe2to de apoio no final da p!gina( ap4s os espa%os de preenchimento$ SEVERIDADEA Problema grande EXPLICAO: O te2to de documenta%&o +ue e2plica a aplica%&o de ta2as do sistema de arrecada%&o monet!ria essencial para o usu!rio entender a funcionalidade do servi%o$ @le recebe uma publicidade n&o t&o efica0 ao permanecer no final da p!gina$ RECOMENDAOA Sendo uma informa%&o essencial( o te2to deveria vir no incio da p!gina para +ue o usu!rio perceba a vitalidade da compreens&o de tal informa%&o$

$uarta Tela
Problema I: Corres ondncia entre o sistema e o mundo real LOCAL: Fermo no ttulo +ue classifica a p!gina$ SEVERIDADE: Problema grande$ EXPLICAO: O sistema usa o termo template( tamb m um termo caracterstico da Ieb +ue pode n&o ter familiaridade para o usu!rio$ N&o e2iste e2plica%&o sobre o +ue seria a escolha do template em nenhum local da p!gina$ RECOMENDAO: Hsar um termo +ue se)a de f!cil entendimento e fa%a uma rela%&o mais aberta com a defini%&o de visual da p!gina$

Problema II: Reconhecimento em vez de memorizao LOCAL: Op%3es de escolha de template no corpo da p!gina$ SEVERIDADE: Problema grande$ EXPLICAO: O usu!rio n&o consegue visuali0ar as op%3es de visual +ue ele dese)a para o perfil p'blico de sua "a#inha$ Os bot3es de la1out n&o e2plicam o +ue est! sendo personali0ado em cada op%&o e podem n&o ser compreendidos por usu!rios novatos$ RECOMENDAO: =nstalar uma pr /visuali0a%&o de como ficaria a p!gina para o perfil p'blico da "a#inha( dando maior controle do processo ao usu!rio$

Problema III: !le"ibilidade e e#icincia de uso LOCAL: P!ginas de cadastro da "a#inha$ SEVERIDADE: Problema grande$ EXPLICAO: O segundo passo do cadastro da "a#inha n&o representa um momento essencial

para o processo<

um empecilho para a rapide0 do processo$

RECOMENDAO: O cadastro( portanto( poderia ser resumido em apenas um passo( com a parte de templates acoplada ap4s os espa%os de preenchimento da "a#inha$

$uinta Tela
Problema I: Consistncia e adronizao LOCAL: Painel de controle da va+uinha( abai2o do ttulo da se%&o SEVERIDADE: Problema cosm tico EXPLICAO: Algumas informa%3es sobre a va+uinha s&o fornecidas( inclusive o total arrecadado$ Apesar de receber desta+ue( n&o h! nenhuma sinali0a%&o de +ue o valor se trata do total arrecadado( podendo levar um usu!rio distrado a se perguntar do +ue se trata o valor em desta+ue$ RECOMENDAO: criar um ttulo acima do valor< *Fotal arrecadado,

Problema II: Preveno de erros LOCAL: Painel de controle da va+uinha( abai2o do ttulo da se%&o SEVERIDADEA Problema grande EXPLICAO: A lado de alguns dados sobre a va+uinha o usu!rio tem acesso a tr9s lin#sA ver va+uinha< cancelar va+uinha< e e2cluir va+uinha$ Guando acionado um dos dois 'ltimos lin#s( uma cai2a de di!logo aberta confirmando o dese)o do usu!rio em reali0ar a a%&o( mas no caso do redirecionado para o perfil da va+uinha diretamente$ primeiro lin#( *ver va+uinha,( o usu!rio perder todas as altera%3es n&o salvas$ RECOMENDAO: Abrir o perfil p'blico da va+uinha em uma nova guia ou abrir uma cai2a de di!logo perguntando se o usu!rio dese)a salvar as altera%3es antes de sair da p!gina$

Pode acontecer de um usu!rio acionar o lin# sem ter real inten%&o de sair da p!gina e por isso

Aba 5

Problema I: Controle e liberdade do usu%rio LOCAL: Campo *Dotivo da "a+uinha, SEVERIDADEA Problema pe+ueno EXPLICAOA O campo em +uest&o n&o estar entre as op%3es$ RECOMENDAOA Cria%&o de uma op%&o *outros,( onde o usu!rio poderia apresentar o motivo da arrecada%&o( caso este n&o este)a entre as op%3es da lista$ composto por uma cai2a de sele%&o com um n'mero

pe+ueno de op%3es a serem selecionadas como resposta$ O motivo da cria%&o da va+uinha pode

Problema II: Corres ondncia entre o sistema e o mundo real LOCALA Sele%&o de imagem para o perfil da va+uinha( no final da primeira aba SEVERIDADEA Problema grande EXPLICAO: Repeti%&o de problema anterior$ A falta de imagem n&o impede o usu!rio de continuar o cadastro( mas ele pode se sentir impedido de conseguir incorporar uma imagem pelo fato do te2to de apoio usar o termo HRL( da linguagem Ieb +ue n&o imagem da va+uinha$ RECOMENDAOA Hsar uma linguagem compreensvel para o maior alcance de usu!rios( para +ue se)a possvel a incorpora%&o de imagens de domnio e2terno e acrescentar a op%&o de selecionar um ar+uivo do pr4prio computador$ conhecido por todos os usu!rios$ Al m disso( o usu!rio pode +uerer colocar um ar+uivo salvo no computador como

Problema III: visibilidade do estado do sistema LOCAL: Op%&o SAL"AR no final da p!gina SEVERIDADE: Problema pe+ueno EXPLICAO: A op%&o para salvar as altera%3es se encontra muito afastado dos outros elementos da p!gina( possibilitando +ue o usu!rio n&o o visuali0e e fi+ue em d'vida se suas altera%3es foram( ou n&o( salvas automaticamente$ RECOMENDAO: Fornar a op%&o SAL"AR mais visvel( talve0 colocando/a na parte superior da p!gina$

Aba 7

Problema I: Controle e liberdade do usu%rio LOCAL: Painel de controle da va+uinha( aba de compartilhamento SEVERIDADE: Problema m dio EXPLICAO: Na op%&o *Convide seus amigos,( nenhum bot&o +ue possibilite essa inclus&o$ RECOMENDAOA =ncluir um bot&o de *=nclua, ou *Adicione amigos ; lista,$ dito +ue voc9 precisa apenas selecionar os

amigos +ue dese)a convidar$ No entanto( n&o aparece nenhum nome( assim como n&o aparece

Problema II: &juda e documentao LOCAL: Painel de controle da va+uinha( aba de compartilhamento$ SEVERIDADE: Problema grande EXPLICAO: N&o h! nenhum tipo de a)uda nessa aba de compartilhamento$ Caso a pessoa

tenha problemas para adicionar contatos( n&o h! nenhum tipo de instru%&o para tanto$ RECOMENDAO: =nclus&o de um bot&o de a)uda nesta aba do painel de controle$

Aba J
De acordo com os pilares da anlise e!r"s#ica$ a #ela n%o poss!i nen !m pro&lema 'is"'el sem (!e a 'a(!in a rece&a arrecada)*es+

Aba 8
N%o poss!i nen !m pro&lema de acordo com os pilares da anlise e!r"s#ica+

Se"ta Tela
Problema I: Projeto esttico e minimalista LOCAL ONDE OCORRE: ,odo o corpo da p-ina+ SEVERIDADE: Pro&lema -rande+ EXPLICAO: O e.cesso de in/orma)*es$ &o#*es e se-men#os da p-ina podem ca!sar r!"do na recep)%o da p-ina pelo !s!rio do ser'i)o+ RECOMENDAO: Eliminar in/orma)*es n%o necessrias para a reali0a)%o da doa)%o+ A-r!par em !m se-men#o apenas #odas as possi&ilidades de in#era)%o com redes sociais+ 1sar #ipo-ra/ia mais le-"'el e menos pol!i)%o 'is!al de cores+

'; INSPE01! SEMI!TICA

Uma )re3e Descrio do M4todo

A inspe%&o semi4tica um m todo de avalia%&o da comunicabilidade de interfaces de =>C$ @ste m todo visa analisar a +ualidade da metamensagem pretendida pelo designer( com o intuito de avaliar a facilidade com +ue o usu!rio acessa a l4gica de constru%&o da interface$ A metamensagem abrange as impress3es +ue o designer tem do usu!rio e de suas necessidades( e pode ser resumida na seguinte par!frase( onde as partes em desta+ue s&o a+uelas +ue devem ser completadas durante a inspe%&o semi4ticaA

2Es#e 3 o me! en#endimen#o$ como desi-ner$ de 'uem voc( usu%rio( ( do (!e aprendi (!e voc 'uer ou voc recisa #azer$ de 'ue maneira re#ere #azer( e or'u+ Es#e$ por#an#o$ 3 o sis#ema (!e pro4e#ei para 'oc5$ e es#a 3 a #orma como ode ou deve utiliz%)lo para alcan)ar !ma -ama de o&4e#i'os (!e se encai.am nes#a 'is%o+6

Antes de come%ar a inspe%&o( o avaliador deve criar um cen!rio de intera%&o( +ue definir! um conte2to de uso e um con)unto de ob)etivos dese)ados por um usu!rio$ @ste cen!rio servir! como base para +ue o avaliador identifi+ue( interprete e analise os signos codificados na interface$ Os signos s&o classificados em tr9s categoriasA matalingusticos( est!ticos e dinKmicos -o ideal +ue se)am analisados nessa ordem.$ Depois de selecionados os signos relevantes( o avaliador deve reconstruir as metamensagens de todos eles( para ent&o poder reali0ar uma compara%&o entre estas metamensagens e identificar as contradi%3es entre elas( elemento +ue gera problemas de comunicabilidade$ Finalmente( reali0a/se um )ulgamento dos problemas identificados( o +ue pode servir como base para melhorias no caso uma eventual adapta%&o da interface$

Sig$os Re%e3a$tes Meta%i$g#sticos

Primeira Tela

V"deo A interface utili0a do recurso audiovisual para informar o usu!rio sobre uma nova parceria e m todo de uso do site "a#inha$com$br diretamente da lo)a online da Livraria Saraiva$ Voc5 4 /e0 !ma 'a(!in a78O (!e di0em de n9s8O (!e es# acon#ecendo no Va:in a7

Cai2as de di!logo utili0adas para e2plicar o conceito do site( sua utili0a%&o e e2peri9ncias +ue outros usu!rios obtiveram utili0ando o servi%o$

Segunda Tela

Cai.a 'erde sem #"#!lo a direi#a Para utili0ar o site( necess!rio uma confirma%&o do e/mail cadastrado$ A cai2a utili0ada foi colocada para atentar o usu!rio a adicionar no seu filtro de mensagens o e/mail de alertas do "a#inha para +ue o e/mail de confirma%&o n&o caia no spam do usu!rio$

Terceira Tela En!nciado 'erde =nforma o usu!rio do processo +ue est! sendo reali0ado no momento$ Ap4s saber o seu estado no sistema( +ue o de cadastro da "a#inha( ele pode ter a liberdade de uso para decidir se continuar! ou n&o seguindo o processo sugerido$

En!nciados das cai.as de #e.#o A)udam o usu!rio a entender o +ue deve ser preenchido em cada cai2a de te2to( apoiando/o com e2emplos de possveis te2tos para preencher$

Se-men#o IMPOR,AN,E O sistema utili0a de uma linguagem direta para informar ao usu!rio como funciona a aplica%&o de ta2as nas doa%3es recebidas$ Dados n'meros e t4picos o a)udam a refletir sobre a validade e importKncia da informa%&o( como )! di0 a chamada =DPORFANF@$

$uarta Tela S!&en!nciado do #"#!lo principal da p-ina Refor%a +ue o usu!rio necessita escolher um template$ N&o especifica o +ue um template$

$uinta Tela Aba 5

E.emplos de reenc imen#o de campo Locali0ados abai2o dos ttulos dos campos( estes e2emplos s&o apresentados um tom cin0a( o +ue diminui a impress&o de sobrecarga de informa%3es( e s&o de suma importKncia para instruir o usu!rio +uanto ; forma correta de preencher os campos dos dados da va+uinha$ A presen%a destes e2emplos mostra +ue o designer considerou a possibilidade do usu!rio n&o compreender

corretamente o +ue era pedido$ Os e2emplos apresentam linguagem simples e )ovial( bem como situa%3es recorrentes no cotidiano$

,e.#o OPCIONAL Ao lado do ttulo do campo de sele%&o da imagem h! um te2to entre par9nteses( com o tom cin0a igual ao dos e2emplos$ @ste te2to enfati0a o car!ter opcional da sele%&o da imagem( tornando evidente para o usu!rio +ue a escolha de uma imagem n&o va+uinha$ essencial para a efetiva%&o da

Passo a Passo para a sele)%o da ima-em Com as mesmas configura%3es dos e2emplos supracitados( este signo est! locali0ado abai2o do campo onde deve/se inserir o endere%o da imagem escolhida para o perfil da va+uinha$ Nele o usu!rio instrudo em tr9s passos sobre o procedimento necess!rio para selecionar uma imagem importante( mas considera um usu!rio leigo( +ue da :eb para o perfil da va+uinha$ @ste signo

n&o est! acostumado a utili0ar imagens da internet e n&o conhece o procedimento b!sico para copiar o HRL de uma imagem$ Por outro lado( o campo utili0a termos +ue podem ser desconhecidos para usu!rios com este perfil( como o caso do pr4prio termo *HRL,$

Aba 7

Con'ide se!s ami-os no ;ace&oo:< @ste te2to em cai2a alta e destacado em verde d! enfo+ue para uma rede social em especfico( apesar da p!gina ser para envio de convites para diversas outras redes sociais$ L not!vel a sobressal9ncia do Faceboo# em rela%&o ;s outras redes sociais( mas esse desta+ue pode n&o ser muito bem recebido$ Hma pessoa +ue n&o utili0a o Faceboo# mas sim outra rede n&o tem essa prioridade$ Abai2o desse enunciado em desta+ue h! uma frase indicando +ue o usu!rio a reali0e o convite clicando em um bot&o mostrado abai2o( bot&o este +ue seria o do Faceboo#( implicitamente$ No entanto( h! uma s rie de bot3es de v!rias redes sociais( h! a op%&o de mandar um e/mail e ainda a op%&o de marcar a p!gina da va+uinha como um favorito$ =sso distonante da informa%&o dada anteriormente( al m de poder causar certa confus&o a um usu!rio n&o e2periente$ =sso s4 de certa forma relevado nessa avalia%&o por estarmos sob a 4tica de um um problema notado inclusive por algu m com este perfil$ usu!rio e2periente$ Apesar disso(

Di'!l-!e s!a 'a(!in a A frase destacada em verde e em cai2a alta refor%a o +ue foi dito nas frases acima( indicando os cones das redes sociais para divulga%&o da va+uinha$

Con'ide se!s ami-os8Impor#a)%o de con#a#os Dentro de uma em +uatro abas no painel de gerenciamento da va+uinha h! ainda uma divis&o em duas abas( a de convide seus amigos e de importa%&o de dados$ S&o considerados metalingusticos por apenas refor%arem a fun%&o da aba em +uest&o( apenas apresentando outras formas al m dos cones do topo da aba para divulga%&o da va+uinha$

Aba J

Sem (!e a 'a(!in a rece&a arrecada)*es a #ela n%o poss!i si-nos me#alin-!"s#icos rele'an#es+

Aba 8

En!nciado das cai.as de #e.#o =nformam o usu!rio a a%&o esperada para cada cai2a de di!logo$ @ssa parte da interface complementar para reafirmar a fun%&o a ser reali0ada$ a mais

clara e informativa( pois al m de di0er ob)etivamente a fun%&o de cada cai2a( tem uma frase

En!nciado da mensa-em de erro Para o caso do usu!rio n&o conseguir incorporar um foto ou vdeo( aparece um te2to e2plicando uma forma de entender o problema e um lin# com um tutorial para solucion!/lo ou para reali0ar a a%&o de forma diferente( de forma a n&o ocasionar em nenhum outro erro$

Se"ta Tela Dados so&re a Va(!in a Orientam o usu!rio criador e e2terior sobre o estado atual das doa%3es e a previs&o de conclus&o e arrecada%&o da "a+uinha$

Ver #odas as con#ri&!i)*es8Den!nciar es#a 'a(!in a Direcionam para informa%3es sobre as contribui%3es e possibilita usu!rios e2ternos ; denuncia de irregularidades do servi%o pelo usu!rio criador$

Est6ticos
Primeira Tela ;a)a 4 se! re-is#ro8=!scar8Cadas#rar Signos fi2os locali0ados em diferentes locais da p!gina( permite ao usu!rio se registrar no site(

procurar va+uinhas e2istentes na plataforma e cadastrar o seu e/mail para receber novidades sobre o site$

Segunda Tela ;a0er lo-in8En#rar pelo ;ace&oo:8Criar con#a Os signos est!ticos na tela do cadastro permitem o usu!rio logar caso )! tenha uma conta e registrar/se pelo site atrav s da sua conta na rede social Faceboo#$ Caso o usu!rio opte por n&o utili0ar o Faceboo#( ap4s preencher o cadastro( o signo Criar conta finali0a seu cadastro$

Terceira Tela Op)%o SAIR do men! 'erde>claro s!perior do lado direi#o "iabili0a a possibilidade do usu!rio ter liberdade de acesso e poder( a +ual+uer momento( se desconectar da conta criada$ Hso do verbo SA=R ilustra melhor o ato de se desvincular do +ue os verbos de linguagem da Ieb como D@SLOMAR$

Cai.as de #e.#o Os espa%os de preenchimento no corpo da p!gina indu0em facilmente o usu!rio a preench9/los( por se assimilarem a uma ficha de preenchimento material$ @spa%os de altura menor demonstram +ue o usu!rio deve escrever um te2to menor( assim como os espa%os maiores d&o lugar a te2tos mais longos$

=o#%o con/irmar =ndu0 facilmente a compreens&o do usu!rio de +ue( +uando ele terminar o cadastro de sua "a#inha( ele pode reconhecer esse bot&o com final do processo$ O fundo degrad9 remete a um bot&o tridimensional( por m tem o mesmo formato +ue os outros bot3es degrad9s do site$ Seria mais efica0 se o bot&o CONF=RDAR tivesse algum diferencial em sua forma ou cor ou tamanho( para se tornar ainda mais perceptvel ao leitor$

$uarta Tela En!nciado 'erde ?PASSO @A =nforma o usu!rio do processo +ue est! sendo reali0ado no momento e +ue ele sugerido$ o final$ O

usu!rio tamb m tem a liberdade de uso para decidir se continuar! ou n&o seguindo o processo

Se-men#o de /!ndo 'erde PROBE,OS

Retoma a classifica%&o )! escolhida pelo usu!rio para definir a tem!tica da sua "a#inha e apresenta os modelos disponvel para esta classifica%&o$

C!adros de #empla#e S&o +uadros sem mobilidade +ue n&o oferecem nenhum dinamismo$ Cada op%&o tem a legenda selecionar +ue direciona o usu!rio a clicar sob o +uadro de sua prefer9ncia$ Cada +uadro cont m o fundo do futuro perfil p'blico da "a#inha$

$uinta Tela Ver 'a(!in a8Encerrar 'a(!in a8E.cl!ir 'a(!in a Signos fi2os na parte superior da p!gina de gerenciamento da va+uinha criada( +ue permanecem est!ticos em todas as +uatro abas da p!gina$ Permitem +ue o usu!rio apenas encerre as contribui%3es( +ue a va+uinha se)a completamente e2cluda e fornece um lin# direto para a p!gina da va+uinha pronta( apontada neste trabalho como a interface N$ @ste lin# permite +ue o trKnsito entre painel de controle e p!gina final se)a r!pido e pr!tico( de modo a n&o impor nenhuma dificuldade ao usu!rio durante esse trKnsito$ Considera tamb m a possibilidade do usu!rio

desistir de manter a+uela va+uinha( facilitando o processo de cancelamentoOe2clus&o da mesma$

A&as de di'is%o das se)*es da p-ina Abai2o da parte superior da p!gina de gerenciamento h! +uatro divis3esA Dados da va+uinha< Convites e compartilhamento< Arrecada%3es< e Blog$ =sto indica( para um usu!rio +ue conhece a divis&o por abas( +uais s&o as se%3es apresentadas na p!gina de gerenciamento$ A *eti+ueta, da aba selecionada apresentada em tom verde( diferente das demais( +ue possuem tonalidade cin0a( enfati0ando em +ual !rea o usu!rio se encontra$

Sal'ar Va(!in a @ste importante signo n&o recebe todo o desta+ue visual +ue deveria receber( estando locali0ado a uma distKncia impr4pria dos outros elementos da p!gina$ Como o acionamento desta op%&o vital para salvar as altera%3es reali0adas na p!gina da va+uinha( este item deveria ser maior$

Aba 5

Com&o 2mo#i'o da 'a(!in a6 O campos *motivo da va+uinha, n&o livremente editado pelo usu!rio( apresentando uma seta ao

lado do campo( o +ue indica +ue o usu!rio deve escolher uma dentre as op%3es de motivos disponibili0adas pelo site$ A utili0a%&o deste recurso indica +ue o designer considera conhecer

bem as possveis ra03es do usu!rio para utili0ar o site "a#inha$com$br$

Dcone de calendrio Ao lado do campo *data de encerramento, apresentado um cone de calend!rio$ O cone n&o

acompanhado de nenhuma legenda( o +ue indica +ue o designer considera certo conhecimento pr vio por parte do usu!rio +uanto ; utili0a%&o deste signo$

A#!ali0ar Posicionado ao lado do campo dedicado ao endere%o da imagem escolhida( este signo recebe desta+ue por ser um retKngulo verde em alto relevo( indicando +ue o usu!rio deve acion!/lo afim de modificar a imagem atual para a+uela a +ual pertence o endere%o$

Aba 7

En!nciado da a&a Dentro do painel de gerenciamento da va+uinha o enunciado *Convites e compartilhamento, direciona para uma p!gina com op%3es de convidar amigos e compartilhar a va+uinha em diversas redes sociais( assim como envi!/la diretamente para um grupo selecionado de e/mails$

En'iar con'i#e O cone recebe um grande desta+ue( a+ui mais por seu tamanho do +ue pelo fato de estar em um retKngulo verde contrastante com a p!gina de fundo branco$ A+ui percebe/se como a divulga%&o da va+uinha site$ parte crucial no processo de arrecada%&o de dinheiro( +ue a fun%&o motora do

Dcones dos si#es para compar#il amen#o Os cones cont m apenas a imagem dos sites e redes sociais( mas seus respectivos nomes aparecem +uando o mouse compartilhada$ posicionado em cima de cada um$ @les tamb m recebem consider!vel desta+ue( novamente para refor%ar a ideia de +ue a va+uinha deve ser

Con'ide se!s ami-os Aba secund!ria dentro do painel de gerenciamento +ue permite uma visuali0a%&o em lista de um grupo de contatos para divulga%&o da va+uinha$

Impor#a)%o de con#a#os

Aba secund!ria dentro do painel de gerenciamento +ue permite +ue o usu!rio importe contatos do seu e/mail( de modo a facilitar o convite$ @ssa op%&o( no entanto( se torna redundante( visto +ue h! duas formas anteriores de reali0ar a mesma a%&o / compartilhar a va+uinha com contatos de e/ mail$

Aba J

,a&ela Apesar da inspe%&o prec!ria possibilitada sem +ue a va+uinha receba a arrecada%&o( possvel

perceber +ue esta aba cont m uma lista detalhada das arrecada%3es da va+uinha( apresentando colunas +ue abrangem v!riasas informa%3es +ue poderiam ser de interesse do usu!rio no +ue di0 respeito aos contribuintes$

Aba 8

En!nciado da a&a Dentro do painel de gerenciamento da va+uinha o enunciado *Blog, direciona para a p!gina de postagens acerca da va+uinha criada$

Sal'ar pos# Ao contr!rio do +ue acontece com o lin# para convite de amigos da interface P$7( a+ui o bot&o verde para salvar a postagem a ser publicada pe+ueno$ No entanto( por ser uma p!gina bem limpa e minimalista( isto n&o se torna pre)udicial para utili0a%&o da interface no caso de um usu!rio e2periente$ O bot&o recebe desta+ue pela cor em uma p!gina predominantemente branca$

Vis!ali0ar Permite ao usu!rio visuali0ar a forma como a foto ou vdeo incorporado aparecer! no post$ @st! destacada de verde( assim como a op%&o de salvar o post( dando desta+ue tamb m para a op%&o de ilustrar a postagem a ser publicada$

Cai.a de #e.#o Demonstram ao usu!rio a +uantidade de te2to +ue se deve escrever atrav s da dimens&o das cai2as e s&o de f!cil preenchimento( por se assimilar a +ual+uer tipo de formul!rio( comum em sites e em formul!rios impressos$

Se"ta Tela

=o#*es s!periores de incorpora)%o em redes sociais Bot3es -+ue simulam bot3es reais. +ue apresentam a possibilidade do usu!rio compartilhar a p!gina para as redes sociais de sua escolha( como o Faceboo#( F:itter( Moogle Plus e Pinterest$ Ao lado dos bot3es( e2poe/se o n'mero de compartilhamentos )! feito$

Con#ri&!a B< Hm bot&o negro e maior +ue os outros +ue tenta chamar a aten%&o do usu!rio para a doa%&o participativa da "a#inha$ Hsa degrad9 e n&o e2pressa minimalidade$ Bot&o direciona para p!gina de pagamento$

Per/il Perfil do usu!rio criador da "a#inha +ue possibilita uso de imagem de avatar( nome( idade e regi&o$ N&o utili0a de um padr&o est tico limpo ou legvel$

Di$7micos
Primeira Tela Men! O menu da p!gina inicial oculto( aparece apenas +uando o mouse se locali0a em cima dele(

sendo assim( um signo dinKmico$

Segunda Tela Calendrio Ao clicar no cone do calend!rio( um pop/up onde o usu!rio pode selecionar a data diretamente do calend!rio mensal apresentado$ @ste signo considera a possibilidade do usu!rio n&o lembrar a data ideal sem ter acesso a um calend!rio anual( ou simplesmente preferir visuali0ar tal calend!rio afim de escolher a data$ Terceira Tela Op)%o MINEA CON,A do men! 'erde>claro s!perior do lado direi#o Ao movimento do cursor se abre um submenu na op%&o D=N>A CONFA( +ue redireciona o usu!rio para os paineis de controle de sua conta$ O sistema possibilita assim total mobilidade( caso o usu!rio n&o este)a interessado em criar uma "a#inha no momento ap4s cadastro$

;inalidade da 'a(!in a Abre uma )anela com uma lista de classifica%3es para a "a+uinha$ O usu!rio precisa ter um

mnimo conhecimento de sistemas de =nternet para entender +ue clicar na escolha fechar! a )anela aberta$ No entanto( considera/se uma ferramenta bastante intuitiva$

=o#%o A,1ALIFAR G Ima-em incorporada =nicialmente( o usu!rio encontra um smbolo negativo em um +uadro na parte de incopora%&o de imagens para o perfil p'blico da "a#inha$ Ao lin#ar uma imagem na cai2a de te2to( o sistema atuali0a automaticamente a imagem( +ue substitui o smbolo de blo+ueio ao lado$ Sendo assim( o bot&o AFHAL=QA( +ue serviria para confirmar este lin#( n&o tem tanta utilidade e pouco prov m benefcios ao sistema$

$uarta Tela N%o poss!i si-nos dinHmicos rele'an#es+

$uinta Tela O ,empla#e ;oi Associado Com S!cesso Sempre +ue a p!gina recarregada( redirecionada da p!gina anterior ou ao se voltar de uma

p!gina diferente( uma cai2a de di!logo aparece com a mensagem *O Femplate Foi Associado Com Sucesso,( dei2ando o usu!rio ciente de +ue o template escolhido previamente foi salvo$

M!dan)a de a&a Ao clicar na divis&o das abas o usu!rio seleciona a a se%&o da !rea de gerenciamento da va+uinha em +ue pretende trabalhar$ Guando a aba +ue alterada( a tela volta ao topo da p!gina( o um pouco impr!tico( considerando +ue o usu!rio )! estava na !rea da tela +ue dese)ava

modificar$ Ao pro)etar esse comando( o designer parece considerar +ue o usu!rio n&o compreende +ue mudar! somente de aba( precisando rever o cabe%alho da p!gina para se locali0ar dentro da interface$

Aba 5

Calendrio Como acontece na segunda tela( ao clicar no cone do calend!rio( um pop/up onde o usu!rio pode selecionar a data diretamente do calend!rio mensal apresentado$ @ste signo considera a possibilidade do usu!rio n&o lembrar a data ideal sem ter acesso a um calend!rio anual( ou simplesmente preferir visuali0ar tal calend!rio afim de escolher a data$
Ima-em da Va(!in a

Guando o endere%o da imagem escolhida cone com a miniatura da imagem imagem foi( de fato( atuali0ada$

modificado e o usu!rio ativa o comando *atuali0ar,( o

modificado da antiga para a nova( evidenciando +ue a

A'iso de Erro @m um dado momento( ao tentar salvar as altera%3es reali0adas( uma cai2a de di!logo surge com a mensagem *Ocorreu um erro ao atualizar sua vaquinha. Por favor, tente novamente mais tarde . Na parte inferior da caixa h um cone Fechar, o que indica que a mensa em s! desaparece quando o usurio acion"lo, arantindo, assim, que a mensa em de erro se#a rece$ida.

Aba 7

Personali0e se! con'i#e Ao clicar em *@nvie seu convite,( ao inv s de envi!/lo diretamente( o site ainda permite +ue o usu!rio personali0e a mensagem do convite a ser enviado$ @ssa op%&o +ue ser! o bot&o utili0ado para envio final de mensagem$ disponibili0ada por uma cai2a de di!logo aberta logo ap4s o cli+ue$ Nesta cai2a h! um novo bot&o de *@nviar o convite,(

P-inas personali0adas de cada rede social para compar#il amen#o da 'a(!in a Ao clicar no cone de cada rede social( delas inspe%&o aberta uma nova cai2a de di!logo$ Como cada uma

a cai2a de di!logo padr&o de cada um dos sites( sua an!lise n&o cabe a+ui( visto +ue esta apenas acerca da programa%&o do site *"a#inha$com$br,$

Aba J

Sem (!e a 'a(!in a rece&a arrecada)*es a #ela n%o poss!i si-nos dinHmicos rele'an#es+

Aba 8

Pos# sal'o com s!cesso Ao concluir um post e clicar na op%&o salvar( aparece um +uadro com a mensagem afirmando +ue a postagem foi publicada$ A mensagem desaparece com o cli+ue no bot&o fechar( centrali0ado e devidamente destacado na cai2a de di!logo tempor!ria$

Mensa-em de erro ao #en#ar incorporar '"deo8/o#o Aparece abai2o da cai2a de inclus&o do lin# com uma fonte pe+uena e cin0a claro$ N&o fica t&o evidente como outras mensagem +ue aparecem em cai2a de te2to pr4pria$ @ssa disposi%&o pode confundir o usu!rio( +ue pode nem mesmo perceber +ue apareceu uma mensagem de erro$

Edi#ar8E.cl!ir @stes signos aparecem ao lado dos lin#s para os posts )! publicados$ As op%3es s&o destacadas de verde e apresentam signos ob)etivos e de clara compreens&o da a%&o a ser desempenhada$

Se"ta Tela Incorpore o Va:in a Cria uma )anela dentro da p!gina com c4digo >FDL para incorpora%&o de uma :idget em outras p!ginas$ Segmento direcionado para usu!rios avan%ados na =nternet$

=anner do aplica#i'o Va:in a para ;ace&oo: Banner animado instituicional +ue fa0 publicidade do aplicativo da "a+uinha para o faceboo#( oferecendo ao usu!rio criador um novo servi%o de plataforma de acesso ao "a#inha$com$br

Comen#rios do ;ace&oo: na p-ina Os usu!rios e2ternos podem comentar e ao mesmo tempo promover na rede social o perfil p'blico da "a#inha$ O segmento de coment!rios tem como personali0!/lo ou modific!/lo$ o padr&o da rede Faceboo#( sendo +ue o "a#inha n&o

Moni#oramen#o do ,Ii##er Segmento onde os usu!rios podem acompanhar as marca%3es do perfil da "a#inha na rede social F:itter$ Famb m construdo pela rede social F:itter( e o flu2o de t:eets sobrem de acordo com ordem cronol4gica$

Com8arao/Verso Re3isada das metame$sage$s

Primeira Tela A interface busca apresentar ao usu!rio o site( seus ob)etivos e finalidades$ Com um vdeo e2plicativo de uma nova fun%&o oferecida pelo "a#inha$com$br( coluna logo abai2o da cai2a de te2to onde mostrado ao leitor as parcerias +ue o site possui com outras empresas$ O designer d! maior desta+ue aos parceiros em uma e2plicado o funcionamento do site$ O designer busca mostrar( na cai2a lateral( e2peri9ncias +ue outros usu!rios tiveram com o site( levando o novo usu!rio a ser convencido dos benefcios do site$

Segunda Tela A tela de cadastro de usu!rios foi pensada de forma auto/e2plicativa( para +ue os usu!rios(

e2perientes ou n&o( possam compreender e utili0ar a plataforma$ Com um formato simples( h!

cai2as de di!logos para serem preenchidas com os dados do usu!rio( al m da op%&o de login com a rede social Faceboo#$ @sta op%&o facilita o cadastro do usu!rio( re+uerendo +ue este apenas

preencha o cadastro com o seu CPF e finali0e o processo ao concordar com os termos de uso -a partir da marca%&o da cai2a com esta op%&o.( criando ent&o a conta( +ue recebe um lin# destacado +ue finali0a a p!gina$

Terceira Tela O sistema priori0a o cadastro dos dados antes da documenta%&o das ta2as aplicadas pelo "a#inha$com$br nas doa%3es$ O designer tendencia o usu!rio a completar os dados e confirmar( n&o dando a 9nfase necess!ria para a importKncia da mensagem$ O bot&o CON;IRMAR vem logo ap4s os campos de preenchimento( sendo possvel para o usu!rio clic!/lo mesmo antes de ler o anunciado do segmento IMPOR,AN,E$

$uarta Tela
O processo de cadastro da "a#inha reali0ado em duas etapas( sendo uma completamente essencial para +ue o servi%o se)a garantido( e a outra referente apenas ao la1out do perfil p'blico da "a#inha$ Fodo esse cadastro poderia se resumir em apenas um passo( utili0ando/se de menos signos e priori0ando as informa%3es au2iliares do servi%o( como a aba IMPOR,AN,E$

$uinta Tela Nesta se%&o( dividida em +uatro !reas distintas( o usu!rio pode gerenciar sua va+uinha( reali0ando modifica%3es( e2cluindo ou( no case de um pro)eto em constru%&o( cancelando/o$ @m v!rios momentos o designer contradi0 o perfil do usu!rio( como ser! melhor apresentado abai2o$ A abertura de cai2a de di!logos confirmando a%&o +uando selecionados os lin#s *e2cluir, e *cancelar va+uinha, demonstram certa preocupa%&o do designer +uanto ; aten%&o do usu!rio e a preven%&o de erros( en+uanto o redirecionamento direto +uando selecionada a op%&o *ver va+uinha desconsidera as mesmas possibilidades supracitadas$ Aba 5

%nquanto em certos momentos desta a$a o usurio possui total li$erdade &na escolha da data limite da vaquinha, por exemplo', em outros suas op()es s*o limitadas &como acontece com a escolha do motivo da vaquinha e a sele(*o da ima em'. +sto mostra uma certe desconsidera(*o por parte do desi ner no que diz respeito , vontade do usurio. - a$und.ncia de exemplos e a explica(*o passo a passo para a escolha de uma ima em s*o elementos ideais para usurios lei os que n*o possuam conhecimento $sico em

lin ua em e uso da internet, caractersticas essas que n*o condizem com o perfil de #ovem com experi/ncia na 0%1 que o site privile ia. -l2m disso, a utiliza(*o de lin ua em t2cnica, como o termo 345, pode dificultar a compreens*o para usurios lei os.

Aba 7 primordial e

Os designers dese)am +ue o usu!rio entenda +ue a divulga%&o da sua "a#inha

aumentar! as chances de arrecada%&o do valor dese)ado$ Percebe/se tal inten%&o pelo bot&o destacado ENVIAR CONVI,ES e pela +uantidade de op%3es de compartilhamento( chegando a redundKncia de signos para a mesma tarefa$ Aba J

A partir desta se%&o percebe/se +ue o designer considerou o possvel interesse do usu!rio nas arrecada%3es con+uistadas pela sua va+uinha( bem como nos contribuintes$ A coluna R@CADO indica tamb m +ue estes contribuintes podem dei2ar mensagens para o usu!rio no momento da contribui%&o( o +ue abre espa%o para uma comunica%&o entre beneficiado e beneficiante$ Aba 8

O sistema espera +ue os usu!rios compreendam a linguagem utili0ada na Ieb$ =sto percebido pela mensagem de erro +ue apresenta um tutorial e2tremamente t cnico para a solu%&o de incorpora%&o de vdeos e imagens$ O sistema tamb m cobra certa aten%&o do usu!rio na finali0a%&o do post( devido ; semelhan%a e pro2imidade dos bot3es VIS1ALIFAR e SALVAR POS,$
Se"ta Tela

O e2cesso de bot3es e possibilidades de compartilhamento podem confundir o usu!rio$ @2istem dois bot3es C1R,IR da rede social Faceboo# no inicio da p!gina( sendo um referente a p!gina Va:in a+com+&r( com mais de NR mil c!r#idas( e outra referente ao perfil da va+uinha pronta do usu!rio criador$ N&o e2iste( no entanto nada +ue diferencie os dois bot3es( e2ceto os valores$ O sistema imagina +ue o usu!rio consiga distribuir a aten%&o por toda a p!gina( impress&o +ue se torna falha( afinal( a +uantidade de informa%3es e segmentos disponveis podem confundir at usu!rios e2perientes$

9#%game$to dos A3a%iadores

O site "a#inha$com$br foi estruturado para usu!rios +ue )! possuem alguma e2peri9ncia com a Ieb( no entanto( em v!rios momentos o designer d! indcios de +ue considera a utili0a%&o por parte de usu!rios ine2perientes( sem conhecimento b!sico de comandos e termos tpicos da

internet$ O designer conseguiria e2pandir o p'blico do site definindo melhor o perfil de seus usu!rios e n&o usasse de termos t cnicos para orientar processos pelo +ual este passa$ @m alguns momentos ele falha na tentativa de simplificar tais processos -como a separa%&o desnecess!ria do cadastro da va+uinha em dois passos.$ Os bot3es em degrad9 verde s&o muito parecidos e podem confundir um usu!rio novato$ A minimali0a%&o dos signos e o recurso de abas facilitariam o uso do sistema e poderiam agili0ar os processos internos$ As abas +ue s&o utili0adas( como no caso da p!gina de gerenciamento da va+uinha( possuem caractersticas de p!ginas diferentes< ao mudar de aba o usu!rio n&o aciona uma simples mudan%a na !rea da p!gina dedicada a cada aba( mas volta ao topo da p!gina( o +ue um pouco improdutivo e totalmente desnecess!rio$

@m suma( h! uma comunica%&o regular entre o desenvolvedor e o usu!rio( +ue poderia ser aprimorada$ Algumas das metamensagens pretendidas s&o contradit4rias( o +ue pode implicar em falhas na comunica%&o designer/usu!rio$

=; C!NCLUS1!

A partir da reali0a%&o da Avalia%&o >eurstica e da =nspe%&o Semi4tica da interface do site va#inha$com$br interface$ @m primeiro lugar( o designer coloca muitos passos desnecess!rios( +ue poderiam ser resumidos( simplificando e acelerando o processo$ O usu!rio possui uma liberdade relativamente boa( no entanto h! elementos b!sicos onde as op%3es s&o limitadas( como a escolha da imagem para o perfil p'blico da va+uinha$ @m v!rios momentos possvel perceber uma discordKncia entre o usu!rio ideal para o site e o perfil de usu!rio considerado pelo designerA h! passagens em +ue todas as a%3es s&o descritas passo a passo( como +ue para iniciantes( en+uanto a linguagem aborda termos t cnicos( +ue podem fugir do conhecimento deste mesmo usu!rios ine2periente$ Hm ponto importante para a uma melhor elabora%&o da interface a melhor defini%&o deste perfil de usu!rio( pois esta discordKncia acarreta em possveis falhas na comunica%&o designer/usu!rio$ @stes problemas de discordKncia no perfil do usu!rio e utili0a%&o de linguagem t cnica percebida tamb m na an!lise heurstica$ Outro fator relevante di0 respeito ; apar9ncia do site$ @m certos momentos h! muita polui%&o visual( en+uanto outras !reas do site apresentam elementos muito semelhantes$ O ideal seria encontrar um e+uilbrio na representa%&o dos elementos da interface( apresentando cones visveis e diferenciados +uando importantes( mas sem e2ageros$ No geral( possvel afirmar +ue o site va#inha$com$br possui uma proposta possvel perceber +ue o la1out simples e do processo r!pido de cria%&o de conta s&o relativos( +uando considerados todos os aspectos da cria%&o da

interessante e 'til( mas precisa trabalhar em melhorias na sua interface( afim de aprimorar a usabilidade e a comunicabilidade do sistema$ L recomendado tambem +ue o site se ade+ue a um perfil mais especfico de usu!rio( de modo a tornar/se mais atraente o p'blico +ue se encai2a neste perfil$

>; ANE:!S Anexo 1 Pgina Inicial

Anexo 2 Criar nova conta

Anexo 3 Criar a primeira vaquinha passo 1/2

Anexo 4 Criar a primeira vaquinha 2/2

Anexo 5 Gerenciamento da Vaquinha aba 1/4

Anexo 6 Gerenciamento da Vaquinha aba 2/4

Anexo 7 Gerenciamento da Vaquinha aba /4

Anexo 8 Gerenciamento da Vaquinha aba 4/4

Anexo 9 Per!il p"blico da vaquinha