tcc entrega final

Download TCC Entrega Final

Post on 22-Jun-2015

5 views

Category:

Documents

1 download

Embed Size (px)

TRANSCRIPT

MURILO FERREIRA SOARES RE-DESIGN DO WEBSITE DA ESCOLA MICROCAMP INTERNACIONAL TrabalhodeconclusodocursodeDesenho IndustrialhabilitaoemDesignGrficoda Universidade Federal do Paran. Orientadora: Prof. Stephania Padovani CURITIBA 2007 ii AGRADECIMENTOS minhaesposa,pelafora,compreenso,ateno,apoioecarinhonos momentos mais difceis e exaustivos dessa trajetria. minhafilha,poisaalegriadesuachegadatrouxemaisnimoecoragem para o cumprimento de mais esta etapa da vida. Ao meu pai, que sempre me apoiou e incentivou meus estudos. minhaorientadora,poracreditaremmimeajudaradirecionarmeus estudos para uma rea alm do design simplesmente criativo e esttico. Aos amigos, que torcem por nosso sucesso assim como torcemos por eles. iii RESUMO Ao longo dos anos a Internet vem se tornando cada vez mais uma ferramenta fundamentalparaadivulgaodeservioseprodutosdeempresasquebuscam conquistar o mercado com rapidez e eficcia. No entanto, nessa busca desenfreada pela conquista de seu espao na rede, muitasempresas,taiscomoaescolaMicrocamp,optaramporcriarseusprprios sitessemoconhecimentonecessrioedeixaramadesejarcolocandonoarsites compoucocontedoouprecriosquenocontribuemmuitoparaaconquistade novos clientes. Nesse trabalho buscamos mostrar que o papel do designer fundamental na criaodesites,poiscomoentendimentoadequadoemultidisciplinarpossvel aplicarconceitosquefavorecemovisualeainteratividadedossites,contribuindo dessa forma para um melhor aproveitamento dos espaos na rede. Com o levantamento dos principais problemas atravs de listas heursticas e pesquisasjuntoaosusurios,pudemosdefinirospontosaseremtrabalhadose redesenhados. SeguindoomodelodeGARRET(2003)paraodesenvolvimentodesites, almdoempregodeconceitosdeusabilidade,e-Learningearquiteturada informao, buscamos propor melhorias funcionais e estticas para o site da escola. Como resultado apresentamos uma interface mais limpa, concisa, coerente e funcional que contribuir para a divulgao dos produtos e servios da escola e que apresenta alternativas de interatividade e desenvolvimento pessoal. iv ABSTRACT Over the years the Internet has become increasingly a fundamental tool for the dissemination of services and products to organizations seeking conquer the market with speed and efficiency. However,thisunbridledquestfortheachievementofyourspaceinthe network,manycompanies,suchasschoolMicrocamp,chosetocreatetheirown sites without the knowledge needed and left to be desired putting on the air sites with littlecontentorinsecurethatdonotcontributemuchfortheconquestofnew customers. Inthatjobseekingshowthattheroleofthedesigneriscrucialincreating sites, as with the proper understanding and multidisciplinary you can apply concepts thatfavorthelookandinteractivityofsites,therebycontributingtoamoreefficient use of space in the network. With the lifting of the main problems through lists heuristics and research with users, we were able to define the issues to be worked and re-designed. FollowingthemodelofGARRET(2003)forthedevelopmentofsites,in additiontotheemploymentofconceptsofusability,e-Learningandarchitectureof information,seekofferfunctionalandaestheticimprovementstothesiteofthe school. Asaresultpresentacleanerinterface,concise,coherentandworkablethat contributetothedisseminationoftheproductsandservicesoftheschoolandthat presents alternatives for interactivity and personal development. v SUMRIO AGRADECIMENTOS ............................................................................................................ II RESUMO .............................................................................................................................. III ABSTRACT .......................................................................................................................... IV 1.INTRODUO ............................................................................................................... 1 1.1.CONTEXTUALIZAO DO PROBLEMA .................................................................... 1 1.2.OBJETO DE ESTUDO ................................................................................................ 3 1.3.OBJETIVOS ................................................................................................................ 6 1.3.1.Objetivos Gerais ...................................................................................................... 6 1.3.2.Objetivos Especficos .............................................................................................. 6 1.4.JUSTIFICATIVA .......................................................................................................... 6 1.5.ESTRUTURA DA MONOGRAFIA ............................................................................... 7 2.REFERENCIAL TERICO ............................................................................................. 9 2.1.E-LEARNING .............................................................................................................. 9 2.2.METODOLOGIAS DE DESENVOLVIMENTO PARA A WEB .................................... 15 2.3.ARQUITETURA DA INFORMAO .......................................................................... 20 2.4.PRINCPIOS DE USABILIDADE ............................................................................... 25 2.5.FERRAMENTAS DE IMPLEMENTAO .................................................................. 29 2.5.1.Utilitrios e Recursos Disponveis .......................................................................... 30 2.4.2.Linguagens ............................................................................................................ 36 3.DESENVOLVIMENTO PROJETUAL ........................................................................... 38 3.1.PESQUISA COM USURIOS ................................................................................... 39 3.1.1.Desenvolvimento ................................................................................................... 39 3.1.2.Resultados Obtidos ............................................................................................... 41 3.2.BRIEFING ................................................................................................................. 46 3.2.1.Desenvolvimento ................................................................................................... 46 3.2.2.Resultados Obtidos ............................................................................................... 47 3.3.AVALIAO COM BASE EM HEURSTICAS ........................................................... 49 3.3.1.Desenvolvimento ................................................................................................... 50 3.3.2.Resultados Obtidos ............................................................................................... 52 3.4.ANLISE DE SIMILARES ......................................................................................... 58 3.4.1.Sites Escolhidos .................................................................................................... 59 3.4.2.Parmetros de Comparao .................................................................................. 61 3.4.3.Resultados Obtidos (Ptos +; Ptos -) ....................................................................... 61 3.5.GERAO DE ALTERNATIVAS ............................................................................... 80 3.6.SELEO E DETALHAMENTO DA ALTERNATIVA ESCOLHIDA ........................... 87 3.7.AVALIAO DE USABILIDADE E VALIDAO DO SITE GERADO ........................ 91 4.CONCLUSO ............................................................................................................ 103 ANEXOS ........................................................................................................................... 108 SOARES, M. - TCC 2007 Re-design do Website da escola Microcamp Internacional 1 1.INTRODUO 1.1.CONTEXTUALIZAO DO PROBLEMA Algunsautoresdividemahistriadahumanidadeemtrsimportanteseras: agrcola,industrialedigital.Naeradigitalasociedadetemrecebidoonomede sociedadedainformao,aquelacujaculturaeeconomiadependem essencialmente da tecnologia, da comunicao e da informao. No Brasil, a histria da Internet comeou em 1991 com a RNP (Rede Nacional de Pesquisa), uma operao acadmica subordinada ao MCT (Ministrio de Cincia eTecnologia).ComosurgimentodaWorldWideWeb(TeiadeAlcanceMundial), tambm conhecida como Web, W3 e WWW, esse meio foi ainda mais enriquecido. O contedo da rede ficou mais atraente com a possibilidade de incorporar imagens e sons. Um novo sistema de localizao de arquivos criou um ambiente em que cada informao tem um endereonicoepodeserencontradaporqualquerusurioda rede (GOTO & COTLER, 2005). Constitudadedocumentosdecontedomultimdia(contendotextos, imagens,vdeos,sons)interativo,chamadoswebpages(pginasdainternet),a Webgaranteumariquezasensorialecriaumforteapelo(HOLZSCHLAG,2004). Estacaractersticacontribuiuparasuautilizaocomoveculodenegcios, causandoaexplosodaInternetqueestamosvivenciandoesuaconseqente explorao em diversos setores do mercado consumidor. Com a incontestvel influncia da Internet na sociedade, onde cada vez mais empresaseinstituiesbuscamalcanaropblicocomsuasofertas,produtose divulgaesemgeral(LEONEL,2005),imprescindvelqueexistauma caracterstica nica para fortalecer sua marca e suas idias em meio a tantas outras (ROCHA&CHRISTENSEN,1995),aqualpodeseralcanadaatravsdeumsite bem estruturado que v ao encontro das necessidades do pblico a ser conquistado. Nosdiasdehoje,nomaisumluxoousimplesquestodeopouma pessoautilizaredominaromanuseioeserviosdisponveisnaInternet,pois consideradoomaiorsistemadecomunicaodesenvolvidopelohomeme,entre outrascoisas,umadasmaioresemelhoresferramentasdealcancedemercados SOARES, M. - TCC 2007 Re-design do Website da escola Microcamp Internacional 2 potenciaisparaprodutoseservios(GARFINKEL,1999)ofertadosporempresase instituiesquebuscamsedestacaremsuaread