• Nenhum resultado encontrado

IP! informação profissional pela internet

N/A
N/A
Protected

Academic year: 2021

Share "IP! informação profissional pela internet"

Copied!
88
0
0

Texto

(1)

U N I V E R S I D A D E F E D E R A L DE S A N T A C A T A R IN A PROGRAM A DE P Ó S - G R A D U A Ç Ã O EM E N G E N H A R IA DE

P R O D U Ç Ã O

ÍP! Informação Profissional pela Internet

por

Marcelo dos Santos

Dissertação subm etida à U niversidade Federal de Santa Catarina para a obtenção do título de Mestre em Engenharia de Produção

Orientador:

Prof. Francisco Antônio Pereira Fialho, Dr.

Co-Orientador:

Prof. Dulce Helena Penna Soares, D ra.

(2)

- informação Profissional pela

Internet

Nome:

Marcelo dos Santos

Área de Concentração:

M ídia e Conhecimento

Orientador:

p ro f. Francisco Antpnio Pereira Fialjio, Dr.

Co-Orientador:

Prof. Dulce Helena Penna Soares, Dra.

(3)

IP ! - In fo rm açã o P ro fis s io n a l pela In te rn e t

Nome: Marcelo dos Santos

E s t a D i s s e r t a ç ã o f o i j u l g a d a a d e q u a d a p a r a a o b t e n ç ã o do t í t u l o de M e s t r e e m E n g e n h a r i a , e s p e c i a l i d a d e e m E n g e n h a r i a d e P r o d u ç ã o , e a p r o v a d a e m s u a f o r m a f i n a l p e l o P r o g r a m a de P ó s - G r a d u a ç ã o e m E n g e n h a r i a de P r o d u ç ã o da U n i v e r s i d a d e F e d e r a l de S a n t a C a t a r i n a , e m m a r ç o d e 2 0 0 0 .

Prof. Ricardo Miran

4

a/Barcia, Ph.D. Coordenador do Gtrfso de Pós-Graduação' em Engenharia de Produção

Banca Examinadora:

(4)

Dedicatória

V

^ o jKjQj ^ Q J o o u M L o J ji, a , ^ a / r u u / r u ij

(5)

A g ra d e c i m e n t o s

Agradeço inicialm ente ao amigo, professor e orientador, Francisco Antônio Pereira Fialho pela ajuda neste tempo de amadurecimento.

A professora Dulce Helena Soares, co-orientadora, que ajudou em momentos difíceis, com compreensão e força para a continuação da caminhada.

Ao professor Emilio Takase que me inspirou ao propor uma disciplina que integre a psicologia e a inform ática.

Ao Programa de Pós-Graduação em Engenharia de Produção pela oportunidade recebida.

Ao prof. W alter de Abreu Cybis que em suas aulas ajudou a visualizar melhor as questões ergonômicas que afetam a interação entre homens e maquinas.

A professora Vânia Ribas U lbricht que pela sua postura fom entou o gosto pela m ultim ídia e hiperm ídia.

Ao Departamento de Psicologia da UFSG, nas pessoas dos professores Cida, Zanelli, Edite, Kleber, Roberto, Marcão, Zé Luis, Baus, Medeiros, Dulce, Juracy, Andréia, Emílio, Denise pelo incentivo e apoio recebidos durante a graduação e pós-graduação.

Para a Janete e A rlete que estiveram sempre presentes q u a n d o

precisava de socorro.

Aos meus pais, e seus com panheiros, pela com preensão, e ajuda nestes anos de estudo.

Aos amigos Adriano, Leila, Helena, Layla, Karina, Sabrina, Fernanda, Mônica, Elisiênia que tiveram um papel im portante em mais esse passo de minha vida.

A todos aqueles que direta ou indiretam ente contribuíram para a realização deste trabalho.

Aos colegas do mestrado em engenharia de produção e sistemas.

(6)

v ii S u m á rio L IS T A D E F I G U R A S ... ... ... ... ... X R E S U M O ... ... ... ... X I I A B S T R A C T ... ... ... X I I I C A P Í T U L O 1 IN T R O D U Ç Ã O ... ... ... 1 1.1 Justificativa... 2

.1.2 E stabelecim ento do Problem a.

...

.... ... ..,.,,4

1.3 Objetivo Gera l... 4

1.3-. lJOJbj.etivosJLspe_cíficjos

r. .. „. „ v >JL.. „ . . . . 5 1.4 Estrutura do Trabalho... ... 5 1.5 Questões...;... 6

1.5. JQuestões subjacentes

... ... ...

6

1.5.2Quesíões de trabalho

...

6

C A P Í T U L O 2 R E F E R E N C I A L T E Ó R I C O ... ... ...7

2.1 Orientação e Informação Profissio n a l...7

2.2 Er go n o m ia... 9

2.3 Hipertexto eHiper m íd ia. .,... ... 9

2:4 Histórico da Internet. ... ... 11

2.5 Histórico da Teia global (W W W , Web, World Wide Web). ...12

2.5.1

Funcionamento

...

13

2.6 Html - Hiper Text Makup Language... 14

2.6.1 Portabilidade

... ...

15

2.6.2Flexibilidade.

...

15

2.6:3Tamanho Reduzido

...— ... ... ...

..15

2.1

U R L - U nifo rm Resource L o c a tio n ... . 16

2.8 H T T P - Hyper Text Transfer Protocol. ... 17

2.9 Acrescentando dinam ism o... ... 17

2.10 As linguagens de Script... ... 18

2.11 Javascript X Java... ... ... ... ... 18

2.12 Princípios de Design Gráfico... ... ... ... 19

2.13 Leis da Gestalt... 19

2.14 Fig u r a e f u n d o... 20

(7)

2

.

15

. lProximidade... ... ...

20

2

.

15:2

Similaridade... ... ...

21

2

.

15.3

Continuidade... ... ...

2.1

2

.

15.4

Fechamento... .... ... ... ... ... ... ...

22

2

.

15.5

Boa forma... ... ... ...

22

2

.

15.6

Simetria...

22

2

.

15

.

7

Contraste... ... ...

23

2

.

15.8

Área...

23

2 . 1 6 Os Ob je t o s de In t e r a ç ã o. ... ... ... ...2 4 2 . 1 7 Me t á f o r a s d e i n t e r f a c e... ... ...2 5

2

.

17.1

Metáforas fam iliares... ... ... ...

..25

2

.

17.2

Metáforas de transporte... ... ... ...

..26

2

.

17.3

Características das metáforas...

27

2 .18 C o n c e p ç ã o de u m a m e t á f o r a ... ... 2 7 2 . 1 9 Re c o m e n d a ç õ e s s o b r e o u s o d e c o r e s e m in t e r f a c e s... 3 0 2 . 2 0 Na v e g a ç ã o. ... ... ... . 3 3 C A P Í T U L O 3 M E T O D O L O G I A . . ... ... ... ... ... 3 6 3.1 Ob j e t i v o d a p e s q u i s a...3 6 3 .2 Co l e t a de Da d o s. ... ... . . . 3 7 3.3 Po p u l a ç ã o e Am o s t r a... ... 3 8 3 .4 In s t r u m e n t o s de Me d i d a. ...3 9 3 .5 Tr a t a m e n t o e An á l i s e d o s Da d o s... 41 3 . 6 Li m i t a ç õ e s d o Es t u d o, ...41 C A P Í T U L O 4 R E S U L T A D O S ... ... ... ... , . 4 2 4 .1 Hi s t ó r i c o d a Pá g i n a d oL I O P . ... ... 4 2 4 . 2 Pá g i n a s a n a l i s a d a s... 4 6

4

.

2.1

Profissional do Futuro... ... — ...

47

4

.

2.2

Vestibanet... ...

49

4

.

2

.

3

ZAZ - Vestibular... ...

51

4

.

2.4

Côunsellor Resource Centre... ... ...

53

4 .3 Re s u l t a d o s d o q u e s t i o n á r i o e i n i c i a ç ã o c i e n t í f i c a... ... 55

4

.

3.1

- Qual o público alvo da página.,....,...

55

4

.

3.2

- Qual a linguagem a se utilizar para atingir o público alvo

....56

4

.

3.3

Qual o visual a ser utilizado na página?... ...

...56

v i i i

4

.

3.4

Quais informações devem ser veiculadas na página...

57

(8)

4

.

3.5

Qual a metáfora pode ser usada ria página?... ... .

59

4.4 Propostada Nova Estrutura. ... ... ... .. 60

4

.

4.1

O diagrama de Estados... ...

...62

4

.

4.2

Storyboard... ... ... ... ...

62

4

.

4.3

Metáfora... ... ... ...

..63

4.5 Interface do Web Site ... ...64

4

.

5.1

Pagina de entrada (home page)...

64

4

.

5.2

Página de Menu _____________ __ _____ ________ ____

65

4

.

5.3

Página Oriente-se..______ ___ ________ ______ ___ ____...

66

4

.

5.4

Página Comunique-se... ... ... ... ... . . .

6

7

_________

4

.

5.5

Página D icas... ... ... ... ... ...

....68

C A P Í T U L O 5 C O N S I D E R A Ç Õ E S F I N A I S ... ... ... .. ... 7 0 5.1 Sugestões paratrabalhos futuros. ... ... 72

R E F E R Ê N C I A S B I B L I O G R Á F I C A S ...73 IX

(9)

Lista de Figuras Fi g u r a 2.1 - Te x t o s e Ob je t o s In t e r l i g a d o s p o r m e i o d e h i p e r l i n k s... 10 Fi g u r a 2 . 2 - O m o d e l o b á s i c o d e f u n c i o n a m e n t o d a w e b a d a p t a d o d e Al c â n t a r a, 1 9 9 8 ... ... ... ... 14 Fi g u r a 2 .3 - Po r t a b i l i d a d e de d o c u m e n t o s h t m l p a r a d i f e r e n t e s s is t e m a s OPERACIONAIS... ... 15 Fi g u r a 2 . 4 - Fo r m u l á r i o d e b u s c a p o r i n f o r m a ç õ e s n a s p á g i n a s d a U F S C ... ... ... . . . 1 8 Fi g u r a2 .5 - m e n s a g e m de a l e r t a u t i l i z a n d o j a v a s c r i p t... ... ... . . . 1 8 Fi g u r a 2 . 6 - Ex e m p l o de f i g u r a e f u n d o n o t e-se a m u d a n ç a e n t r e d o i s r o s t o s e u m a t a ç a... ... ... 2 0 Fi g u r a 2 . 7 - Pr o x i m i d a d e... ... ... ... . 21 Fi g u r a 2 .8 - Si m i l a r i d a d e... ...21 Fi g u r a 2 .9 - Co n t i n u i d a d e... ... ... 2 2 Fi g u r a 2 . 1 0 -Fe c h a m e n t o... 2 2 Fi g u r a 2 .1 1 - Bo a f o r m a... ... ... ...2 2 Fi g u r a 2 .1 2 - Si m e t r i a... ... ...23 Fi g u r a 2 . 1 3 - Co n t r a s t e... ... ... 23 Fi g u r a2 . 1 4 - Ár e a. ... ... . . . 2 3 Fi g u r a 2 . 1 5 - Fi g u r a m o s t r a n d o a i m a g e m d e u m a b o l a i n a d e q u a d a q u a n d o v i s u a l i z a d a p o r o u t r a s c u l t u r a s, (n i e l s e n, 2 0 0 0 ) ...3 0 Fi g u r a 2 . 1 6 - Es t r u t u r a h o r i z o n t a l de n a v e g a ç ã o a d a p t a d o d e Yale ( 1 9 9 9 ) . . . ... ... ... ...33 Fi g u r a 2 . 1 7 - Es t r u t u r a v e r t i c a l de n a v e g a ç ã o a d a p t a d o de Ya l e( 1 9 9 9 ) ... 3 4 Fi g u r a 2 . 1 8 - Es t r u t u r a m i s t a de n a v e g a ç ã o a d a p t a d o de Ya l e ( 1 9 9 9 ) ... ... ... ... ... ... ...3 4 Fi g u r a2 . 1 9 -Ex e m p l o de b a r r a d e n a v e g a ç ã o... ... ... ...35 Fi g u r a 4 .1 - As p e c t o d a p á g i n a d o L I O P n a s u a p r i m e i r a v e r s ã o... ... 43 Fi g u r a 4 . 2 - Re p r e s e n t a n d o o h i p e r l i n k p a r a o e n v i o d e m e n s a g e m e l e t r ô n i c a... ... .43 Fi g u r a 4 .3 - As p e c t o d a p á g i n a d o L I O P n a s u a s e g u n d a v e r s ã o ... ... ... ... ... 4 4 X Fi g u r a

4.4

- As p e c t o d a p á g i n a d o L I O P n a s u a t e r c e i r a v e r s ã o ... ...

45

(10)

Fi g u r a 4 .5 - Pá g i n a v i s u a l i z a d a n o Na v e g a d o r Ne t s c a p e Co m u n n i c a t o r 4 . X ... ... ... ... ... ... ... 4 7 Fi g u r a 4 . 6 - Pá g i n a v i s u a l i z a d a n o Na v e g a d o r In t e r n e t Ex p l o r e r 4 . 0 ... ...4 8 Fi g u r a 4 . 7 - Pá g i n a d e e n t r a d a d o w e b s i t e Ve s t i b a n e t ... 4 9 Fi g u r a 4 . 8 - Pá g i n a de Di c a s d a v e t í b a n e t sem h i p e r l i n k s de r e t o r n o à p á g i n a i n i c i a l ... ... ...50 Fi g u r a 4 . 9 - Pá g i n a Gu i a de p r o f i s s õ e s „ d a v e t í b a n e t ... : ... ... ... ... ... ... 51 Fi g u r a 4 . 1 0 - Pá g i n a Gu i a d e p r o f i s s õ e s d a p á g i n a v e s t i b u l a r d o p r o v e d o r de a c e s s o Z A Z ... 52 Fi g u r a 4 . 1 1 - Ba r r a d e Na v e g a ç ã o o c u l t a p e l a d i v i s ã o e x i s t e n t e n a p á g i n a

QUANDO DA UTILIZAÇÃO DE UMA CONFIGURAÇÃO PARTICULAR DE TAMANHO DE FONTE POR OPÇÃO DO USUÁRIO... 53 Fi g u r a 4 . 1 2 - Ba r r a d e Na v e g a ç ã o c o m p l e t a s e m a u t i l i z a ç ã o d e c o n f i g u r a ç ã o FEITA PELO U S U Á R IO ...,... ... ... .53 Fi g u r a 4 . 1 3 - Re p r e s e n t a n d o o h i p e r l i n k p a r a o e n v i o d e m e n s a g e m ELETRÔNICA... ... ... 5 4 Fi g u r a4 . 1 4 -Ex e m p l o d e f i g u r a u t i l i z a d a n a p á g i n a a t u a l d oL I O P ... . . . 5 6 Fi g u r a4 . 1 5 - Mo d e l o d e s t o r y b o a r d u t i l i z a d o n a f a s e d e p r o d u ç ã o... . . . 6 3 Fi g u r a 4 . 1 6 - p á g i n a d e e n t r a d a r e m o d e l a d a d o L I O P ...6 4 Fi g u r a 4 . 1 7 - p á g i n a d e m e n u c o m f i g u r a s e x p l i c a t i v a s e l in k s d i r e t o s s e g u n d o l e i d o s “t r ê s c l i q u e s” ... ... ... . . . 6 5 Fi g u r a 4 . 1 8 - p á g i n a Or ie n t e-se c o m a d i s t r i b u i ç ã o d o s a s s u n t o s s e m p r e p r e s e n t e s n o l a d o e s q u e r d o. ... ..., ... . 6 6 Fi g u r a 4 . 1 9 - Fi g u r a d a p á g i n a o r i e n t e-se c o m seus r e s p e c t i v o s a s s u n t o s, ... ...67: X I F i g u r a 4 . 2 0 - F r a m e d e n a v e g a ç ã o d a v e r s ã o a n t e r i o r d a p á g i n a d o L I O P c o m s u p r e s s ã o d e í c o n e q u a n d o d e s u a v i s u a l i z a ç ã o n a r e s o l u ç ã o 6 4 0 X 4 8 0 . . . ... ... ... !...69

(11)

R e s u m o A g l o b a l i z a ç ã o e a t e c n o l o g i a atual e s t ã o m o d i f i c a n d o a f o r m a c o m o as p r o f i s s õ e s se d e f i n e m . A l g u m a s s ão e x t i n t a s e o u t r a s são c r i a d a s d e s c o r t i n a n d o n o v o s c e n á r i o s p r o f i s s i o n a i s . N e s t e c o n t e x t o a W o r l d W i d e W e b t o r n a - s e u m a i m p o r t a n t e f o n t e de p e s q u i s a , em q u e o u s u á r i o é b e n e f i c i a d o p e l a r a p i d e z de a t u a l i z a ç ã o d o s c o n t e ú d o s . P o r é m , de m a n e i r a g e r a l , as p á g i n a s a t u a i s q ue m a n t ê m i n f o r m a ç õ e s s o b r e p r o f i s s õ e s , o r i e n t a ç ã o p r o f i s s i o n a l e e x a m e v e s t i b u l a r d e m o n s t r a m p o u c a o u n e n hu m a a t e n ç ã o q u a n t o a i n t e r a ç ã o c o m o u s u á r i o . N ã o l e v a n d o e m c o n t a a s p e c t o s c o m o o t e m p o p a r a a l c a n ç a r as i n f o r m a ç õ e s r e l e v a n t e s , c o r e s q ue s ã o u s a d a s na i m p l e m e n t a ç ã o da s p á g i n a s , d i f i c u l d a d e de n a v e g a ç ã o . O b s e r v a - s e a o c o r r ê n c i a d e s t e s p o n t o s na p á g i n a e x i s t e n t e do L a b o r a t ó r i o de I n f o r m a ç ã o e O r i e n t a ç ã o P r o f i s s i o n a l . A s s i m , p r o p õ e - s e a a l t e r a ç ã o da e s t r u t u r a d e s t a p á g i n a , a d e q u a n d o - a e r g o n o m i c a m e n t e p a ra q ue a d i s p o n i b i l i z a ç ã o d a i n f o r m a ç ã o sej a f l e x í v e l , i n c o r p o r e n o v a s t e c n o l o g i a s e s ej a a c e s s í v e l a um n ú m e r o m a i o r de u s u á r i o s .

(12)

Ab st r a c t

In our common world, where globalization and technology are m odifying the w ay professions are created and extinguished, uncovering new professional scenes; where can we look for inform ation on professions? In this context a Word Wide Web becom es an im portant source of research because of its update speed and the easiness of distribution of its contents. Even so the current pages that have its focus on the “v estib u la r”, professions, and professional counseling show little or no attention to the u s e r ’s interaction, forgetting that he can spend hours in front of the com puter screen looking for relevant inform ation. Because of this a change in the existing structure of the page is proposed, adapting it ergonom ically so that the availability of the pro fession al inform ation be flexible, so that it incorporates new technologies and be accessible to the m ajority of users.

(13)

C a p í t u l o

1

I n t r o d u ç ã o C r i a r meu Web s i t e F a z e r m i n h a h o m e - p a g e Com q u a n t o s g i g a b y t e s Se f a z uma j a n g a d a Um b a r c o q u e v e l e j e ( . . . ) Eu q u e r o e n t r a r n a r e d e P r o m o v e r um d e b a t e J u r i t a r v i a I n t e r n e t Um g r u p o d e t i e t e s d e C o n n e c t i c u t

( . . . )

Eu q u e r o e n t r a r n a r e d e p r a c o n t a c t a r Os l a r e s d o N e p a l , o s b a r e s d o G a b ã o ( . . . ) ( Pe l a I n t e r n e t - G i l b e r t o G1l)

Estam os vivenciando a era da revolução pela inform ação, respaldada por uma rede de com putadores interligados. Am anhã não só terem os com putadores, mas, também pagers, telefones celulares e eletrodom ésticos possibilitando o acesso a uma quantidade im ensa de inform ações, onde quer que ela esteja localizada. Opções não faltam, pois a Internet hoje é utilizada para com ércio eletrônico, educação à distância, marketing, integração entre em presas, leilões, e uma série de outras finalidades, que estão m odificando a rotina das pessoas.

No mundo atual, onde a globalização e a tecnologia estão m odificando a forma como as profissões são criadas, como são extintas, d escortinando novos cenários profissionais, como podemos escolher

(14)

uma profissão. Onde podemos procurar conhecim entos sobre determ inada profissão, A rede cresce a olhos visto s logo* logo serem os um bilhão de usuários, concom itantem ente ocorre um crescim ento do conteúdo arm azenado pelos quatro cantos do mundo.

A tualm ente calcula-se que a rede dobre de tamanho a cada 50 dias e que uma nova página seja adicionada a cada 4 segundos, sendo assim quando procuram os uma inform ação sobre profissões, m ercado de trabalho, estamos procurando uma agulha em palheiro. (Negroponte, 1997)

Por estes motivos o LIOP - Laboratório de Inform ação e Orientação Profissional, começou a investir na Internet como meio de tornar-se um farol em assuntos relacio nado s â escolha profissional com plem entando o atendimento já prestado no SAPSI - Serviço de A tendim ento Psicológico (a clínica de psicologia) da UFSC. Este foi um trabalho pioneiro quando do seu lançam ento em idos de 1997. Na ocasião foram realizadas pesquisas com as palavras chaves “Inform ação P ro fissio n al” nos principais mecanism os de busca, encontrando-se apenas os nomes de alguns psicólogos que realizavam a orientação profissional em seus consultórios. A partir desta iniciativa, m uitos outros Web sites foram sendo criados Brasil afora.

1 . 1 Justificativa

Como visto acima o contexto profissional com amplas m udanças faz com que a Internet se torne um meio eficaz para distribuição de informação que deve estar em constante processo de atualização.

Hoje em nosso país, seguindo-se a tendência mundial, ocorre um crescim ento do uso da Internet, atualm ente na casa de três a quatro m ilhões de usuários (Ibope, 1998), notando-se também um aumento de usuários na faixa etária de 15 a 24 anos que engloba os adolescentes e

(15)

jo v en s que estão se preparando para a eseolha profissional, seja a continuação de seus estudos no segundo grau* a escolha de um curso profissionalizante, de um curso seqüencial, uma graduação numa in stituição de ensino superior ou a sua entrada no m ercado de trabalho.

Desta forma o uso de ferram entas como ehat, e-mail, vídeos, CD- Roms e páginas da Internet pode atingir a clientela de jovens que já trazem em sua bagagem o uso cotidiano da televisão, do vídeo, e mais

recentem ente do com putador.

Segundo" Lancaster citado por Figueiredo (1995) a publicação eletrônica surgirá cada vez mais por dois m otivos básicos; terem os com putadores nos lares, escritórios, escolas e em locais de acesso público, como hoje se usa o telefone a cartão; por outro lado, o custo da distribuição da informação no formato de papel irá torná-la cada vez mais inacessível.

Além disto, um sistem a eletrônico, oferece vantagens como: ser acessível há várias pessoas, os usuários podem selecionar 0 que vão ler, velocidad e na distrib uição de novas inform ações. Como no Brasil se criam universidades e cursos com muita rapidez, necessário se faz que estas novas inform ações sejam disponibilizadas de uma forma rápida e eficaz.

Os avanços tecnológicos, também demonstram a necessidade dos próprios Orientadores Profissionais terem cada vez mais proxim idade com estas atualidades, uma v e z que a tarefa de oferecer inform ação profissional é parte do processo de orientação profissional e, m uitas vezes, os orientadores não díspoem de inform ações pertinentes que a clientela necessita, configurando-se um banco de dados eletrônico como eficaz recurso para a realização de seu trabalho.

3

(16)

4

1.2 Estabelecimento do Problema

As páginas atuais que tem seu enfoque voltado para o exame vestibu lar, profissões, orientação profissional, tem dem onstrado pouca ou nenhum a atenção para a interação entre o usuário e os p rofissionais, para a ergonom ia e o design das páginas, tendo seu conteúdo voltado principalm ente para o estresse das provas do vestibular. Esquecendo-se que o u suário -cliente pode passar horas frente à tela do com putador procurando a inform ação pertinente, e é obrigado a conviver com cores, formas e inform ações apenas com conotação meramente com ercial para que os seus espaços pub licitários (banners) sejam constantem ente vistos. Deste modo a partir da avaliação da página atual sobre inform ação profissional do Laboratório de Inform ação e Orientação Profissional, observamos que a mesma também se encontra inadequada nos requisitos de interação, acessibilidade, facilidade de navegação, tom ando-se por base os guias e recom endações ergonômicas.

1.3

Objetivo Geral

Propor a alteração da estrutura da página existente sobre inform ação profissional do Laboratório de Informação Profissional da UFSC para que esta se adeqiie a população alvo, a partir da u tilização da análise ergonômica, a fim de que a informação transm itida seja clara, objetiva, possa ser encontrada com facilidade e esteja disponível para o maior numero possível de usuários.

(17)

5

1 . 3 .1 O b j e t i v o s E s p e c í f i c o s

D isponibilizar as inform ações a fim de que sejam acessíveis em diversas plataform as de hardware e software.

Que os usuários possam acessar as páginas sem a necessidade de navegadores sofisticados, ou de configurações específicas.

1.4 Estrutura do Trabalho

Esta dissertação está dividida em cinco capítulos

O capítulo primeiro apresenta uma breve introdução sobre o tema da dissertação, o problema da pesquisa, a ju stifica tiv a do estudo, os objetivos desta pesquisa e as questões.

O Segundo capítulo apresenta o levantam ento bibliográfico, bem como conceitos sobre orientação e inform ação profissional, também os estudos sobre a forma de apresentação do layou t de páginas da Internet e o uso de m etáforas.

O Terceiro capítulo trata da m etodologia u tilizada nesta dissertação

O capítulo quarto apresenta os resultados, a análise das páginas pesquisadas mostrando como foi desenvolvida a estrutura para a nova página de inform ação profissional do LIOP.

O Quinto capítulo é dedicado a conclusão, onde são delineadas as considerações finais e sugeridas propostas para outros estudos.

(18)

6

As Referências Bibliográficas listam o m aterial bibliográfico que foi consultado durante a realização desse trabalho

1.5

Q u e s t õ e s

____ Se observarm os a página atual levando-se em conta guias de estilos e cadernos de encargos ergonôm icos existentes então percebem os que esta se encontra inadequada e fora dos padrões estudados.

1 . 5 .1 Q u e s t õ e s s u b j a c e n t e s

O procedim ento de Informação Profissional via Internet ajuda os jovens em seu futuro acadêmico?

A distribuição de inform ação profissional pela rede significa um m aior número de usuários tendo contato com estas, decidindo com mais segurança e consciência a profissão a seguir, deste modo espera-se dim inuir os abandonos de cursos antes mesmo de sua finalização.

1 . 5 . 2 Q u e s t õ e s d e t r a b a l h o

Esta nova página irá suprir conteúdos não existentes em outras páginas, trabalhando com uma interface agradável ao usuário e fácil de se entender.

(19)

C a p í t u l o

2

R e f e r e n c i a l t e ó r i c o

2 , 1 O rientação e Informação Profissional

A tecnologia e a globalização estão criando novos cenários pro fission ais, extinguindo outros, com estas m odificações constantes e previsões que as especialidades e as profissões no século 21 passarão por transform ações a cada 15 anos, como poderem os escolher uma profissão. Onde procurar conhecim entos sobre determ inada profissão?

Neste ponto entra em cena a orientação profissional que se propõe a “ auxiliar o indivíduo no processo de escolha de modo que este realize opções ocupacionais adequadas. Esse objetivo mais geral desdobra-se em outros tais quais: ajudar o indivíduo a obter, organizar e u tilizar inform ações a respeito de si e do mundo do trab alh o ” (Ferreti, 1992:14).

À parte que cuida desta obtenção, organização e utilização é representada pela informação profissional. De acordo com Bohoslavsky (1983) a inform ação profissional é um momento no processo de escolha, que visa esclarecer o jovem sobre a organização, as características e as perspectivas das diferentes carreiras, assim como da instituição na qual estas são cursadas, a fim de con seguir uma inserção mais consciente nela. Se de um lado se inform a de outro a inform ação profissional necessita corrigir im agens distorcidas que o jo v em traz com ele. Essas distorções nas im agens do mundo adulto devem-se não só a falta de inform ação, mas a outros fatores que são:

© I n t r a p e s s o a i s : características de personalidade, idade, fatores cognitivos, afetivos, etc;

(20)

8

O Interpessoais: transtorno nos processos de identificação com

outros significantes;

O Trãnspessoais ou culturais: distorções devido a unia

com unidade que valoriza as profissões de modo inconsciente na m edida em que as diferentes profissões conferem diferente status, poder, prestígio, níveis de ingresso, entre outros.

Nesse sentido, a tarefa de esclarecim ento deve estar necessariam ente integrada à transm issão de nova inform ação. No processo de inform ação profissional deve-se esclarecer sobre quais são as diferentes atividades profissionais; relação existente entre elas; a organização do ensino que o adolescente quer ter acesso (ensino médio, técnico, seqüencial, superior e pós-graduação); carreiras como meios para se assum ir atividades científicas, técnicas e profissionais.

Para o orientador profissional fica d ifícil dispor de todas as inform ações necessárias. Ê fundam ental também, despertar no jovem interesse para que ele próprio busque novo manancial inform ativo, sob m edida para suas pretensões.

O adolescente deve ser estim ulado a buscar um nível mais profundo de informação sobre aquelas profissões que mais lhe interessam utilizando-se dos mais diversos meios e, no presente um meio prom issor para esta busca aprofundada de conhecim entos sobre as profissões é representado pela internet.

A Internet por sua constante efervescência, e rapidez na atualização pode se tornar propícia para a localização das inform ações profissionais que serão de grande utilidade neste século XXI.

Mas para que os jovens utilizem a Internet, o seu conteúdo deve ser de fácil entendim ento, rápido, intrigante, tendo um a linguagem que chame a atenção, sem descuidar dos princípios ergonôm icos. Desta forma passo a narrar a seguir, o nascim ento da W orld Wide Web, o histórico da hiperm ídia, e os usos da Gestalt,

(21)

ergonom ia e das metáforas para a construção de interfaces fáceis e “hip erjoven s” .

2 . 2 Ergonomia

O termo ergonom ia ê derivado das palavras gregas ergon (trabalho) e nomos (regras).

Segundo o dicionário M ichaelis (1999) a ergonom ia é o conjunto de estudos relacionados com a organização do trabalho em função dos objetivos propostos e da relação hom em -m áquina. Pode- se dizer que a ergonom ia se aplica ao projeto de m áquinas, equipam entos, sistem as e tarefas, com o objetivo de m elhorar a segurança, saúde, conforto, e eficiência no trabalho. Muitas situações de trabalho e da vida cotidiana são p reju diciais à saúde. As doenças como dores nas costas ou estresse se constituem na maior causa de absenteísm o, na sua m aioria ocorrendo pelo uso inadequado de equipamentos, sistem as e tarefas.

A ergonomia desenvolveu-se principalm ente durante a segunda guerra m undial onde os esforços de união entre a tecnologia e as ciências humanas ocorreu.

A ergonom ia baseia-se principalm ente em conhecim entos advindos de outras áreas como a antropom etria, psicologia, fisiologia, engenharia mecânica, eletrônica, inform ática e outras.

O grande diferencial é o seu caráter interdisciplinar, apoiada em várias disciplinas e sua natureza voltada às aplicações no dia-a- dia adaptando os postos de trabalho e o ambiente às características e necessidades do ser hum ano (Dul; W eerdm eester, 1995).

2.3

H ip e r te x to e Hipermídia

A idéia do H ipertexto foi concebida na década de 40 por Vannevar Bush, estás idéias foram relatadas na revista The A tlan tic M ontly de 1945 com o título “Como Nós P ensam os” . Bush relata a sua

(22)

id éia sobre um dispositivo chamado Memex, este organizaria as inform ações (texto e im agens) de forma interligada, formando uma rede de associações.

Já em 1962 Theodor Nelson projeta o Xanadu, que seria uma rede de com unicações que abarcaria todo o conhecim ento do mundo, como uma grande biblioteca de Alexandria. Esta biblio teca seria com posta por documentos d ispostos de forma não linear, em oposição ao formato linear dos livros, film es e discursos. Pode-se pensar que está forma não linear sign ifique que as inform ações estão em desordem. Nada disso, as páginas criadas com hipertexto se apresentam bem estruturadas, desde sua criação até a im plem entação (Bairon 1995, p. 84). Para LÉVY (1993, p .37) o h ipertexto possui um aspecto dinâmico e m ultim ídia, e a velocidade de acesso aos nós lhe garante utilizar em toda a sua extensão o princípio da não- linearidade, transform ando a referência espacial, que não ocorre mais diante da tela, pois as inform ações podem encontrar-se além do lim ite visual do m onitor e da própria topologia de rede existente no “cib eresp aço” . No hipertexto quem está no controle da ação são os usuários, pois diferentem ente do que ocorre com a televisão ou com o rádio, neste caso ele escolhe o cam inho a percorrer, ficando para o com putador apenas a armazenagem.

A hiperm ídia é o termo usado para definir o hipertexto que não é exclusivam ente texto, podendo incluir, gráficos, diagramas, vídeo, som, animação, imagens sem movim ento, imagens em movim ento, fala, ou programas de com putador. A vantagem é que ao “clicar” com o mouse sobre um desses nós, que pode ser uma palavra sublinhada, uma imagem, um ícone ou um botão, o usuário é remetido a uma

(23)

putra página, que pode residir ou não no mesmo lugar ou estar localizado em outro canto do planeta (Martin, 1992).

2.4

H i s t ó r i c o da I n t e r n e t

Em jan eiro de 1969, a Arpa (Departam ento de Defesa dos EUA) começou a financiar a pesquisa e o desenvolvim ento de um a nova rede de com putadores cham ada Arpanet. O trabalho foi desenvolvido por equipes de engenheiros de hardware e de software. A A rpanet foi inicialm ente um experimento para determ inar que tipos de projetos de rede iriam funcionar, quão robustos estes projetos deveriam ser e que quantidade de inform ações eles poderiam transm itir. Um dos principais desafios in iciais foi projetar uma rede que pudesse continuar funcionando se algum a de suas seções deixassem de operar no caso de u m a guerra com armas nucleares. Outro objetivo da pesquisa e do desenvolvim ento do projeto fo r criar uma rede quê perm itisse a inclusão ou remoção de nós com bastante facilidade. Finalm ente a rede deveria perm itir a interconexão entre com putadores de diferentes fabricantes de maneira fácil e barata (ícaro Brasil, p .62)

(24)

12

2.5

H i s t ó r i c o da T e ia g l o b a l ( W W W , W e b , W o r l d W i d e W e b ) .

Você pode se perguntar o por que da existência de tantas páginas na Internet, cada qual com um assunto diferente. Podemos im aginar que a m aioria desaparecerá, ledo engano, cada vez mais haverá publicações especializadas, e público para todas elas, e estas páginas nascem, crescem e se m ultiplicam sem parar. Isso tudo começou em 1989 com Tim Berners-Lee os pesquisadores do CERN (Centro Europeu de Pesquisas Nucleares) que se encontravam em diferentes países.

Berners-Lee desenvolveu a Web, sobre tecnologias sim ples e fáceis de usar, pois antes da concepção da www a com unidade de pesquisadores que utilizava com putadores ligados na rede internet precisava utilizar-se de vários programas distintos para localizar, buscar e visu alizar as informações.

Mas foi somente em 1993 que a Web começou a crescer, pois estava pronta a versão do software Mosaie, um navegador gráfico (browser) criado por Marc A ndreessen e alguns colegas do Centro Nacional de A plicações para Supercom putadores, da Universidade de Illinois, que se tornou logo depois o fundador da Netscape (e seu navegad or).

A partir do lançam ento do navegador (browser) gráfico, os usuários, agora não mais restritos a acadêm icos e pesquisadores, tiveram acesso a uma rede de docum entos apresentados de m aneira fácil através de interfaces gráficas, m ecanism os de busca, etc.

O termo Browser provê da língua inglesa onde To Browse significa "folhear" o virar de páginas, podemos descrever o funcionam ento deste software, também conhecido como navegador em nosso país , como um mecanismo de videocassete onde tem os os botões para frente e para traz e o recurso mais interessante, que seja,

(25)

os hiperlinks que são palavras “vitam in ad as” onde você pode ter acesso a mais conhecim entos ou a outros tipos de docum entos fazendo com que a W eb se torne uma hiperm ídia.

Na educação a utilização da Internet e dos navegadores tem se tornado um grande auxiliar dos professores que podem produzir suas lições disponibilizando-as para vários estudantes que estejam distantes geograficam ente. Além disso, a criação e disponibilização de páginas são uma maneira de trazer a Internet para a sala de aula e a sala de aula para o m undo (De Lucca; M archezan,i996).

2 . 5 . 1 F u n c i o n a m e n t o

A Web ou WWW é formada por m ilhões de Web sites (ou locais) na Internet. Estes Web sites são m antidos por universidades, em presas, órgãos do governo e encontram os também páginas mantidas por apenas uma pessoa. Normalmente acessamos a home page ou página inicial do Web site. Mas como tudo isso funciona?

Bem, para que tudo fu n cio n e; é necessário um cliente e um servidor, e 3 tecnologias im portantes, o protocolo H TTP, para a comunicação enlre os clientes (navegadores), e o servidor: (com putador da rcdc), que fica esperando que o clicnte faça um pedido de um docum ento que é escrito na linguagem HTML, e as URLs {U niform e R esource Locaior) que possibilitam a identificação dos docum entos na rede. Para exem plificar podemos observar a figura 2,-2 qufl mostra:o funcionam ento das três tecnologias:

(26)

14 "Bivie-me o documento dia URL

http://w w w .cfh.ufsc.br/-liop

HTTP

(Servidor V\fet> I

1. O ciienie envia uma mensagem HTTP para o servidor V\feb, requisitando o documento de determinada URL

A — HTTP Documento HTML requisitado .‘Viâj»;, 'WSW>'

<-iServidor V\teb I Sstemade arquivos do

servidor

2. 0 servidor envia o documento requisitado para o navegador, que o apresenta de acordo com as regras de formatação de HTML

Figura 2.2 - O modelo básico de funcionamento da W eb adaptado de Alcântara, 1998.

2 .6 Html - Hiper Text Makup La n g u a g e

É a linguagem utilizada para a criação de docum entos com ligações entre eles. Seus com andos ou elementos de marcação (tags) criam a estrutura do texto, por exemplo, onde colocar negrito, onde ficam as imagens, e os links, ficando a cargo do navegador (browser) a apresentação do mesmo respeitando os diferentes tipos de fontes, configurações de monitor, e tipo de sistema operacional. Não é, no entanto, uma linguagem de programação.

(27)

2 . 6 . 1 P o r t a b i l i d a d e

Os docum entos escritos em HTML devem ter aparência sem elhante nos diversos navegadores existentes para cada tipo de com putador e sistem a operacional. Desta maneira ocorre uma grande portabilidade, pois a pessoa que faz as páginas não precisa editar uma a urna para cada plataform a de software, os navegadores se encarregam de formatar e apresentar o conteúdo levando em conta as especificidades de cada sistem a operacional conforme apresentado na

2

.

6.2

Fiexibiiidade

O usuário deve ter a liberdade de personalizar os diversos elementos do docum ento, como o tam anho padrão da letra, as cores, etc.

2

.

6.3

Tamanho Reduzido figura 2.3.

M g id ;r pari Pc’ Navegador pajji

Ttnix/WTlllV Navsgàdor para TiAfilTif/l'sK

uocumento

Figura 2:3 — Portabilidade de documentos htmi para diferentes sistemas operacionais.

Os docum entos devem tçr um tamanho reduzido, a fiín de econom izar tempo na transm issão através da Internet, evitando longos períodos de espera e congestionam ento na rede.

(28)

A linguagem HTML é simples e pode ser aprendida sem m aiores dificuldades pelo usuário leigo, não sendo necessárias, na

maioria dos caso s,/ noções anteriores de program ação.

Uma das principais características do HTML é a de que se um navegador não entende um determinado com ando (que são chamados TAG em inglês), este é ignorado, nao causando nenhum tipo de mensagem de erro e afetando no mínimo o resto do docum ento.

Gomo exemplo, podem os citar o com ando de centralizar texto na página:

<CENTER>Este texto deve ficar centralizado</CENTER>

Esfcé te x to d e ve f ic a r centraiízacío .

Se um navegador mais antigo versões um ou dois, le r esta página com o comando de centralizar texto, ele não apresentará nenhum a mensagem de erro, mas também nao irá centralizar o texto, ignorando o comando (TAG).

i 6

2 .7

U R L

-

U

n ifo rm

R

e s o u r c e

L

o c a t io n

Normalmente para enviarmos ou recebermos uma carta necessitam os preencher no envelope, os campos correspondentes, a rua, cidade, estado e CEP, na Internet a coisa funciona nos mesmos moldes, as Uris (w sc, 1999b) (NCSA, 1999) são o endereçamento onde cada página, ou servidor tem um único no mundo.

Exemplo:

Servidor Domínio D iretoria, s^bdiretôriçí c árq.u^

http:// ~/liop/index.htm l

(29)

v ^ m c fh .u fs c .b x é o nam-e do dom ínio onde está localizado o que queremos

~/liop/iiidex.hLmi é o noine do recurso requerido. Normalmente as páginas da www têm a terminação .htm l ou „htm

2 .8

H T T P

- Hyper TextTransfer Protocol

Nós seres hum anos nos com unicam os utilizando um idioma. Para que duas pessoas se com uniquem é necessário -que falem e entendem o mesmo idioma. Isto também ocorre com os com putadores para que eles se "entendam" e possam "falar" é necessário que usem um protocolo (o idioma).

0

protocolo mais utilizado é o HTTP qu Hyper Text Transfer Protocol, este protocolo faz com que o nosso navegador peça um docum ento, seja ele texto ou imagem, e o servidor em resposta envie este docum ento. Este protocolo é extrem am ente sim ples, desta maneira m uitas vezes não perm itindo o desenvolvim ento de aplicações mais complexas (w3.ç, 1999c).

2.9

Acrescentando dinamismo

Com o surgim ento de linguagens como o CGI - Common Gateway Interface, uma especificação para a transferência de arquivos do servidor web para uma página.

Um program a CGI c um programa elaborado para accitar e retornar dados que obedecem às especificações do CGI. O program a pode ser escrito em qualquer linguagem de programação, incluindo C++, Perl, Java ou Visual Basic. Programas CGI são o meio mais comum pelo qual os servidores Web interagem dinam icam ente com os usuários. O uso dos scripts CGI p o ssib ilita o acesso a dados que a linguagem html não poderia resolver por si só, por exemplo, a construção de form ulários de bu sca ou de envio de dúvidas que se encontra disponibilizado na página do LIOP.

(30)

Exemplo de Formulário:

l8

Figura 2.4 Formulário de busca por informações nas páginas da UFSC

Desta maneira o CGI flexib ilizou e tornou possível a interatividade com os usuários, pois d ispon ib ilizou a program ação no servidor de www (server side program m ing) (Powell, 1999b).

2 .1 0

As

LINGUAGENS DE SCRIPT

O modelo dinâm ico de d isponib ilização de inform ações possibilitado pela ÇQI executa código apenas do lado do servidor retornando um a página de resposta estática. V isando passar parte do processam ento para a m áquina cliente, surgiram linguagens de script que são interpretadas pelos próprios navegadores e podem ser usadas para validar dados de um form ulário e enviar mensagens de alerta ao usuário, observe a figura 2-5 (Powell, 1999a).

Figura 2.5 - mensagem de alerta utilizando javascript

2 .1 1

J a v a s c r i p t

X

Java

Javascript é um a extensão da html e pode ser executado em Navegadores Netscape 2.x em diante, já a linguagem de program ação Java desenvolvida inicialm ente pela Sun M icrosystem s roda apenas no Netscape Navigator ou Internet Explorer versões 3>X para W indows 95, e ainda há possibilidade de ocorrerem problem as com seu uso mesmo em navegadores mais recentes, como por exemplo à

(31)

falta de componentes, não instalação do componente ou instalação inadequada. Já no caso de JavaScript o não reconhecimento pelo navegador da marcação (tag), será ignorado e a página será m ontada normalmente como ocorre com as marcações da linguagem HTML (Torres, 1997).

2 . 1 2 P rincípios de D esign G r á fic o

A comunicação é interação, e para que a comunicação entre usuários e computadores ocorra é necessário que as informações contidas no computador sejam fornecidas para o usuário de forma estruturada, esta estruturação não ocorre naturalmente nos artefatos feitos pelo homem, sendo, portanto necessário utilizar-se de leis que descrevam a emergência destas estruturas e estas leis são as:

2 .1 3 Leis da Gestalt

A Gestalt surgiu nas primeiras décadas deste século na Alemanha como uma espécie de resposta à psicologia associacionista existente nos Estados Unidos. A escola associacionista pregava um a busca do todo psicológico através da soma de suas partes mais elementares; o complexo viria pura e simplesmente da reunião de seus elementos mais simples, era uma escola de adição. Por sua vez a escola da forma dizia o contrário: não podemos separar as partes de um todo, pois dele elas dependem e não fazem sentido, quando separadas. A palavra gestalt significa “todo”, "configuração" ou “form a”, e a posição gestaltiana foi, em si mesma um a gestalt cuja argumentação só faz sentido depois que a examinarmos como um todo (Hochberg, 1982, p .133).

(32)

20

2.14

Figura efundo

Somos bom bardeados por estím ulos físicos todo o tem po e, para com preendê-los precisam os organizar esses estím ulos, e fazem os de tal maneira que exista apenas um estím ulo, nunca ocorrendo dois ao mesmo tempo. Deste modo um estím ulo sempre parece saltar frente aos outros. A este damos o nome de figura, sendo o fundo o restante. Figura e fundo são d i f e r e n c i a d o s não só em

formas visuais, vale lembrar: tendem os a separá-los em todas as experiências da percepção. Na m úsica, por exemplo, geralm ente percebem os a voz do cantor como figura e o instrum ental como fundo, como acom panham ento. Na figura 2-6 abaixo pode-se observar tanto uma taça branca contra um fundo negro como dois rostos negros, olhando um para o outro, contra um fundo branco.

Figura 2.6 - Exemplo de figura e fundo note-se a mudança entre dois rostos e uma taça.

2 .1 5 Agrupamento Perceptual - W ertheimer

Pode haver, e na maioria das vezes há, mais de dois elem entos na forma: nesse caso. o que seria figura? F, fundo? Por quê? Max W ertheim er, tido como o fundador da teoria da Gestalt, propõe em seu " Raciocínio Visual" certos princípios, a seguir (Hochberg, 1982, P-

133

)-2.15.1 Proximidade

Em çç^cjjlçõfcs iguais, eventos próxim os no tem po e espaço tenderão a perm anecer unidos, formando um só todo. Grupos

(33)

perceptuais são favorecidos de acordo com as proxim idades das 21 partes <,V»V.a*••••

S í í í

V .V - • « # * Figura 2.7 - Proximidade

Neste tipo de agrupamento, o observador percebe não apenas pontos pretos, mas um olho humano.

2 . 1 5 . 2 S i m i l a r i d a d e

Eventos sem elhantes se agruparão entre si onde na figura 2-8 percebemos várias colunas, em vez de várias horizontais.

o

©

o

o

o

o

/ " 's V J r \ ■>_> r\ 'w O O

o

) O I 'um w Figura 2.8 - Similaridade

E ssa sem elhança se dá por intensidade, cor, odor, peso, tamanho, form a etc. e se dá em igualdade de condições.

2 . 1 5 . 3 C o n t i n u i d a d 6

É o acom panham ento de uns elem entos por outros, de modo que uma linha ou uma forma continue em uma direção ou maneira já conhecidas. A organização na percepção tende a ocorrer de tal maneira que uma linha reta parece continuar como uma linha reta, uma parte de um círculo como um círculo, etc..

(34)

22 4^. ® . 9 ' $ m Figura 2.9 - Continuidade 2 . 1 5 . 4 F e c h a m e n t o

Os elem entos de uma forma tendem a se agrupar de modo que

estáveis que as não fechadas e, portanto, formam mais prontam ente as figuras na percepção. O com portam ento se dirige a uma situação final que traz consigo o fecham ento, conforme apresentado na figura abaixo:

2 1 5 . 6 S i m e t r i a

T endência de perceber, primeiro, as formas de contorno sim étrico que as de contorno assim étrico. Em term os de uma com posição, as com posições sim étricas transm item formalismo, enquanto que as assim étricas transm item inform alidade e dinam ism o. formem uma figura mais total ou fechada. As áreas fechadas são mais

Figura 2 . 1 0 - Fechamento

2 . 1 5 . 5 B o a f o r m a

T endência de com pletar uma imagem.

(35)

23

Figura 2 . 1 2 - Simetria.

2 . 1 5 . 7 C o n t r a s t e

O mais prim ário fator d e percepção de um objeto (figura) é a diferença entre ele e o seu entorno (fundo). O contraste pode criar distinção e ênfase (saliência).

Figura 2.13 - Contraste.

2 . 1 5 . 8 Á r e a

Quanto menor for uma região fechada, a tcn dcn cia c maior de perceber como uma figura assim quando a área branca dim inui da figura a para b aumenta a tendência para ser vista como figura.

Figura 2 . 1 4 - Área.

Com a aplicação das leis da Gestalt é possível estruturar de m aneira organizada uma página, para que esta traga b enefícios para os usuários, tais como:

(36)

U nidade - Mantém ju n to s até os elem entos, mais desiguais de um projeto, trabalhando na sua harm onização para que a mensagem seja transm itida.

Integridade - Uma estrutura forte mantém o projeto como um todo, fazendo com que o significado do conjunto da página perm aneça como uma forma emergente.

Leiturabilidade - A estrutura mantém os objetos legíveis para o projetista da página, facilitando assim su a utilização.

Controle r A estrutura disponib iliza ao usuário considerar as áreas de interesse, facilitando sua navegação pela página.

2 , 1 6 O s O b je to s de In te ra ç ã o

Um objeto de interação é definido como um objeto de software cujo processam ento gera uma imagem que é apresentada ao usuário e çom a qual ele pode interagir. Eles preenchem as telas das interfaces com o usuário e podem se basear em metáforas de objetos do mundo não inform atizado, representando botões, janelas, menus, interruptores, etc.

Bonsiepe citado por R igh i {1993) defende que

“0 u s u á r i o a p r e n d e u a u s a r um a p l i c a t i v o q u a n d o e s t e s e t o r n a ‘t r a n s p a r e n t e V d e t a l f o r m a q u e e l e , u s u á r i o , n ã o p r e c i s e m a is ‘p e n s a r n e l e ’ , a p l i c a t i v o , ou s e j a , q u a n d o

0

a p l i c a t i v o d e s a p a r e c e c o m o p a n o d e f u n d o , p e r m i t i n d o q u e

0

u s u á r i o s e c o n c e n t r e n a r e a l i z a ç ã o d e s u a t a r e f a , e q u a n d o

0

a p l i c a t i v o n ã o s e c o n s t i t u i r e m u m p r o b l e m a p a r a o u s u á r i o " . 24

(37)

2.17

M e t á f o r a s de in t e r f a c e

O que são metáforas? São conceitos fundam entais, condições e im agens pela qual a mensagem que se quer transm itir é com preendida facilm ente.

A idéia de metáforas para o desenvolvim ento de interfaces homem com putador (IHG) se popularizou com o aparecim ento da interface Xerox Star, que nasceu na década de 70 quando o centro de pesquisas da Xerox Corporation, localizado em Paio Alto, Califórnia, perto da U niversidade de Stanford, com eçou a investigar as interfaces do futuro. O sistem a operacional desenvolvido pelo centro de pesquisa tinha como característica ser inteiram ente gráfico, tendo uma interface com o usuário, baseada em m etáfora visual (a organização e a forma de trabalho de um a pessoa em uma escrivaninha). Em anos posteriores também foram feitas tentativas de se utilizar cadernos, edifícios e cidades como metáforas.

A preocupação da Xerox Star em que os comandos fossem consistentes em todas as aplicações, ajudou os usuários nó momento da interação com os dispositivos inform áticos. Esta orientação foi de grande valia, pois o usuário aprende a usar as aplicações que obedecem ao mesmo tipo de com ando, em m enor tempo, poupando dinheiro, e desgastes em cursos e treinam entos.

Segundo Heckel citado por Stanford (2000) as metáforas podem ser divididas em fam iliares e de transporte.

2 .

17.1 Metáforas famll iares

São objetos gráficos que facilitam o aprendizado de u m program a por usuários novatos.

Sendo a metáfora de desktop ou mesa de trabalho um exemplo clássico que se baseia na experiência an terio r dos usuários em trabalharem com mesas de escritório. Uma m etáfora fam iliar pode fazer com que o sistema seja aprendido facilmente.

(38)

2.6

2 . 1 7 . 2 M e t á f o r a ^ d e t r a n s p o r t e

As m etáforas de transporte criam uma nova maneira de pensar, urna nova “realidade” como exemplo temos a metáfora de planilha eletrônica que proporcionou uma base para aplicações financeiras, científicas, etc.

Ainda para Heckel citado por H iratsuka (1996)

“A arte de elaborar uma boa m etáfora de transporte consiste não só em manter um modelo conceituai natural e sim ples dentro dos diferentes, empregos que lhe serão dados, como também em preservar a capacidade de alterar as aplicações dentro dos lim ites desse m odelo” .

Verplank citado por Stanford (20 O o) soma uma terceira categoria que enama de metáfora de invenção q ue estabelece novas possibilidades. Como exemplo o que aconteceria se um processador de texto tivesse como metáfora uma fábrica de enlatados. Teríam os perguntas sobre os elementos desta fábrica (linha de montagem, fecham ento, m áquinas de etiquetar e empacotar) o que tornaria a interação com este novo editor de texto algo curioso.

Para Tregiown citado por IIira ts u k a (i996) fragmentos de som e vídeo, juntam ente com outras estruturas de dados encontradas em sistemas m ultim ídia quase não possuem analogia direta com um ambiente de escritório. Sistemas m ultim ídia evidentemente não precisam de metáforas de desktop.

Desta m aneira as metáforas mais comuns utilizadas em sistem as operacionais são as de mesa de trabalho (desktop), e de janelas (windqws), mas; na Internet norm almente utilizam -se livros, jorn ais, revistas, lojas, canais de televisão, em ambientes m ultim ídia são u tilizados jog os, cidades, cômodos de uma casa ou escritório, animais, prédios, etc.

(39)

2 7

O Facilitam o aprendizado, pois com sua utilização o u suário principiante, não necessita de treinam ento, conseguindo trabalhar rapidam ente dentro de uma página ou software (Cybis, 1997).

O Fornecem um ambiente de trabalho fam iliar, p ois trabalham com á experiência anterior do usuário evocando elementos presentes no mundo real (H iratsuka, 1996};

© Devem ser desenvolvidas tomando-se por base 0 público alvo;

€1

Sim plificam a realização de tarefas, pois o usuário não precisa aprender novos comandos, ou tipos de navegação (Barreto, 1998);

© Devem ser conhecidas do público, para que o usuário sinta-se à vontade, e se ela for boa, o usuário lem brará da inform ação por longo tempo (Barreto, 1998);

© Permitem associações com o m undo real, pois se baseiam em objetos existentes no mundo ou no cotidiano (Cybis, 1997).

2 .1 8 Concepção de uma metáfora

O uso da m ultim ídia, a com binação de eletrodom ésticos com com unicação (lavadoras que enviam mensagens eletrônicas), estão cada vez mais possibilitando a com unicação entre homens e m áquinas em ambientes que não mais os escritórios. Desta maneira devemos utilizar conceitos e imagens que abarquem não só a idéia de trabalho corno produção, mas idéias que aliciem 0 lazer, a diversão. Assim

(40)

para conceberm os uma m etáfora devemos prim eiram ente conhecer o usuário e suas preferências, bem como seus modelos mentais, tipo de navegação e interação que ele tem com os objetos eletrônicos, mais particularm ente com a Internet.

As metáforas fazem que o usuário sinta-se à yqiítade, e se ela for boa, o u suário lem brará da inform ação por longo tempo e com a surpresa causada pela m etáfora provavelm ente ele irá explorar sua página para descobrir até onde pode chegar (Barreto, 1998).

Deve-ise levar em conta também que a maioria dos usuários são iniciantes, e que não precisam ter um treinam ento básico para trabalhar com a página, mas sim começar a navegar.

Os gráficos em 3 dim ensões e animações norm alm ente tem um tempo de carregamento maior que os de gráficos mais com uns, porém a m aioria dos usuários trabalha ainda com modems de velocidades baixas, e no caso de nosso país utilizam linhas telefônicas precárias, deve-se portanto pensar na demora para o carregam ento desta página, pois se o usuário esperar m uito tempo provavelm ente se frustrará ou irá procurar outra página. Por isso as metáforas devem ser leves.

As metáforas também devem ser fam iliares para o público-alvo. Um site que se baseia na estrutura de um motor de carro é ótimo para quem gosta de carros, mas pode ser péssim o para outras pessoas.

A m etáfora deve ser intuitiva, pois a utilização de uma metáfora inadequada irá forçar o usuário a aprender novos comandos.

Se usarmos uma m etáfora, ela deve ser u tilizada no Web site inteiro e não somente numa parte dele. E, uma vez escolhida uma metáfora, deve-se m an ter sua linha consistente, pois parece fácil manter a consistência, mas norm almente somos tentados a relaxar em alguns setores do Web site, ou, expandir a metáfora u tilizand o outros temas. Nestes casos o im portante e necessário é resistir à tentação mantendo a metáfora sim ples e coerente.

A utilização de metáforas do mundo real também facilita o reconhecim ento, a identificação e a associação do ícone por parte do usuário, que pode usar a cxpcricncia c aprendizado prcyio para interpretar e usar o ícone de modo efetivo (Parizoto, 1997).

(41)

A concepção de uma metáfora só é possível após a identificação do modelo mental do usuário, assim como a sua formação e a sua base de conhecim ento realizado na análise ergonôm ica através de entrevistas e observações (H iratsuka, 1996, p .93).

Segundo Treglown, citado por Cybis (1997) existem m uitas abordagens ao problema da produção de sistem as interativos e fáceis de usar. Um método que tenta sim p lificar a interface com o usuário aplica o conhecim ento que este tem sobre a tarefa e sobre os aspectos relevantes do seu mundo real para a concepção de metáforas de interface. Neste sentido, as m anipulações diretas baseadas em metáforas são usadas para reduzir o tempo necessário no aprendizado do uso do siste m a .

Para Carrol et al citada por Eberts (p.224, 1994) o uso de m etáforas deve seguir quatro passos básicos:

Qual a metáfora será utilizada O detalhamento da m etáfora

A identificação de problemas com esta metáfora

E a identificação de estratégias para ajudar os usuários a adm inistrar estes problemas.

As metáforas também devem ser exploradas para abranger outros meios culturais, que sejam, usuários de outros países. Sabemos que a Internet não está mais restrita as fronteiras de nosso país, se levarm os em conta apenas os países de língua portuguesa como idiom a oficial já terem os reunido sete países. Para poder alcançar ainda mais usuários será necessário traduzir, se não o conteúdo de todo o Web site, pelo menos um local com as palavras chaves. É necessário ter cuidado também com a utilização de termos técnicos, ou questões relativas a datas e medidas. Exemplo disso nos é dado por Nielsen na interface de um programa para crianças, chamado Dê ao cão um osso, as crianças consideram o programa excelente, mas quando o cachorro pede sua bola, a maior parte das crianças que moram na Europa irá oferecer ao cachorro um biscoito no lugar da bola de futebol (am ericano), pois a criança européia tem para si que bolas são redondas. Veja na figura abaixo a tela do software:

(42)

Figura 2.15 - figura mostrando a imagem de uma boia inadequada quando visualizada por outras Culturas. (Nielsen, 2000).

Segundo o autor o melhor é testar o seu software ou p ágina da Internet com pessoas de outras culturas e países.

O ideal seria fazer os testes com os usuários deslocando-se até os países de origem.

Sendo assim você deve ter em mente quantos países serão necessários mesmo q ue você se ocupe de apenas um ou dois países.

Mas ele deixa claro que não é necessário entrar em d esesp ero , deve-se com eçar aos poucos, fazendo o estudo primeiro com um país, ou pessoas daquele país, e depois aos poucos trabalhando com outros países (Nielsen, 1999).

2.19

R eco m en d açõ es s o b r e o u s o de c o r e s em i n t e r f a c e s

As cores devem ser utilizadas para a transm issão de inform ações, para chamar a atenção, criar contrastes e associações entre objetos. Desaconselha-se o seu uso meramente decorativo.

Para que a utilização da cor seja eficaz deve-se tom ar cuidado com três aspectos:

(43)

2, Com os efeitos das cores sobre a perform ance cognitiva do usuário

e;

3. Com as p ossib ilidades dos dispositivos físicos.

Estes aspectos devem ser levados em conta, pois o emprego exagerado das cores causa confusão visu al (Cybis, 1997).

Há uma variedade de recom endações sugeridas pelas literaturas sobre o uso de cores em interfaces:

Usar no máximo cinco e no mínim o duas cores diferentes. Apesar da tecnologia atual dispor de placas de alta resolução com 16 milhões de cores ou mais, a mente hum ana só é capaz de discrim inar cerca de 7,5 m ilhões de cores. Marcus citado por Hiratsuka, (1996)

Usar cores apropriadas às características fisiológicas do olho humano. Marcus citado por Hiratsuka (1996).

® A incidência de daltonism o é cerca de 8% dos homens europeus; ® A área central do campo visual é mais sensível ao verde e ao

vermelho;

® A área periférica do campo visual é mais sensível ao azul, ao preto, ao branco e ao amarelo.

Na tela, a cor magenta é formada por verm elho e azul (síntese aditiva), cores com maior diferença de com prim ento de onda no espectro visual. Por isso a sua focalização sim ultaneam ente deve ser evitada. Essa aberração crom ática é prejudicial à visão e o seu uso deve ser evitado (Righi, 1993).

A percepção de uma cor em relação a uma segunda é diferente da percepção de uma cor isoladam ente. As relações de contrastes figura e fundo mais alto devem ser usados principalm ente para texto.(Righi, 1993).

(44)

32

O uso de com binações de certas cores pode criar vibrações e pós-im agens (fantasmas) no contorno da figura. Ex: verde/verm elho, azul/verm elho (Righi, 1993).

Considerar o contexto cultural na codificação crom ática. As conotações das cores podem variar entre culturas. Ex: no Japão usa- se branco para velório enquanto que no ocidente usa-se preto (Marcus, 1992).

Considerar os estereótipos culturais na codificação cromática. As conotações das cores podem ser convencionadas (Cybis, 1997). Ex:

® Verm elho deve ser u tilizado para perigo, alarme, Atenção, alerta, calor e comandos de interrupção; © Amarelo para advertências, teste e lentidão;

® Verde para passagem livre, norm alidade, vegetação e segurança;

® Laranja para valor lim ite e radiação; ® Azul para frio, água, céu e calma; ® Cinza para inatividade, neutralidade; ® Branco é uma cor neutra.

Usar codificação de cores para cada sub assunto dentro do sistem a m ultim ídia. Para cada sub assunto pode ser usado um fundo, de cor diferente, textura diferente, ou até mesmo uma m etáfora diferente adequada ao contexto do sub assunto. A m udança de cor para fundo im plica em m udança de cor para fontes e outros elementos gráficos. O im portante é manter as mesmas características de program ação visual estipuladas para o sistem a m ultim ídia como um todo.

Usar distinção de cores para realçar determ inado elemento gráfico. Se o elemento gráfico requer o uso de m uitas cores, como no caso dos mapas, pode-se usar níveis de cores diferentes. Para cada

Referências

Documentos relacionados

Outras possíveis causas de paralisia flácida, ataxia e desordens neuromusculares, (como a ação de hemoparasitas, toxoplasmose, neosporose e botulismo) foram descartadas,

função recursiva, mais recursos de memória são necessários para executar o programa, o que pode torná-lo lento ou. computacionalmente

 Caminho simples que contém todas as arestas do grafo (e,. consequentemente, todos os

Dessa maneira, os resultados desta tese são uma síntese que propõe o uso de índices não convencionais de conforto térmico, utilizando o Índice de Temperatura de Globo Negro e

Dentre as misturas binárias estudados foi possível observar que a associação entre prednisona e ciclobenzaprina é provavelmente a mais instável devido ao aquecimento, dados este

Our contributions are: a set of guidelines that provide meaning to the different modelling elements of SysML used during the design of systems; the individual formal semantics for

Here, we aim to understand how expression of RA degradation enzymes (Cyp26) can be correlated with RA distribution and functions during amphioxus (B. lanceolatum)