Embed Size (px)
DESCRIPTION
ergonomia de ihms projeto e avaliacao
Citation preview
UNIÃO EDUCACIONAL MINAS GERAIS S/C LTDA FACULDADE DE CIÊNCIAS APLICADAS DE MINAS Autorizada pela Portaria no 577/2000 – MEC, de 03/05/2000 BACHARELADO EM SISTEMAS DE INFORMAÇÃO
UM ESTUDO DE PADRÕES EM
PROJETO DE INTERFACE HOMEM - MÁQUINA
FERNANDO GONZAGA SOUZA
Uberlândia
2006
FERNANDO GONZAGA SOUZA
UM ESTUDO DE PADRÕES EM
PROJETO DE INTERFACE HOMEM - MÁQUINA
Trabalho de Final de curso submetido à UNIMINAS como parte dos requisitos para a obtenção do grau de Bacharel em Sistemas de Informação.
Orientador: Prof. Msc. Francisco José Muller
Uberlândia
2006
FERNANDO GONZAGA SOUZA
UM ESTUDO DE PADRÕES EM
PROJETO DE INTERFACE HOMEM - MÁQUINA
Trabalho de Final de curso submetido à UNIMINAS como parte dos requisitos para a obtenção do grau de Bacharel em Sistemas de Informação.
Orientador: Prof.Msc. Francisco José Muller
Banca Examinadora:
Uberlândia, 19 de Julho de 2006.
__________________________________
Prof. Dr. Mauro Hemerly Gazzani
__________________________________
Prof. Msc. Francisco José Muller
_________________________________
Prof. Esp. Carlos Barros
Uberlândia
2006
�������������� ��������������������������������������������������������
����������������������������������������� ����������������������� ���������
AGRADECIMENTOS
Agradeço a DEUS em primeiro lugar, por ter me concedido esta oportunidade
valorosa de conseguir vencer mais uma etapa de minha vida. Agradeço aos
meus pais e familiares pela confiança, motivação e por acreditar na minha
capacidade. A minha noiva, pela paciência, compreensão e pela força que tem
me dado. A UNIMINAS, a professora Kátia Lopes e ao professor e orientador
FRANCISCO JOSÉ MULLER, que me ajudaram na realização deste trabalho, e
todos aqueles que tenham participado diretamente ou indiretamente para a
construção do mesmo....OBRIGADO !
RESUMO
A evolução da informática tem facilitado a vida nos dias atuais, devido a sistemas que
foram ou são desenvolvidos com a função de ajudar várias tarefas no dia a dia, tanto
em empresas, como em escolas, residências, hospitais etc. Entretanto, muito desses
programas ao invés de auxiliar em diversas rotinas de trabalho, faz muito pelo
contrário, ou seja, o próprio software que fora desenvolvido para determinado objetivo
específico, se torna um programa confuso, complicado de entender suas
funcionalidades e ainda por fim, causa pânico na maioria das pessoas que os utilizam.
Este trabalho apresenta os problemas encontrados no desenvolvimento de interfaces
para programas de computador e demonstra a importância de se criar um projeto
específico e detalhado, projetando uma interface de fácil compreensão, facilitando o
entendimento do usuário. Para o desenvolvimento deste trabalho, utilizou-se como
método de estudo, pesquisa bibliográfica e a criação de um pequeno projeto de
interface, envolvendo desde a construção de casos de uso até chegar às interfaces
propriamente ditas, apresentando as melhores formas de interação que uma tela de
sistema possa ter, possibilitando a junção de informações concisas sobre o assunto
abordado e um maior conhecimento sobre as falhas existentes no desenvolvimento de
interface para sistemas computacionais. No decorrer deste estudo foram
apresentados vários conceitos e regras de como iniciar e desenvolver um projeto
como um todo, mostrando soluções em possíveis falhas na criação de interfaces,
apresentando de forma clara e objetiva, corretas técnicas e normas para a criação de
telas para programas de computador, mostrando a importância de ser bem projetada
para alcançar a satisfação do usuário final. Atualmente, não existe nenhum projeto de
interface 100% perfeito, que obedeça todas as regras e siga todas as normas
específicas para o seu desenvolvimento; mas é importante para uma equipe de
projetistas ou analistas procurar manter o mais perfeito possível à criação das
mesmas, observando sempre a qualidade de interação e visar a forma de como o
usuário deverá interagir com o sistema, garantindo assim a sua satisfação no uso do
programa computacional.
Palavras Chave: interface, usuário, projeto, interação
ABSTRACT
The evolution of the computer science has been facilitating the life in the current
days, due to systems developed for helping several tasks in companies, schools,
residences, hospitals etc. However, a lot of these programs instead of auxiliar in work
routines, make a lot on contrary. In other words, the software that had been
developed for certain specific objectives becomes a confused program, complicated
of understanding, causing panic in most of the people that use it. This work presents
the problems found in the development of computer programs interfaces and
demonstrates the importance of growing up a specific and detailed project, projecting
an interface of easy understanding, facilitating the user's understanding. For the
development of this work it was used as study method bibliographical research and
the creation of a small interface project, involving since the construction of “use
cases” until the interfaces. It is presented the best interaction forms that a screen
could be, making possible the junction of concise information on the approached
subject and a larger knowledge on the existent imperfections in the interface
development for computational systems. In elapsing of this study were presented
several concepts and rules to begin and develop a project as a whole, showing
solutions for possible imperfections in creation of interfaces. It still presents in a
objective and clear way, correct techniques and norms for the creation of screens for
computer programs, showing the importance of a good project to reach final user's
satisfaction. Nowadays, any project of interface that obeys all rules and specific
norms for your development, 100% perfect, doesn't exist, but it is important for a
team of planners or analysts try to maintain the most perfect possible the creation of
interfaces, always observing the quality interaction with the user and seek the better
form how it should interact with the system, guaranteeing your satisfaction in the use
of the computational program.
LISTA DE FIGURAS
1- Resultado obtido pela maquina de perfurar cartão...................................................................................7
2- Interface de interação mainframe..............................................................................................................8
3- Exemplo de interface atual........................................................................................................................8
4- Exemplo de interface em ambiente DOS..................................................................................................9
5- Exemplo da Janela Primária....................................................................................................................10
6- Exemplo de Janela Secundaria...............................................................................................................11
7- Interface desenvolvida para POCKET ....................................................................................................12
8- Interface desenvolvida para QUIOSQUES .............................................................................................12
9- Exemplo da interface usando Realidade Virtual......................................................................................13
10- Exemplo do uso prático da interface com Realidade Virtual.................................................................14
11- Utilização de metáforas representando manipulação de dados...........................................................16
12- Utilização de metáforas representando função.....................................................................................16
13- Exemplo da utilização de metáforas representando função.................................................................17
14- Calculadora do Windows, outro exemplo do uso de metáforas...........................................................18
15- Exemplo de utilização de formulário (Mestre / Detalhe).......................................................................19
16- Resultado da ação da interface.............................................................................................................22
17- Resultado do andamento de operação da interface.............................................................................23
18- Princípios da interface com o usuário... ................................................................................................25
19- Caminhos da prototipação ..................................................................................................................30
20- Processo de interação homem-computador .......................................................................................31
21- Exemplo de fácil interação com o usuário (Microsoft)..........................................................................32
22- Atributos de Usabilidade .......................................................................................................................33
23- Modelo de interação da Engenharia Cognitiva ...................................................................................37
24- Etapas de ação do usuário durante a interação com o sistema .........................................................37
25- Mensagem que o projetista quer passar para ao usuário .................................................................. 39
26- Mensagem que o projetista quer passar para o usuário ...................................................................39
27- Processo de Interface na Eng. Semiótica ............................................................................................40
28- Paralelo entre desenvolvimento do software com o projeto de interface.............................................43
29- Representação diagramática da meta...................................................................................................45
30- Representação do modelo de interação................................................................................................47
31- Exemplo da utilização de um storyboard ..............................................................................................48
32 – Diagrama de Caso de Uso – Modulo Comercial.................................................................................56
33-Cadastro.de.Cliente.................................................................................................................................62
34- Cadastro de Fornecedor........................................................................................................................62
35- Cadastro de Produto..............................................................................................................................63
36 - Pedido de Venda..................................................................................................................................63
37 - Consulta Cliente / Vendas....................................................................................................................64
38 - Barra de Ferramentas utilizando consistência.....................................................................................64
39 - Botão utilizando consistência................................................................................................................64
40 – Padronização entre as telas.................................................................................................................65
41 - Utilização de signos...............................................................................................................................66
42 - Exemplo de componentes Chek List e Radio Button...........................................................................66
43 - Resultado de ações realizadas pelo usuário........................................................................................67
44 - Orientação ao usuário por meio de mensagens..................................................................................67
45 - Orientação ao usuário por meio do estado do aplicativo.....................................................................68
46 - Orientação ao usuário por meio de dicas sobre botões.......................................................................68
47 - Interface utilizando Mestre-Detalhe......................................................................................................69
48 - Utilização de Metáfora c/ manipulação de função................................................................................70
49 - Recurso de Ajuda, visível ao usuário....................................................................................................71
50 – Recurso de Recuperação, visível ao usuário......................................................................................71
51 - Comparação entre layouts de uma mesma interface..........................................................................72
52 - Utilização de componentes Microsoft...................................................................................................73
53 - Utilização de componentes semelhantes ao sistema operacional......................................................73
54 - Utilização de componentes Microsoft...................................................................................................74
LISTA DE ABREVIATURAS E SÍMBOLOS
IHC - Interface Homem Computador
TI - Tecnologia da Informação DOS - Disk Operating System
RV - Realidade Virtual IU - Interface de Usuário UML - Language Unified Modelling
SUMÁRIO
1 INTRODUÇÃO ......................................................................................................................................1 1.1 CENÁRIO ATUAL................................................................................................................................1 1.2 IDENTIFICAÇÃO DO PROBLEMA ...........................................................................................................2 1.3 OBJETIVOS DO TRABALHO .................................................................................................................3 1.4 JUSTIFICATIVA PARA A PESQUISA .......................................................................................................4 1.5 ORGANIZAÇÃO DO TRABALHO ...........................................................................................................5
2 CARACTERISTICAS DE UM BOM PROJETO DE INTERFACE........................................................6 2.1 INTERFACE .......................................................................................................................................6 2.2 CARACTERÍSTICAS DE UMA BOA INTERFACE......................................................................................14 2.3 VALIDAÇÃO DE INTERFACE ..............................................................................................................24
3 CONCEITOS DE PROJETO DE INTERFACE...................................................................................25 3.1 DIFERENTES MODELOS DE PROJETO....................................................................................26
3.1.1 MODELO DE PROJETO ......................................................................................................26 3.1.2 MODELO DE USUARIO.......................................................................................................26 3.1.3 Modelo de usuário ou Percepção do Sistema......................................................................27 3.1.4 Imagem do Sistema..............................................................................................................27
3.2 DESENVOLVIMENTO DE INTERFACE PARA USUARIOS........................................................29 3.2.1 Benefícios do uso de prototipação em projetos de interfaces .............................................30
3.3 MODELOS DE APOIO A TESTES DE USABILIDADE.................................................................34 3.4 ENGENHARIA COGNITIVA E ENGENHARIA SEMIOTICA ........................................................36
3.4.1 ENGENHARIA COGNITIVA .................................................................................................36 3.4.2 ENGENHARIA SEMIÓTICA .................................................................................................38
3.5 ENGENHARIA COGNITIVA OU ENGENHARIA SEMIOTICA .....................................................40 3.6 TECNICAS PARA CONSTRUÇÃO DE INTERFACES ................................................................41
3.6.1 FATORES E ANALISES QUE FAZEM PARTE DO PROJETO DE INTERFACE ...............42 3.6.2 ANALISE E MODELAGEM DE TAREFAS...........................................................................44 3.6.3 ETAPAS DO PROCESSO DA CONSTRUCAO DE INTERFACES.....................................44
4 CRIAÇÃO DO PROJETO DE INTERFACE .......................................................................................49 4.1 INÍCIO DA CONSTRUÇÃO DO PROJETO DE INTERFACE.......................................................50
4.1.1 FUNCIONALIDADES PARA OS CASOS DE USOS ...........................................................51 4.1.2 DIAGRAMA DE CASOS DE USO ........................................................................................56 4.1.3 ESPECIFICAÇÃO DOS CASOS DE USOS.........................................................................57
5 CRIAÇÃO DAS INTERFACES COM BASE NOS CASOS DE USOS ..............................................61 5.1 INTERFACES PROJETADAS......................................................................................................61
5.1.1 CONSISTÊNCIA...................................................................................................................61 5.1.2 UTILIZAÇÃO DE SIGNOS ...................................................................................................65 5.1.3 ORIENTAÇÃO AO USUÁRIO ..............................................................................................67 5.1.4 MESTRE DETALHE (MASTER DETAILS) ........................................................................68 5.1.5 METÁFORAS .......................................................................................................................69 5.1.6 RECURSO DE AJUDA VISÍVEL AO USUÁRIO ..................................................................71 5.1.7 FACILIDADE DE RECUPERAÇÃO VISÍVEL AO USUÁRIO ...............................................71 5.1.8 LAYOUT BEM DEFINIDO ....................................................................................................72
6 CONCLUSÕES ...................................................................................................................................75
1
1 INTRODUÇÃO
1.1 Cenário atual
Os sistemas computacionais a cada dia estão mais presentes em nossas
vidas, ganhando rápido espaço na sociedade, podendo ser encontrados em vários
lugares, como escolas, empresas, hospitais, residências etc, deixando de ser
utilizados não apenas por especialistas em computação, abrangendo uma grande
quantidade de usuários comuns, de vários conhecimentos, idades, culturas, etc.
É muito comum usuários de programas de computador procurarem por
aplicações que possuam interfaces amigáveis, que sejam fáceis de aprender e usar,
fazendo com que eles tomem gosto pelo seu uso, através da interação direta com o
software, realizada pela interface.
Para que aconteça uma perfeita comunicação entre homem e computador,
é necessário que haja um meio que faça com que o próprio sistema transmita ao
usuário a informação bem clara e objetiva daquilo que deve ser realizado naquele
momento, facilitando o seu entendimento durante determinada operação com o
mesmo.
Para isso, diversos estudos estão sendo propostos direcionados à visão do
usuário final, sobre a utilização do sistema computacional, focalizando sobre o que
ele pensa e o que precisa ao utilizar o software, através da utilização da interface do
sistema, constituindo assim a IHC.
A IHC – Interface Homem Computador, trata-se das diversas formas e
diretrizes que possam ocorrer no diálogo entre homem e software, constituindo-se
no estudo da melhor interface a ser implantada, através do desenvolvimento do
projeto da mesma com o usuário.
Toda a comunicação entre homem-software é realizada através da interface
que cada sistema possui especificadamente. Sendo esta o principal canal de
comunicação existente no programa de computador, influenciando desta forma o
resultado final do produto a ser entregue ao cliente.
2
[...] as interfaces de sistemas computacionais assumem um papel importante para o sucesso do software. Para o usuário, que não conhece o conteúdo da caixa preta do sistema, a interface é a sua única visão do produto em questão. Diante desses fatos, existe uma grande preocupação com a comunicação adequada desses sistemas computacionais com os seus usuários. (ZANCHETA, 2004, p.9)
As interfaces ser humano-computador têm como papel principal promover, ou facilitar, a relação do usuário com um objeto ou sujeito. Elas podem ser compreendidas como um espaço composto por diversas representações com capacidade comunicativa. As interfaces representam as condições para possíveis ações que são constituídas através do apoio ou impedimento de certas operações direcionadas ao artefato e aos sujeitos ou objetos, através do artefato. (BARSOTTI, 2002, p.32)
Por ser um recurso de suma importância, tanto para o usuário quanto para a
criação do programa, o projeto de interface tem sido implantado pela maioria das
empresas de desenvolvimento de sistemas computacionais. Porém, muitos
profissionais ainda não percebem a grande importância que o projeto possa ter num
desenvolvimento de software, não se adaptando para a utilização desse novo
paradigma de desenvolvimento, que visa primeiramente à integridade da informação
transmitida pelo programa ao entendimento do usuário final.
É sobre este contexto que está sendo realizado este trabalho. Os problemas
relevantes sobre o mau desenvolvimento do projeto de interface, bem como suas
vantagens quando desenvolvido da maneira correta e confiável são abordados
propiciando ao usuário a total confiança durante a manipulação das informações que
ali estão sendo lidadas e interpretadas por ele.
1.2 Identificação do problema
Com a evolução da tecnologia da informação, com a grande massa de
produtos de software existentes no mercado mundial, cresce ainda mais o contato
do homem com o computador. Praticamente o software está presente em todos os
lugares, conquistando cada vez mais uma diversidade muito grande de usuários,
independente da idade ou cultura do próprio indivíduo.
Com esse crescimento excessivo de pessoas que usam sistemas
computacionais, é preocupante a maneira de como elas utilizam o aplicativo, com
sua forma de operação, entendimento e facilidade de operação da ferramenta.
3
A variedade de perfis de usuários e operações a serem realizadas diante
dos sistemas informatizados torna-se um grande desafio para o projeto de software.
Diversas empresas de desenvolvimento de software não levam em conta a
importância do projeto de interface, caracterizando-se este passo por apenas um
módulo à parte que tem que ser desenvolvido ao longo do sistema, não tendo a
devida preocupação com o processo de interação com o usuário.
Estudos mais recentes sobre o projeto de interface, mostram que uma
interface bem projetada faz com que o software ganhe mais familiaridade entre seus
usuários, tornando-se o cartão de visita para a venda do produto. Até hoje já foram
desenvolvidos milhares de sistemas com diversas formas de interfaces, cada uma com
seu objetivo e entendimento. E cada vez mais se fazem estudos e pesquisas para
conseguir a melhor satisfação do usuário. E mesmo assim, existem softwares que
foram ou são desenvolvidos sem a perspectiva da diversidade dos usuários que
possam ter, não se preocupando com a forma de como será utilizada a ferramenta,
desenvolvendo assim softwares confusos e difíceis de serem entendidos, fazendo com
que o produto se torne ineficiente e exaustivo para o usuário final.
1.3 Objetivos do trabalho
Este trabalho tem por objetivo apresentar diversas formas e técnicas para
o bom desenvolvimento do projeto de interface com o usuário, oferecendo aos
analistas e projetistas de interface uma melhor eficiência no processo de criação de
telas para programas, através de regras e normas estabelecidas.
Com este estudo, pretende-se apresentar a diversos profissionais da área
de Tecnologia da Informação (TI), principalmente àqueles voltados ao
desenvolvimento de softwares, a importância de se tratar a construção de interface
como um projeto definido e concreto, seguindo normas e estudos detalhados para a
construção do mesmo.
O foco deste trabalho é detalhar os processos para a criação do projeto
como um todo, tendo como objetivo o entendimento dos processos e a importância
dos resultados cabíveis à aplicação do mesmo.
4
Pretende-se descrever e exemplificar o histórico do desenvolvimento de
interfaces, mostrando suas passagens até chegar às atuais que conhecemos hoje.
As corretas formas de planejamento do projeto de interface são mostradas,
apresentando desde recursos tecnológicos até diversos meios de análise
envolvendo a percepção humana, englobando meios utilizados pela engenharia de
software, cognitiva e semiótica.
Esta pesquisa não possui como objetivos apresentar recursos de
programação e desenvolvimento de softwares em geral, e também não pretende
descrever ferramentas de prototipação para a criação específica de cada interface, e
nem a realização de trabalho de campo com usuários finais.
Por fim, o trabalho desenvolvido formará uma fonte detalhada de dados sobre
os processos do desenvolvimento da interface com o usuário, a fim de facilitar o
trabalho de empresas de desenvolvimento de sistemas, autônomos da área em geral
e todos os profissionais envolvidos em TI.
1.4 Justificativa para a pesquisa
Muitos sistemas que são desenvolvidos apresentam uma interface muito difícil
de se trabalhar, levando o usuário a possíveis erros, podendo até mesmo cometer
falhas gravíssimas que venham a corromper os dados ou até mesmo causar danos
muito graves no sistema.
Os projetistas de interfaces têm que levar em conta a capacidade física e
mental dos seus usuários, principalmente quando lidam com muitas informações.
Desta forma, é de suma importância a preocupação dos projetistas e analistas
para o projeto de interface, levando em conta as normas técnicas necessárias e
tentando sempre chegar à boa qualidade na implantação dos recursos de interface.
Este trabalho tem como objetivo de apresentar soluções para diminuir as
falhas na criação de interfaces, apresentando técnicas e normas estabelecidas de
desenvolvimento de telas para sistemas computadorizados.
Essa pesquisa detalha diversas diretrizes de desenvolvimento de interface,
apresentando ao leitor informações necessárias para a criação da mesma,
procurando mostrar a importância da interface bem projetada para o usuário final.
5
1.5 Organização do Trabalho
O capitulo dois apresenta a interface em geral, ressaltando sua importância
em relação ao sucesso do software como também a satisfação daquele que vai
utilizar aquele programa de computador, mostrando um pequeno histórico das
interfaces até os tempos atuais. São abordadas também regras de aplicação no
desenvolvimento de interfaces, como diretrizes, normas e exemplos para se alcançar
a qualidade na criação da mesma.
Todas essas informações iniciais se fazem necessárias para apresentar ao
projetista de interface a importância da aplicação do projeto, reconhecendo que nem
todos que desenvolvem sistemas para computadores preocupam-se com as formas
de entendimento do usuário em relação ao software a ser implantado.
No capitulo três, são apresentados os conceitos para se iniciar um projeto de
interface com o usuário, mostrando exemplos e associando-os aos princípios de
criação de interface, indo desde as regras de prototipação do projeto, até o momento
de avaliação com o usuário final, trantando-se de regras de usabilidade, percepção
humana, interação com o usuário, comunicação entre usuário/sistema, etc.
No capítulo quatro e cinco, serão apresentados de forma prática e objetiva
todos os conceitos voltados para o bom desenvolvimento do projeto de interface,
mostrando por meio de especificações, casos de uso e também por meio de
exemplos (interfaces desenvolvidas), as corretas formas de se aplicar diretrizes para
a construção do projeto de interface.
Por fim no capítulo seis, as conclusões obtidas pela realização do trabalho,
apresentando as limitações do estudo praticado, e também as possíveis sugestões
que possam vir para a realização de estudos futuros, dando seqüência a este
trabalho de pesquisa.
6
2 CARACTERISTICAS DE UM BOM PROJETO DE INTERFACE
2.1 Interface
No dizer de Pressman (1995) o projeto de desenvolvimento de sistemas
envolve várias atividades para chegar ao produto final, envolvendo desde o projeto
de hardware até o projeto de interface.
Um dos aspectos fundamentais do desenvolvimento de sistemas para
computador é, desta forma o projeto de interface com o usuário. Ele é fundamental
para o sucesso de um sistema. A interface é um meio de interação entre o homem e
o computador. É através dela que o usuário consegue manipular todas as
informações necessárias durante seu trabalho. “A interface é, de muitas maneiras, a
embalagem do software de computador” (PRESSMAN, 1995, p.602).
Segundo>o>documento>eletrônico>(Cartão perfurado, 2005) nos primórdios
da era tecnológica, um dos marcos para a programação foi a máquina perfuradora
de cartão. O trabalho realizado com este tipo de sistema era bem tedioso, pois a
interface era totalmente rústica. Para alimentar o código no computador era preciso
perfurar cada cartão, sendo que cada um deles continha uma linha de programa e
os resultados eram impressos em listagens de formulário contínuo, para
posteriormente verificar algum erro de programa.
Este tipo de interface propiciava ao usuário várias frustrações: além de
perfurar cada cartão, era preciso passar horas e horas na frente da máquina para
coletar os resultados esperados, e caso outra pessoa necessitasse utilizar o
equipamento, teria que esperar até o processo do outro ser concluído. A Figura 1
mostra um modelo dos resultados obtidos pelas máquinas de perfurar cartão.
7
Figura 1 – Resultado obtido pela maquina de perfurar cartão (Cartão perfurado, 2005)
Através do estudo e o surgimento de outras tecnologias, as opções de
interação entre usuário e máquina crescem cada vez mais ao longo dos anos. Com
o aparecimento dos mainframes1, a interface de interação era baseada em teclas de
funções e canetas marcadoras de tela, onde todas as funções realizadas eram
distribuídas em uma única tela, ficando cada funcionalidade mapeada para um
programa, exigindo que o operador conhecesse e executasse vários comandos por
vez para concluir qualquer operação. Todos os processos eram visualizados em um
monitor monocromático, com única exibição de caracteres, linhas e pontos.
Sendo assim, o que dominou por muito tempo o mercado, foi a
centralização do processamento com a utilização de terminais de vídeo pelos
usuários finais, sem nenhuma utilização de interface gráfica. A Figura 2 mostra um
exemplo das interfaces utilizadas pelos mainframes.
_____________ 1 Mainframes = Computadores de grande porte com alta escala de processamento que podem
manipular memória de alta capacidade e dispositivos auxiliares de armazenamento.
8
Figura 2 – Interface de interação mainframe
(Trying to read what is in telnet window, 2005)
Conforme Pressman (1995) após a era mainframes, surgiram os sistemas
baseados em interface de comando e consulta. Tais sistemas não possuíam
interface gráfica, e a comunicação com o usuário final era apenas por formas de
comandos e respostas à consultas retornadas pelo sistema. Este tipo de interface
possibilitava a ocorrência de erros freqüentes e sua interação era de difícil
entendimento. A Figura 3 representa um exemplo de interface textual.
Figura 3 – Exemplo de interface textual
Após a era de interfaces à base de consultas e comandos, deu-se inicio às
interfaces já com menu de opções, telas, etc, caracterizadas por Pressman (1995)
como interfaces de menu simples. Esses programas eram desenvolvidos em
9
linguagens como CLIPPER, PASCAL, C, etc. Suas interfaces eram bem diretas, e
menos favoráveis a erros do que a interface no formato de linha de comando. Os
usuários operavam nestes sistemas somente por meio do teclado e nesta época
ainda não havia a necessidade de utilizar o mouse.
A utilização deste tipo de interface pode ser tedioso para o usuário final,
devido à forma de se obter a informação do sistema. Os programas apresentavam
um menu de opções que era composto, por exemplo, de códigos, sendo que para
executar cada função do programa, era preciso digitar números referentes a cada
menu, alcançando assim a opção desejada.
Este tipo de interface tem como vantagem o rápido acesso ao menu de
opções, já que o mesmo é realizado diretamente pelo teclado. A Figura 4 apresenta
um modelo típico das interfaces de menu simples ou interfaces em ambiente DOS.
Figura 4 – Exemplo de interface em ambiente DOS
Segundo Pressman (1995), este tipo de interface diminui a probabilidade do
operador cometer erros, em comparação com a interface baseada em linhas de
comando e consultas, mesmo assim, seu uso também é frustrante e confuso para o
entendimento do usuário. Por exemplo, na escolha de qualquer opção desse menu,
ele terá outras telas com mais opções de escolha, caracterizando-se um sub-menu
de opções, fazendo com que o usuário não consiga chegar diretamente a opção
desejada, forçando-o a trabalhar em sub-niveis até alcançar a opção escolhida,
tornando-se trabalhosa a rotina de trabalho.
10
Logo após os sistemas com interfaces baseadas em DOS, deu-se o início
das famosas janelas que conhecemos hoje, nada mais do que programas com base
na interface Windows (Microsoft ®). As interfaces atuais são desenvolvidas com o
mais alto padrão de tecnologia, mesmo assim, muitas ficam a desejar, devido ao
mau planejamento do projeto das mesmas.
O processo de interação com as interfaces gráficas, são hoje mais
comumente utilizadas em forma de janela, caracterizando-se pelo principal canal de
interação entre usuário e sistema, permitindo o trabalho simultâneo de varias tarefas,
facilitando o trabalho de quem utiliza programas com este tipo de layout gráfico. As
janelas são dividas em primárias e secundárias. A primária é a principal tela dos
aplicativos, sendo a primeira tela a ser carregada quando se abre o programa. A
Figura 5 representa um modelo de janela primaria.
Figura 5 – Exemplo da Janela Primária
Este tipo de janela, geralmente apresentará todos os recursos para acessar
diversos módulos do programa através de menu de opções ou atalhos adicionados à
própria tela, propiciando acessos mais rápidos e de fácil entendimento.
Outros tipos de janela são chamados de Secundária; elas são chamadas a
partir da tela principal (Janela Primária). A partir delas o usuário executará todas as
11
funções que necessita durante seu trabalho. A Figura 6 mostra um exemplo de
janela secundária.
Figura 6 – Exemplo de Janela Secundaria
Existem também interfaces bem interativas, um pouco diferentes daquelas
baseadas em sistemas Windows, que são interfaces em que o usuário interage com
o sistema diretamente na tela do computador; tecnologia esta chamada TOUCH
SCREEN. Esta é caracterizada pela sua fácil aprendizagem e por ser muito amigável
ao nível de operação, pois com esse tipo de interface o processo ganha vida, já que
as telas mudam a cada toque.
Apesar desta tecnologia ser cara, este recurso é muito utilizado em pockets
e quiosques de apresentação, tendo como característica a rápida interação com o
usuário, possibilitando ao mesmo realizar consultas diretas no sistema. As Figuras 7
e 8 ilustram modelos de interfaces utilizando esta tecnologia.
12
Figura 7 – Interface desenvolvida para POCKET
(Wireless touch screen control, 2005)
Figura 8 – Interface desenvolvida para QUIOSQUES
(Introduction to Electronic Classrooms, 2006)
13
Fazendo um comparativo entre as interfaces atuais e as antigas que foram
citadas, o avanço foi muito grande, buscando sempre como prioridade o conforto do
usuário, pois com uma boa interface desenvolvida, capaz de responder as
necessidades de quem está usando o programa, tem-se um bom sistema
funcionando e a satisfação garantida durante seu uso.
Há varias Universidades que estão estudando possíveis formas de interação
entre o usuário e sistema bem realístico do que temos hoje no mercado de
programas para computador. Experiências estão sendo realizadas principalmente no
ramo da Medicina e também em outras áreas, como Engenharia, Arquitetura,
Educação, etc. Este estudo está sendo realizado no tipo de interface que é capaz de
fazer com que o usuário interaja praticamente cem por cento com o sistema, fazendo
parte daquele meio de interação, constituindo-se o nascimento da realidade virtual
(RV). Esta é caracterizada pela sua fácil interação e por ser muito amigável ao nível
de operação, pois se tem a impressão de que o usuário está dentro do sistema,
simulando um ambiente realístico, permitindo que eles se interajam com o sistema,
fazendo parte do mundo virtual. As Figuras 9 e 10 ilustram um exemplo de RV.
Figura 9 – Exemplo da interface usando Realidade Virtual
(Departamento de Estatística, 2006)
14
Figura 10 – Exemplo do uso prático da interface com Realidade Virtual
(Realidade virtual no ensino médico, 1998)
Cada vez mais, cientistas de software estão se aprofundando em estudos e
testes voltados a IHC (Interação Homem Maquina), procurando desenvolver o que
mais há de tecnologia para a satisfação do usuário, propiciando lhe facilidade e
rapidez, em se tratando de programas para computador ou qualquer outro dispositivo,
como celulares, aparelhos eletrônicos, automóveis, etc.
O bom desenvolvimento de interfaces é muito importante para o projeto como
um todo. As interfaces estão em constantes modificações, buscando sempre melhorias
voltadas diretamente para o usuário, conseguindo cada vez mais a sua satisfação,
procurando sempre ouvi-lo e resolver seus problemas, com produtos fáceis e
amigáveis.
Até hoje já foram desenvolvidos diversos sistemas, com várias formas
diferentes de interfaces, cada uma com seu objetivo e entendimento. E cada vez mais
se fazem pesquisas e testes para conseguir a melhor satisfação do usuário.
2.2 Características de uma boa interface
Ao longo dos anos, o computador tem deixado de ser um instrumento de
trabalho voltado apenas à especialistas de informática, tornado-se ferramenta de apoio
a diversos profissionais nas várias áreas existentes. Hoje temos uma grande variedade
de usuários e tarefas exercidas por eles, que impõem desafios para o desenvolvimento
de projeto de sistemas computacionais.
15
Os usuários de computadores sempre buscam por aplicações amigáveis, ou
seja, que sejam fáceis de aprender e usar, independente dos recursos oferecidos pelo
sistema. Um projeto de interface geralmente exige cinqüenta por cento do tempo e dos
recursos utilizados durante todo o projeto, representando uma importante fase na
criação de sistemas para computador.
Um bom projeto de interface é de fundamental importância para a boa
aceitação do software desenvolvido. É ele que faz a aproximação entre o homem e a
tecnologia utilizada, representando um canal de interação entre o usuário final e o
computador.
Um aspecto importante para uma interface é utilizar uma linguagem de forma
natural, para que o usuário e o software se comuniquem de forma mais simples,
facilitando a troca de informações entre homem e máquina. Uma boa interface deve
apresentar associações que possam facilitar a memorização de operações por parte
dos usuários. Isso será possível através da utilização de metáforas. Elas ajudam o
reconhecimento de uma função do sistema, associando-se aquele recurso com um
objeto comum e familiar ao conhecimento dos usuários. No dizer de Paula Filho (2001),
a interação com um produto de software se torna mais fácil quando estes conseguem
formular um modelo mental consistente.e. íntegro.
Através do modelo mental, os usuários conseguem compreender o
funcionamento do sistema, apresentando facilidades durante a utilização do programa.
A não utilização de metáforas pode causar confusão e aumentar os índices de erros,
dificultando o aprendizado, por surgirem dificuldades de interação do próprio sistema.
As Figuras 11 e 12 representam um exemplo típico do uso de metáforas.
16
Figura 11 – Exemplo da utilização de metáforas representando manipulação de dados
�
�
Figura 12 – Exemplo de menu com utilização de metáforas representando função
17
A Figura 11 representa um modelo bem prático do uso de metáfora, que é o
modelo com manipulação de dados, que se refere a um objeto do meio realístico 2 para
o programa de computador. Ela apresenta a interface do aplicativo Word, desenvolvido
pela (Microsoft ®). Sua característica assemelha-se a uma máquina de escrever, tendo
como referência no centro de sua tela o formato de uma folha A4 (meio realístico), com
suas réguas de medidas, etc. A Figura 12 representa também outro modelo de
metáfora, que é o modelo com representação de funções, que utiliza várias
representações, como botões, menus de acesso e outros para informar ao usuário
sobre tal operação. Quando este se depara, por exemplo, com um menu contendo o
seguinte desenho “(...)”, indica a ele que ao acioná-lo surgirá uma outra tela para
concluir sua operação, no caso da figura referida, seria a de salvar o documento. A
Figura 13 representa por meio de botão de opção, o mesmo modelo da utilização de
metáfora com uso de funções, indicando ao usuário a mesma característica do menu
utilizado na Figura 12, que ao acionar este botão surgirá uma outra janela para
completar a operação desejada.
�
�
Figura 13 – Exemplo da utilização de metáforas representando função
Como no exemplo da Figura 12, o usuário seleciona a opção Salvar Como... e
em seguida surge a tela para que ele escolha o local de destino para armazenar o
documento. Quando uma interface é rica em utilização de metáforas, o usuário poderá
fazer associações práticas pelas tarefas que realiza no seu dia a dia, facilitando sua
interação com o programa, sendo mais fácil e rápido o aprendizado com a ferramenta
computacional.
Outro exemplo do uso de metáfora é o da calculadora que vem com o pacote
Windows (Microsoft ®). Ela apresenta as mesmas características de uma calculadora
comum, facilitando o uso até mesmo de pessoas com conhecimento básico em
_____________ 2 Meio Realístico = Ambiente real, o que existe na vida real.
18
microinformática. A Figura 14 representa a calculadora da Microsoft, caracterizando-se
também a utilização de metáforas.
Figura 14 – Calculadora do Windows, outro exemplo do uso de metáforas
Além do uso de metáforas para garantir a padronização e qualidade para
programas de computador, é necessário também um bom projeto de layout,
procurando obedecer a padrões pré-estabelecidos e que possam fazer com que o
usuário entenda perfeitamente a comunicação que aquela tela representa.
Para a interface de uma aplicação, o layout representa também um importante
papel na qualidade do software. Objetos visuais provêem valiosas impressões e
fornecem sugestões importantes ao comportamento interativo de recursos do
programa, deixando o usuário sempre informado nas operações que devem ser
executada. Num bom projeto de interface, o layout deve oferecer um ambiente
coerente para o entendimento da informação apresentada. O usuário ficará mais à
vontade diante do software se formular um modelo mental consistente e íntegro. A
Figura 15 representa um típico modelo de layout utilizando Master Detail (Mestre /
Detalhe).
19
�
�����������������Figura 15 – Exemplo de utilização de formulário (Mestre / Detalhe)
Este tipo de interface apresenta uma facilidade na leitura da informação. Neste
exemplo é apresentado um curso de graduação qualquer, contendo ao mesmo tempo
todas as turmas referentes àquele curso específico, oferecendo desta forma um melhor
resultado em consultas e manutenções de novas turmas para determinado curso,
constituindo-se de uma interação entre tabelas distintas, apresentando um só um
conjunto de informação unificado em apenas uma tela.
Para um programa de computador ter uma boa interface, é necessário que o
seu projeto de desenvolvimento envolva fatores de conhecimentos humanos e da
tecnologia de interfaces a ser utilizada. A percepção humana, o perfil do usuário, seu
jeito de pensar, etc, são conhecimentos importantes para o projetista de interface,
juntamente com outros conhecimentos como o estilo de interface associada àquele
perfil de usuário, tecnologia de hardware e software disponível para a aplicação. Todos
esses itens associados terão um salto muito grande para o resultado final do projeto.
Quando essas diretrizes são utilizadas simultaneamente, o resultado
alcançado será um produto de software bem acabado e com uma boa qualidade de
entendimento, ambiente amigável e de fácil operação, e conseqüentemente a
satisfação do usuário será das melhores possíveis.
20
O ideal é fazer com que a interface utilize termos familiarizados, ou seja, o
principio é fazer com que ela se adapte ao usuário final, e não fazer o inverso, que ele
se adapte ao modo da interface.
Uma interface bem projetada oferece fácil aprendizagem e diminuição de
erros, até mesmos usuários sem nenhuma experiência em informática podem aprender
a utilizar o programa que tem uma boa interface após algumas horas de treinamento.
Isso é possível através da qualidade do próprio layout desenvolvido.
De acordo com Sommerville (2003), é necessário seguir alguns critérios
específicos para alcançar o resultado esperado durante o projeto de interface com o
usuário. Consistência, objetividade, orientação ao usuário e facilidade de recuperação
são uns dos meios adequados para este fim.
A consistência de interface com o usuário indica que os recursos utilizados
como menus de opções e outros recursos a mais do próprio sistema, devem seguir o
mesmo formato, constituindo um padrão de interface para o software. E com isso
diminuir o tempo de aprendizagem, possibilitando que aquele recurso aprendido possa
ser utilizado em outras partes do aplicativo.
A consistência ajuda os usuários a reaproveitar o conhecimento já adquirido, por meio de analogias. Com isso, eles aprenderão novas funções e novos mecanismos com maior rapidez.
(PAULA FILHO, 2001).
Segundo Paula Filho (2001), para fazer utilizar consistência em um
desenvolvimento de interface, dependerá de alguns atributos para colocar em prática
esta técnica:
• Nomenclatura adequada, consistente no jargão da área de aplicação;
• Aspectos visuais dos elementos das interfaces (cor, tamanho, leiaute);
• Comportamento das funções;
(PAULA FILHO, 2001).
Exemplos de utilização do uso da consistência:
• Caracteres especiais de textos devem ter a mesma função;
21
• Comandos Globais � (Ajuda, Cancelar, etc) devem ser invocáveis de qualquer
estado do aplicativo;
•Comandos genéricos � (Recortar, Copiar, Colar) devem ter a mesma função em
qualquer estado do aplicativo;
(PAULA FILHO, 2001).
Estes são alguns dos vários critérios exigidos no desenvolvimento do projeto
de interface. Num sistema que não leva em conta a questão de padronização de
recursos, sua interação pode ser difícil e complexa, agravando muito a dificuldade de
uso. Os projetistas de interface devem empenhar-se em desenvolver um layout que
corresponda e simplifique as necessidades do usuário final.
Outro meio para se alcançar qualidade no projeto de interface é a objetividade.
Ela caracteriza-se pela forma de representação dos dados manipulados pelo usuário
através da mesma. Esta será cada vez mais objetiva quanto mais próxima for da
realidade que o usuário vive. Se ela for simples de se usar, e amigável, ele estará bem
disposto a fazer bom uso dos processos que lhe estão destinados.
Orientação ao usuário constitui em respostas que o programa lhe apresenta
de acordo com determinadas ações executadas através de mensagens, barra de
progresso, etc. A orientação inclui três aspectos distintos:
Resultado de ações – O resultado de cada operação executada pelo usuário
final, deve ser mostrado a ele, deixando-o informado sobre tal operação.
A Figura 16 representa uma ação de excluir um registro do banco de dados, e a
interface oferece orientação sobre o resultado naquele momento, deixando-o
informado sobre o evento correspondente.
_____________ 3 Comandos Globais: comandos e funções disponíveis em qualquer parte do software. 4 Comandos Genéricos: comandos e funções disponíveis em lugares estratégicos do software.
22
Figura 16 – Resultado da ação da interface
Andamento de operações – Qualquer tipo de operação que leve alguns
segundos de processamento deve ser indicado ao usuário. Caso isso não aconteça,
tem-se a impressão de que o sistema não está mais respondendo, tendo a sensação
que o programa travou.
Quando se usa esse tipo de recurso, faz parecer que a operação está sendo
executada mais rápida, devido ao andamento mostrado pela interface. A Figura 17
representa um modelo de interface que contém uma barra de progressão, mostrando
ao usuário o andamento da operação solicitada.
23
Figura 17 – Resultado do andamento de operação da interface
Estado do aplicativo – O software deve oferecer recursos que possibilite
acompanhar o estado do aplicativo, à medida que forem executadas funcionalidades
no programa.
Facilidade de recuperação faz com que a interface ofereça recursos de
desfazer sempre que possível para uma ação finalizada ou que esteja em andamento,
é muito importante deixar o usuário informado, para evitar o mínimo de surpresas.
Segundo Pressman (1995), o recurso de recuperar informações (UNDO ou
REVERSE) deve estar disponível em qualquer sistema interativo. Quanto mais os
usuários tiverem facilidade em reverterem suas ações, mais confiáveis ficarão e terão
menos receio de causar estragos, sentindo-se mais à vontade na utilização da
aplicação.
Ter uma interface transparente, permite uma melhor concentração na tarefa
que deve ser realizada, evitando erros banais de operação, facilitando o manuseio dos
dados e fácil entendimento dos parâmetros estipulados pelo programa.
80%
24
2.3 Validação de interface
Durante um projeto de interface, todo o processo será sempre voltado para a
satisfação do usuário. No inicio de um projeto de software, os projetistas devem refletir
sobre uma simples pergunta a si mesmos: Estamos a construir o produto desejado ?
Com essa preocupação em satisfazer sempre a comodidade do usuário e
manter a integridade do software, os projetistas de interface passam por um processo
de validação de interface. Este processo visa a garantia dos efeitos da própria interface
sobre os usuários em relação ao sistema, visando garantir que a interface se comporte
conforme desejado e que responda às expectativas esperadas.
A validação deve ser aplicada em cada estágio do processo de software. Seu
objetivo é de considerar as características do usuário e as tarefas de interação que a
interface transmite a ele, respeitando a utilidade (adequação à tarefa) e a usabilidade
(facilidade de uso), para atender os objetivos finais do projeto de software.
Um meio de utilizar o recurso de validação é durante as fases de testes do
software. São utilizados grupos de pessoas com experiências distintas, fazendo testes
em diversos módulos do programa, para posteriormente serem analisados os
resultados obtidos através de formulários de perguntas entregues a cada membro do
grupo, fitas com gravações apresentando cada operação executada, etc. Outros meios
de validação também são utilizados para a garantir integridade e confiança de uma
interface, como a aplicação de questionários ao usuário final, observação de tempo de
execução gasto em cada tarefa, etc.
A interface é um mecanismo que estabelece um diálogo entre o programa e
o ser humano. Os fatores humanos devem ser levados em conta durante o projeto
de interface, resultando em um diálogo harmonioso e uma boa interação entre
homem e programa. Um projeto de interface deve seguir um padrão especifico,
sendo que toda informação visual deve ser organizada seguindo um padrão definido,
oferecendo ao usuário final um sistema de qualidade, com um design confiável e
ergonômico, fazendo com que até se esqueça de que está trabalhando em um
sistema de computador. Para que o projeto de interface consiga alcançar esses
objetivos, é necessário primeiramente conhecer quem utilizará o programa, para
formar uma base na construção dos estudos de casos, chegando assim a um projeto
confiável e interativo.
25
3 CONCEITOS DE PROJETO DE INTERFACE
De acordo com Pressman (1995), o projeto de interface ser humano-
computador é um dos elementos de maior importância durante o projeto de software.
Para a sua criação, inicia-se com a construção de diferentes modelos de funções do
sistema a ser desenvolvido, por meio de prototipação em papel. Todas a tarefas
rotineiras que são executadas e que vão ser implementadas ao computador são
mescladas a um só projeto, constituindo assim um sistema interativo, com suas
possíveis telas (interfaces) que vão fazer a comunicação dos usuários com o programa
em si.
Diversas ferramentas podem ser usadas para construir protótipos de
interfaces e por fim implementar o modelo de projeto até chegar a um resultado final.
Após a elaboração dessas telas, o projetista verifica se as mesmas
correspondem a todas as diretivas dos padrões de interfaces a serem aplicadas, até
chegar a um nível de excelência em qualidade.
Segundo Sommerville (2003), para um bom desenvolvimento de projeto de
interface, o projetista tem que tomar como base à capacidade humana; é ela que
estabelece os princípios gerais aplicáveis a todos os projetos de interface com o
usuário. A Figura 18 mostra os princípios da interface com o usuário:
Princípios Descrição Familiaridade A interface deve utilizar termos e conceitos que tenham como com o usuário Base a experiência das pessoas que mais vão utilizar o sistema.
A interface deve ser consistente, no sentido que, sempre que Consistência Possível, operações semelhantes devem ser ativadas da mesma maneira. Os usuários nunca devem ser surpreendidos com o comportamento Mínimo de surpresa de um sistema.
Facilidade A interface deve incluir mecanismos para permitir aos usuários a de recuperação recuperação a partir de erros.
Orientação A interface deve fornecer feedback significativo, quando ocorrem erros, do usuário e oferecer recursos sensíveis ao contexto de ajuda ao usuário.
Diversidade A interface deve fornecer recursos de integração apropriados a de usuários diferentes tipos de usuários do sistema.
Figura 18-Princípios da interface com o usuário (SOMMERVILLE, 2003, p. 280)
26
Segundo Pressman (1995), quando se inicia um projeto de interface, deve-se
levar em conta a utilização da Engenharia Cognitiva, que trata em desenvolver um
sistema que permita ao usuário, durante o processo de interação, criar um modelo
mental consistente com o modelo criado pelo projetista. Para que isto seja possível,
Pressman argumenta que o projetista de interface precisa entender o processo através
do qual o usuário interage com a interface do sistema, pondo em prática pelo menos
quatro diferentes modelos de projeto que entram em cena durante o desenvolvimento:
3.1 DIFERENTES MODELOS DE PROJETO
3.1.1 MODELO DE PROJETO
Criado pelo engenheiro de software, este modelo incorpora todas as
representações procedimentais, arquiteturais e de dados do software.
3.1.2 MODELO DE USUARIO
Criado pelo engenheiro humano ou engenheiro de software, este modelo
descreve o perfil dos usuários finais do sistema.
Os usuários são classificados em três grupos distintos:
•Usuários principiantes: usuários sem conhecimento para utilizar os recursos do programa eficientemente, e pouco conhecimento das funções que devem ser executadas, do significado de entrada e saída das informações e das metas e objetivos do sistema.
•Usuários instruídos e intermitentes: usuários com razoável conhecimento das funções da aplicação, mas com pouca lembrança em saber como utilizar operacionalmente o sistema.
•Usuários instruídos e freqüentes: usuários com bom conhecimento tanto a nível operacional quanto a execução de funções no software, “o que freqüentemente leva a síndrome de usuários com poder, ou seja, indivíduos que procuram atalhos e modos abreviados de interação”. (PRESSMAN, 1995, p. 611)
27
3.1.3 Modelo de usuário ou Percepção do Sistema
Criado pelo usuário final, este modelo representa a imagem do sistema que o
usuário tem em sua mente.
3.1.4 Imagem do Sistema
Criado pelos desenvolvedores do sistema. Este modelo faz a interação do
exterior do sistema baseado em computador, com as informações de apoio a sintaxe e
semântica do sistema.
Estes modelos representam para o projetista um importante papel durante o
desenvolvimento do projeto de interfaces, que é conhecer o usuário final, e também as
tarefas executadas pelo mesmo.
Todos estes modelos fazem parte de um processo pelo qual se pode adquirir
conhecimento, aplicando essas teorias na compreensão das capacidades e limitações
à mente dos usuários.
À medida que o desenvolvimento do projeto de interface se desenvolve, é
importante abordar três questões de projeto: tempo de resposta do sistema, recursos
de ajuda ao usuário e mensagens enviadas pelo sistema.
O tempo de resposta do sistema é medido a partir do ponto em que o usuário
realiza qualquer tipo de ação de controle até a resposta do sistema com uma saída de
informação ou alguma ação desejada. Se o tempo de resposta for muito longo, com
certeza o usuário sofrerá frustração e estresse.
Já os recursos de ajuda são fundamentais para um sistema interativo. “Quase
todo usuário de sistemas baseados em computador precisa de ajuda, agora e sempre”.
(PRESSMAN, 1995, p.616).
De acordo com Pressman (1995), muitos sistemas modernos oferecem
recursos de ajuda on-line, que facilita ao usuário ter uma resposta a uma consulta ou a
um problema sem abandonar a interface.
Há dois tipos diferentes de ajuda encontrados em sistemas interativos:
facilidades integradas e add-on (RUB, 1988). Ambos os recursos têm a funcionalidade
de auxiliar o usuário na utilização de recursos do programa. O recurso de facilidade de
ajuda integrada é desenvolvido junto com os módulos do sistema desde o começo do
28
projeto, tornado-se assim sensível ao contexto, oferecendo desta forma ao usuário final
a seleção de opções de ajuda voltadas para aquela interface que ele está usando no
momento, reduzindo assim o tempo exigido quando obtém ajuda, aumentando a fácil
interação com o tipo de interface desenvolvida. O outro tipo de ajuda add-on, é
desenvolvido somente quando o programa estiver sido construído por completo,
caracterizando-se como um manual on-line, com consultas limitadas de ajuda. No dizer
de Pressman (1995), com este tipo de opção, o usuário talvez se depare por vários
tópicos até chegar à opção desejada, podendo trazer informações irrelevantes e não
satisfazendo a dúvida real do usuário.
Quando alguma operação por parte do usuário sai errada, a primeira
informação que ele recebe é por meio de mensagens enviadas pelo sistema interativo.
Em muitos casos, as mesmas representam informações inúteis ou enganosas e
servem para aumentar a sua frustração.
De acordo com Pressman (1995), para que as mensagens sejam eficientes e
que verdadeiramente possam dizer alguma coisa que ajude o usuário, elas devem ter
as seguintes características:
• As mensagens devem usar uma linguagem simples, para que o usuário
possa entender;
• As mensagens devem apresentar conselhos construtivos, e ser
acompanhada por um sinal sonoro ou visual;
• As mensagens não devem fazer julgamentos e nem colocar a culpa no
usuário;
Desta forma, se as mensagens de aviso seguirem essas características,
representarão uma melhor qualidade na informação transmitida e reduzirá a frustração
do usuário quando um problema acontecer.
A construção de interfaces para aplicativos é considerada um desafio num
projeto de software, porque ela necessita de uma junção de diversas áreas de
conhecimento, para ter como resultado uma interface de qualidade e que represente
as necessidades dos usuários.
Segundo Silva Filho (2005), desenvolver um projeto de interface não é
simplesmente desenvolver uma fatia do software do sistema. O projeto em si requer,
29
além disso, outras atividades, tais como:
• Projeto da comunicação entre usuários e computador: Identificação e representação de tarefas dos usuários e informações pertinentes;
• Projeto gráfico e textual da interface: Projeto de software IU (Interface de Usuário) através do qual outras decisões de projeto serão implementadas;
• Avaliação da interface; (SILVA FILHO, 2005, p.85).
“O desenvolvimento de uma interface de usuário é à parte do sistema que
mais requer do projeto tanto em termos de tempo de desenvolvimento quanto na
proporção de software dedicada a esta fatia do sistema (SILVA FILHO, 2005, p.85)”.
Sendo assim, todo projeto de interface antes de ser iniciado, deve
primeiramente ter um estudo detalhado de todos os processos que fazem parte dos
usuários, passando por processos de protótipos e reuniões com todos os envolvidos
pelo processo de construção da interface.
3.2 DESENVOLVIMENTO DE INTERFACE PARA USUARIOS
No desenvolvimento do projeto de interface, as indústrias de software utilizam
processos iterativos de construção e avaliação de protótipos baseadas em princípios e
diretrizes práticas e teóricas. Este processo orientará a elaboração do projeto de
interface, possibilitando ao projetista a solução para o conjunto de problemas que a
aplicação pretende resolver, transmitindo ao sistema o mesmo ambiente que o usuário
já esta acostumado a trabalhar.
Segundo Preece e outros (1994) quando se inicia o desenvolvimento de
layout para sistemas computacionais, um dos primeiros passos a serem dados é a
utilização da prototipação do layout da interface.
Prototipação é um recurso utilizado pelos projetistas (designers), que permite
fazer uma avaliação de suas idéias durante o processo de criação de interface. Ela
apresenta uma visão, como um todo, de como será o resultado final da interface
projetada, facilitando desta forma o entendimento entre projetistas e usuários finais. A
30
Figura 19 apresenta as formas de como é realizado a prototipação em um projeto de
interface:
Figura 19 – Caminhos da prototipação – modificada (PROTOTIPAÇÃO de Software, 2006)
Segundo o artigo (PROTOTIPAÇÃO DE SOFTWARE, 2006), para fazer uso
da prototipação de interfaces, é recomendável seguir um caminho especifico para obter
resultados satisfatórios durante o desenvolvimento do projeto. De acordo com a Figura
18, primeiramente é necessário fazer o plano de prototipação, ou seja, definir os
objetivos reais da interface que será desenvolvida. Em seguida, faz-se a definição das
funcionalidades do protótipo, detalhando seus objetivos, suas vantagens, etc. Após
esta etapa, é necessária a construção do mesmo, tornando-se o que foi discutido
anteriormente como protótipo prático para ser avaliado pelo usuário, e após a
validação, o mesmo deve ser analisado novamente, certificando-se de que o protótipo
desenvolvido está cumprindo ou não com as necessidades do usuário final.
3.2.1 Benefícios do uso de prototipação em projetos de interfaces
A prototipação é fundamental em um projeto de interface, pois ela oferece
facilidade por parte dos usuários para utilizar os recursos e facilitar o entendimento da
interface, oferecendo benefícios voltados ao próprio meio de trabalho do usuário,
sendo possível de ser aplicado antes mesmo de informatizar seu meio de trabalho
(PROTOTIPAÇÃO DE SOFTWARE, 2006).
Benefícios:
• Maior aproximação das necessidades requeridas dos usuários;
• Melhoria na qualidade do projeto desenvolvido;
• Melhoria na facilidade de utilização da interface;
Estabelecer objetivos do
protótipo
Definir a funcionalidade do protótipo
Desenvolver o protótipo
Avaliar o protótipo
31
Alem do uso de prototipação, há outros meios de se conseguir qualidade no
produto a ser desenvolvido. Segundo Moran (1981), uma das características básicas
do projeto de interface é a interação e usabilidade que o sistema possa oferecer. Essas
diretrizes são essenciais durante o projeto de construção de interfaces.
De acordo com Moran (1981), a interação é um processo que envolve ações
dos usuários sobre um sistema através da interface, obtendo interpretações sobre
respostas reveladas pela mesma (Figura 20).
Figura 20 – Processo de interação homem-computador
(SOUZA, C et al, 2006, p. 4)
Segundo Souza e outros (2006), através da interação com o sistema, o
usuário é capaz de entender sem grandes dificuldades as premissas, decisões e
intenções que foram projetadas durante o projeto de interface.
“Quanto maior o conhecimento do usuário da lógica do designer embutida na
aplicação, maiores suas chances de conseguir fazer um uso criativo, eficiente e
produtivo [...]” (SOUZA et al., 2006, p.5).
Para representar um exemplo do modelo de interação da interface, a Figura
21 ilustra um típico software para controle de volume multimídia, desenvolvido pela
MICROSFT�. Através da sua semelhança com um painel de volume analógico de um
aparelho de som. Esta interface comunica de forma efetiva com o exterior, passando
para o usuário a maneira que deve interagir para regular o volume do som no
computador.
32
Figura 21 – Exemplo de fácil interação com o usuário (Microsoft)
A qualidade da interação dos usuários com o sistema recebe o nome de
usabilidade. Ela é caracterizada como uma das principais metas dos projetistas de
interfaces, considerado o principal meio para avaliação do layout que está sendo
desenvolvido. É ela que faz a medição da qualidade de uma interface, envolvendo
vários fatores como a facilidade de uso e aprendizagem por parte dos usuários na
realização de suas tarefas, evidenciando o seu esforço em reconhecer a parte lógica
do software a ser utilizado e sua aplicabilidade na resolução de problemas, procurando
chegar ao alcance das metas desejadas em relação às operações executadas no
programa.
Segundo Oliveira e Garcia (2002), a usabilidade é medida pela utilização de
métodos de avaliação sobre a interface. Cada método tem um objetivo especifico,
sendo que todos são utilizados com um único objetivo: de obter um projeto de interface
com qualidade e confiável ao usuário.
A usabilidade apresenta alguns atributos específicos, que se deve levar em
conta durante sua utilização, caracterizando-se em técnicas simples e fundamentais
para o desenvolvimento da interface. A Figura 22 apresenta um modelo geral de
atributos utilizados na usabilidade.
33
Figura 22 – Atributos de Usabilidade (PROTOTIPAÇÃO DE SOFTWARE, 2006)
Dentro do projeto de interface, a avaliação não deve ser considerada como
fase única e nem como uma atividade a ser realizada apenas no final do
desenvolvimento da aplicação.
De acordo com Rocha (2000), quando se inicia a construção das interfaces,
logo de início ela já deve ser avaliada, permitindo assim aos projetistas vários
resultados, possibilitando desta maneira a realizações de mudanças e adaptações de
acordo com os resultados obtidos pela avaliação, podendo mostrar os problemas que
podem acontecer durante a interação dos usuários com o software.� A avaliação de
interface possui três objetivos:
• Avaliar a funcionalidade do sistema, verificando sua adequação aos requisitos das tarefas do usuário, que deve executa-las de modo fácil e eficiente;
• Avaliar o efeito da interface junto ao usuário; • Levantar resultados inesperados sobre o uso da interface, mostrando os
pontos críticos que causam confusão entre os usuários, caracterizando como problemas de usabilidade;
(ROCHA, 2000, p.82).
De acordo com Rocha (2000), os métodos de avaliação de usabilidade são
classificados em dois grupos, e devem ser aplicados de forma combinada. São eles:
testes de usabilidades e inspeção. Os testes de usabilidade envolvem a participação
de usuários, utilizando um modelo de interface que foi desenvolvida para a execução
34
de tarefas, mostrando assim os problemas obtidos durante a interação do usuário com
o software.
No inicio dos testes de usabilidade, é necessário também aplicar o teste de
inspeção, nesta fase inicial as idéias estão sendo exploradas e a usabilidade sendo
avaliada, tendo desta forma a participação e observação de especialistas neste tipo de
teste, vistoriando cada fase de interação por parte do usuário.
De acordo com Rocha (2000), no decorrer do processo, os testes devem ser
aplicados em estágios mais avançados do projeto da interface, podendo apresentar
possíveis alterações durante esta fase, caso seja necessário.
Conforme Oliveira e Garcia (2001), a aplicação de testes de usabilidade pode
ser realizada com o apoio de modelos definidos, que foram desenvolvidos unicamente
para apoiar os avaliadores na aplicação dos testes.
3.3 MODELOS DE APOIO A TESTES DE USABILIDADE
MODELO DE CAPTURA��apresenta a forma de como as ações dos usuários
são capturadas e registradas durante sua interação com o sistema de avaliação.
Segundo Oliveira e Garcia (2002), para a utilização deste modelo. São usadas
diferentes técnicas conforme a citação abaixo:
• Captura e registro do tempo de acionamento das teclas; • Captura e registro dos eventos do mouse e teclado; • Captura e registro das ações de mouse e teclado; • Captura e registro da freqüência de uso de comandos e objetos da
interação; • Captura e armazenamento das imagens de interação;
(OLIVEIRA, GARCIA, 2002).
MODELO DE REPRODUCAO: apresenta como são as interações que foram
capturadas, variando de acordo com o modelo de captura descrito logo acima.
MODELO DE ANALISE:� apresenta as funcionalidades que devem ser
implementadas, para ajudar o projetista ou avaliador dos testes durante a análise das
interações entre usuário e sistema.
35
O processo da utilização de usabilidade em projetos de interface depende de
vários aspectos para se alcançar um resultado satisfatório:
• Facilidade de aprendizado: tempo e esforço necessários para que os usuários
consigam um determinado nível de desempenho;
• Facilidade de uso: avalia o esforço físico e o conhecimento do usuário durante o
processo de interação, medindo a velocidade e o número de erros cometidos
durante a execução de uma determinada tarefa;
• Satisfação do usuário: avalia se o sistema satisfaz as exigências do mesmo;
• Flexibilidade: mede a capacidade do usuário de utilizar o sistema de uma forma
ágil e criativa, possibilitando a execução de tarefas de várias formas diferentes;
• Produtividade: verifica se o sistema faz com que o usuário seja mais produtivo
com o seu uso, do que seria se não o utilizasse.
Estas características são relevantes a construção do projeto de interface, e em
muitos casos, o próprio designer deve identificar entre estes fatores quais têm
prioridade sobre outros, uma vez que é difícil conseguir alcançar todos de forma
equivalente.
Estes fatores determinam a forma de interação entre usuários e sistemas,
definindo a facilidade de uso como sendo o aspecto de usabilidade prioritário,
desenvolvendo desta forma aplicativos em que os usuários não cometam erros, más
também não tem opções para os mesmos fazerem tomadas de ação ou decisão.
E importante que além de desenvolver um sistema que amplie as capacidades
do usuário, a interface deve atingir também a aplicabilidade, sendo útil na resolução
dos mais variados problemas.
Segundo Fischer (1998) todo usuário é experiente em um domínio, e um
programa de computador deve servir a sua especialidade, funcionando como um
instrumento de trabalho, não fazendo com que o usuário assuma as exigências de
peculiaridades tecnológicas.
36
3.4 ENGENHARIA COGNITIVA E ENGENHARIA SEMIOTICA
3.4.1 ENGENHARIA COGNITIVA
Segundo Preece e outros (1994), o que caracterizou o processo de IHC foram
às bases cognitivas, ou seja, processo pelo qual se pode adquirir conhecimento, e que
aplica suas teorias na capacidade e limitação da mente dos usuários.
A estratégia da engenharia cognitiva para apoio ao desenvolvimento do
projeto de interface consiste na construção de modelos que ajudam os projetistas a
entender os processos cognitivos humanos usados na interação e a realizar
experimentos ou previsões com estes modelos.
Segundo a pesquisa cientifica de Souza e outros (2006), os modelos
cognitivos servem para representar os processos e estruturas mentais como
recordação, interpretação e aprendizado. Tais estruturas podem mostrar para os
projetistas de interface que os modelos de interação devem funcionar de maneira com
que a este possa ser desempenhado mais facilmente pelos usuários.
Segundo Pádua ([199-?]), o desenho de interfaces deve fornecer o máximo de
confiança ao usuário e deve minimizar o possível de transformações mentais
necessárias.
Para que o projeto de interface consiga alcançar esses objetivos cognitivos,
Norman (1986), afirma que o projetista deve criar primeiramente o modelo mental do
sistema, caracterizando-se o inicio para a criação do layout, com base nos modelos de
tarefa e de usuários. O resultado alcançado através da implementação do modelo de
design é a imagem do sistema. O usuário final não tem nenhuma interação neste caso,
criando desta forma sua própria estrutura mental, caracterizando-se no modelo do
usuário. Este modelo é que faz com que o usuário possa formular suas intenções e
objetivos em termos de comandos e funções do próprio sistema. A Figura 23 abaixo,
apresenta a abordagem do processo de design, segundo Norman (1986).
37
Figura 23 – Modelo de interação da Engenharia Cognitiva (SOUZA, C et al, 2006, p. 13)
O projeto de interface realizado com estes aspectos cognitivos do usuário é
chamado de design de sistemas centrado no usuário (User Centered System Design –
UCSD) Norman (1986).
Segundo a Engenharia Cognitiva, o projetista deve procurar desenvolver uma
aplicação que permita ao usuário criar um modelo mental de acordo com a interface
projetada. De acordo com Norman (1986), é necessário que o projetista entenda do
processo de interação do usuário com a interface do sistema, aplicando-se assim a
teoria da ação, que é simplesmente a interação usuário-sistema, envolvendo GOLFO
da EXECUÇÃO , caracterizando-se pelas etapas de formulação da meta do projeto de
interface, especificação das ações e atividade física de execução, e também o GOLFO
da AVALIAÇÃO, caracterizado pelas etapas de percepção, interpretação e avaliação
da meta.
�
Figura 24 - Etapas de ação do usuário durante a interação com o sistema (SOUZA, C et al, 2006, p. 14)
38
De acordo com Preece e outros (1994), a Figura 24 representa a ação do
usuário final quando utiliza um software para realizar uma determinada operação, ele
deve primeiramente formular metas a serem alcançadas através da interação com as
funções do sistema. Seqüencialmente o usuário deve definir quais são as ações que
devem ser executadas para conseguir atingir o resultado esperado, realizando assim
toda a preparação mental para a execução da meta, restando-lhe concretizar o que foi
mentalizado através de operações realizadas no sistema, compreendendo assim o
golfo de execução. Após a execução da ação definida pelo usuário, inicia-se o GOLFO
DE AVALIAÇÃO. Sua etapa inicial é a compreensão do usuário do novo estado que o
sistema se encontra, mas em muitas situações ele não consegue interpretar este novo
estado e o avalia com base em sua meta inicial, prosseguindo assim a definição da sua
próxima ação a ser executada no sistema.
Se o usuário não perceber que o sistema mudou de estado através
de uma sinalização clara, ele possivelmente interpretará que nada ocorreu e que a sua meta inicial não será atingida.
O projetista pode ajudar o usuário a atravessar estes golfos diminuindo-os. Para isto ele deve definir quais são as ações e estruturas mais adequadas para comandar as funções do sistema, escolher os elementos de interface que melhor comunicam a informação desejada, optar por feedbacks significativos, dentre outras escolhas de design. Assim, quanto mais próxima da tarefa e das necessidades do usuário for à linguagem de interface oferecida pelo projetista, menos esforço cognitivo o usuário terá que fazer para atingir seus objetivos.
(Preece et al., 1994, p. 14)
3.4.2 ENGENHARIA SEMIÓTICA
A Engenharia Semiótica complementa a Engenharia Cognitiva. Ela refere-se a
comunicação entre diferentes meios, constituindo-se em estudos sobre a forma de
como o emissor transmite a mensagem ao receptor, compreendendo desta maneira
uma forma de dialogo entre as partes, através da utilização e interpretação de signos.
“Signo é algo que representa alguma coisa para alguém. Por exemplo, tanto a
palavra <cão> em português, quanto uma fotografia de um cão representam o animal
“cachorro”, e assim são signos de cachorro para falantes da língua portuguesa”
(PEIRCE, [19--]).
“Um sistema computacional é considerado como um ato de comunicação, que
inclui o projetista no papel de emissor de uma mensagem para os usuários
39
(receptores) dos sistemas por ele criados” (ANDERSEN et al., 1993; DE SOUZA,
1993).
De acordo com Souza (1993; 1996), a interface de um programa de
computador é vista como sendo uma mensagem enviada pelo projetista de interface ao
usuário final.
Esta mensagem tem como objetivo comunicar ao usuário a resposta a duas perguntas fundamentais: Qual a interpretação do projetista (designer) sobre o(s) problema(s) do usuário, e como o usuário pode interagir com a aplicação para resolver este(s) problema(s)? O usuário concebe a resposta a estas perguntas à medida que interage com a aplicação.
(SOUZA, 2006, p.17).
“O design de interfaces envolve não apenas a concepção do modelo da
aplicação, mas a comunicação deste de maneira a revelar para o usuário o espectro
de usabilidade da aplicação” (SOUZA et al., 2006, p. 18).
A Engenharia Semiótica ressalta ainda que a presença do projetista de
interface no cenário comunicativo deve ser explicitada e tornada sensível para os
usuários para que tenham maior chance de entender as decisões tomadas, sendo
assim capazes de fazer um uso mais criativo e eficiente da aplicação.
As figuras abaixo representam um exemplo da mensagem que o projetista de
interface está transmitindo ao usuário. A Figura 25 mostra que apenas é permitida a
emissão de um relatório por vez, devido às opções de seleção da interface. Já a
Figura 26 mostra que, com esse tipo de interface é possível emitir um relatório
selecionando varias opções ao mesmo tempo, assinalando mais de um item na tela,
devido às caixas de seleção.
�
Figura 25 – Mensagem que o projetista quer
passar para ao usuário
�
Figura 26 - Mensagem que o projetista quer
passar para o usuário�
40
Na abordagem da Engenharia Semiótica, o projeto de interface compõe-se de
quatro etapas básicas para o seu desenvolvimento: análise, design, prototipação e
avaliação. A Figura 27 apresenta o processo de design na Engenharia Semiótica.
Figura 27 - Processo de Interface na Eng. Semiótica
(LEITE, SOUZA, [200-],p.4).
A Figura acima representa as atividades de um projeto de interface num
processo cíclico, ou seja, “no qual o design da interface pode ser corrigido ou sofrer
evoluções para novas etapas a partir da avaliação da interface” (LEITE, SOUZA, [200-
]).
O projetista contempla no projeto tanto a funcionalidade quanto o modelo de
interação. A interface bem desenvolvida é responsável por fazer com que o usuário
tenha condições de interagir com as funcionalidades do sistema. E o layout bem
projetado depende da especificação dos modelos de interação e das funcionalidades
do sistema, visando descrever quais funções o sistema deve oferecer para os seus
usuários.
3.5 ENGENHARIA COGNITIVA OU ENGENHARIA SEMIOTICA
“Tanto a Engenharia Semiótica quanto a Engenharia Cognitiva vêem o
processo de layout se iniciando com o projetista de interface que cria o seu modelo
mental da aplicação, e com base neste, implementa a própria interface para a
aplicação” (LEITE, SOUZA, [200-], p. 19).
41
O usuário ao interagir com esta aplicação cria-se seu próprio modelo mental
do uso do software. A criação das interfaces do sistema e a interação do usuário com o
projeto de construção funcionam em diferentes momentos no tempo de projeto.
A Engenharia Cognitiva se concentra na interação usuário-sistema, deixando
a etapa designer-sistema em segundo plano. Ela oferece subsídios para se definir a
meta ideal do processo de layout, um produto cognitivamente adequado para a
população de usuários.
A Engenharia Semiótica por sua vez, junta estas duas etapas ao transferir seu ponto de vista para um nível mais abstrato, no qual o projetista envia ao usuário uma meta-mensagem. Desta forma, a Engenharia Semiótica dá um zoom-out no processo de design e inclui a Engenharia Cognitiva.
(LEITE, SOUZA, [200-], p. 19).
No dizer de Leite e Souza ([200-]) todos os resultados que são obtidos na
engenharia cognitiva são válidos também na engenharia semiótica, deixando de ser o
foco a interação usuário-sistema, dando subsídios para a definição do plano de design,
que se faz tornar um processo coeso e consistente, levando com segurança a
mensagem que o projetista de interface passa ao usuário final.
3.6 TECNICAS PARA CONSTRUÇÃO DE INTERFACES
A construção do projeto de interfaces depende de vários fatores para chegar a
um resultado satisfatório, envolvendo toda uma atividade intelectual com técnicas e
ferramentas especializadas, todas aliadas a criatividade do projetista que irá
desenvolver o projeto de comunicação com o usuário.
Como já foi mostrado neste trabalho, quando um projeto de interface for
desenvolvido, é preciso criar um protótipo das futuras telas do sistema. A
prototipação consiste no que foi discutido e imaginado nos primeiros contatos com o
usuário final, utilizando materiais mais simples para formular a primeira apresentação
do esboço, permitindo uma descrição e pré-avaliação mais concreta do produto a ser
construído.
42
Especificação também faz parte do projeto de interface, pois consiste na
descrição e avaliação detalhadas do projeto, a partir de técnicas associadas às
notações utilizadas.
A utilização da prototipação e especificação no projeto de interface permitem
várias formas de visões e avaliações complementares, levando o projetista a um novo
layout a ser construído, e posteriormente ser avaliado, ajudando-o desta forma a
desenvolver uma interface que corresponda com as perspectivas do usuário.
“O protótipo da interface deverá permitir uma avaliação da interação com os
usuários do sistema. Esta avaliação pode ser feita utilizando-se dois tipos de testes:
testes de usabilidade e comunicabilidade” (LEITE, SOUZA, [200-], p. 22).
Os testes de usabilidade avaliam fatores relacionados com facilidade de uso
do programa, produtividade, flexibilidade e satisfação do usuário. Os testes de
comunicabilidade avaliam as diferentes formas de layout desenvolvidas, até chegar
num melhor modelo para o software.
Segundo Sommerville (2003), no início de um projeto de interface, deve-se
levar em conta a análise e modelagem de usuários. O usuário final sempre deve ser o
foco central, durante o desenvolvimento do layout do programa. O objetivo da
modelagem e análise, é para identificar quem são os usuários que irão utilizar o
sistema e caracterizá-los de acordo com sua função, definindo quais são suas
capacidades, etc”.
3.6.1 FATORES E ANALISES QUE FAZEM PARTE DO PROJETO DE
INTERFACE
• Papel ou Função de cada usuário: é necessário definir quais tarefas que eles
exercerão no aplicativo;
• Conhecimentos em microinformática: é de suma importância saber o grau de
conhecimento de informática dos usuários e pela familiaridade com o modelo de
interação do ambiente de interface.
• Domínio da aplicação: conhecer o grau de domínio da aplicação do usuário é
importante para desenvolver uma interface que ofereça recursos tanto para os
iniciantes quanto para especialistas.
43
• Contexto sócio-cultural: há um conjunto de fatores que visam analisar as
diferenças sócio-culturais entre os usuários da aplicação, tais como problemas
de línguas ou dialetos diferentes e tradições culturais distintas. Estes fatores
têm grande importância em aplicações que serão distribuídas em diversos
países, ou em diversas regiões de um mesmo país (é o caso de software de uso
geral e software de companhias multinacionais).
Segundo Cooper (1995), há vários modelos que definem um processo de
construção de software, caracterizando-se um processo para o projeto e outro para a
construção da interface com o usuário. Esses modelos são construídos através da
analise do perfil e das tarefas do usuário.
De acordo com Abreu e outros ([199-]), durante um projeto de software, há um
paralelismo com a construção do projeto de sistema com o projeto de interface,
podendo o mesmo ser executado na fase inicial do ciclo de vida do desenvolvimento
do software. O projeto de interface poderá ser desenvolvido tanto pela mesma equipe
de desenvolvedores do sistema, quanto por equipes especializadas unicamente para o
projeto de<telas para programas de computador. Essa distinção irá depender dos
recursos investidos no projeto como um todo, sendo mais favorável aquela equipe que
possui um grupo apenas para lidar com a construção do projeto de interface. A Figura
28 apresenta o paralelismo entre as fases de construção de software e a construção da
interface.
�
Figura 28 – Paralelo entre desenvolvimento do software com o projeto de interface (modificada)
(CIÊNCIA E TECNOLOGIA DA INFORMAÇÃO, 2005)
44
3.6.2 ANALISE E MODELAGEM DE TAREFAS
A utilização de modelos se torna fundamental para os projetistas de interface
refletirem desde as etapas iniciais do projeto, permitindo um entendimento mais
concreto e organizado sobre o que será desenvolvido no projeto de interface, ajudando
na tomada de decisões da própria equipe.
3.6.3 ETAPAS DO PROCESSO DA CONSTRUCAO DE INTERFACES
No dizer de Barbosa e outros [(200-?)], as etapas do processo de construção
de interface compõem-se dos seguintes passos: análise, cenários, modelagem de
tarefas, modelagem de interação, storyboarding e prototipação rápida.
• Análise = Este processo focaliza-se na compreensão do domínio do problema e
no contexto do usuário. Sendo realizado por meio de questionários, entrevistas
e estudos sobre o seu comportamento.
• Cenário = “Cenários são narrativas textuais, pictóricas ou encenadas, de
situações fictícias, mas plausíveis (senão desejáveis) de uso situado da
aplicação” (LEITE, SOUZA, [200-], p. 25). É construído com base na análise
que foi realizada junto ao usuário, permitindo uma exposição de várias situações
de.uso,com.grande.variedade>de>informações.
Eles devem ser ricos em contextualização, validando junto aos usuários, o
entendimento dos projetistas sobre as idéias e tarefas a serem desenvolvidas.
Os métodos baseados em cenários permitem aos projetistas a identificação de
componentes de layout, facilitando a compreensão dos usuários envolvidos,
podendo os mesmos avaliar, criticar e dar sugestões sobre o que está sendo
desenvolvido. Apesar dos cenários serem bem minuciosos, eles não devem
apresentar detalhamento da interface propriamente dita, “como textos, rótulos,
seleção de widgets, etc” (BARBOSA et al,.[200-?]). Esse não detalhamento da
interface é fundamental para o projetista, assim ele não passa por um
45
comprometimento tardio com a escolha do modelo de interface a ser adotada, o
que causaria dificuldades na exploração de soluções alternativas para a
realização do projeto. Quando um cenário é aprovado, inicia-se a construção de
representações de todas as tarefas que foram argumentadas e trabalhadas
durante o mesmo, seqüencialmente dando forma ao produto de software.
Após a conclusão dos cenários, o projetista já apresenta vários elementos para
modelar a interface e dar seqüência para o inicio dos outros passos do processo
de IHC.
• Modelagem de tarefas = Trata-se de atingir os objetivos (metas) que se
pretende alcançar ao utilizar o sistema, possibilitando a criação de uma lista de
metas do usuário final, através do trabalho realizado por meio dos cenários,
sendo representado em forma de diagrama com especificações textuais,
possibilitando uma visão mais ampla das metas, com sua seqüência de tarefas
a serem realizadas. Cada meta obtida pelo cenário será representada por um
modelo de tarefas, sendo organizado pela seqüência das ações ou de forma
independente. A Figura 29 apresenta uma meta obtida através de um cenário.
Figura 29 – Representação diagramática da meta - Modificada (Proceedings IHC 2002)
O objetivo da representação por diagramas na modelagem de tarefas é de
apresentar uma visão geral das metas e também da hierarquia de cada tarefa a ser
46
executada. Todos os itens que constituem o modelo de tarefas (meta, tarefas e
operadores) devem ser expressos baseando-se no ponto de vista do usuário (como
Consultar documentos, Efetuar Login, etc).
Com a utilização deste modelo, o projetista obtém definições detalhadas de
cada objetivo a ser desempenhado pelo usuário no sistema, conseguindo chegar a um
resultado satisfatório para o desenvolvimento da interface.
• Modelo de interação = Após a construção do modelo de tarefas inicia-se o
modelo de interação. O objetivo deste modelo é de apresentar as possíveis
formas de interações que os usuários terão ao utilizar a interface, dando uma
ampla visão aos projetistas, da interação entre usuário e sistema. Segundo
Barbosa e outros ([200-?]), durante este processo é fundamental modelar a
interação utilizando um nível mais alto de abstração, sem incluir detalhes da
interface para não tornar a notação complexa e de difícil compreensão. Um
diagrama de interação constitui-se de alguns elementos básicos, tais como:
cenas, processos do sistema e processos externos. Uma cena corresponde a
um componente estruturado da interface, como as janelas (telas), que
representam vários diálogos entre usuário e sistema. Quando ocorre alteração
em algum dialogo existente, acontece uma transição entre cenas, podendo levar
o usuário à outra cena, ou a um outro processo do sistema.
A Figura 30 ilustra um exemplo da meta CONSULTAR DOCUMENTOS,
apresentando a utilização do modelo de interação, mostrando ao projetista de interface
todas as possíveis formas de comunicação do usuário com o sistema.
47
Figura 30 - Representação do modelo de interação – Modificada (Proceedings IHC
2002)
Uma cena mostra o diálogo do usuário com o sistema como a fala (efetuar
login). Os retângulos na figura são representados pelo processo do sistema, como
exemplo o processo PROCESSA LOGIN. As mudanças entre cenas e processos
do sistema são representadas por setas juntamente com seus rótulos, identificando
a função de cada um. Algumas cenas podem ser acessadas por qualquer outra
cena, esse acesso é chamado de UBIQUA. Na figura é representado por um
retângulo vazio com preenchimento cinza.
Este tipo de modelo apresentado pela Figura 30, facilita o desenvolvimento do
projeto de interface, apresentando ao projetista um mapeamento mais detalhado
das funções exercidas pelo usuário final, facilitando possíveis correções e fácil
entendimento entre ambas as partes.
• Storyboarding = É uma técnica que envolve especificações através de imagens,
descrevendo situações que estão sendo planejadas no projeto de interface.
Esta técnica utiliza meios de desenhos e ilustrações, sendo realizado
48
manualmente ou por ajuda de softwares, permitindo a validação dos cenários
construídos pelo projetista e a elaboração de protótipos de interfaces para
layouts iniciais. É um recurso que pode ser usado de uma forma mais livre e
simples, facilitando o dialogo entre usuários e projetistas. A Figura 31 mostra um
exemplo de storyboarding gerado a partir de um cenário especifico:
�
Figura 31 – Exemplo da utilização de um storyboard (SOUZA, C et al, 2006, p. 34)
49
4 CRIAÇÃO DO PROJETO DE INTERFACE
Neste capítulo, será mostrado de forma prática e objetiva, o conceito
apresentado nos capítulos anteriores focalizando na qualidade da construção do
projeto de interface para usuários. De início será abordado o procedimento de como
construir o projeto, seguindo as principais características e regras que foram
apresentadas nos capítulos anteriores. O foco deste capítulo é de apenas
apresentar uma visão geral da construção do projeto de interface, entretanto, deve-
se observar que não foi realizado um trabalho de campo, ou seja, não há nenhuma
participação de usuários reais para a construção do mesmo.
Por meio de exemplos, serão apresentadas as principais técnicas utilizadas
em um projeto de desenvolvimento de telas para programas de computador, com o
objetivo de alcançar a excelência na qualidade do desenvolvimento da mesma,
caracterizando-se um desafio para os profissionais da área de projeto e de
desenvolvimento.
Através da utilização de casos de usos, será construído o modelo mental do
sistema, e posteriormente desenvolver a prototipação das futuras telas, até chegar
no modelo final com o layout definido, finalizando o projeto com as interfaces prontas
para serem utilizadas.
O modelo escolhido para o estudo detalhado da construção do projeto será o
módulo comercial de um sistema de vendas qualquer. O mesmo será composto de
cinco especificações que determinarão as funcionalidades do modelo estudado,
indicando as possíveis formas de interação que o usuário deverá ter ao utilizar a
interface do sistema. As especificações de cada funcionalidade deste módulo,
constituem-se em:
• Cadastro de Fornecedores
• Cadastro de Produtos
• Cadastro de Clientes
• Lançamento de Vendas (Pedido de Venda)
• Consultar Pedidos
50
Após a criação destas, serão construídos casos de usos para cada
especificação abordada, utilizando a ferramenta de modelagem UML - Visual
Paradigma. Com a criação deste modelo, será possível apresentar a forma de
interação com o sistema, através da utilização simbólica de um ator, correspondendo
a ação do usuário diante da função a ser realizada no sistema através da interface
que será ser projetada.
Com a criação destes casos de usos, será possível desenvolver a
prototipação das telas, com base ao modelo mental do possível usuário,
determinando assim o primeiro esboço prático para a criação das janelas do sistema
e posteriormente chegar ao desenvolvimento prático das mesmas, através de
ferramentas de programação, como de exemplo DELPHI, VISUAL BASIC, etc . Com
relação a este trabalho, as interfaces foram construídas utilizando-se a ferramenta
de programação.Delphi.6.0.
4.1 INÍCIO DA CONSTRUÇÃO DO PROJETO DE INTERFACE
Para a criação do projeto, o primeiro passo é o contato direto com usuário,
através de reuniões e encontros para obter especificações detalhadas de todas suas
rotinas no seu dia a dia, procurando por parte do projetista ou desenvolvedor
entender o modelo mental que o usuário tem em relação as suas tarefas exercidas.
Tendo entendido o modelo mental e as necessidades dos usuários, cabe a equipe
do projeto passar todas as idéias obtidas para o papel e assim serem discutidas, e
conseqüentemente passar para a etapa seguinte, que são as especificações
detalhadas de acordo com as necessidades obtidas.
Após o estudo detalhado destas necessidades, inicia-se a construção da
planta das futuras interfaces, que é a criação dos casos de usos e seqüencialmente
a construção da prototipação, tendo assim um conjunto de informações necessárias
para a criação das interfaces que constituirão o projeto como um todo,
representando para o usuário a principal forma de entendimento e comunicação com
o sistema a ser implantado.
51
4.1.1 FUNCIONALIDADES PARA OS CASOS DE USOS
Cadastro de Fornecedor
O usuário será capaz de incluir um novo fornecedor. Toda entrada de
produtos na empresa é realizada pela negociação com cada fornecedor. Para que o
usuário consiga fazer o cadastro de produtos, será necessário ter os dados do
fornecedor cadastrado no sistema, pois existe um relacionamento entre entrada de
produtos com o fornecedor correspondente. Se no cadastro de fornecedor não
houver seus dados registrados, não será possível realizar o cadastro do produto no
sistema.
Para cada fornecedor, é necessário armazenar dados sobre razão social,
nome fantasia, endereço, cidade, estado, CNPJ, Insc. Estadual e contatos. Estes
dados são obrigatórios no ato do cadastro. Todo fornecedor é relacionado a um
contato especificadamente, constituindo a lista de contatos, eles representam os
responsáveis pelo contato direto por cada fornecedor lançado no sistema.
Antes de o usuário fazer o lançamento do novo fornecedor, ele pode realizar
uma consulta para verificar se há existência do mesmo no sistema. Não será
permitido realizar o cadastro do fornecedor caso já exista suas informações no
banco de dados. Se através da consulta, for verificado que não há registros sobre
determinado fornecedor, deve-se realizar então o novo cadastro, informando todos
os dados necessários para a sua conclusão.
No momento de salvar as informações no sistema, será verificada a
validação dos dados digitados, como de exemplo o calculo do CNPJ, caso não
esteja correto, o usuário será notificado pelo sistema, indicando que o valor digitado
no CNPJ está errado, obrigando-o a corrigir o valor digitado. Após a verificação e
correção do CNPJ, o cadastro do fornecedor será concluído, finalizado assim a
operação.
52
Cadastro de Produtos
O usuário deve ser capaz de incluir um novo produto, os mesmos
representam tudo que é comercializado pela empresa, representando o giro de todo
o fluxo comercial. Antes de fazer o cadastro do novo produto, o usuário pode realizar
uma consulta, verificando se o mesmo já foi lançado no sistema. A consulta deverá
ser realizada pelos principais dados que identificam o produto, como código do
produto ou a descrição do mesmo.
Ao realizar a consulta, o usuário será informado pelo sistema, mostrando se
existe o produto com a mesma descrição cadastrada. Não será permitido cadastrar
produtos que tenham a mesma descrição, caso não ocorra esse tipo de alerta, o
usuário será liberado para realizar o cadastro.
Para a realização do cadastro, é necessário armazenar para cada produto,
dados sobre descrição, complemento, local do estoque, lista de opções, marca,
grupo e fornecedor. Essas informações são obrigatórias para a conclusão do
cadastro. Todo produto registrado é identificado por um numero único, este numero
é chamado de código e deve ser gerado automaticamente pelo sistema.
Durante o lançamento, o usuário devera fazer consultas internas no cadastro,
pois algumas informações obrigatórias são armazenadas em outras tabelas do
banco de dados, e elas estão relacionadas com o cadastro do produto, como a
identificação do fornecedor correspondente, somente será cadastrado o produto,
caso o fornecedor do mesmo já esteja lançado no cadastro de fornecedores.
Outra opção que também está vinculada em outra tabela, é a escolha do grupo
pertencente ao determinado produto, somente será cadastrado o produto, caso
tenha algum grupo especifico no cadastro de grupo e sub-grupo, caso não haja
grupos específicos para o produto, o sistema emitira um alerta informando o usuário
sobre a falta do grupo definido.
Depois de realizado o preenchimento de toda a ficha, o usuário devera registrar
as informações na base de dados, concluindo assim a operação. Este cadastro está
ligado ao controle de estoque, refletindo assim em sua quantidade de produtos
armazenadas em cada local.
53
Cadastro de Clientes
O usuário será capaz de incluir um novo cliente. Cada cliente é ligado a um
vendedor especifico, tornando-se exclusivo para aquele determinado vendedor.
Antes de fazer o cadastro, o usuário pode realizar uma consulta para verificar se os
dados do cliente já foram lançados no sistema, caso não seja, é liberado o cadastro
para o usuário. Essa consulta será realizada por meio de um dado principal, que é o
código do cliente.
A indicação ao usuário se já existe ou não o cliente cadastrado, será por meio
de mensagem trazida pelo sistema, informando que já existe o cliente com o mesmo
CPF, impossibilitando a seqüência do lançamento. Se não existir o cliente, o usuário
deverá preencher os campos necessários para concretizar o cadastramento do
mesmo. Durante o preenchimento do cadastro, alguns campos são obrigatórios,
entre eles: Código, Nome, CPF, e situação do cliente. O usuário também devera
preencher a classificação fiscal do cliente, essa seleção ira identificar a classificação
do ICMS, podendo ser selecionada apenas uma opção, dividindo-se em:
Consumidor Final, Revendedor, Produtor rural ou isento de ICMS. Após o
preenchimento de todos os dados, o cliente será cadastrado no sistema, finalizando
assim a operação.
Lançamento de Vendas (Pedido de Venda)
O usuário será capaz de realizar uma nova venda caso já seja registrado no
sistema informações do cliente que esteja fazendo o pedido, como também
fornecedor e produto a ser comercializado.
O pedido de venda é composto por 3 partes distintas, que se divide em
cabeçalho, corpo do pedido e rodapé. Primeiramente, o usuário devera preencher o
cabeçalho, contendo as principais informações do novo pedido, como nome do
cliente, data de negociação, data de faturamento, tipo de negociação, e
observações. Essas informações deverão ser digitadas manualmente pelo usuário,
ficando a opção do numero do pedido para ser gerado automaticamente pelo
sistema.
54
Neste mesmo cabeçalho, o usuário selecionará o cliente que esta fazendo o
pedido, através de consulta por meio do código do cliente, nome ou cpf. É
obrigatório preencher as informações do cliente no cabeçalho do pedido, caso o
cliente não seja selecionado ou encontrado, o pedido não poderá ser finalizado,
impedindo assim a confirmação do mesmo. O usuário será informado sobre o
resultado da consulta, por meio de um alerta do sistema, sinalizando a existência ou
não do cliente no cadastro.
Se o cliente for selecionado ou encontrado na base dados, o usuário poderá
continuar o preenchimento através do corpo do pedido, informando na seqüência os
itens do mesmo, como o produto a ser adicionado, quantidade a ser comprada, local
de estoque e valor unitário. Para cada pedido existe o item do pedido, que se
caracteriza por produtos que estão armazenados em estoque, representando o
conteúdo do mesmo.
Para adicionar o produto no item do pedido, o usuário devera realizar uma
consulta por meio do código, descrição, localização do estoque ou por referencia do
fornecedor correspondente. O usuário será informado sobre a existência ou não do
produto na base de dados, por meio de mensagem de alerta emitida pelo próprio
sistema. Se o produto for localizado, será apresentado um resumo geral do seu
cadastro, visualizando os principais campos como descrição completa,
complemento, lugar e total em estoque. Através desta consulta, o usuário ficará
informado sobre o produto selecionado, tendo assim uma quantidade precisa de
informações para realizar o lançamento no pedido de venda. Se o produto não
estiver sido lançado no cadastro de produtos, a continuação do pedido não será
possível. O usuário terá o livre direito de acrescentar outros produtos para o mesmo
pedido, caso o produto a ser lançado já esteja registrado na base de dados.
Após o preenchimento dos itens do pedido, o usuário terá que preencher o
rodapé do mesmo, contendo dados como transportadora, desconto e seguro. Após o
preenchimento das três partes que constituem o pedido, ele será confirmado. Após a
confirmação do pedido, o mesmo deverá ser impresso e o usuário também poderá
enviar um copia do PV via e-mail para o cliente, apenas informando o e-mail do
destinatário que ira receber a copia do pedido.
55
Consultar Pedidos
O usuário poderá fazer consultas a todos os pedidos que estão ligados a um
determinado cliente. Essas informações serão visualizadas de acordo com cada
vendedor relacionado ao seu cliente especifico.
A consulta devera ser feita pelo cliente desejado, informando seu código,
nome ou CPF correspondente, se o usuário informar um dado errado ou cliente que
não exista no cadastro, o sistema ira trazer uma mensagem informando para o
usuário refazer a consulta novamente.
Após realizar a consulta e localizar o cliente desejado, o usuário poderá
visualizar todas os pedidos feitos para aquele cliente, podendo classificar alguns
filtros por pedidos pendentes e não pendentes e data de negociação.
Através deste recurso, será possível identificar cada item do pedido,
identificando o numero do pedido, data de negociação, valor, cliente, tipo de
negociação e valor do frete.
Por meio desta opção, o vendedor terá um maior controle de seus pedidos
realizados, sabendo também quais estão pendentes ou não.
56
4.1.2 DIAGRAMA DE CASOS DE USO
Após cada funcionalidade do sistema, os projetistas terão informações
suficientes para iniciarem o modelo do sistema, baseado-se em cada funcionalidade
descrita sobre o mesmo. A Figura 32 apresenta um pequeno modelo de caso de
uso, com base nas funcionalidades detalhadas no item 4.1.1.
Figura 32 – Diagrama de Caso de Uso – Módulo Comercial
57
4.1.3 ESPECIFICAÇÃO DOS CASOS DE USOS
Nome = Cadastrar Fornecedor
Pré-condição = Não ter fornecedor cadastrado
Pós- condição = Fornecedor cadastrado
Fluxo principal
1- Solicitar o CNPJ do fornecedor
2- Verificar se existe o fornecedor
3- Criar novo fornecedor
4- Solicitar demais dados do fornecedor
5- Validar CNPJ
6- Incluir fornecedor na base de dados
Fluxo Secundário
Fornecedor já cadastrado
2.1 – Estende consulta fornecedor
2.2 – Retornar para item 1
CNPJ inválido
4.1 – Exibir mensagem de alerta
4.2 - Retornar para item 4
Nome = Cadastrar Produto
Pré-condição = Não ter produto cadastrado
Ter cadastro do fornecedor
Ter cadastro do grupo e subgrupo
Pós- condição = Produto cadastrado
Fluxo principal
1- Solicitar código ou descrição do produto
2- Verificar se existe o produto
3- Criar novo produto
4- Solicitar demais dados do produto
5- Solicitar código do fornecedor
58
6- Verificar se existe fornecedor
7- Solicitar código do grupo e subgrupo de produtos
8- Verificar se existe o grupo e subgrupo
9- Incluir produto na base de dados
Fluxo Secundário Produto já cadastrado
2.1- Estende consulta produto 2.2 – Retornar para item 1
Fornecedor não cadastrado
5.1- Exibir mensagem de aviso
5.2- Retornar para item 5
Grupo e subgrupo não cadastrado
7.1- Exibir mensagem de aviso
7.2- Retornar para item 7
Nome = Cadastrar Cliente
Pré-condição = Não ter cliente cadastrado
Pós- condição = Cliente cadastrado
Fluxo principal 1- Solicitar CPF do cliente
2- Verificar se existe cliente cadastrado
3- Criar novo cliente
4- Solicitar demais dados do cliente
5- Solicitar código do vendedor
6- Incluir cliente na base de dados
Fluxo Secundário
Cliente já cadastrado
2.1- Estender consulta Cliente 2.2 - Retornar para item 1
59
Nome = Emitir pedido de venda
Pré-condição = Ter cadastro do cliente
Ter cadastro do produto
Pós- condição = Pedido de Venda lançado
Fluxo principal 1- Solicitar dados para o cabeçalho do pedido
2- Verificar se existe cliente cadastrado
3- Solicitar dados para o corpo do pedido (itens do pedido)
4- Verificar se existe produto cadastrado
5- Solicitar dados para o rodapé do pedido
6- Incluir pedido na base de dados
7- Imprimir pedido de venda
8- Enviar e-mail com o pedido de venda
Fluxo Secundário Cliente não cadastrado
2.1- Exibir mensagem de aviso 2.2 - Retornar para item 2
Produto não cadastrado
4.1- Exibir mensagem de aviso
4.2- Retornar para item 4
E-mail invalido
8.1- Exibir mensagem de erro 8.2- Retornar para item 8 Nome = Consultar Pedido de Venda
Pré-condição = Ter cadastro do cliente
Ter cadastro do fornecedor
Ter cadastro do produto
Ter cadastro do grupo e subgrupo de produtos
Ter cadastro do vendedor
Pós- condição = Consulta executada
60
Fluxo principal 1- Solicitar o código ou nome do cliente
2- Verificar se existe cliente cadastrado
3- Solicitar alguns filtros para a consulta
Fluxo Secundário Cliente não cadastrado ou não fez pedido de venda
2.1- Exibir mensagem de aviso 2.2 - Retornar para item 2
61
5 CRIAÇÃO DAS INTERFACES COM BASE NOS CASOS DE USOS
Neste capítulo, serão apresentadas as interfaces projetadas com base no
caso de uso criado no capítulo 4. As técnicas utilizadas para a criação destas telas,
estão de acordo com os conceitos citados nos capítulos 2 e 3.
O layout e a forma de padronização descritas neste capítulo, não deverão ser
entendidos como a única forma de padronização para ser aplicada em todos os
projetos de interface, mas este estudo serve apenas como um guia para a criação de
projetos que venham a ser desenvolvidos.
Para facilitar a leitura e o entendimento do leitor, as interfaces serão
apresentadas por meio de tópicos, sendo organizados separadamente pelas principais
características que constituem o projeto de interface com o usuário.
5.1 INTERFACES PROJETADAS
As Figuras 33 a 37 constituem as telas do módulo comercial abordado no
cap tulo 4, dividindo-se em cadastro de cliente, fornecedor, produto, lançamento de
pedido de venda e consulta vendas/clientes.
5.1.1 CONSISTÊNCIA
� A Figuras 33 a 37 representam o princípio da consistência da interface com o
usuário. De acordo com Sommerville (2003), este princípio significa que os menus,
botões, etc devem seguir a mesma padronização, tendo de forma similar o mesmo
formato em todas as telas do sistema.
Sommerville (2003) também afirma que consistência aplica-se a padrões
existentes em determinadas funções que a interface possa oferecer, como exemplo a
função de salvar um registro em um aplicativo, se em uma tela qualquer para realizar
esta função, deve-se fazer de uma maneira especificadamente, em outras telas do
sistema a função de salvar um registro deve seguir a mesma forma de execução da
62
interface anterior, ou seja, seguindo a mesma padronização na execução de funções
que são oferecidos pela interface. Utilizando este conceito de consistência no projeto
de interface, diminui-se o tempo de aprendizado do usuário, ou seja, os conhecimentos
adquiridos em uma tela do sistema será reaproveitado em outras partes do programa.
Figura 33 – Cadastro de Cliente
�
Figura 34 – Cadastro de Fornecedor
63
Figura 35 – Cadastro de Produto
�
�
�Figura 36 – Pedido de Venda
64
Figura 37 – Consulta Cliente / Vendas
Nesta primeira representação, nota-se a aplicação do conceito de consistência principalmente pela barra de ferramentas inferior (Figura 38), onde se localizam todos os procedimentos básicos de operação do usuário, como as funções de voltar e avançar registros, excluir e salvar informações no banco de dados, etc.
�
�Figura 38 - Barra de ferramentas utilizando consistência�
�
�
Outra representação da utilização de consistência, é através dos botões de operação (Figura 39), independente da interface que o usuário esteja usando, as funções e as formas de representações serão as mesmas, facilitando assim sua memorização em utilizar a interface. �
�
�Figura 39 – Botão utilizando consistência
�
�
�
65
A Figura 40, apresenta a padronização do layout entre as telas do sistema,
tendo como exemplo as telas de consulta cliente e consulta fornecedor. Nota-se nesta
figura, que o projetista procurou manter a padronização dos botões de comandos e a
posição dos objetos que constituem o conteúdo da interface, tais como as posições
dos campos, rótulos de textos etc.
�
�
5.1.2 UTILIZAÇÃO DE SIGNOS
Como apresentado no capítulo 3, outro recurso fundamental para a criação de
interfaces é a forma de comunicação que a mesma possa fazer com o usuário. Ela
deve ser desenvolvida de forma simples e natural, fazendo com que a comunicação
entre usuário e sistema se torne confiável, de fácil entendimento e compreensão, e que
não cause incertezas nas ações que o usuário possa vir a executar.
A Figura 41 mostra como o projetista expressa através da interface os
conceitos associados aos tipos de dados utilizados. Nesta figura estão contidos dois
grupos distintos: Tipo de Pessoa (Tela de Cadastro de Fornecedor), que foi criado
pelo componente Radio-Button e Compras (Tela de consulta vendas/clientes), recurso
este.criado.pelo.componente.check.list.
Figura 40 – Padronização entre as telas
66
�
�Figura 41 – Utilização de signos
Quando a interface apresenta este tipo de componente, Radio Button e Check
List, estes identificam ao usuário final as possibilidades distintas de seleção que
existem entre as duas opções, sendo que a primeira somente fornece recurso de
selecionar uma única opção, já a outra fornece recurso de selecionar mais de uma
opção simultaneamente. Note também que a utilização destes recursos, associa-se
com a idéia de padronização de componentes com o sistema operacional Windows,
aplicando-se assim o conceito de consistência, devido à associação utilizada com o
padrão usado pelo sistema operacional. A Figura 42, mostra um exemplo deste mesmo
recurso, sendo utilizado pelo sistema operacional Windows.
�
�
Figura 42 – Exemplo de componentes Chek List e Radio Button
67
5.1.3 ORIENTAÇÃO AO USUÁRIO
As Figuras 43 e 44, apresentam uma das principais funções que uma interface possa oferecer ao usuário com relação à orientação das funcionalidades a serem executadas em um determinado momento. Qualquer layout desenvolvido, deve sempre orientar o operador do sistema, deixando-o informado sobre qualquer operação que ele possa executar em qualquer parte do sistema.
�
�
Figura 43 – Resultado de ações realizadas pelo usuário
�
�
�
�
�
�
�
Figura 44 – Orientação ao usuário por meio de mensagens
Nome Fantasia
Aaaa
68
A Figura 45, representa a mesma orientação ao usuário utilizada na Figura 44, a
diferença é que o resultado da orientação se encontra na barra de status, indicando o
estado do aplicativo no instante de executar a função de salvar registro.
�
�
�
Figura 45 - Orientação ao usuário por meio do estado do aplicativo
Na mesma barra de ferramentas apresentada na Figura 45, nota-se outro tipo
de orientação ao usuário com padronização baseada no sistema operacional Windows.
A Figura 46 apresenta o exemplo da utilização de dicas de tela, quando se posiciona o
ponteiro do mouse sobre os botões de operação existentes na barra de ferramentas da
interface.
Figura 46 - Orientação ao usuário por meio de dicas sobre botões
5.1.4 MESTRE DETALHE (MASTER DETAILS)
A Figura 47, representa o relacionamento de várias informações vindas de
tabelas distintas do banco de dados, reunindo tudo em uma só janela, facilitando a
interação e a forma de visualização das informações. Este recurso recebe o nome de
Mestre Detalhe (Master Detail ). Para o usuário final, tem-se a idéia de que tudo está
centralizado em apenas uma janela representando uma só informação. Geralmente,
os dados que aparecem na parte superior, são dados vindos da tabela principal,
chamada de tabela mestre. Já as informações apresentadas na parte central ou inferior
da tela, geralmente são vindas de tabelas, caracterizadas como tabela detalhe.
69
Figura 47 – Interface utilizando Mestre-Detalhe
5.1.5 METÁFORAS
� A Figura 47, também representa outro recurso de suma importância
para o bom projeto de interface. A figura mostra recursos de associações, que facilitam
a memorização do usuário, ajudando-o no reconhecimento de determinadas funções
do sistema, através da utilização de metáforas. A Figura 48 mostra o exemplo de
metáfora com manipulação de função, sendo aplicado na tela de lançamento de
pedidos.
Informações vindas de tabelas distintas
70
���
�
Figura 48 – Utilização de Metáfora c/ manipulação de função
Quando o usuário aciona o botão com as “(...)”, surgirá uma outra tela para
completar sua operação, no caso da Figura 48 a função seria de carregar a tela de
consultar estoque por produto.
A Figura 47 também está utilizando outro recurso de associação a interface,
caracterizando-se na utilização de metáfora com manipulação de dados, ou seja, a
tela de lançamento de pedidos foi desenvolvida com base no lançamento que era
realizado manualmente pelo vendedor, assemelhando-se ao seu objeto de trabalho
da vida real. Tal recurso, também se encaixa no conceito de objetividade, ou seja, a
interface será cada vez mais objetiva quanto mais próxima for da realidade do que o
usuário vive.
71
5.1.6 RECURSO DE AJUDA VISÍVEL AO USUÁRIO
Uma interface bem desenvolvida, deve oferecer tranqüilidade e confiança ao usuário, quando o mesmo se defronta com uma mensagem de erro ou algo lhe passa incerteza do que esteja fazendo, eles procuram por meio da interface algum recurso que possa lhe dar apoio e ajuda. A Figura 49 mostra através da barra de ferramentas um botão com a opção de ajuda.
Figura 49 – Recurso de Ajuda, visível ao usuário
5.1.7 FACILIDADE DE RECUPERAÇÃO VISÍVEL AO USUÁRIO
Além de a interface oferecer recursos de ajuda, etc ela também deve
apresentar meios que possam facilitar a recuperação de dados, através de botões
ou teclas de atalhos. De acordo com Sommerville (2003), a interface deve sempre
permitir a recuperação de dados a partir de erros cometidos pelos operadores do
sistema.
Se a interface não apresentar recursos de recuperação, o usuário poderá
ficar inibido em realizar novas operações em partes do sistema que ele não
conheça. É importante a interface fazer com que ele aprenda novos recursos através
de tentativas e erros, assim ele será mais confiante e perderá o medo de causar
possíveis estragos com relação aos dados do sistema. A Figura 50, mostra um típico
botão de desfazer operação, criado.em.cada.interface.deste.projeto.
Figura 50 – Recurso de Recuperação, visível ao usuário
72
5.1.8 LAYOUT BEM DEFINIDO
Todo e qualquer projeto de telas para computador, deve apresentar seu layout
o mais fácil e simples possível para a identificação das funcionalidades do sistema,
sendo que quanto mais carregado for, mais difícil será a visualização e entendimento
por parte de quem estiver utilizando a interface. A Figura 51 mostra a interface com o
layout bem carregado, dificultando desta forma leitura do usuário.
�
Figura 51 – Layout carregado
A Figura 52 representa a mesma interface mostrada na Figura 51, a diferença é que ela possui o layout mais organizado e de fácil leitura por parte do usuário.
73
Figura 52 – Layout com os campos mais organizados
Outra característica de um bom layout desenvolvido, é utilizar as mesmas
particularidades de interfaces que o usuário já está acostumado a trabalhar, como o
ambiente do Windows (Microsoft �), etc.
Recursos familiarizados ao usuário, facilitarão seu entendimento e o
aprendizado será mais rápido, passando mais segurança e precisão durante sua
interação com a interface do sistema.
A Figura 53 (opção da tela de Cadastro de Produtos), apresenta um recurso
bem semelhante ao utilizado pelo Windows. Quando o usuário aciona o botão de Abrir
imagem..., é carregada uma tela com as mesmas características da tela de abrir
imagens do sistema operacional.
�
�
�
�
�
�
�
�
�
�
�
�
�
Figura 53 – Utilização de componentes semelhantes ao sistema operacional
74
A Figura 54 representa outra semelhança do layout desenvolvido com o
sistema operacional. Quando o usuário aciona o botão imprimir (opção da tela
Consulta Ficha Cliente / venda), é carregada uma janela de imprimir relatório, está
apresenta as mesmas características da tela de impressão utilizada pelo Windows.
��
Figura 54 – Utilização de componentes Microsoft Este capítulo apresentou um projeto contendo diversas interfaces, sendo todas
voltadas a garantir uma simples e fácil utilização. Quando se faz um projeto de
interface com base no modelo mental do usuário, inicialmente deve-se saber o que ele
realmente precisa para ajudá-lo em suas tarefas do dia a dia, buscando sempre a
desenvolver um layout amigável e de fácil interação, passando satisfação, confiança
nas operações e nas tomadas de decisões para quem utiliza o programa de
computador.
75
6 CONCLUSÕES
Neste capítulo são apresentadas as conclusões obtidas a partir da pesquisa
previamente realizada. E para finalizar são descritas as propostas e sugestões de
trabalhos futuros que possam ser realizados de acordo com o desenvolvimento deste
trabalho.
CONSIDERAÇÕES FINAIS
Este trabalho faz uma análise das diversas formas e técnicas para o bom
desenvolvimento do projeto de interface com o usuário, apresentando um pequeno
projeto de interface com os principais conceitos para a criação de telas para
programas de computador.
Foram apresentadas diferentes maneiras de se obter qualidade durante a
criação do layout das telas de um sistema, seguindo conceitos e diretrizes para a
conclusão do mesmo, tendo como resultado final à satisfação de quem irá utilizar o
programa computacional.
Este estudo reuniu, em um só lugar, vários conceitos de diversas
metodologias de desenvolvimento de projeto de interface. O trabalho reúne todo o
estudo realizado em forma de guia de consulta, que acompanha as fases para a
criação do projeto, permitindo que o mesmo seja seguido facilmente pelo leitor.
O projeto de interface desenvolvido neste trabalho, foi baseado em modelos
voltados a interação do usuário, com base na teoria da engenharia em software,
cognitiva e semiótica, conforme detalhado com capitulo 3.
Conseguir desenvolver interfaces fáceis de se usar, que consiga prever as
ações dos usuários e causar o mínimo de surpresa durante suas operações, situações
assim e entre outras são consideras tarefas nada fácil, comparado pela maioria dos
projetistas como um desafio a ser conquistado, principalmente pela diversidade de
usuários que existem hoje.
Conforme analisado no capitulo 3, antes de se iniciar um projeto de interface,
deve-se primeiramente diagnosticar qual a necessidade do usuário, deve-se
76
compreender o seu modelo mental, ou seja, o que ele pensa em relação as suas
tarefas diárias em serem executadas em um sistema informatizado, como será sua
interação com este sistema, etc. Através destas perguntas entre outras, é que o
projetista de interface conseguirá absorver com precisão, quais são essas
necessidades, e por fim dar início ao projeto como um todo, passando por várias
etapas, até conseguir chegar ao projeto final, que é a interface do sistema pronta e
rica em recursos que vão ajudar a executar suas tarefas no seu dia a dia, tornado-se
assim, o principal canal de comunicação entre o ele e o sistema computacional.
O projeto de interface desenvolvido no capítulo quatro, mostrou que é
fundamental para qualquer projeto sendo pequeno ou não, que não basta apenas criar
algumas janelas para interagir com o usuário de qualquer maneira e pronto, e depois
deixar por conta da pessoa que esta utilizando o sistema se adaptar com a tela que foi
desenvolvida tornando seu trabalho confuso e irritante a medida que ele se interage
com a interface. Com este trabalho, mostra-se claramente que cada projeto que for ser
desenvolvido, deve-se projeta-lo para se adaptar conforme as exigências do usuário e
não que o usuário se adapte a interface.
Através de conceitos detalhados entre os capítulos 2, 3 e 4, o leitor encontrará
uma diversidade muito ampla com relação ao assunto em como desenvolver um
projeto de interface. Já que este é um assunto novo, não muito comum na literatura,
este trabalho procurou apresentar de forma precisa e simplificada vários conceitos
utilizados por uma das melhores empresas do ramo de desenvolvimento de interfaces,
a Microsoft.
Por meio de vários exemplos ilustrativos, foram apresentados as principais
características de interfaces bem desenvolvidas, com todos os seus requisitos para
manter uma perfeita comunicação entre homem e computador, tornando-se a interface
a embalagem principal do software a ser comercializado.
Propostas de trabalhos futuros
Como este trabalho não realizou pesquisa de campo, não tendo nenhuma
participação de usuários reais para o desenvolvimento do projeto de interface, uma boa
proposta para complemento do mesmo, seria em desenvolver um projeto como este,
tendo em prática o trabalho de campo, com participação direta de usuários, desde o
77
momento da entrevista até a entrega das interfaces validadas e prontas para a
utilização.
Outra proposta, é fazer um estudo detalhado de ferramentas (software)
voltadas exclusivamente ao desenvolvimento de interface.
78
REFERÊNCIAS BIBLIOGRÁFICAS
PINHO, M. Realidade Virtual Visão Tridimensional. 1.ed. Rio Grande do Sul: PUCRS. 15 p. Disponível em http://www.inf.pucrs.br/~pinho/TACCII/Aula3-Visao3D.pdf. Acesso em: 09 Mar de 2006. PROJETO de interfaces. Processo de desenvolvimento da interface. 32 p. Disponível em http://www2.uepa.br/paulolima/disciplinas/ufpa/IHCUFPA2004-P2.pdf. Acesso em: 02 Dez de 2005. RIBEIRO, C; CHIARAMONTE, M. Validação experimental de recomendações gráficas básicas em interfaces de aplicações educacionais. Santiago, 2003. p. 8 Disponível em
http://www.tise.cl/archivos/tise2003/papers/validacao_experimental_de_recomendacoes_graficass.pdf
. Acesso em: 03 de Dez de 2005.
SILVA, ANDRÉ. C et al. Relacionamento de Padrões de Engenharia de Software e de Interação Humano-Computador para o Desenvolvimento de Sistemas Interativos. p.15. Disponível em http://sugarloafplop2005.icmc.usp.br/papers/9692.pdf. Acesso em: 17 de Nov de 2005. SOFTWARE, Instruções para um computador que criam signos. p. 11. Disponível em http://www.dimap.ufrn.br/~jair/piu/slides/cap1.pdf. Acesso em: Acesso em: 17 de Nov de 2005. PIRES, S; SIQUEIRA, I. Padronização de Interfaces para Sistemas de informação. Goiânia. p. 9. Disponível em: http://www.alfa.br/revista/pdf/6.pd. Acesso em: 17 de Nov de 2005. INTERFACE de Usuário para Múltiplos Dispositivos. Disponível em: http://www.espacoacademico.com.br/045/45amsf.htm. Acesso em: 17 de Nov de 2005. O PAPEL da Diversidade Humana no Design de Interfaces. Disponível em: http://www.espacoacademico.com.br/032/32amsf.htm. Acesso em: 17 de Nov de 2005. USER-CENTERED Design Principles. Disponível em: http://msdn.microsoft.com/library/default.asp?url=/library/en-s/dnwue/html/ch02b.asp. Acesso em: 30 de Nov de 2005 A BELA E A FERA: Aplicando Interface Gráfica em Sistemas Legados. Disponível em: http://www.celepar.gov.br/batebyte/edicoes/2000/bb100/abela.html. Acesso em: 10 Set de 2005. SABATINI, R. Realidade Virtual no ensino Médico. Disponível em:
79
http://www.informaticamedica.org.br/informaticamedica/n0202/sabbatini.htm. Acesso em: 09 de Mar de 2006.
SOUZA, C et al. Projeto de Interfaces de Usuário. Perspectivas Cognitivas e Semióticas. Rio de Janeiro. p. 46. Disponível em: http://www.eesc.usp.br/nomads/tics_arq_urb/JAI_Apostila.pdf. Acesso em: 23 de Jan de 2006. ENGENHARIA de Software. Disponível em: http://www.ime.usp.br/~anderson/ES2.ppt. Acesso em: 23 de Jan de 2006. PROTOTIPAÇÃO de Software. USP. p. 41. Disponível em: http://beast.dcce.ibilce.unesp.br/~ines/cursos/eng_soft/aula07.pdf. Acesso em: 14 de Mai de 2006. PROJETO de Interface com o Usuário. USP. p. 45. Disponível em: http://beast.dcce.ibilce.unesp.br/~ines/cursos/eng_soft/aula11.PDF. Acesso em: 14 de Mai de 2006. VERIFICAÇÃO e Validação. USP. p. 34. Disponível em: http://beast.dcce.ibilce.unesp.br/~ines/cursos/eng_soft/aula12.PDF. Acesso em: 14 de Mai de 2006. FILHO, A. O papel de protagonistas no desenvolvimento de sistemas interativos. Disponível em: http://www.espacoacademico.com.br/047/47amsf.htm. Acesso em: 23 de Jan de 2006.
FILHO, A. Interface de Usuário para Múltiplos Dispositivos: Questões de Desenvolvimento e Tendências de Pesquisa Disponível em: http://www.espacoacademico.com.br/045/45amsf.htm. Acesso em: 23 de Jan de 2006.
FILHO, A. Percepção Humana na Interação Humano-Computador Disponível em: http://www.espacoacademico.com.br/025/25amsf.htm. Acesso em: 23 de Jan de 2006.
FILHO, A. O Papel da Diversidade Humana no Design de Interfaces Disponível em: http://www.espacoacademico.com.br/032/32amsf.htm. Acesso em: 23 de Jan de 2006.
PINNA, C et al. Uma Abordagem para Projeto da Interface e da Navegação de Aplicativos Web orientada pelo Processo de Negócio. São Paulo. p. 10. Disponível em: http://www.univates.br/sicompi/wcompi2003/11-pinna-souza-arakaki.pdf. Acesso em: 23 de Jan de 2006.
80
ENGENHARIA de Software. Projeto de Software. Disponível em: http://www.classilages.com.br/rodrigo/software/aula5.ppt. Acesso em: 22 de Jan de 2006. O PROJETO de sistemas interativos envolve atividades bastante complexas... .Rio de Janeiro. p. 4. Disponível em: http://www2.dbd.puc-rio.br/pergamum/tesesabertas/0115643_03_cap_01.pdf. Acesso em: 22 de Fev de 2006.
SOMMERVILLE, Ian. Engenharia de software. Tradução de André Maurício de Andrade Ribeiro; revisão técnica Kechi Hirama. 6.ed. São Paulo: Addison Wesley, 2003. 592 p. Título original: Software Engineering.
PRESSMAN, Roger S. Engenharia de software.Tradução de José Carlos Barbosa dos Santos; revisão técnica José Carlos Maldonado, Paulo César Masieiro, Rosely Sanches. São Paulo: Makron Books, 1995. 1056 p. Título original: Software engineering.
PROJETO de Interface com Usuário para Programadores. Disponível em: http://brazil.joelonsoftware.com/vibook/chapters/1.html. Acesso em: 10 de Set de 2005.
O CONJUNTO de cartões perfurados representou um marco na programação. Disponível em: http://pt.wikiedia.org/wiki/historia_da_computacao.html. Acesso em: 16 de Mar de 2006. PROJETO de Interface com Usuário para Programadores. Disponível em: http://brazil.joelonsoftware.com/uibook/chapters/8.html. Acesso em: 10 de Set de 2005. MODELOS e Formalismos para a Engenharia Semiótica de Interfaces de Usuário. Rio de Janeiro. p. 205. Disponível em: http://www.serg.inf.puc-rio.br/serg/pub/jair/tese_jair.pdf. Acesso em: 11 de Abr de 2006. AVALIAÇÃO da interface de um aplicativo computacional através de teste de usabilidade, questionário ergonômico e análise gráfica do design. Santa Catarina. p. 146. Disponível em: http://teses.eps.ufsc.br/defesa/pdf/14001.pdf . Acesso em: 11 de Abr de 2006.
81
FILHO, Wilson. Engenharia de Software: Fundamentos, Métodos e Padrões. 2.ed. Rio de Janeiro, Editora LTC, 2001. p. 602 ORTALEZA, J et al. Proceedings - Symposium On Human Factores in Computer System. SBC, Fortaleza, Ceara, 2002. 405 p. TRYING to read what is in telnet window. Disponível em: http://members.cox.net/amuk/as400.JPG. Acesso em: 10 de Nov de 2005. WIRELESS touch screen control. Disponível em: http://www.jdstechnologies.com/images/PocketPCfront1.jpg. Acesso em: 10 de Nov de 2005. INTRODUCTION TO Electronic Classrooms. Disponível em: http://www.columbia.edu/acis/facilities/classrooms/intro/touchscreen.gif Acesso em: 10 de Jan de 2006. Departamento de Estatística. Disponível em: http://www.de.ufpb.br/~ronei/pyr_maia.gif. Acesso em: 10 de Jan de 2006.
![[Segmedtrab] ergonomia ergonomia](https://img.document.onl/doc/110x75/559e5d231a28abfa7f8b4723/segmedtrab-ergonomia-ergonomia-55a14c97665e9.jpg)
