12
6. Viso de Interface
Interface a parte do sistema com a qual o usurio ter contato, e ser atravs dela que o mesmo far uso das funcionalidades oferecidas pelo sistema. Durante o uso do sistema, o usurio consegue classific-lo como fcil ou difcil com base na sua interface. Essa classificao denominada usabilidade do sistema. Outros fatores que so relevantes nessa avaliao de usabilidade so a eficincia, a eficcia e a satisfao em uso.
Neste captulo descrevem-se as diretivas de usabilidade e os padres de interfaces utilizados no Sistema de E-Commerce. 6.1. Diretivas de Usabilidade
Durante o processo de desenvolvimento do E-Commerce, foi utilizado algumas diretivas para aperfeioar a produo do mesmo, tais como: Diretivas para elaborao de contedo
Diretivas para produo de pginas
Diretivas para projeto arquitetural
Diretivas para projeto navegacional
Diretivas para elaborao do projeto de interface
Diretiva para realizao de testes
A usabilidade um fator de vital importncia para qualquer software desenvolvido. a usabilidade que vai prover o feedback entre o usurio e a interface apresentada. Para o site de E-Commerce a questo da usabilidade algo estritamente necessrio, pois caso o usurio no se sinta a vontade utilizando o sistema apresentado, o mesmo ir buscar em outro site, procurando por facilidade e confiana para realizar sua compra.6.2. Padres WEB de Montero
Padro pode ser definido como uma soluo conhecida, previamente testada e que apresenta um nvel de sucesso satisfatrio para um determinado problema.
Os padres WEB apresentados por Montero so padres que visam facilitar a construo de ferramentas e softwares para web. Tambm visam ressaltar as melhores praticas para o desenvolvimento web e so divididos em trs grupos conforme ilustra a Figura 30:
Figura 1 - Linguagem de Padres Web de Monteiro6.3. Apresentao do Prottipo
Um prottipo uma boa prtica durante o desenvolvimento, e utilizado para a validao dos requisitos do sistema e apresentao de funcionalidade para os usurios.
O prottipo desenvolvido neste trabalho foi com base nos padres web de Montero e sero descritos nos itens subseqentes, cada um em sua respectiva camada.
6.3.1. Camada Web
O padro Welcome descreve que o usurio precisa saber onde est, quais so suas opes e o que ele precisa para visitar o site. Conforme ilustra a Figura 2, possvel notar a clara inteno do site bem como uma boa recepo ao cliente na pgina principal do site. Outros itens a serem avaliados dentro deste padro com os padres Homepage, Indication, Ready, Polyglot, About This e Contact Us sero descritos com mais detalhes a seguir.
Figura 2 - Linguagens de Padres de Montero - Welcome
Para permitir o acesso a todos, o padro Polyglot foi adotado. Atravs da mensagem no rodap do site, como ilustra a Figura 3, o usurio informado sobre a melhor resoluo e navegador para visitar o site, porm o site se ajusta para usurios que possurem resolues e navegadores diferentes o mnimo especificado.
Figura 3 - Linguagem de Padres de Montero PolyglotCom menus bem visveis, com descries bvias e disponveis todo o tempo, o usurio sabe o que ele pode fazer a partir de qualquer ponto do site. A seguir, a Figura 4 que ilustra o padro Indication para satisfazer essa necessidade.
Figura 4 - Linguagem de Padres de Montero - IndicationPara o usurio saber se est no mesmo site (padro Similarity), foi utilizada uma nica folha de estilo e uma nica estrutura para disposio das informaes e menus/links de acesso de forma a no confundir o usurio, conforme ilustra a Figura 5 a seguir:
Figura 5 - Linguagem de Padres de Montero - Similarity6.3.2. Camada de Pgina
O padro Homepage visa manter o usurio orientado, possibilitando que o mesmo consiga navegar de volta caso se sinta perdido. Sua utilizao pode ser vista na Figura 2. Este padro assim com o Welcome discutido anteriormente, o Homepage tambm faz uso de outros padres, tais como: Novelty, Tag Line, Search, Subscription, Contact Us e About This, que sero todos discutidos a seguir.Para manter o usurio no controle das operaes, foi adotado o padro Second Chance. Sua utilizao pode ser claramente notada na Figura 6, que demonstra o carrinho de compras do site. Neste carrinho, o usurio pode por conta prpria remover produtos, recalcular o frete, atualizar os valores da compra e por fim efetuar a compra.
Figura 6 - Linguagem de Padres de Montero - Second ChancePara obter as informaes dos usurios, foi adotado o padro Form, principalmente na seo de cadastro. Atravs dos formulrios l contidos, o usurio pode se cadastrar para acessar o contedo personalizado, conforme ilustra a Figura 7.
Figura 7 - Linguagem de Padres de Montero - FormPara navegao entre as pginas do site foi utilizado o padro Polite, que proporciona aos usurios o modo mais simples e claro de visualizao do contedo desejado. Atravs de menus objetivos e claros, o usurio pode chegar at a seo desejada com poucos cliques, conforme demonstra a Figura 8
Figura 8 - Linguagem de Padres de Montero - PolitePlug-ins so bem comuns quando o assunto internet. Na web muito sites utilizam se no o mais famoso Flash Player da Adobe. Para suprir a necessidade dos usurios que pele primeira vez se deparam com a necessidade de instalao do mesmo para visualizar corretamente o contedo a ele exibido, foi adotado o padro Danger, e para aqueles usurios que no possuem o plug-in, foi disponibilizado o link para download, conforme ilustra Figura 9:
Figura 9 - Linguagens de Padres de Montero - Danger6.3.3. Camada de Ornamento
A proposta do site tambm est bem clara, graas ao padro Tag Line adotado. Atravs do slogan no janela do navegador, logo e das imagens contidas facilmente notado que se trata de um E-Commerce, como ilustra a Figura 10:
Figura 10 - Linguagem de Padres de Montero - Tag LineAs informaes sobre a companhia so facilmente encontradas atravs do link no menu rpido ou do menu esquerda, satisfazendo o padro About This como demonstra a Figura 11:
Figura 11 - Linguagem de Padres de Montero - About ThisNo menu a esquerda pode-se notar o link para a busca de produtos do site. Muito til para quem utiliza de deseja encontrar de forma rpida algo que procura, segundo o padro Search. A busca por produtos apresentada possui dois filtros: por produto e por faixa de preo, conforme visto na Figura 12
Figura 12 - Linguagem de Padres de Montero - SearchPara um E-Commerce de vital importncia prover aos visitantes do site, informaes sobre novos produtos e promoes. Seguindo o padro Novelty, a Figura 13 ilustra os lanamentos dos produtos, colocando-os em destaque j na pagina principal do site.
Figura 13 - Linguagem de Padres de Montero NoveltyEm caso de alguma dvida ou comentrio, o usurio pode fazer uso do formulrio de contato (padro Contact Us) para estabelecer comunicao com os responsveis pelo site, conforme mostra a Figura 14:
Figura 14 - Linguagem de Padres de Montero - Contact UsAs informaes dos usurios so privadas e protegidas durante o preenchimento das mesmas pelo usurio. Conforme descreve o padro Secret, esto disponveis polticas de privacidade e termos de uso para o usurio verificar a confiabilidade do site como demonstra a Figura 15 e Figura 16
Figura 15 - Linguagem de Padres de Montero - Secret
Figura 16 - Linguagem de Padres de Montero - SecretAs novidades do site tambm podem ser vista fora do mesmo. Atravs de notificaes via email, os usurios que optarem por receber o informativo, estaro cientes das ultimas novidades e promoes, como ilustra a Figura 17 (padro Subscription)
Figura 17 - Linguagem de Padres de Montero - SubscriptionPara todas as pginas visitadas pelo usurio, o mesmo ir encontrar no topo de cada uma a sua atual localizao (padro Location), conforme visto na Figura 18
Figura 18 - Linguagem de Padres de Montero LocationAs cores do site tambm foram utilizadas seguindo o padro Colour, para prover um melhor contraste entre imagens e textos, bem como locais de destaque com cores e tamanhos diferente dos demais.A disposio dos textos contidos no site foi feita com base no padro Print, facilitando a leitura e impresso pela diviso em blocos de texto, conforme ilustra a Figura 19
Figura 19 - Linguagem de Padres de Montero - PrintNa web, um recurso muito interessante e que vem sendo utilizado com muita freqncia a capacidade do site reconhecer o seu usurio quando o mesmo retorna ao site. Para isso foi utilizado o padro Recognize e fornecido ao usurio do E-Commerce, seus ltimos produtos visitados, conforme ilustra a Figura 20
Figura 20 - Linguagens de Padres de Montero - Recognize6.4.Avaliao do uso de padres como ferramenta de projeto
Com a velocidade que a internet vem crescendo, junto com ela cresce o nmero de usurios, sendo que cada um apresenta um perfil diferente. Um site hoje necessita atender o maior nmero possvel de pessoas para atingir o sucesso. Uma forma bem eficiente e que j demonstrou inmeros resultados a utilizao de padres para o desenvolvimento. Os padres descritos por Montero facilitam o desenvolvimento com a certeza de buscar solues para facilitar a navegao e o acesso dos diferentes grupos de usurios que visitarem o site.
