CENTRO EDUCACIONAL DA FUNDAO SALVADOR ARENA FACULDADE DE TECNOLOGIA TERMOMECANICA

FABRCIO FERRARI DE CAMPOS JAYSON WESLLEY CEZAR SILVA

INTERFACE HOMEM-MQUINA: Melhores Prticas de Usabilidade.

SO BERNARDO DO CAMPO 2008

FABRCIO FERRARI DE CAMPOS JAYSON WESLLEY CEZAR SILVA

INTERFACE HOMEM-MQUINA: Melhores Prticas de Usabilidade.

Trabalho de Concluso de Curso apresentado Faculdade de Tecnologia Termomecanica como exigncia para obteno do ttulo de Tecnlogo em Anlise e Desenvolvimento de Sistemas. Orientador: Flvio Viotti.

SO BERNARDO DO CAMPO 2008

CATALOGAO NA FONTE ELABORADA PELA BIBLIOTECA DA FACULDADE DE TECNOLOGIA TERMOMECANICA Bibliotecria: Miriam da Silva Nascimento - CRB- 8/5347

Campos, Fabrcio Ferrari; Silva, Jayson Weslley Cezar Interface Homem-Mquina: Melhores prticas de usabilidade. Fabrcio Ferrari de Campos, Jayson Weslley Cezar Silva. So Bernardo do Campo: FTT, 2008. 96 p. : il. ; 30 cm. Orientador: Flvio Viotti Trabalho de concluso de curso Faculdade de Tecnologia Termomecanica, FTT, Tecnologia em Anlise e Desenvolvimento de Sistemas, 2008. 1. Interface homem-mquina 2. Usabilidade 3. Heursticas I. Viotti, Flvio II. Faculdade de Tecnologia Termomecnica, FTT, Tecnologia em Anlise e Desenvolvimento de Sistemas III. Ttulo

Titulao: Tecnlogo em Anlise e Desenvolvimento de Sistemas Banca Examinadora: Prof. Flvio Viotti (orientador, presidente, FTT) Prof. Silvio Celso Peixoto Gomes (professor especialista) Prof. Francisco Jos Martins (professor especialista) Aprovado em 12/12/2008

Lista de figurasFigura 1: Usabilidade em lavadora de roupas ........................................................... 17 Figura 2: ENIAC (1946) ............................................................................................. 20 Figura 3: LEO, o primeiro computador de uso comercial do mundo (1949) .............. 20 Figura 4: PDP-1, o primeiro minicomputador ............................................................ 21 Figura 5: Console do IBM 7094 ................................................................................. 22 Figura 6: PDP-8 (esquerda) e seu painel (direita) ..................................................... 24 Figura 7: IBM System/360 (esquerda) e seu painel (direita) ..................................... 24 Figura 8: Kenbak-1, o primeiro computador pessoal ................................................. 24 Figura 9: Prompt de comando do Windows XP ......................................................... 26 Figura 10: Xerox Alto (1973) ..................................................................................... 28 Figura 11: Interface grfica do Apple Lisa, j utilizando a barra de menus ............... 28 Figura 12: Exemplo de interface do tipo TUI ............................................................. 29 Figura 13: Dois skins do software Winamp ............................................................... 31 Figura 14: Modelo de interao da Engenharia Cognitiva ......................................... 36 Figura 15: Etapas de ao do usurio durante a interao com o sistema ............... 37 Figura 16: Exemplo da teoria da ao....................................................................... 38 Figura 17: Exemplo de imagem que no oferece uma boa distino visual .............. 39 Figura 18: cones do Gnome ..................................................................................... 45 Figura 19: Exemplo de card sorting........................................................................... 51 Figura 20: Exemplo de diagrama de afinidade .......................................................... 51 Figura 21: Exemplo de storyboard ............................................................................ 52 Figura 22: Exemplo de maquete ............................................................................... 53 Figura 23: Exemplo de um papel de usurio ............................................................. 57 Figura 24: Exemplo de um caso de tarefa ................................................................. 57 Figura 25: Exemplo de especializao ...................................................................... 58 Figura 26: Exemplo de extenso ............................................................................... 58 Figura 27: Exemplo de composio .......................................................................... 59 Figura 28: Exemplo de afinidade ............................................................................... 59 Figura 29: Smbolos utilizados no mapa de navegao ............................................ 61 Figura 30: Parmetros para custo perceptivo, motor e cognitivo .............................. 64 Figura 31: Exemplo de descrio GOMS .................................................................. 65

Figura 32: Clssico laboratrio de teste .................................................................... 69 Figura 33: Grfico comparativo do nmero de usurios e o nmero de problemas encontrados............................................................................................................... 71 Figura 34: Comparao do arranjo da barra de ferramentas do Word verso 2007 e 2003 .......................................................................................................................... 75 Figura 35: Internet Explorer ....................................................................................... 78 Figura 36: Firefox ...................................................................................................... 79 Figura 37: Chrome .................................................................................................... 79 Figura 38: Opera ....................................................................................................... 80 Figura 39: Gerenciador de downloads do Firefox...................................................... 81 Figura 40: Gerenciador de downloads do Chrome .................................................... 81 Figura 41: Barra de tarefas lateral do Opera, com gerenciador de downloads ......... 82 Figura 42: Menus do Internet Explorer ...................................................................... 83 Figura 43: Botes de navegao do Firefox ( esquerda) ........................................ 84 Figura 44: Barra de endereos do Firefox, com autocompletar................................. 84 Figura 45: Alguns complementos do Firefox ............................................................. 86 Figura 46: Tela do Linpus .......................................................................................... 88 Figura 47: Cada guia do Linpus e a interface Xfce (abaixo direita) ........................ 89

Lista de siglas e abreviaesBASH Bourne Again Shell CI Circuito Integrado CLI Command Line Interface CRT Catode Ray Tube DOS Disk Operating System ENIAC Electrical Numerical Integrator and Calculator GOMS Goals, Operators, Methods and Selection rules GUI Graphical User Interface IDE Integrated Development Environment IEA International Ergonomics Association IHC Interface Homem-Mquina ISO International Organization for Standardization LED Light Emitting Diode LEO Lyons Electronic Office LSI Large Scale Integration PC ou IBM PC Personal Computer PDA Personal digital assistants RAM Random access memory RSS1 Really Simple Syndication SO Sistema Operacional TUI Text User Interface UCSD User Centered System Design WIMP Windows, Icons, Menus, Pointing device ZUI Zooming User Interface

A abreviatura pode referir-se ao seguinte: Rich Site Summary (RSS 0.91), RDF Site Summary (RSS 0.9 e 1.0), Really Simple Syndication (RSS 2.0). Apesar de vrias denominaes, identificam o mesmo padro.1

ResumoCom o advento dos computadores, surgiu a Interface Homem-Mquina (IHC), que busca a conexo entre estes dois mundos: o do homem e o da mquina. Hoje, com a popularizao dos computadores, a interface passa a receber maior ateno durante o desenvolvimento dos sistemas. No estudo de IHC uma das reas mais importantes a da usabilidade, que ser o foco do desenvolvimento desse trabalho. No mbito deste trabalho ser verificado o papel e influncia que o usurio exerce durante o projeto do software2, sendo ele o principal avaliador da interface. Prope-se um guia de melhores prticas para que possa ser usado na concepo, anlise e avaliao das interfaces. Para isso, apresentado as heursticas e objetivos da usabilidade, como tambm conceitos de engenharia cognitiva e semitica, para entender o usurio, e exemplos prticos, no final, para facilitar o entendimento do leitor. O objetivo proposto do trabalho alcanado, e percebe-se a importncia da ateno na concepo, anlise e avaliao das interfaces. Palavras-Chave: Usabilidade, Interface Homem-Mquina, Concepo, Anlise, Avaliao, Heursticas.

2

Termo em ingls para programa de computador.

AbstractWith the advent of computers, the Human-Computer Interaction (HCI) appeared which searches for the connection between these two worlds: the man and the computer. Nowadays, with the popularization of computers, the HCI started to receive more attention in the system development. In the study of HCI one of the most important area is the usability, which will be the focus of development of this work. As part of this work, the role that the user plays over the software's design will be studied, because the user is the main evaluator of the interface. A guide of best practices is proposed so that it can be used in the design, analysis and evaluation of interfaces. For this purpose, the goals of heuristics and usability, are proposed, but also concepts of cognitive engineering and semiotics, to understand the user, and practical examples, in the end, to facilitate the understanding of the reader. The proposed objective of the work is reached, and realizes the importance of attention in the design, analysis and evaluation of interfaces. Keywords: Usability, Human-Computer Interaction, Design, Analysis, Evaluation, Heuristics.

Sumrio1 INTRODUO ....................................................................................................... 12 1.1 MOTIVAO ................................................................................................... 12 1.2 OBJETIVO....................................................................................................... 12 1.3 ESTRUTURA DO TRABALHO ....................................................................... 13 2 DEFINIES GERAIS ........................................................................................... 14 2.1 INTERFACE .................................................................................................... 14 2.1.1 Interface Homem-mquina ..................................................................... 14 2.1.2 Tipos de interface.................................................................................... 14 2.1.3 GUI, Graphical User Interface ou Interface Grfica do Usurio ... 14 2.2 ERGONOMIA .................................................................................................. 15 2.3 ACESSIBILIDADE........................................................................................... 15 2.4 SIMPLICIDADE E COMPLEXIDADE .............................................................. 16 2.5 INTUITIVIDADE ............................................................................................... 16 2.6 USABILIDADE ................................................................................................ 16 3 A HISTRIA DOS COMPUTADORES E DA EVOLUO DAS INTERFACES ... 18 3.1 INTRODUO ................................................................................................ 18 3.2 PRIMEIRA GERAO: 1944-1959 ................................................................. 19 3.3 SEGUNDA GERAO: 1960-1964 ................................................................ 21 3.3.1 Interface Batch ........................................................................................ 22 3.4 TERCEIRA GERAO: 1964-1975 ................................................................ 23 3.4.1 Interface de linha de comando (Comand Line Interface, ou CLI) ........ 25 3.5 QUARTA GERAO: 1971 - ATUALMENTE ................................................ 27 3.5.1 Interface de texto do usurio ................................................................. 29 3.5.2 Interface grfica do usurio ................................................................... 29 3.5.3 Interface de botes ................................................................................. 31 3.5.4 Interfaces de toque ................................................................................. 32 3.5.5 Interfaces tteis ....................................................................................... 32 3.6 INTERFACES DO FUTURO ............................................................................ 32 3.6.1 Interfaces de ateno.............................................................................. 33 3.6.2 Interface de gestos.................................................................................. 33

3.6.3 Interfaces reflexivas ................................................................................ 33 3.6.4 Interfaces tangveis ................................................................................. 33 3.6.5 Interfaces de ampliao.......................................................................... 34 3.6.6 Interface crebro-computador ............................................................... 34 4 FUNDAMENTOS COGNITIVOS E SEMITICOS ................................................. 35 4.1 ENGENHARIA COGNITIVA ............................................................................ 35 4.1.1 Percepo ................................................................................................ 38 4.1.2 Ateno .................................................................................................... 41 4.1.3 Vigilncia ................................................................................................. 41 4.1.4 Memria ................................................................................................... 42 4.2 ENGENHARIA SEMITICA ............................................................................ 43 4.3 CONSIDERAES FINAIS ............................................................................ 45 5 PRINCPIOS E PRTICAS PARA SE OBTER MELHORES INTERFACES......... 47 5.1 PRINCPIOS DE USABILIDADE ..................................................................... 47 5.1.1 Heurstica ................................................................................................. 47 5.1.2 Objetivos .................................................................................................. 49 5.2 CONCEPO E ANLISE DAS INTERFACES ............................................. 50 5.2.1 Tcnicas de gerao e organizao de idias ...................................... 50 5.2.1.1 Brainstorming (Tempestade de Idias) ........................................... 50 5.2.1.2 Card sorting (arranjo de cartas) ...................................................... 50 5.2.1.3 Diagramas de afinidade ................................................................... 51 5.2.2 Tcnicas de Concepo ......................................................................... 52 5.2.2.1 Storyboard (narrativa grfica) ......................................................... 52 5.2.2.2 Maquetes (prottipos em papel)...................................................... 53 5.2.2.3 Prototipagem rpida ......................................................................... 54 5.2.3 Usage-centered design projeto de IHC centrado no uso.................. 56 5.3 AVALIAO DA USABILIDADE..................................................................... 61 5.3.1 Avaliaes analticas .............................................................................. 63 5.3.2 Avaliaes heursticas............................................................................ 65 5.3.3 Teste de Usabilidade............................................................................... 67 6 EXEMPLOS PRTICOS ........................................................................................ 74 6.1 COMPARAO: WORD 2003 E WORD 2007................................................. 74

6.2 COMPARAO ENTRE OS NAVEGADORES ............................................... 76 6.3 LINPUS - SIMPLICIDADE E INTUITIVIDADE ................................................. 87 6.4 ANLISE FINAL .............................................................................................. 89 7 CONCLUSO ........................................................................................................ 91 REFERNCIAS BIBLIOGRFICAS ......................................................................... 92 INTERNET ................................................................................................................ 94

12

1 INTRODUO1.1 MOTIVAO Nos primrdios da computao, os usurios que operavam computadores eram somente profissionais especializados, pois a informtica era restrita - no existia a necessidade de computadores pessoais. Com a evoluo dos computadores e surgimento dos PCs3, a forma de se usar a informtica evoluiu, at o aparecimento das interfaces grficas (GUI). Com essas interfaces, a utilizao dos programas tornou-se muito mais fcil para leigos e usurios casuais. A grande diferena estava no fato de que era o usurio quem comandava a execuo dos programas, e no os programadores, ou seja, no seria imposta uma ordem de execuo das tarefas em um programa. Numa interface grfica, nunca se sabe o caminho que o usurio vai tomar na execuo. Com isso, foi criado um novo tipo de problema: com a liberdade do usurio, surge a probabilidade de o programa tomar um rumo imprevisto pelo desenvolvedor. Passou-se a dar uma importncia muito maior para a qualidade de software, para que fossem feitos programas com a menor quantidade de erros possveis, no menor tempo possvel. Contudo, outro detalhe tambm precisava de mais ateno, e que acabou sendo deixado de lado: a qualidade das interfaces, ou seja, no era dada mais a devida ateno organizao, praticidade e facilidade dos usos dos softwares. Hoje se percebe que dada maior importncia qualidade das interfaces, mas no o suficiente. Existem poucos softwares realmente intuitivos e prticos no mercado. 1.2 OBJETIVO O objetivo deste trabalho apresentar um guia de melhores prticas para desenvolvedores, contando com exemplos comparativos, onde a teoria aplicada, para que a interface de seus programas seja de qualidade, intuitiva e inteligente.

3

Padro de computador pessoal lanado pela IBM na dcada de 1980.

13

Com isso, pretende-se mostrar as necessidades existentes para que um sistema seja capaz de fornecer uma boa usabilidade. Quais aspectos devem ser analisados e considerados na elaborao da interface e quais aes necessitam ser executadas durante o projeto do sistema para que os objetivos de usabilidade sejam alcanados. 1.3 ESTRUTURA DO TRABALHO Neste primeiro captulo, foram apresentadas a motivao e o objetivo do trabalho. No captulo 2 sero apresentadas as definies dos principais termos do assunto, cujo objetivo preparar o leitor para um aprofundamento melhor no trabalho. O captulo 3 apresenta um histrico da informtica juntamente com as interfaces de suas pocas, e tambm as interfaces atuais e do futuro. O objetivo mostrar a variedade dos tipos de interface, bem como suas respectivas importncias para o desenvolvimento tecnolgico atual. O captulo 4 sintetiza o funcionamento de uma interao do ponto de vista do usurio, ou seja, o que acontece na mente da pessoa que est interagindo, para que, com esses conhecimentos, possa ser projetada uma interface melhor. No captulo 5 sero apresentados os princpios da usabilidade4, mtodos para concepo de boas interfaces e mtodos para posterior avaliao. O objetivo do captulo apresentar as melhores prticas propriamente ditas, conforme o foco principal do trabalho. O captulo 6 apresenta exemplos prticos, com comparaes entre softwares existentes, para facilitar o entendimento do usurio em relao aos princpios da usabilidade.

4

Este termo ser explicado na seo 2.6.

14

2 DEFINIES GERAIS2.1 INTERFACE Segundo o dicionrio Michaelis, interface uma superfcie, plana ou no, que forma um limite comum de dois corpos ou espaos. O termo interface referencia, ento, uma diviso, ou limite entre dois mundos distintos. 2.1.1 Interface Homem-mquinaInterface aquilo que serve de conexo entre dois modelos, entre duas vises: o modelo mental do usurio em relao ao sistema e o modelo de programa, construdo pelos engenheiros de software. Toda interface tem dois lados, uma para cada modelo conectado a ela. (VALENTE, 2004)

Na informtica, segundo o dicionrio Michaelis, a definio de interface um equipamento e programa projetado para tornar mais fcil e eficiente a comunicao dos usurios com a mquina. 2.1.2 Tipos de interface Durante o desenvolvimento histrico das interfaces homem-mquina, surgiram diversas formas de interao entre homem e mquina. Os tipos mais comuns sero descritos no captulo 3. 2.1.3 GUI, Graphical User Interface ou Interface Grfica do Usurio Uma interface grfica de usurio, ou GUI, um sistema para interao com computador pela manipulao de elementos grficos e texto. Estes elementos grficos incluem janelas, botes, menus e cones. Pelo fato de todos os programas com interface GUI utilizarem muitos destes elementos, a utilizao desses programas torna-se fcil, de modo que, rapidamente, o usurio aprenda a relacionar os elementos grficos da interface com os elementos equivalentes do mundo real (BUTOW, 2007). Este assunto ser tratado com maiores detalhes na seo 3.5.2.

15

2.2 ERGONOMIA Ergonomia (ergon significa trabalho, e nomos significa regras, em grego) definida pela International Ergonomics Association (IEA) como uma disciplina cientfica, que:Visa compreenso das interaes entre homens e outros elementos de um sistema, e a profisso que aplica teoria, princpios, dados e mtodos para aperfeioar o bem estar e o sistema como um todo. (IEA apud INSTITUTO FABER-LUDENS, 15 out. 2008)

No mbito da disciplina, a IEA distingue trs domnios de especializaes: a) ergonomia fsica, que se interessa pelas caractersticas anatmicas, antropomtricas, fisiolgicas e biomecnicas relativas ao homem em atividade fsica (IEA apud INSTITUTO FABER-LUDENS, 15 out. 2008), ou seja, busca melhorar o relacionamento entre o trabalho e a forma ou o funcionamento do corpo humano; b) ergonomia cognitiva, que se interessa pelos processos mentais, como a percepo, memria, raciocnio e respostas motoras, no contexto das interaes entre as pessoas e os demais elementos do sistema (IEA apud INSTITUTO FABER-LUDENS, 15 out. 2008); c) ergonomia organizacional, que se interessa pela otimizao da estrutura, dos processos e regras dos sistemas scio-tcnicos (IEA apud INSTITUTO FABER-LUDENS, 15 out. 2008). 2.3 ACESSIBILIDADE Acessibilidade remete a flexibilidade de acesso a algo. No site do Instituto Faber-Ludens (15 out. 2008), tem que se no posso ir por um caminho, tenho outro disposio; se no posso ver, tenho como ouvir; se no tenho os aparelhos ideais, tenho uma alternativa menos exigente.

16

2.4 SIMPLICIDADE E COMPLEXIDADE Segundo o socilogo Edgar Morin (apud INSTITUTO FABER-LUDENS, 15 out. 2008), vivemos uma poca em que o aumento da complexidade constante em todos os sistemas da sociedade. Os produtos esto ficando cada vez mais complexos, com muito mais funcionalidades. Acabar com a complexidade no tornar o produto simples; para isso, precisamos domar a complexidade para que o usurio final possa ter uma boa experincia. Isso significa que possvel ter produtos complexos e simples, ao mesmo tempo. John Maeda (apud INSTITUTO FABER-LUDENS, 15 out. 2008) em seu livro As Leis da Simplicidade, diz que o conhecimento faz tudo mais simples. Logo, a simplicidade no universal: para alguns simples, para outros, no. 2.5 INTUITIVIDADE O termo intuitividade significa uma forma como ele [um produto eletrnico] pode ser utilizado sem [o usurio] precisar pensar. [...] Dois exemplos simples disso so alguns aparelhos celulares que, com apenas um dedo, possibilita sua operao, e um televisor que pode ser controlado por uma criana de dois anos, explica Marcelo Zuffo (apud SCHEINER, 1 nov. 2008). Donald Norman (apud INSTITUTO FABER-LUDENS, 15 out. 2008) diz que precisamos lembrar que o que hoje nos intuitivo (como andar), levou anos para ser aprendido. Por isso, em alguns casos, melhor usar o termo familiaridade. 2.6 USABILIDADE o mesmo que facilidade de uso. Se um produto fcil de usar, o usurio tem maior produtividade: aprende mais rpido, memoriza a forma de utilizao e comete menos erros ao utilizar os produtos. Sempre que houver uma interao entre um ser humano e um objeto, seja ele fsico (exemplo: forno de microondas) ou abstrato (exemplo: software), possvel analisar a usabilidade deste objeto. O termo usabilidade surgiu como uma ramificao da ergonomia voltada para as interfaces homem-mquina, mas acabou se difundindo para outras aplicaes,

17

como a utilizao de outros produtos, como controles remotos, painis de elevadores etc. Para exemplificar essa situao, ser feita uma analogia com a lavadora de roupas. Supondo que essa mquina de lavar roupas dever atender um pblico feminino com idade superior a 40 anos, ela precisa atender as necessidades desse pblico para alcanar sucesso de venda. Em uma anlise dos dois modelos abaixo (figura 1), pode-se perceber qual o modelo mais adequado para o pblico-alvo exemplificado:

Figura 1: Usabilidade em lavadora de roupas (SUBMARINO, 10 de nov. 2008)

Ambas as mquinas apresentadas na figura 1 tem o mesmo objetivo: automatizar a lavagem de roupas. No entanto, fornecem diferentes interfaces para que o usurio a utilize. A mquina nmero 1 tem a sua interface baseada em dois botes rotatrios, dois botes de pressionamento e LEDs5. J a mquina de nmero 2 possui sua interface baseada em cinco botes de pressionamento e LEDs. A mquina nmero 1 utiliza botes rotatrios, que lembram os existentes em foges de cozinha. Devido mquina nmero 1 utilizar mecanismos mais simples e em menor nmero ela fornece uma maior usabilidade do que a mquina nmero 2, que, por sua vez, mais complexa. Tanto que h um extenso manual do lado esquerdo do painel, o que faz com que a utilizao no seja to agradvel e prtica para o pblico alvo.5

um componente eletrnico semicondutor (diodo) que, quando energizado, emite luz visvel.

18

3 A HISTRIA DOS COMPUTADORES E DA EVOLUO DAS INTERFACES3.1 INTRODUO No incio da dcada de 1940, surge a mquina que provocou mais mudanas no mundo: o computador. Os primeiros tiveram o seu nascimento motivado, principalmente, pela necessidade de calcular trajetrias balsticas, que, at aquele momento, eram calculadas com a utilizao de equipamentos pouco sofisticados e que no eram suficientes para realizar clculos mais complexos. Esta situao demandava o trabalho de cerca de duzentas mulheres com calculadoras manuais completando os clculos, o que geralmente consumia meses (LSI USP, 11 de set. 2008). Com o surgimento dos computadores, os clculos de balstica eram realizados numa velocidade muito maior. Para que esses clculos fossem feitos, era necessrio que os dados e instrues fossem inseridos nos computadores por pessoas. Com o passar do tempo, o computador ganhou novos usos, o que fez com que o volume de informao aumentasse gradualmente. Dado esse fato, as formas de interao com o computador se tornavam obsoletas de dcada para dcada, obrigando novos projetos de interface homem-mquina, para que atendesse nova demanda de informaes. A histria dos computadores tem a sua diviso feita, geralmente, por geraes, sendo as seguintes (PAGLIS, 21 nov. de 2008): a) b) c) d) primeira gerao: 1940-1950; segunda gerao: 1950-1960; terceira gerao: 1960-1970; quarta gerao: 1970-Atualmente.

A histria dos modelos de interfaces de usurios pode ser dividida em trs eras distintas, nomeadas de acordo com a interface predominante na poca (RAYMOND, 2004 apud BUTOW, 2008):

19

a) b) c)

interfaces batch, as quais eram usadas desde o advento do ENIAC6, de 1945 at 1968; interface de texto, ou CLI, que ficou em uso de 1969 a 1983; interface grfica (GUI), em uso desde 1984 at os dias atuais.

O uso destes trs tipos de interfaces no desapareceu instantaneamente na mudana de uma era para outra. A maioria dos usurios do IBM PC e computadores compatveis, na dcada de 1980, continuaram a usar a CLI no DOS (Disk Operating System), enquanto muitos destes usurios migraram para a interface grfica do Windows (Windows GUI) no incio da dcada de 1990. Alm disso, computadores com esta interface somente entraram para o uso comum no primeiro ano de suas eras (BUTOW, 2007). Neste captulo, ser mostrada a histria dos computadores, juntamente com suas interfaces. Para isso, sero utilizadas as geraes da histria dos computadores como referncia e o panorama da interface homem-mquina em cada gerao. 3.2 PRIMEIRA GERAO: 1944-1959 A primeira gerao caracteriza-se pela utilizao da vlvula como componente bsico, que fazia com que os computadores consumissem muita energia eltrica e tivessem um alto aquecimento. Outras caractersticas dessa gerao so (PACITTI, 2000): os computadores ocupavam muito espao fsico, geralmente tinham uma sala especfica; tinham dispositivos de Entrada/Sada primitivos (cartes perfurados, botes, interruptores etc.); eram aplicados em campos cientficos e militares; a linguagem de programao era a prpria linguagem de mquina; as operaes internas eram medidas em milissegundos7. Alguns exemplos de computadores: ENIAC e LEO (Lyons Electronic Office).6

ENIAC (Electrical Numerical Integrator and Calculator) foi o primeiro computador digital eletrnico de grande escala. 7 Milsimo de segundo.

20

Figura 2: ENIAC (1946) (MDIG, 11 de set. 2008)

Figura 3: LEO, o primeiro computador de uso comercial do mundo (1949) (CADINFORMATICA, 11 de set. 2008)

No incio, a interface se encontra em nvel de hardware, ou seja, utiliza painis com chaves seletoras, compreendidas apenas por engenheiros e especialistas. Durante a primeira gerao, o modo normal de operao dos computadores era o programador descer at o lugar da mquina, inserir suas conexes no computador e gastar algumas horas esperando que nenhuma das aproximadamente 20.000 vlvulas queimasse durante a execuo. (TANENBAUM & WOODHULL, 2000). Nesta gerao a interface predominante a batch, que ser apresentada na seo 3.3.1.

21

3.3 SEGUNDA GERAO: 1960-1964 Na segunda gerao, o transistor foi o componente bsico. Ele possui um tamanho bem menor se comparado vlvula, com aquecimento e gasto de energia bem menores, alm de uma durabilidade maior, resultando num menor nmero de paradas do sistema. Outras caractersticas da segunda gerao so (PACITTI, 2000): as mquinas diminuram muito em tamanho, e suas aplicaes passam das reas cientfica e militar para a administrativa e gerencial; h a utilizao de rotinas escritas em linguagens de programao; alm dos ncleos de ferrite8, fitas e tambores magnticos passaram a ser usado como memria; as operaes internas passam a serem medidas em microssegundos9. Alguns exemplos de computadores: PDP-1 e IBM 7094.

Figura 4: PDP-1, o primeiro minicomputador (WIKIPEDIA, 14 de set. 2008 a)

8

Ncleos de ferrite: so fabricados atravs de prensagem e sinterizao de mistura de p e ferro e outros materiais nobres, que lhe conferem caractersticas especiais para operao em altas freqncias com baixas perdas. 9 Um milionsimo de segundo.

22

Figura 5: Console

10

do IBM 7094

(CADINFORMATICA, 11 de set. 2008)

Surgem as interfaces batch, que utilizam cartes perfurados parar a insero de dados e de comandos para o computador, conforme ser detalhado a seguir. Pela primeira vez, houve uma separao clara entre projetistas, construtores, operadores, programadores e o pessoal da manuteno (TANENBAUM & WOODHULL, 2000). A execuo de um simples job11 necessitava de pelo menos duas pessoas: um programador responsvel por escreve o programa em papel (em FORTRAN ou Assembly), e transform-lo em cartes perfurados; um operador que acompanhava a execuo e recolhia os resultados (TANENBAUM & WOODHULL, 2000). Os grandes para computadores clculos da segunda de gerao eram utilizados, & principalmente, cientficos engenharia (TANENBAUM

WOODHULL, 2000). 3.3.1 Interface Batch12 A interface batch foi o primeiro tipo de interface disponvel para computadores. Atravs de painis com chaves seletoras, o usurio programava cartes com furos, semelhantes aos produzidos por furadores de papis. Estes cartes eramUnidade que permite que um operador se comunique com um sistema de computador, terminal principal ou centro de controle. 11 Um programa ou um conjunto de programas (TANENBAUM, 2000). 12 A palavra batch, em ingls, significa lote. Os programas batch so executados do incio ao fim, sem interrupo.10

23

perfurados com um padro determinado em que o computador poderia reconhecer. Geralmente, os padres de furos que compunham um caractere eram dispostos verticalmente. Cada carto correspondia a um comando numa interface do tipo CLI13, ou uma linha de cdigo num programa de computador. Os cartes eram lidos por um leitor de cartes que alimentava o computador com as informaes para processamento (BUTOW, 2007). Havia, tambm, os chamados job cards, que eram cartes de controle, que funcionavam como uma espcie de ndice dos cartes de dados. O problema com as interfaces batch que o usurio no podia interagir com o computador enquanto ele processava os cartes. Se houvesse alguma falha a operao era interrompida, e ento era preciso inserir o carto com a informao correta. O processamento dos cartes poderia facilmente levar vrios dias para ser concludo (BUTOW, 2007). 3.4 TERCEIRA GERAO: 1964-1975 A terceira gerao tem como marco inicial o surgimento do circuito integrado (CI), que a integrao de centenas e milhares (atualmente muito mais) de pequenos transistores em uma simples pastilha, tambm conhecida como chip. Esta miniaturizao reduziu no s o espao fsico ocupado, como tambm as interferncias eletromagnticas, aumentou mais a confiabilidade, diminui a dissipao do calor, eliminou um grande nmero de soldas e conexes e baixou o custo devido sua produo em massa (PACITTI, 2000). Alguns computadores da poca: PDP-8, IBM System/360 e Kenbak-1.

13

Interface de linha de comando, descrita na seo 3.3.1.

24

Figura 6: PDP-8 (esquerda) e seu painel (direita) (WIKIPEDIA, 14 de set. 2008 b)

Figura 7: IBM System/360 (esquerda) e seu painel (direita) (COMPUTER MUSEUM, 11 de set. 2008)

Figura 8: Kenbak-1, o primeiro computador pessoal (KENBAK-1, 20 de set. 2008)

Na rea da interface homem-mquina o terminal a inovao da poca, porm a interface com o usurio ainda textual, na qual ele interage por meio de comandos. A partir do advento de linguagens de programao de alto nvel14, como COBOL e FORTRAN, a interface passa a ser em nvel de software, ou seja, uma14

A partir desta poca, as linguagens de programao se assemelham a linguagem escrita, o que facilita para os programadores de computadores.

25

interface programada, sem acesso direto a parte fsica da mquina. Para isso, porm, necessrio compreender os comandos de texto para operar o sistema (VALENTE, 2004). 3.4.1 Interface de linha de comando (Comand Line Interface, ou CLI) As interfaces do tipo CLI exibem um prompt de comando, que um cursor que permite ao usurio saber que o computador est pronto para a entrada de dados. O usurio pode, ento, digitar um comando usando o teclado e envi-lo para processamento, normalmente pressionando a tecla Enter. O computador, em seguida, processa o comando e fornece o resultado. Um comando tambm pode chamar um arquivo contendo uma srie de comandos a serem processados. As interfaces do tipo CLI comearam a ser usada nos anos 1950, quando monitores de computador comearam a aparecer. Porm, somente na dcada de 1970 que as interfaces do tipo CLI foram efetivamente usadas. Nesta poca, as interfaces de mainframe15 e de minicomputadores16 mudaram de cartes para papis, e depois para monitores CRT17 com interfaces do tipo CLI (BUTOW, 2007). Este tipo de interface possibilitou a interatividade com o computador, que foi um salto de usabilidade sobre as interfaces batch (BUTOW, 2007). O usurio ainda poderia utilizar o computador para executar programas em modo batch, o que muitas vezes era feito por ser mais barato, ou seja, consumia menos tempo de processador, que era um recurso precioso na poca. O maior inconveniente de uma interface do tipo CLI que o usurio tinha que aprender uma enorme lista de comandos para instruir o computador.

Um mainframe um computador de grande porte, dedicado normalmente ao processamento de um volume grande de informaes. Os mainframes so capazes de oferecer servios de processamento a milhares de usurios atravs de milhares de terminais conectados diretamente ou atravs de uma rede. 16 O minicomputador um sistema computacional intermedirio aos grandes mainframes e os computadores pessoais. Modernamente foram substitudos pelos chamados workstation, sistemas de mdio alcance, ou, em suas verses mais recentes, os servidores, que prestam servios a outros sistemas computacionais. 17 Monitores de tubo de raios catdicos, que a mesma tecnologia utilizada nos televisores da poca, e, atualmente, ainda utilizado.

15

26

O sistema operacional18 DOS, para PC, apesar de ter sido lanado na dcada de 1980, era o sistema com interface do tipo CLI mais usado, devido ao fato dos computadores do padro PC terem sido os mais populares. O DOS inclua uma linguagem de scripting19 rudimentar, denominado batch programming (no confundir com a interface batch), que permitia os usurios criarem um pequeno programa, chamado arquivo batch, que inclua uma srie de comandos. Quando o usurio executava o arquivo batch, o sistema executava os comandos na ordem em que apareciam no arquivo (BUTOW, 2007). Embora o Windows tenha suplantado o DOS como opo de sistema operacional, o Windows no tinha inicialmente o substitudo. Em vez disso, o Windows era uma "casca" (shell, em ingls) sobre o DOS, que permitia o usurio invocar os comandos sem ter que digitar nada na interface do tipo CLI. O DOS no deixou de existir, e o usurio ainda pode acessar uma emulao dele a partir do Windows, abrindo o prompt de comando20 (BUTOW, 2007).

Figura 9: Prompt de comando do Windows XP (O autor, 2008)

Apesar das interfaces do tipo GUI21 terem suplantado as interfaces do tipo CLI como opo, sistemas operacionais com interface do tipo CLI ainda so

Sistema operacional um programa que faz a comunicao dos perifricos com o processador e as memrias, possibilitando a utilizao do computador sem se preocupar com a parte de hardware. 19 Refere-se aos prprios comandos da interface. possvel automatizar tarefas sem a necessidade de o usurio digit-los todos na ordem correta. 20 Neste caso, o nome prompt de comando refere-se a um programa que emula uma interface CLI, ou seja, no imita somente a aparncia, como tambm interpreta todos os comandos da antiga interface. 21 Interfaces grficas, que ser detalhada na seo 3.5.2.

18

27

utilizados por muitos programadores e administradores de rede, que acreditam que estes sistemas ajudam-os a serem mais produtivos. O Windows XP ainda contm o prompt de comando. Sistemas operacionais baseados em UNIX22, como o Mac OS X23 e o Linux24, tambm permitem utilizar uma janela de comando para acessar o sistema operacional usando uma CLI. Estas interfaces CLI baseadas em UNIX tambm incluem funcionalidades de scripting (BUTOW, 2007, p.30). Atualmente, as interfaces do tipo CLI ainda esto em desenvolvimento. A Microsoft est desenvolvendo um "CLI com esterides", chamado de PowerShell, que inclui uma linguagem de scripting baseada na linguagem C# ("C Sharp"), da Microsoft, com recursos para reduzir a digitao. (BUTOW, 2007). Interfaces do tipo CLI baseadas em UNIX tambm continuam a ser desenvolvidas. Por exemplo: a popular interface BASH (Bourne Again Shell), que foi desenvolvido inicialmente em 1987 (baseado na Bourne UNIX Shell, desenvolvido em 1978), recebeu uma grande atualizao para a verso 3.0 em 2004. Atualmente j est disponvel a verso 3.1 (BUTOW, 2007). 3.5 QUARTA GERAO: 1971 - ATUALMENTE O desenvolvimento dos circuitos LSI (Large Scale Integration - integrao em larga escala), chips contendo milhares de transistores por centmetro quadrado de silcio, tambm chamados de microprocessadores, favoreceu o incio da era do computador pessoal (PC). Com eles tornou-se possvel uma pessoa ter o seu prprio computador pessoal (TANENBAUM & WOODHULL, 2000). Enquanto o tamanho fsico dos computadores diminui a capacidade de processamento aumenta e passa a ser mais rpida, possibilitando a execuo das tarefas em um menor tempo (IBM, 22 de nov. 2008). Alguns computadores: Xerox Alto, Apple Lisa etc.

Sistema operacional criado em 1965 por cientistas da Bell e da GE, conhecido por sua estabilidade. Mac OS X um sistema operacional proprietrio, desenvolvido pela Apple, destinado aos computadores da linha Macintosh. Conhecido por unir a estabilidade do UNIX e o design caracterstico da Apple. 24 Linux o termo geralmente usado para designar sistema operacional que utilize o ncleo Linux. O seu cdigo fonte est disponvel qualquer pessoa utilizar, estudar, modificar e distribuir.23

22

28

Figura 10: Xerox Alto (1973) (CATB, 20 de set. 2008)

Figura 11: Interface grfica do Apple Lisa, j utilizando a barra de menus (MPROVE, 20 de set. 2008)

A interface do tipo GUI e o mouse surgem, possibilitando novas aplicaes, incluindo multimdia. A interface atinge o nvel de dilogo e inicia-se o abandono do modo puramente textual, como ser detalhado a seguir. A usabilidade comea a ter uma maior importncia e a ser um diferencial (VALENTE 2004).

29

3.5.1 Interface de texto do usurio Aps a interface do tipo GUI se tornar popular, o termo interface de texto do usurio, ou TUI (Text User Interface), foi criado para diferenciar as interfaces de texto das interfaces grficas (BUTOW, 2007). Ao contrrio das interfaces do tipo CLI, uma interface do tipo TUI usa toda a rea da tela para realizar as tarefas. As interfaces do tipo TUI foram muito utilizadas nos PCs durante a dcada de 1980 para proporcionar maior funcionalidade e usabilidade para realizar as tarefas. As aplicaes que utilizavam interfaces TUI incluam softwares de processamento de texto, como o WordPerfect (um processador de texto para PC), bem como softwares de telecomunicaes, que permitiam o usurio se conectar a outros sistemas atravs de seus modems, entre outros (BUTOW, 2007).

Figura 12: Exemplo de interface do tipo TUI (BUTOW, 2007)

3.5.2 Interface grfica do usurio

As interfaces do tipo GUI tem sido a interface de usurio padro desde a dcada de 1990, e tornou-se disponvel para o uso geral na computao pela primeira vez em 1984, quando a Apple introduziu o Macintosh. No entanto, foi a disponibilidade do Windows no popular IBM PC e nas plataformas compatveis que levou as interfaces do tipo GUI para a aceitao popular (BUTOW, 2007).

30

Em vez do usurio digitar comandos, ele pode usar o mouse para clicar nos cones e nos menus. A informao organizada como uma mesa de escritrio seus arquivos localizam-se em pastas, assim como os programas e outras informaes na tela. As interfaces do tipo GUI so normalmente baseadas em metforas, na qual os elementos visuais imitam alguma coisa da nossa experincia cotidiana. A metfora est presente no desktop25 do Windows, Mac OS e nas interfaces do Linux (BUTOW, 2007). O usurio pode iniciar os programas e manipular os objetos na tela usando o mouse, um dispositivo de hardware, movendo o ponteiro na tela para um objeto e executando uma ao, como clicar sobre ele ou arrast-lo para outro lugar. Estes objetos foram categorizados em quatro reas que, juntas, formam o acrnimo WIMP: janelas (Windows), cones (Icons), menus (Menus), e um cursor (Pointing device) (BUTOW, 2007). O cursor padro em muitas interfaces do tipo GUI o desenho de uma seta, porm, ele pode mudar seu desenho para alertar o usurio de que ele est realizando uma determinada tarefa, como editando um documento num processador de texto, ou indicando que o computador est ocupado com algum processamento intenso. Outra caracterstica marcante das interfaces GUI a personalizao da interface. Ao contrrio das interfaces TUI, que apenas permitem mudar alguns elementos como cores, as interfaces do tipo GUI permitem que seja alterado a aparncia e a posio de vrios elementos na tela, incluindo um "papel de parede", que uma imagem para o fundo do desktop, assim como cones e, no Windows, a posio da barra de tarefas (BUTOW, 2007). A interface do tipo, GUI do Windows e de outros sistemas operacionais, assim como Websites, oferecem "skins (mscaras) ou temas para a sua interface GUI. Skins e temas so templates26 que proporcionam uma aparncia personalizada para os elementos grficos da GUI, como, por exemplo, a interface do software multimdia Winamp.

25 26

rea de trabalho, no Windows e no Linux, e Mesa, no Mac OS. So esquemas com alteraes visuais prontas para serem instaladas em uma interface. No altera o funcionamento da mesma.

31

Figura 13: Dois skins do software Winamp (O autor, 2008)

3.5.3 Interface de botes Incluem as encontradas em MP3 Players e controle de videogame. Embora interfaces de botes tenham muitas das caractersticas das interfaces de toque, elas so mantidas em uma categoria separada, pois se precisa usar um perifrico de hardware para manipular os objetos na tela, em vez de se usar a tela propriamente dita (BUTOW, 2007). Interfaces de botes podem ter diferentes formas. Por exemplo: um iPod (marca de MP3 Player) possui um boto (Click Wheel) que permite o usurio navegar rapidamente atravs de uma lista para encontrar a msica ou vdeo para reproduzir. Interfaces de botes tambm podem ser combinadas com outras interfaces, tais como um joystick, para mover um objeto em um jogo (BUTOW, 2007). Uma variao da interface de botes a interface de telefone, na qual os botes sero sempre os do teclado numrico. O sistema detecta qual a tecla pressionada atravs do tom transmitido via linha telefnica. Este tipo comumente utilizado para selecionar o nmero de uma extenso ou departamento quando o usurio liga para uma empresa, como tambm para acessar a uma caixa postal de voice mail, gerenciado pela companhia telefnica. (BUTOW, 2007).

32

3.5.4 Interfaces de toque Esto se tornando populares em lugares como livrarias, caixas eletrnicos, em Tablet PCs27 e at mesmo em celulares. Interfaces de toque tambm so amplamente utilizadas com computadores pessoais portteis, tambm chamados de Personal Digital Assistants (PDAs) e Pocket PCs28. Algumas interfaces destes dispositivos usam uma pequena caneta stylus29, para que voc possa manipular os cones e outros objetos com mais preciso (BUTOW, 2007). 3.5.5 Interfaces tteis So aquelas que contam com a sensao de toque do usurio para dar o feedback30 sobre o que est acontecendo com o sistema. Este tipo de feedback utilizado em simuladores de maneira a criar mais precisamente o que acontece no mundo real. Por exemplo: simuladores de vo utilizam as interfaces tteis para informar ao usurio o que est acontecendo. Quando o piloto encontrar determinados tipos de situao na tela, o joystick ir fornecer a mesma quantidade de resistncia que o piloto teria numa experincia real desse tipo de situao (BUTOW, 2007). 3.6 INTERFACES DO FUTURO Vrios novos e interessantes tipos de interfaces esto atualmente sendo criados e pesquisados, como ser apresentado a seguir.

Tipo de computador porttil do tamanho de uma prancheta, em que o nico tipo de interao atravs da interface de toque. 28 Ambos os tipos so do tamanho de celulares, mais utilizados para o envio e recebimento de emails. 29 Artefato que imita o formato de uma caneta, somente por questo de preciso. 30 Uma palavra com sentido amplo, por isso evita-se de ser traduzida. Neste caso, significa retorno, resposta.

27

33

3.6.1 Interfaces de ateno Guiam a ateno dos usurios, orientando-os atravs de um processo e alertando-os sobre eventuais problemas, tais como uma ao incorreta do usurio, que ir impedir a aplicao de concluir a tarefa desejada (BUTOW, 2007). A idia principal da interface entender o que o usurio est tentando fazer, para que, assim, a interface reaja e guie o usurio. Por exemplo: a interface observar qualquer mudana na ateno visual, para saber onde o usurio est se concentrando. Ela poder mudar, por exemplo, o tamanho da fonte do texto que o usurio est lendo, ou trazer outras informaes sobre o assunto daquele determinado texto. 3.6.2 Interface de gestos Utiliza gestos manuais como entrada, como no filme Minority Report, em que os computadores do ano 2054 d.C. detectavam os gestos dos usurios, que poderiam mover as mos e os braos para manipular objetos no computador (BUTOW, 2007). 3.6.3 Interfaces reflexivas Um tipo de interface que utiliza inteligncia artificial, que aprende. Permitem que os usurios definam e controlem todo o sistema atravs da interface, como mudar o dialeto de comando para adequar s necessidades e expectativas do usurio (BUTOW, 2007). 3.6.4 Interfaces tangveis Do forma fsica s peas tangveis de informao. Por exemplo, a Marble Answering Machine, um prottipo de secretaria eletrnica, de Durrell Bishop (WIKIPEDIA, 2006 apud BUTOW, 2007). Ela tem uma esfera que representa uma mensagem gravada. Quando a esfera colocada no recipiente da mquina, ela reproduz a mensagem. O filme Minority Report utilizou um recurso semelhante, em que o

34

resultado da previso dos assassinatos no exibido na tela de um computador, mas sob a forma de uma esfera, na qual as informaes eram gravadas (BUTOW, 2007). 3.6.5 Interfaces de ampliao uma variao das interfaces GUI. As interfaces de ampliao receberam o acrnimo de ZUI, de zooming user interface. Uma ZUI representa os objetos em diferentes nveis de escala e detalhe. Enquanto o usurio faz uma panormica sobre uma rea de trabalho infinita, que consiste em vrios objetos em diversos nveis de detalhe, ele pode selecionar um objeto e ampli-lo para ler ou trabalhar com ele, e ento poder reduzi-lo novamente ao terminar (BUTOW, 2007). As interfaces do tipo ZUI no usam janelas; ao invs disso, usam grficos vetoriais31 para representar objetos. Um exemplo de interface do tipo ZUI o Google Maps, em que o usurio digita um endereo para que seja exibido no mapa, para ento ampli-lo e afast-lo como quiser. 3.6.6 Interface crebro-computador talvez a mais direta de todas as interfaces. A interface crebro-computador permite que o usurio interaja com o computador atravs do pensamento. Interfaces crebro-computador rudimentares j esto em desenvolvimento para permitir que seres humanos possam controlar um cursor na tela (BUTOW, 2007). Alguns desses projetos, ao invs de implantarem chips de computados no crebro, utilizam eletrodos conectados na cabea, de forma a no haver necessidade de se fazer uma cirurgia. As interfaces deste tipo podero ajudar usurios a superar a surdez e a cegueira no congnitas32 (BUTOW, 2007).

31 32

Grficos construdos matematicamente, que no distorcem conforme o nvel de ampliao. Caracterstica do indivduo desde o nascimento.

35

4 FUNDAMENTOS COGNITIVOS E SEMITICOSAs fabricas txteis produzem, por exemplo, camisas de vrios tamanhos, para que o usurio possa escolher qual o mais apropriado para seu uso. A fabricao dessas camisas ocorre de acordo com uma anlise de mercado que trar quais os tipos de camisas, cores e estampas sero melhores aceitos. O desenvolvimento de software tambm fornece produtos para usurios. Porm, muitas vezes, o software a ser desenvolvido ser nico, o que significa que no ter uma verso de acordo com alguma caracterstica do usurio, como a idade, por exemplo. Logo, se faz necessrio realizar um estudo para descobrir como ser a interface desse software e quais caractersticas sero importantes. Neste momento o projetista da interface necessita ter conhecimentos sobre os fundamentos cognitivos e semiticos, que sero tratados nos tpicos seguintes, para melhor adequar o sistema realidade e aos objetivos do usurio. Pois, como o terico de design Klaus Krippendorff destaca:[...] os artefatos no existem fora do envolvimento humano. Eles so construdos, compreendidos e reconhecidos quando usados pelas pessoas, que tm objetivos prprios. (KRIPPENDORFF, 2000)

4.1 ENGENHARIA COGNITIVA Uma das abordagens dominantes que tm caracterizado a IHC a de base cognitiva (PREECE et al., 1994). Essa base tem como razes reas de psicologia cognitiva, cincia cognitiva e inteligncia artificial, que estudam a cognio. Segundo Cybis et al. (2007), a cognio pode ser caracterizada pelo tratamento e produo de conhecimento de natureza simblica na forma de representaes mentais produzidas pelas pessoas a partir de suas experincias com a realidade. A idia bsica que modelos cognitivos que descrevem os processos e estruturas mentais (e.g. recordao, interpretao, planejamento e aprendizado) possam indicar quais os modelos de interao sero mais adequados para os usurios. Como estas abordagens adotam uma perspectiva centrada nos aspectos cognitivos do usurio, o design feito com base nelas chamado de design de sistemas centrado no usurio (User Centered System Design UCSD).

36

Uma das teorias mais conhecidas de design centrado no usurio a Engenharia Cognitiva (NORMAN, 1986 apud de SOUZA, 21 nov. 2008). Norman considera que o designer inicialmente cria o seu modelo mental do sistema, chamado modelo de design, com base nos modelos de usurio e tarefa. O modelo implementado deste modelo de design a imagem do sistema. O usurio ento interage com esta imagem do sistema e cria seu modelo mental da aplicao, chamado de modelo de uso. Este modelo mental que permite ao usurio formular suas intenes e objetivos em termos de comandos e funes do sistema. A figura 14 mostra o processo de design na abordagem da Engenharia Cognitiva.

Figura 14: Modelo de interao da Engenharia Cognitiva Adaptada (de SOUZA et al., 1999)

Segundo a Engenharia Cognitiva, a meta do designer desenvolver um sistema que possibilite ao usurio, durante a interao com o sistema, a criao de um modelo mental consistente com o modelo projetado pelo designer. Para que isso seja possvel, Norman (1986 apud de SOUZA, 21 nov. 2008) diz que o designer precisa entender o processo pelo qual o usurio interage com a interface do sistema e prope a teoria da ao. A teoria da ao (Norman, 1986 apud de SOUZA, 21 nov. 2008) define que a interao usurio-sistema desempenhada num ciclo-de-ao com seis etapas, dividida em duas partes: a) a primeira a parte da execuo, que envolve as etapas de formulao da inteno, especificao da seqncia de aes e atividade fsica de execuo;

37

b) a segunda a parte da avaliao, que composta pelas etapas de percepo, interpretao e avaliao da meta.

Figura 15: Etapas de ao do usurio durante a interao com o sistema Adaptada (de SOUZA et al., 1999)

Para que o usurio possa alcanar o seu objetivo ao utilizar o sistema, ele dever formular metas a serem alcanadas, atravs da interao oferecida pelo sistema. Na seqncia o usurio necessita definir as aes a serem executadas para que ele atinja o seu objetivo. At o momento, o usurio realizou a preparao mental para a execuo dos passos at o objetivo, faltando a ele executar o que foi mentalizado atravs de uma ao fsica (de SOUZA et al., 1999). Estas trs fases compreendem a travessia do golfo de execuo, e no precisam ser necessariamente realizadas na seqncia descrita. Por exemplo, a especificao e o planejamento podem ser realizados intercaladamente ou pode-se comear a executar o comando sem que se tenha ainda especificado todas as aes por completo (de SOUZA et al., 1999). Assim que o sistema executa a ao definida pelo usurio inicia-se o golfo de avaliao. A primeira etapa da travessia deste golfo a percepo do usurio do novo estado em que o sistema se encontra. O usurio ento interpreta este novo estado e o avalia de acordo com a sua meta inicial. Com base nesta avaliao o usurio prossegue para definir sua prxima ao. importante notar que, se o usurio no perceber que o sistema mudou de estado atravs de uma sinalizao

38

clara, ele possivelmente interpretar que nada ocorreu e que a sua meta inicial no foi atingida (de SOUZA et al., 1999). O designer tem como objetivo ajudar o usurio a concluir as suas partes, tornando-as mais fceis. Para isso ele necessita definir quais so as aes e estruturas mais adequadas para comandar as funes do sistema, escolher os elementos de interface que melhor comunicam a informao desejada, fazer com que o sistema retorne informaes (feedbacks) significativas, dentre outras escolhas de design. Desta forma, se a interface construda pelo designer estiver mais prxima da tarefa e das necessidades do usurio, menos esforo cognitivo o usurio ter que fazer para atingir seus objetivos (de SOUZA et al., 1999). Abaixo uma ilustrao exemplificando a teoria da ao:

Figura 16: Exemplo da teoria da ao Adaptada (de SOUZA et al., 1999)

A cognio formada por processos que se relacionam. Quando o designer est projetando o sistema ele deve pensar quais destes processos cognitivos sero estimulados. 4.1.1 Percepo De acordo com Cybis et al. (2007), a percepo humana delimitada por um conjunto de estruturas e tratamentos cognitivos pelos quais organizam e do significado s sensaes produzidas por seus rgos perceptivos a partir dos

39

eventos que lhes estimulam. Cybis et al. (2007), ainda subdivide esses tratamentos em trs subnveis: a) b) processos neurofisiolgicos ou de deteco: tm por objetivo reagir existncia de um estmulo que gere uma sensao; processos perceptivos ou de discriminao: visam organizar e classificar as sensaes. Tal funo s possvel se anteriormente houver a deteco e se j existirem categorias memorizadas; c) processos cognitivos ou de interpretao: visam dar significado s informaes. Essa funo s possvel se existirem conhecimentos e se houver informao sobre as condies de contexto no qual a percepo realizada. O ser humano pode identificar o estmulo da interface utilizando trs tipos de percepo: percepo visual; percepo auditiva; percepo da linguagem. Percepo visual A primeira diferenciao feita ao utilizar essa percepo a de figura e fundo. As pessoas percebem o fundo como mais uniforme, e a figura como uma forma particular e parecendo estar mais prxima do observador (CYBIS, 2007). possvel notar o quo difcil pode se tornar a percepo de uma figura se a diferenciao da figura com o fundo no estiver clara, como pode ser observado na figura 17:

Figura 17: Exemplo de imagem que no oferece uma boa distino visual (O autor, 2008)

40

Para identificar o nome da pgina Web da ltima aba do Firefox (figura 17), precisamos ter maior ateno e focalizar melhor (percepo visual) o local onde est descrito o nome do site. Logo se v como os processos cognitivos se relacionam e tambm notvel que quanto mais processos forem necessrios mais tempo ser despendido. Portanto, o designer dever buscar estimular de maneira eficiente o usurio, tentando diminuir o nmero de processos a serem usados durante a interao com o sistema. Percepo auditiva A percepo auditiva envolve a recepo e a interpretao de estmulos sonoros atravs da audio, transformando sinal acstico em informao til. A sua identificao se baseia no confronto entre as caractersticas do sinal acstico com aqueles sons que as pessoas j possuem em sua memria, dentro de uma condio de contexto (CYBIS, 2007). Percepo da linguagem A percepo da linguagem se d em dois nveis: linguagem falada e linguagem escrita. A primeira envolve inicialmente a ao de um filtro fontico, destinado a isolar as unidades silbicas pertencentes aos idiomas dominados pelos indivduos. Uma seqncia de processos de agrupamento e decodificao sucessivos ento realizada sobre essas unidades silbicas (CYBIS et al., 2007). J na percepo da linguagem escrita tais processos so disparados, aps a identificao de um lexema33 de uma palavra conhecida das pessoas. Cybis et al. (2007) informa em seu livro que pesquisas sugerem a existncia de um mecanismo de inferncia que ativa um conjunto de palavras e de significados a elas associados, medida que os primeiros elementos da mensagem e de seu contexto sejam identificados. Esse conjunto contm palavras conhecidas das pessoas e que provavelmente (por inferncia) faam parte do resto da mensagem. Tais pesquisas explicam o porqu das pessoas compreenderem

33

Em portugus, lexema um conjunto de palavras de mesma classe morfolgica que se distribuem de forma complementar e diferem morfologicamente entre si unicamente por sufixos flexivos. Exemplo: as palavras bonito, bonita, bonitos, bonito e bonitinha pertencem a um mesmo lexema.

41

rapidamente e entenderem o que esperam entender de uma mensagem, em vez do que ela expressa efetivamente. 4.1.2 Ateno A ateno envolve a focalizao ou a concentrao dos processos cognitivos sobre um determinado objeto ou pensamento. Neste particular, necessrio saber quais so as condies que favorecem ou prejudicam o desempenho humano quando existem vrios estmulos semelhantes e se quer focalizar a ateno em um estmulo, ou, ao contrrio, quando se quer dividir a ateno entre dois ou mais estmulos (CYBIS et al., 2007). Exemplo da primeira situao ocorre na Internet durante a tentativa de leitura de um determinado texto e os banners de propaganda acabam prejudicando a concentrao, por serem coloridos e no pararem de piscar. J a segunda situao acontece quando o usurio est lendo um e-mail e, por cima, ocorre a passagem de notcias (por meio da tecnologia de RSS34). Nesse caso, o usurio quer ler o texto sem perder as notcias, que passam em intervalos de tempo. Outra interessante pesquisa feita por Cybis et al. (2007) que ambas as situaes apresentadas acima so favorecidas quando os estmulos que devem ser tratados em paralelo so de modalidades diferentes (verbal, visual, sonoro etc.). O que explica o hbito, muito freqente nos jovens, de ler um livro (verbal) e ouvir uma msica (sonoro) ao mesmo tempo. 4.1.3 Vigilncia A vigilncia envolve a estratgia de economia que consiste na

desconsiderao de eventos sem pertinncia para a situao. A percepo ser mais rpida e efetiva se a pessoa no precisar prestar ateno a todos os eventos e seus detalhes (CYBIS et al., 2007). Por outro lado, tal comportamento pode induzir as pessoas a erros como: o no tratamento de eventos pertinentes, ou o tratamento de um evento como sendo outro. Por exemplo: um usurio j acostumado com o preenchimento de cadastrosA tecnologia RSS permite aos usurios da internet se inscrever em sites que fornecem "feeds" (alimentadores ou fontes) de notcias, ou seja, oferece atualizao constante de informaes.34

42

pode colocar a data de seu nascimento sem as barras (/), porm, determinado cadastro pode exigir a colocao delas. Para ser evitado tal erro necessrio que o sistema informe, ao lado do campo da data do nascimento, a informao do formato da data correto. 4.1.4 Memria A memria o local onde ficam armazenadas as informaes, aps terem sido percebidas, identificadas e compreendidas. Cybis et al. (2007) dividi a memria em trs tipos: memria sensorial; memria de trabalho; memria permanente. Memria sensorial Somos bombardeados com uma enorme quantidade de informao o tempo todo, essa informao fica armazenada em registros sensoriais de memria altamente volteis. Nesta fase de percepo, muito mais rpido tratar apenas as caractersticas distintas da informao (cor, tamanho, localizao) do que a informao como um todo (CYBIS et al., 2007). Memria de trabalho Segundo Cybis et al. (2007), a memria de trabalho modelada como um sistema composto de diversos registros especializados e de um executor central. Existem registros identificados para a informao sonora, para a informao visualespacial e para a informao verbal-auditiva, cada um com capacidade, volatilidade e acessibilidade diferentes. A recuperao da informao na memria de trabalho extremamente rpida e fcil, mas, se no for acessada diversas vezes, ser esquecida em poucos segundos, dependendo das condies de distrao e interferncia do contexto.

43

Memria permanente Toda informao que reativada diversas vezes na memria de trabalho, seja para ser analisada ou simplesmente decorada, gravada em uma estrutura da memria chamada memria permanente. Esta no pode ser apagada com o tempo, mas o acesso a ela pode ser perdido (CYBIS et al., 2007). Seria como ter um determinado captulo do livro fora do ndice, sendo que sempre seria necessrio consultar esse ndice para lembrar. na memria permanente que os modelos mentais relativos a conceitos, procedimento e estruturas so guardados. De acordo com Cybis et al. (2007), os projetistas de IHC devem investir na organizao, categorizao, diferenciao e discriminao das informaes apresentadas nas interfaces para favorecer o processo de busca de conhecimento, que se d pelo confronto entre ndices de busca e as caractersticas dos conhecimentos estocados. Segundo Cybis et al. (2007), os tratamentos de recuperao de informaes alocadas na memria permanente so mais lentos e custosos e podem ser classificados em: Lembrana: a capacidade humana de recuperar, de forma integral, uma situao anteriormente vivenciada, sem a presena de qualquer um dos elementos dessa situao (por exemplo, lembrar-se da sintaxe correta de comandos a serem entrados em uma linha de comando). Reconhecimento: a capacidade humana de reencontrar no seu campo perceptivos elementos anteriormente memorizados (por exemplo, reconhecer no contexto da interface o nome de uma opo de menu aps algum tempo sem v-la). 4.2 ENGENHARIA SEMITICA As abordagens semiticas tm como base terica a semitica, disciplina que estuda os signos, os sistemas semiticos e de comunicao, bem como os processos envolvidos na produo e interpretao de signos. Um signo algo que representa alguma coisa para algum (PEIRCE, 1931 apud de SOUZA, 21 nov. 2008).

44

A civilizao humana depende dos sinais e dos sistemas de sinais; a inteligncia humana inseparvel do funcionamento dos sinais. (MORRIS, 1976).

Um dos grandes diferenciais para a melhoria da usabilidade, que pode ser notada durante a evoluo das interfaces, apresentadas no captulo 3, foi o incio da utilizao de sinais. Hoje no conseguimos imaginar uma interface sem fazer uso de sinais, que na maioria das vezes so representados por cones. Para que a comunicao entre duas pessoas acontea, preciso que o emissor da mensagem a expresse em um cdigo que tanto ele quanto o receptor conheam. Cada mensagem pode ser formada por um ou mais sinais. Assim que o receptor recebe a mensagem, ele gera uma idia daquilo que o emissor quis dizer e inicia o processo de compreenso (JAKOBSON, 1970 apud de SOUZA, 21 nov. 2008). Na utilizao desses cones o designer dever lembrar que ele tem que ser compatvel com o mundo real. Um exemplo o cone do Meu Computador (atalho para as unidades de disco do computador), que representador pela figura de um computador. De acordo com o GNOME Human Interface Guidelines 2.2 (LIBRARY GNOME, 21 de nov. 2008), os cones devem ser sugestivos com a funcionalidade que esto associados. O melhor cone ir sugerir ao usurio a principal finalidade do programa ou operao sem ter que ler o texto acompanhante. Os usurios reconhecem funcionalmente os cones sugestivos mais rapidamente do que outros, devido a eles estarem diretamente associados com o objeto fsico ou com a ao. Outro aspecto interessante nos cones que em alguns sistemas eles podem ser customizados, fornecendo controle e liberdade para o usurio. Neste caso, o usurio poder modificar a interface de acordo com a sua necessidade e vontade. A figura 18 ilustra os cones do ambiente desktop Gnome, utilizado em distribuies do sistema operacional Linux:

45

Figura 18: cones do Gnome (O autor, 2008)

Na abordagem da Engenharia Semitica, o designer o autor de uma mensagem ao usurio, que transmitida pela interao que caracteriza o processo meta-comunicativo35. Assim, o design de interfaces envolve no apenas a concepo do modelo da aplicao, mas a como ser feita a comunicao com o usurio para a transmisso da informao. A Engenharia Semitica ressalta ainda que a presena do designer no cenrio comunicativo deve ser explicitada e tornada sensvel para os usurios. O objetivo fazer com que eles tenham maior chance de entender as decises de design tomadas e a aplicao com que esto interagindo, sendo assim capazes de fazer um uso mais criativo e eficiente desta aplicao (de SOUZA et al., 1999). 4.3 CONSIDERAES FINAIS As duas abordagens apresentadas neste captulo destacam a importncia de o designer elaborar um modelo mental da aplicao tendo como foco o usurio. Devido criao da interface e a interao do usurio serem assncronas36, o designer dever ter um conhecimento prvio sobre as expectativas dos usurios quanto ao sistema.

35 36

Processo metalingstico, ou seja, que comunica comunicao. Ocorrer em momentos diferentes de tempo.

46

A Engenharia Cognitiva pode ser utilizada no planejamento da interface, onde ocorre a definio de quais sero as caractersticas que formaram o escopo da interface, tendo em vista, o bem-estar do usurio. Enquanto a Engenharia Semitica acontece tambm durante o planejamento, porm aps o estabelecimento do escopo da interface, para fornecer meios de como alcanar tais caractersticas definidas no escopo da interface. Desta maneira, uma complementar a outra, no havendo necessidade de buscar contrapor as suas idias e princpios. O designer que dever avaliar quais das teorias podem ser colocadas em prtica, e que se ajustam melhor ao projeto em questo. importante lembrar que, muitas vezes, o usurio no percebe que a aplicao a criao de outra pessoa, que pode ter cometido equvocos, e transfere a dificuldade do uso para ele mesmo, como se a culpa fosse sua e no do designer. Tornando a interao com o sistema um processo frustrante. Para evitar tal situao, preciso buscar desenvolver sistemas com o foco no usurio e sempre que possvel fornecer prottipos, para que os usurios possam avaliar. Assim, com os dados obtidos na avaliao, o designer ter conhecimento se a interface est ou no atingindo as expectativas do usurio e, caso no esteja, ele poder implementar correes e melhorias.

47

5 PRINCPIOS E PRTICAS PARA SE OBTER MELHORES INTERFACESNeste captulo, sero abordados os princpios e heursticas de usabilidade (para avaliao de uma interface), bem como prticas para a concepo, anlise e teste das interfaces. 5.1 PRINCPIOS DE USABILIDADE Os princpios de usabilidade funcionam como metas para os projetos de interface. Dentro destes princpios, esto as heursticas e os objetivos da usabilidade (NIELSEN, 1993 apud BORDIGNON, 2004). As heursticas so formas de se saber, em uma interface concluda, se ela tem uma boa usabilidade, e os objetivos so metas que devem ser buscadas durante o desenvolvimento da interface(NIELSEN, 1993 apud BORDIGNON, 2004). 5.1.1 Heurstica Esta tcnica baseia-se na avaliao da interface utilizando heursticas de usabilidade. Inicialmente, o mtodo, desenvolvido por Jakob Nielsen (1993 apud BORDIGNON, 2004), foi proposto para fazer parte do design de uma aplicao, mas tambm serve como forma de avaliao. As heursticas so as seguintes: 1. Visibilidade do Status do Sistema: O sistema precisa manter os usurios informados sobre o que est acontecendo, fornecendo um retorno adequado dentro de um tempo razovel. 2. Compatibilidade de um sistema com o mundo real: O sistema precisa falar a linguagem do usurio, com palavras, frases e conceitos familiares ao usurio, ao invs de termos orientados ao sistema. Seguir convenes do mundo real, fazendo com que a informao aparea numa ordem natural e lgica.

48

3. Controle do usurio e liberdade: Usurios freqentemente escolhem por engano funes do sistema e precisam ter claras sadas de emergncia para sair do estado indesejado sem ter que percorrer um extenso dilogo. Prover funes desfazer e refazer. 4. Consistncia e padres: Usurios no precisam adivinhar que diferentes palavras, situaes ou aes significam a mesma coisa. Seguir convenes de plataformas computacionais. 5. Preveno de erros: Melhor que uma boa mensagem de erro um design cuidadoso o qual previne o erro antes dele acontecer. 6. Reconhecimento ao invs de relembrana: Tornar objetos, aes e opes visveis. O usurio no deve ter que lembra informao de uma para outra parte do dilogo. Instrues para uso do sistema devem estar visveis e facilmente recuperveis quando necessrio. 7. Flexibilidade e eficincia de uso: Usurios tornam-se peritos com o uso. Prover aceleradores de forma a aumentar a velocidade de interao. Permitir aos usurios experientes cortar caminho em aes freqentes. 8. Esttica e design minimalista: Dilogos no devem ter informao irrelevante ou raramente necessria. Qualquer unidade de informao extra no dilogo ir competir com unidades relevantes de informao e diminuir a visibilidade relativa. 9. Ajudar os usurios a reconhecer, diagnosticar e corrigir erros: Mensagens de erros devem ser expressas em linguagem clara (sem cdigos) indicando precisamente o problema e construtivamente sugerindo uma soluo. 10. Ajuda e documentao: Embora seja melhor um sistema que possa ser usado sem documentao, necessrio prover help e documentao. Essas informaes devem ser fceis de encontrar, focalizadas na tarefa do usurio e no muito extensas. Junto lista de heursticas, deve ser associado um grau de severidade, para se analisar a gravidade do problema e a necessidade de correo, descritos na tabela a seguir (NIELSEN, 1993 apud BORDIGNON, 2004):

49

Tabela 1: Nveis de severidade do problema Severidade 1 2 3 4 5 Descrio Eu no concordo que isso seja um problema de usabilidade. um problema cosmtico somente precisa ser corrigido somente se sobrar algum tempo. Problema de usabilidade menor corrigi-lo deve ter prioridade baixa. Problema de usabilidade grave importante corrigi-lo, deve ter alta prioridade. Catstrofe de usabilidade a sua correo imperativa antes de o produto ser liberado. (NIELSEN, 1993 apud BORDIGNON, 2004) 5.1.2 Objetivos Os objetivos so metas a serem alcanadas por uma interface com boa usabilidade, (PREECE, 2002 apud VALENTE, 2004) e so: 1. Uso efetivo (effectiveness): faz o que tem que fazer? Auxilia a realizar o desejado? 2. Uso eficiente (efficiency): quo rpido pode ser feito? Quantas etapas requer? 3. Uso seguro (safety): protege o usurio de danos e frustraes. Em situaes potencialmente danosas, aumenta o nvel de alerta; previne o erro e se, mesmo assim, ele ocorrer, permite recuperao. 4. Ter boa utilidade (utility): prov ferramentas poderosas; similar ao uso efetivo. 5. Fcil de aprender (learnability): quo fcil aprender a utilizar o sistema? 6. Fcil de recordar como se usa (memorability): quo fcil recordar como o sistema funciona aps ter aprendido uma vez?

50

5.2 CONCEPO E ANLISE DAS INTERFACES Nesta seo, sero apresentadas as tcnicas para gerao e organizao das idias sobre informaes e componentes das interfaces, tcnicas para se conceber rapidamente os aspectos essenciais das mesmas e as abordagens metodolgicas para se modelar a estrutura, o contedo e o comportamento das futuras interfaces. 5.2.1 Tcnicas de gerao e organizao de idias 5.2.1.1 Brainstorming (Tempestade de Idias) O brainstorming consiste em reunies destinadas para estimular a gerao de idias. Nestas reunies, o foco na resoluo de um problema ou no aproveitamento de uma oportunidade. A vantagem do brainstorming so as discusses que ocorrem, estimulando a compreenso tanto do problema como da soluo (CYBIS et al., 2007). 5.2.1.2 Card sorting (arranjo de cartas) A tcnica do card sorting utilizada para descobrir o modelo mental que os usurios elaboram para um conjunto de itens e informaes relacionados ao software. O analista espalha as cartas, cada uma com um item de informao, sobre a mesa, para que um usurio agrupe-os conforme sua perspectiva. Para esta tcnica, basta que sejam feitas seis sesses com os usurios. Depois, o analista pode juntar e analisar os dados estatisticamente (CYBIS et al., 2007). Primeiro, deve-se identificar os itens de informao. Depois, estes itens devem ser descritos em fichas ou cartes de papel, numerados no verso. Os colaboradores devem ser escolhidos entre o pblico alvo do sistema. A reunio inicia com o facilitador (pessoa que ir orientar a reunio) espalhando as cartas sobre a mesa. Nenhum participante deve receber, em hiptese alguma, as cartas organizadas pelo participante anterior.

51

O participante, ento, orientado a formar pilhas de cartas conforme seu critrio ou segundo critrio predefinido. Em ambos os casos, o facilitador pode dizer quantas categorias so esperadas.

Figura 19: Exemplo de card sorting (CYBIS et al., 2007)

necessrio que o facilitador informe ao participante que podero sobrar cartas sem grupamento definido. Porm, o facilitador deve recomendar ao participante que todas as cartas faam parte de uma categoria. O facilitador deve tambm pedir ao participante que indique o nome das categorias e suas associaes. A reunio deve ser registrada com anotaes e, se possvel, com fotografias. Normalmente, a anlise dos resultados simples, porm, pode existir a necessidade de se fazer uma anlise estatstica (CYBIS et al., 2007). 5.2.1.3 Diagramas de afinidade Os diagramas de afinidade so semelhantes ao card sorting, com a diferena de que tcnicos, projetistas e representantes de usurios trabalham juntos na concepo e organizao dos grupos de itens.

Figura 20: Exemplo de diagrama de afinidade (CYBIS et al., 2007)

52

Durante a reunio, o facilitador deve garantir que todos os participantes dem sua opinio. Os participantes tm a liberdade de encaixar as cartas nos grupos existentes ou criar novos grupos. O resultado do diagrama de afinidade deve sair quando houver consenso entre projetistas e usurios (CYBIS et al., 2007). 5.2.2 Tcnicas de Concepo 5.2.2.1 Storyboard (narrativa grfica) Storyboard uma representao das interaes feitas entre os usurios e o sistema. O storyboard detalha um caso de uso determinado do sistema, detalhando no s as mudanas de tela, como tambm o contexto (usurio, equipamentos etc.) (CYBIS et al., 2007). Os storyboards devem ser feitos em grandes folhas de papel para que sejam vistos numa reunio tanto pelos usurios, para serem avaliados, quanto pelos projetistas.

Figura 21: Exemplo de storyboard (CYBIS et al., 2007)

Durante as reunies, os projetistas devem descrever o storyboard, para que os usurios e outras pessoas envolvidas no projeto opinem. Estas observaes podem ser anotadas e anexadas s figuras do storyboard (CYBIS et al., 2007).

53

5.2.2.2 Maquetes (prottipos em papel) Maquetes so usadas para esclarecer e desenvolver aspectos especficos da interface. As maquetes permitem uma simulao de maneira rpida e barata, permitindo que sejam descobertos possveis erros de usabilidade, sem a necessidade de qualquer programao.

Figura 22: Exemplo de maquete (CYBIS et al., 2007)

A prpria natureza precria das maquetes permite uma comunicao intensa entre desenvolvedores e usurios. A implementao desta tcnica feita em reunies com a presena de desenvolvedores, usurios, um facilitador e uma pessoa para fazer as anotaes. O ciclo das maquetes est organizado em quatro etapas (CYBIS et al., 2007): a) definio de conceito: o processo inicia com um brainstorming, em que as especificaes sero transformadas em desenhos de telas e um mapa do fluxo das tarefas (somente as principais, desconsiderando excees); b) projeto da interao: esta etapa integra a tcnica de diagrama de afinidades para definir as interaes. Ser necessrio organizar reunies com os usurios e projetistas, buscando um consenso sobre as seguintes atividades: definir o nome de cada tela sugerida e de cada tarefa especificada em cartes adesivos; criar cartes para as telas; grudar os cartes adesivos representando as telas na parede de modo a formar grupos associados a cada tarefa;

54

documentar a seqncia em que as telas sero acessadas durante a realizao das tarefas; reorganizar a seqncia de telas (suprimindo ou adicionando telas) de modo a simplificar a realizao das tarefas; c) projeto e teste das telas: esta etapa envolve o desenho propriamente dito das telas em papel de acordo com as telas identificadas da etapa anterior. Os desenhos podem ser associados a cartes com as descries das tarefas com as quais a tela est envolvida. Nesse momento, possvel construir e testar diferentes maquetes aplicando um mesmo modelo conceitual. Para que a maquete seja validada, o projetista deve fazer uma reunio semelhante de storyboard. O processo deve ser o seguinte (CYBIS et al., 2007): grudar as telas em papel na parede conforme os grupos definidos na etapa de projeto da interao; pedir aos usurios para interagir com as telas de modo a simular a realizao das tarefas (baseados nos cenrios); a cada vez que o usurio realizar uma ao, o projetista explicar a reao da interface e indicar a prxima tela ativa (sem dar dicas). Para representar as interaes que ocorrem dentro de uma mesma tela, ser necessria a criao de cartes que representem painis pop-up (menus e listas de seleo) e caixas de dilogo. Por meio das reaes dos usurios, o projetista tem a oportunidade de conhecer suas estratgias e tambm seus erros. A ajuda de um especialista tambm interessante, pois ele pode dar sugestes interessantes para sua reviso. 5.2.2.3 Prototipagem rpida A prototipagem rpida a criao de softwares que simulem o funcionamento do sistema final atravs da interface. Os prottipos permitem que os usurios operem de fato o futuro sistema, proporcionando a oportunidade para que o

55

projetista tenha uma avaliao mais fiel sobre as vantagens e desvantagens da interface em questo (CYBIS et al., 2007). H dois tipos de prototipagem: - prottipos de baixa fidelidade; - prottipos de alta fidelidade. a) prottipos de baixa fidelidade Prottipos de baixa fidelidade nada mais so do que maquetes

informatizadas. A sua criao depende de se ter uma ferramenta com recursos adequados, alm de intuitiva. Esta ferramenta no pode se tornar um obstculo livre expresso dos projetistas e nem comunicao da equipe (CYBIS et al., 2007). Prottipos de baixa fidelidade podem ser criados com ferramentas como o ToolBook, para PC, o HyperCard, para Mac, e at mesmo em PowerPoint(CYBIS et al., 2007). A vantagem dos prottipos de baixa fidelidade que a simulao de interao, realizada pelos usurios, ser mais realista do que a da maquete, porm, ainda sero precrias, visto que no representam o sistema de fato, alm de permitir um contedo mais limitado(CYBIS et al., 2007). b) prottipo de alta fidelidade Este tipo de prottipo usa ferramentas que permitem a criao de um prottipo de interface mais fiel ao sistema e contedo final. Este tipo de prottipo permite uma melhor anlise da usabilidade, de forma a saber se o prottipo se aproxima ou no das especificaes. Com isto, fica mais fcil de fazer alteraes em caso de necessidade. Esta tcnica exige disponibilidade de tempo, ferramenta e, talvez, de um profissional especializado para oper-la (CYBIS et al., 2007). Um prottipo deve somente ser usado para levantar aspectos da interface, para depois ser descartado. Se isso no for levado em considerao, haver muita perda de tempo na construo do prottipo, fazendo com que componentes de prottipo fiquem na verso oficial do sistema, devido pressa. Uma outra forma de prototipagem de alta fidelidade uma construo de sistema evolutiva, ou seja, em cada etapa ser usado o prottipo anterior e, junto a

56

isso, dever ser feita a programao propriamente dita do sistema, sempre aproveitando a verso anterior. Atualmente, com as novas verses de IDE37, tornase muito mais fcil de criar um sistema com uma construo dessas, em que o prottipo se tornar o sistema definitivo (CYBIS et al., 2007). 5.2.3 Usage-centered design projeto de IHC centrado no uso O tipo de projeto proposto por Constantine e Lockwood (apud CYBIS et al., 2007) prioriza a utilizao e o desempenho do usurio no sistema. Nesta abordagem, as decises so baseadas no uso do sistema, como modelos de usurios, de tarefas, de contedos e de interfaces. O projeto de IHC centrado no uso dividido em trs partes: - papis de usurios; - casos de tarefas; - arquitetura de interface e de navegao. a) papis de usurio Papel de usurio um perfil que estabelece as necessidades, interesses, expectativas, comportamentos ou responsabilidades especficas de um determinado usurio em relao ao sistema. Cybis et al. (2007) cita um exemplo: Em um website de comrcio o usurio pode ser um consumidor adulto e apressado. Este se distingue, por exemplo, o papel do consumidor jovem e sem pressa . Estes perfis de usurios devem estar bem documentados no incio do projeto, para que os projetistas tenham em mos as necessidades especficas no que diz respeito a informaes e funes do programa. Cybis et al. (2007) diz que um papel pode ser desempenhado por mais de um usurio real, e um nico usurio pode assumir mais de um papel. Cada papel descrito pelas condies tpicas do contexto em que se est inserido, pelas caractersticas tpicas o desempenho da tarefa, e por critrios para a satisfao dessas pessoas em relao a sua interao com o sistema.

Programa de computador que rene caractersticas e ferramentas de apoio ao desenvolvimento de software com o objetivo de agilizar o processo.

37

57

Figura 23: Exemplo de um papel de usurio (CYBIS et al., 2007)

Os papis esto relacionados entre si, e este relacionamento deve ser desenhado em um mapa estruturado com todos os papis definidos. Os papis principais em relao ao sistema, como por quantidade de usurio ou por responsabilidade perante os negcios, devem ser identificados como papis focais, e sobre eles os projetistas devem dar ateno especial (CYBIS et al., 2007). b) casos de tarefa Casos de tarefas so narrativas estruturadas e simples (livres de detalhes) da interao realizada pelo usurio (papel de usurio) em relao ao sistema. Junto elas, podero estar associados casos de uso. Os casos de tarefas devem ser escritos em linguagem direta, e contm as seqncias de intenes dos usurios e responsabilidades do sistema (CYBIS et al., 2007).

Figura 24: Exemplo de um caso de tarefa (CYBIS et al., 2007)

58

Nos mapas estruturados de casos de tarefas, h quatro tipos de relacionamentos para os casos de tarefas: especializao, extenso, composio e afinidade (CYBIS et al., 2007). Na especializao, as tarefas so do mesmo tipo, porm, as tarefas especializadas so descritas com base em outra, mais genrica, detalhando uma ao mais especfica.

Figura 25: Exemplo de especializao (CYBIS et al., 2007)

Na extenso, apresentada uma tarefa alternativa e opcional, que nem sempre realizada quando o caso de tarefa se instala.

Figura 26: Exemplo de extenso (CYBIS et al., 2007)

Na composio, as subtarefas devem ser obrigatoriamente realizadas para que a supertarefa seja concluda, pois estas representam componentes de um mesmo caso.

59

Figura 27: Exemplo de composio (CYBIS et al., 2007)

Na afinidade, a relao entre dois casos no clara, porm o projetista sabe que eles se parecem de alguma forma. Neste caso, o projetista deve marcar o relacionamento, para uma especificao futura, quando as informaes estiverem mais claras.

Figura 28: Exemplo de afinidade (CYBIS et al., 2007)

necessrio, antes de encerrar o diagrama, que o projetista indique os casos focais, nos quais se deve depositar mais ateno. Para isso, basta que estes casos sejam marcados como elipses com bordas duplas (CYBIS et al., 2007). c) estrutura de contedos da interface A estrutura de contedos um diagrama que contm contextos de interao interligados por um modelo de navegao (CYBIS et al., 2007). - modelo de contextos de interao Os modelos de contextos de interao so feitos com base em espaos, onde estar as ferramentas e matrias necessrios para a interao do usurio num

60

determinado caso de tarefa. As regras gerais de mapeamento so (CYBIS et al., 2007): a) os casos de tarefa correspondem a espaos e trabalho; b) as ferramentas representam as funes que processam dados e informaes; c) os materiais representam esses dados e informaes. As descries devem ser feitas com base em componentes abstratos, para que as maquetes as utilizem. Cybis et al. (2007) exemplifica as escolhas de um componente abstrato da seguinte maneira: um seletor exclusivo em vez de um boto de radio (radio button). O processo se inicia com a definio de um contexto de interao para cada caso e tarefa. Porm, para casos de tarefas parecidos, pode-se usar um mesmo contexto de interao. Na prxima etapa, o projetista deve analisar as narrativas linha a linha de forma a identificar as ferramentas e os materiais necessrios para a realizao da tarefa. Primeiro o projetista deve identificar os materiais necessrios, para, depois de revisar os casos de tarefa, buscar as ferramentas necessrias. Constantine e Lockwood (apud CYBIS et al., 2007) propem que as definies sejam registradas em cartes adesivos, de cores e tamanhos diferentes, d