[email protected] [email protected]
DSC/CCT/UFCG
Prof.: José Eustáquio Rangel de Queiroz
Carga Horária: 60 h
DSC/CCT/UFCG
Questões Introdutórias
 De que trata a disciplina Interface Homem-Máquina
(IHM)?
 Por que este curso é importante?
[email protected] [email protected]
 Quanto este curso exige do estudante?
 Há
de fato problemas relevantes a serem
solucionados IHM ou esta é apenas mais uma
disciplina para complementação de créditos?
 O que é projeto em IHM ?
 Por que avaliar uma interface é importante?
2
DSC/CCT/UFCG
Visão Geral
[email protected] [email protected]
 Interface Homem-Máquina (IHM) é uma
disciplina que trata do projeto, da
implementação e da avaliação de sistemas
interativos destinados ao uso humano
 IHM transcende o projeto de interfaces para
sistemas computacionais
 Diversidade de equipamentos eletro-eletrônicos
automatizados (e.g. forno de micro-ondas,
videocassetes, painéis de aeronaves)
3
Visão Geral
DSC/CCT/UFCG
[email protected] [email protected]
 IHM é uma área interdisciplinar

Ciência da Computação (engenharia e projeto
de aplicações de interfaces humanas);

Psicologia (aplicação de teorias cognitivas e
análises comportamentais do usuário);

Sociologia e Anthropologia (interações entre
tecnologias,
contextos
de
trabalho
e
corporações);

Projeto Industrial
interativos).
(geração
de
produtos
4
Visão Geral
DSC/CCT/UFCG
 Eixos-chaves

Abordagens de Projeto
[email protected] [email protected]


e.g. considerações de fatores humanos, diretrizes para
projeto gráfico, engenharia de software, análise da
tarefa;
Técnicas e Ferramentas de Implementação
 e.g. técnicas de prototipagem, caixas de ferramentas de
diálogo, métodos orientados a objetos, representação
de dados; e

Técnicas de Avaliação
 e.g. análise de desempenho, teste de usabilidade,
sondagem da satisfação, inspeção de conformidade de
produtos a padrões, heurísticas, guias de estilo, etc.
5
Visão Geral
DSC/CCT/UFCG
 Problema simples de projeto:
[email protected] [email protected]

Faça-me uma caixa
ou seja,

Construa-me uma caixa
6
Visão Geral
DSC/CCT/UFCG
 Quem usará a caixa?
 Para que a caixa será usada?
 Onde a caixa será usada?
[email protected] [email protected]
 Qual o artefato que está sendo atualmente usado
em lugar da caixa?
 Quão importante é que a caixa:

tenha dimensões exatas?

seja construída em um material específico?

seja resistente a impactos?
…

7
Visão Geral
DSC/CCT/UFCG
 Questões
freqüentemente ouvidas ou
formuladas no contexto de projeto da IHM
[email protected] [email protected]
 Quem usará o sistema?
 Para que o sistema será usado?
 Qual o sistema que existe atualmente?
 Qual o contexto de uso do sistema?
8
Visão Geral
DSC/CCT/UFCG
 Falha nas respostas relevantes ao contexto
do projeto  resultados desastrosos
[email protected] [email protected]

implementações de projetos deficientes
 Exemplos

Spruce Goose

MS-Bob

Painel de controle do Three-mile Island

...
9
Visão Geral
DSC/CCT/UFCG
 Evitar resultados desastrosos

Compreensão Contextual
[email protected] [email protected]
Usuários
Sistemas
Tarefas
Ambientes
10
Visão Geral
DSC/CCT/UFCG
 Projeto e implementação de sistemas úteis
[email protected] [email protected]

Suprimento da funcionalidade que os usuários
necessitam
 Projeto e
usáveis

implementação
de
sistemas
Suprimento da funcionalidade que pode ser
usada com um grau de esforço moderado
11
Visão Geral
DSC/CCT/UFCG
[email protected] [email protected]
 Dificuldades do curso

NÃO se deve à quantidade de tarefas

NÃO se deve ao grau de dificuldade dos
exercícios de avaliação

NÃO se deve ao dispêndio de tempo
com a execução do projeto

DEVE-SE à focalização no projeto

Aprendizado e execução de projetos não
é uma atividade trivial
12
Visão Geral
DSC/CCT/UFCG
[email protected] [email protected]
 Por que o projeto da IHM não é trivial?

Projetistas sentem dificuldade em apre(E)nder
as tarefas do usuário;

As tarefas e seus domínios podem assumir
graus de complexidade elevados;

Há diversos aspectos de naturezas distintas a
serem contrabalançados

E.g. projeto gráfico, internacionalização,
padrões, desempenho, satisfação, graus de
detalhamento, fatores sociais, questões legais,
prazos;
13
Visão Geral
DSC/CCT/UFCG
[email protected] [email protected]
 Por que o projeto da IHM não é trivial?

Teorias e diretrizes existentes NÃO garantem
per si a concepção de BONS projetos;

Projeto iterativo e iNterativo NÃO é simples;

Projeto de interfaces NÃO é projeto gráfico!
14
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Desastres em IHM

Torrey Canyon

Soyuz 11

Bhopal

Therac-25

Ônibus Espacial A320
15
Exemplos de Desastres
DSC/CCT/UFCG
 Torrey Canyon - Características

Super-petroleiro (Março, 1967)
[email protected] [email protected]



31.000.000 de galões
Entrega arriscada!

Canal com 6 milhas de largura

Aportamento APENAS numa maré muito alta
(MAS …)
(…) Tripulação
automatizado
experiente
e
navio
16
Exemplos de Desastres
DSC/CCT/UFCG
 Torrey Canyon - Projeto
[email protected] [email protected]

Controle de leme com 3 posições

automático (posição próxima)

manual (posição intermediária)

controle (posição distante)

SE o leme falhar, desconectá-lo e cambiar a
direção para uma alavanca de controle

Retorno (feedback) audível (clique para grau
de mudança de curso)

“Ajuste fino” (até 3º ) em modo automático
17
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]

Torrey Canyon - Uso

Posição mal calculada;

Mudança de curso significativa necessária;

Controle de leme cambiado de automático
para manual;

Conversão feita, MAS …

… Controle de leme foi cambiado de manual
para controle.
18
Exemplos de Desastres
DSC/CCT/UFCG

Torrey Canyon - Resultado
[email protected] [email protected]

31.000.000 de galões de petróleo
ATINGIRAM a Inglaterra e a França !!!
19
Exemplos de Desastres
DSC/CCT/UFCG
 Torrey Canyon - Problema
[email protected] [email protected]


Retorno da informação (feedback) sobre a
posição de controle do leme

sugestão de posição, MAS os olhos estavam
em outra parte

clique audível
posição

ausência de cliques sinalizou o problema,
MAS muito tarde!
sinalizando
mudança
de
Ausência de uma sugestão pode não ser
uma forma eficaz de feedback
20
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Soyuz 11 - Características

Retorno da estação
(Junho, 1971)
espacial
Salyut

Tripulação
altamente
treinada,
espaçonave altamente automatizada

Segurança e redundância SÃO metas de
projeto
21
Exemplos de Desastres
DSC/CCT/UFCG
 Soyuz 11 - Projeto
[email protected] [email protected]

Na entrada na Atmosfera

Retro-foguetes do módulo orbital reduziriam
a velocidade da aeronave;

Módulo de comando se separaria do módulo
orbital;

Foguetes de orientação manteriam o curso;

Pára-quedas se abriria, escudo de reentrada
seria descartado, foguetes de aterrissagem
disparariam, válvula de equalização da
pressão se abriria.
22
Exemplos de Desastres
DSC/CCT/UFCG
 Soyuz 11 - Uso
[email protected] [email protected]

Na entrada na Atmosfera

Pinos explosivos separaram
orbital do módulo de comando;

Válvula de equalização da pressão abriu-se,
aeronave girou, começou a perder pressão e
oxigênio;

A válvula foi fechada manualmente …

o
módulo
... MAS não a tempo de evitar o trágico desfecho.
23
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Soyuz 11 - Resultado

Soyouz 11 aterrissou, MAS...

... os 3 cosmonautas MORRERAM !!!
24
Exemplos de Desastres
DSC/CCT/UFCG
 Soyuz 11 - Problema
[email protected] [email protected]

Segurança e redundância NÃO testadas
sob condições de uso “típicas”!
Como v. testaria tal sistema?
 courses.cs.vt.edu/~cs3604/lib/Safety/soyuz11.html
 http://www.users.wineasy.se/svengrahn/histind/Soyuz11Land/Soyuz11land.html
25
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Bhopal - Características

Índia (Dezembro, 1984)

Pesticida Sevin (isocianato de metila - MIC)

“...our safety standards in the U.S. are
identical to those in India or Brazil or some
place else. Same equipment, same design,
same everything” 1
1 Warren Anderson, Presidente da Union Carbide
26
Exemplos de Desastres
DSC/CCT/UFCG
 Bhopal - Projeto
[email protected] [email protected]

Segurança (?)

medidor de pressão (sala de controle)

termômetro (tanques)

unidade de refrigeração

depurador de soda cáustica

sistema de flare

sistema de lavagem de gases
27
Exemplos de Desastres
DSC/CCT/UFCG

Bhopal – Uso (1)

medidor de pressão

[email protected] [email protected]

termômetro


máximo de 77°
unidade de refrigeração


“normal” (10psi, mas era 2psi minutos antes!!!)
líquido de resfriamento drenado e usado fora
depurador de soda cáustica

medidor defeituoso indicava falha
28
Exemplos de Desastres
DSC/CCT/UFCG

Bhopal – Uso (2)
[email protected] [email protected]


sistema de flare

tubo de conexão retirado para manutenção

tubo NÃO reposto!

fora de serviço
sistema de lavagem de gases

gás atingiu mais de 100 pés; água SÓ atingiu 40
pés
29
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]

Bhopal - Resultado

nuvem de 40 T de isocianato de metila

cerca de 200.000 expostos

cerca de 2.500 MORTOS!!!
30
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Bhopal - Problemas

NENHUM treinamento em procedimentos de
emergência

Apresentação de ESTADOS,
MUDANÇAS DE ESTADO
não
de
 gurukul.ucc.american.edu/ted/BHOPAL.HTM
31
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Therac-25 - Características

Equipamento de radioterapia (1985-1987)

PDP-11, VT100

Dois modos de operação (apenas!)

Raios X



máxima potência via espessa placa metálica
radiação de tumores internos
Feixe eletrônico


baixa potência, feixe direcionado
cobertura localizada
32
Exemplos de Desastres
DSC/CCT/UFCG
 Therac-25 - Projeto

Opções
[email protected] [email protected]

feixe de alta potência (25.000 rads), placa
metálica posicionada sob o feixe
type “e” (feixe eletrônico)


modo RAIOS X
type “x” (raios X)


modo FEIXE E
feixe de baixa potência (200 rads), placa metálica
retraída
type “b”2 (ativar feixe)
2 beam – feixe, em inglês
33
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Therac-25 - Uso

type “x” (!!!) <edit mode> “e” “b”

feixe de alta potência, placa metálica
retraída

mensagem de erro: Malfunction 54

type “b” Malfunction 54 “b” Malfunction
54 …
34
Exemplos de Desastres
DSC/CCT/UFCG
 Therac-25 - Resultado
[email protected] [email protected]


paciente MORREU devido
excessiva de radiação!!!
à
dose
courses.cs.vt.edu/~cs3604/lib/Therac_25/Therac_1.html
35
Exemplos de Desastres
DSC/CCT/UFCG
 Therac-25 – Problemas

Seqüência de entrada NUNCA testada (!!!)
[email protected] [email protected]


entrada de dados pelo usuário  erro percebido
 erro corrigido
Falta de clareza no retorno da informação
(feedback)

Malfunction 54 não significava NADA para o
operador!
36
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Aeronave A320 - Características

Show
aéreo
próximo
ao
aeroporto
Mulhouse-Habsheim (França – Junho, 1988)

Tour de force tecnológico


flightdeck.ie.orst.edu/FDAI/Phase1/phase1.html
www.gecas.com/tour_airbus320.asp
37
Exemplos de Desastres
DSC/CCT/UFCG
 Ônibus Espacial A320 - Projeto

Aeronave com tecnologia fly-by-wire
[email protected] [email protected]

sistema computadorizado projetado para
prevenir erros humanos de pilotagem


Manobras de risco da aeronave,
e.g.
aterrissagens, ascenções e mergulhos extremos.
5 (cinco) computadores
proteção de vôo

proporcionando
manutenção da aeronave no curso de vôo (ao
invés de entradas feitas pelo piloto)
38
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Ônibus Espacial A320 - Uso

estratégia de baixa altitude (100 pés, 130
nós)

proteção de vôo desativada, a fim de
permitir manobra

a 30 pés, aeronave posicionada para a
subida

retardo no acionamento das turbinas
39
Exemplos de Desastres
DSC/CCT/UFCG
 Ônibus Espacial A320 - Resultado


[email protected] [email protected]


colisão com árvores impediu a decolagem ...
... a aeronave partiu-se...
... e explodiu ao atingir o solo...
... resultando na MORTE de TODOS os
tripulantes e passageiros!!!
40
Exemplos de Desastres
DSC/CCT/UFCG
[email protected] [email protected]
 Ônibus Espacial A320 – Problemas

Piloto praticou a manobra em altitude com
proteção de vôo ativa

EXCESSO de confiança na proteção de vôo
41
Interface Homemmáquina
 O que É uma interface homem-máquina?
[email protected] [email protected]
DSC/CCT/UFCG

parte do sistema que expande a autonomia do
usuário

agente integrador das propriedades físicas da
interação, das funções do sistema e do
equilíbrio entre a extensão e o controle da
funcionalidade
42
Interface Homemmáquina
 O que é projeto da IHM?
[email protected] [email protected]
DSC/CCT/UFCG

concepção de solução para problema em
sistema interativo destinado ao uso humano,
de modo a disponibilizá-lo para mais
indivíduos

necessidades e expectativas do usuário

resultado da revolução industrial

Ergonomia na Europa

Fatores Humanos nos EUA
43
DSC/CCT/UFCG
Fatores
Humanos/Ergonomia
 Fatores Humanos/ Ergonomia
[email protected] [email protected]

Ciência aplicada relativa às características de
indivíduos a serem consideradas no projeto e
estruturação de artefatos por eles utilizados, de
modo a prover uma interação mais efetiva e
segura
44
DSC/CCT/UFCG
Fatores
Humanos/Ergonomia
 Engenharia de Fatores Humanos/ Engenharia
de Usabilidade
[email protected] [email protected]

Aplicação de conhecimentos sobre características
humanas, visando o projeto dos aspectos físicos
dos sistemas e equipamentos  interface com o
usuário
45
Eng. de Fatores Humanos
DSC/CCT/UFCG
 Meta

Otimização do desempenho do sistema
[email protected] [email protected]

Compatibilização de processos (sistemas e
ambientes) e atributos (usuários)

Projeto, implementação e
sistemas ou equipamentos
avaliação
dos

Tarefas humanas requeridas para a operação,
manutenção, controle e suporte dos sistemas
ou equipamentos

Ambiente de trabalho

Atributos sensoriais, perceptivos, mentais e
físicos dos usuários
46
Evolução
DSC/CCT/UFCG
 Engenharia e Psicologia Industrial

Operações e equipamentos
[email protected] [email protected]

Elevação da eficiência
 2ª Guerra Mundial

Segurança pessoal

Visualização de informações em cabines de
aeronaves (sistemas homem-máquina)

Deficiência dos controles e visualizadores

Indução de erros
47
Evolução
DSC/CCT/UFCG
[email protected] [email protected]
 Atualidade

Complexidade
progressiva
computacionais

Difusão mais efetiva de problemas e acidentes
envolvendo usuários

das
tecnologias
Three-mile Island

Projeto mais ergonômico de artefatos em geral para
uso humano

Avanços da indústria de dispositivos médicos

Hardware computacional “mais amigável” com o
usuário
48
DSC/CCT/UFCG
Breve Histórico
 Computador digital concebido em idéias nos
séculos XVIII e XIX
[email protected] [email protected]
 Tecnologia tornou-se disponível nas décadas
40 e 50 do século XX
Breve Histórico
DSC/CCT/UFCG
MemEx
Vanevar Bush (1890-
[email protected] [email protected]
1974)
MemEx = Memory Expander (primeiros
escritos: início dos anos 30)
1945 M e m e x
 As we may think
(The Atlantic Monthly - Julho 1945)
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
 www.press.jhu.edu/press/books/landow/memex.html
 www.theatlantic.com/unbound/flashbks/computer/bushf.htm
 www.aedo-to.com/eng/inspiration/future/realizzati/01/ art01.html
1974 B r a v o
1981
1983
S t a r  Concebido como sistema baseado em
L i s a microfilme, não em computador
1984
Mac
1985 Windows
50
Breve Histórico
DSC/CCT/UFCG
MemEx
Vanevar Bush (1890-
1974)

Possibilidade de armazenamento
[email protected] [email protected]
de todos os registros/ artigos/
comunicações
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
 Capacidade elevada de memória
 Itens recuperados por indexação,
FLEX
Alto
1974 B r a v o
1981
1983
palavras-chaves, cruzamento de
referências
Star
Lisa
1984
Mac
1985 Windows
51
Breve Histórico
DSC/CCT/UFCG
MemEx
Vanevar Bush (1890-
[email protected] [email protected]
1974)
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
52
Breve Histórico
DSC/CCT/UFCG
Sketchpad
Ivan Sutherland
(1938) em 1963 no MIT Laboratory
 Ph.D
 Dispositivo
[email protected] [email protected]
de entrada:
óptica usada sobre CRT
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
Caneta
 Possibilidade
de
desenho
e
modificação de objetos gráficos
através de constraints
 Modelo orientado a objetos
 Funções de cópia (copy) e colagem
(paste)
53
Breve Histórico
DSC/CCT/UFCG
Sketchpad
Ivan Sutherland
(1938)
 Funções
de cópia (copy) e colagem
[email protected] [email protected]
(paste)
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
54
Breve Histórico
DSC/CCT/UFCG
Augment/NLS
Douglas Engelbart (1925- )
 Fundador do Augmentation Research
[email protected] [email protected]
Center (1963)
1945 M e m e x
 Diversas contribuições para o domínio
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
da interação usuário-computador –
mouse, NLS, interface gráfica com o
usuário
 www.livinginternet.com/?w/wi_engelbart.htm
 www.bootstrap.org/engelbart/hist_pix/index.jsp
 www.histech.rwth-
aachen.de/www/quellen/engelbart/ahi62index.html
55
Breve Histórico
DSC/CCT/UFCG
Mouse
Douglas Engelbart
[email protected] [email protected]
(1925- )
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
56
Breve Histórico
DSC/CCT/UFCG
Augment/NLS
Douglas Engelbart (1925- )
 Demonstração pública do NLS, em
[email protected] [email protected]
1968 (90 minutos de vídeo)
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
 NLS: oN Line System
 NLS foi o 2° sistema computacional
conectado à ARPANET
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
57
Breve Histórico
DSC/CCT/UFCG
Augment/NLS
Douglas Engelbart (1925- )
 Características pioneiras do NLS:
[email protected] [email protected]
 mouse
1945 M e m e x
 edição em visualizador 2D
1963 Sketchpad
 endereçamento e indexação de objetos in-file
1968 Augment
 hipermídia
1969
1973
FLEX
Alto
 processamento outline
1974 B r a v o
 controle de visualização flexível
1981
1983
 multi-janelas
Star
Lisa
1984
Mac
1985 Windows
 edição cross-file
58
Breve Histórico
DSC/CCT/UFCG
Augment/NLS
Douglas Engelbart (1925- )
 Características pioneiras do NLS:
[email protected] [email protected]
 e-mail com hipermídia
1945 M e m e x
 controle de versões de documentos
1963 Sketchpad
 teleconferência via tela compartilhada
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
 reuniões mediadas por computador
 ajuda sensível ao contexto
 arquitetura cliente-servidor distribuída
 sintaxe de comandos uniforme
59
Breve Histórico
DSC/CCT/UFCG
Augment/NLS
Douglas Engelbart (1925- )
[email protected] [email protected]
 Características pioneiras do NLS:
 módulo front-end de "interface com o usuário"
universal
1945 M e m e x
1968 Augment
 interpretador de linguagem de comandos
orientado a gramática
1969
 protocolos para terminais virtuais
1963 Sketchpad
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
 protocolos para chamada de procedimentos
remotos
 "Metalinguagem de Comandos" compilável
60
Breve Histórico
DSC/CCT/UFCG
Augment/NLS
[email protected] [email protected]
Douglas Engelbart (1925- )
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
61
Breve Histórico
DSC/CCT/UFCG
FLEX
Alan Kay (1940- )
[email protected] [email protected]
 Concepção do 1° computador pessoal
(final dos anos 60 – University of Utah)
a suportar uma linguagem gráfica e de
simulação
1945 M e m e x
 www.cosc.canterbury.ac.nz/~wolfgang/cosc205/
1963 Sketchpad
smalltalk1.html
1968 Augment
1969
1973
FLEX
Alto
 FLEX:
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
FLExible EXtendable
Machine e FLEX Language)
(FLEX
 www.users.qwest.net/~rvossler/vision.html
 www.mprove.de/diplom/gui/kay69.html#IIAf
62
Breve Histórico
DSC/CCT/UFCG
FLEX
 Precursor
Alan Kay (1940- )
do Dynabook,
(XEROX) e do Mac (Apple)
do
Star
 www.ieee.org/organizations/history_center/cht_papers/
[email protected] [email protected]
Barnes.pdf
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
63
Breve Histórico
DSC/CCT/UFCG
Alto
 Precursor
XEROX PARC (1973)
do Dynabook,
(XEROX) e do Mac (Apple)
do
Star
 www.ieee.org/organizations/history_center/cht_papers/
[email protected] [email protected]
Barnes.pdf
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
64
Breve Histórico
DSC/CCT/UFCG
Alto
XEROX PARC (1973)
 Primeira estação de trabalho pessoal

 Primeiras
[email protected] [email protected]
iniciativas
desenvolvimento de:
1963 Sketchpad
1968 Augment
1973
FLEX
 Incorporação
Alto
1974 B r a v o
1981
1983
de
resultados
de
 mouse
 edição WYSIWYG
 gráficos bit-map
1945 M e m e x
1969
efetivas
Star
Lisa
1984
Mac
1985 Windows
dos
pesquisa de:
 rede local
 impressão a laser
 todos os conceitos modernos de computação
distribuída cliente/servidor
65
Breve Histórico
DSC/CCT/UFCG
Alto
XEROX PARC (1973)
 Licenciamento do mouse (1971) e do
Alto (1973) para a XEROX

[email protected] [email protected]
 Fato mais surpreendente:
 uso por apenas um usuário (PC)
1945 M e m e x
1963 Sketchpad
 Visualizador gráfico P&B com pixels
1968 Augment
1969
1973
FLEX
 resolução: 808 x 606 pixels
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
66
Breve Histórico
DSC/CCT/UFCG
Alto
XEROX PARC (1973)
 Interface gráfica (GUI):
[email protected] [email protected]
 janelas controladas pelo cursor
 dispositivo de entrada: mouse
 menu popup (controle de tarefas)
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
 Impressora a laser
 Ethernet
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
67
Breve Histórico
DSC/CCT/UFCG
Bravo
XEROX PARC (1974)
 Sistema de edição de documentos para
o Alto
[email protected] [email protected]
 Charles Simonyi & Butler Lampson
1945 M e m e x
 Editor
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
de texto
facilidades de:
WYSIWYG
com
 sublinhado
 negrito
 itálico
 família de fontes
 caracteres com largura variável
 divisão de tela
68
Breve Histórico
DSC/CCT/UFCG
BravoX
XEROX PARC (1976-
1978)
 Versão melhorada do Bravo
 Larry Tessler
[email protected] [email protected]
 Protótipo Gypsy
1945 M e m e x
1963 Sketchpad
 Incorporação de estilos - capacidade de
controle da aparência de documentos
1968 Augment
1969
1973
FLEX
Alto
 Simonyi integrou-se à Microsoft
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
 desenvolvimento do MS Word
69
Breve Histórico
DSC/CCT/UFCG
Star
XEROX (1981)
 Projetado
como
sistema
automação de escritórios
para
[email protected] [email protected]
 Computador
para profissionais em
organizações de negócios
1945 M e m e x
1963 Sketchpad
 Meta-chave: o computador invisível
1968 Augment
1969
1973
FLEX
Alto
para o usuário
 Primeiro
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
computador fundamentado
em engenharia de usabilidade
 prototipagem e análise em papel
 teste de usabilidade e refinamento iterativo
70
Breve Histórico
DSC/CCT/UFCG
Star
XEROX (1981)
 GUI fácil de apre(E)nder
 janelas passíveis de superposição
[email protected] [email protected]
 uso de ícones para a manipulação do
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
sistema (manipulação direta)
 ícones diferentes para tipos diferentes de
arquivos
 “desvendamento” progressivo
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
 www.thocp.net/hardware/xerox_star.htm
 www.geocities.com/SiliconValley/Office/7101/retrospect/
71
Breve Histórico
DSC/CCT/UFCG
Star
XEROX (1981)
[email protected] [email protected]
 Arquitetura fechada
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
72
Breve Histórico
DSC/CCT/UFCG
Star
XEROX (1981)
[email protected] [email protected]
 GUI (1)
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
73
Breve Histórico
DSC/CCT/UFCG
Star
XEROX (1981)
[email protected] [email protected]
 GUI (2)
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
74
Breve Histórico
DSC/CCT/UFCG
Lisa
Apple (1983)
 Início do desenvolvimento em 1979
como sistema com interface textual
 Reprojeto
[email protected] [email protected]
como sistema
similar ao Star da XEROX
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
gráfico
 GUI muito similar à do Star
 http://www.pegasus3d.com/apple_screens.html
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
75
Breve Histórico
DSC/CCT/UFCG
Lisa
Apple (1983)
 Lisa 7/7

LisaWrite - processador de texto
[email protected] [email protected]
5

LisaCalc - planilha eletrônica

LisaGraph - editor gráfico
1963 Sketchpad

LisaList - agenda
1968 Augment

LisaProject - gerenciador de projetos

LisaDraw - aplicativo de desenho

LisaTerminal - aplicativo de comunicações
via modem
1945 M e m e x
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
76
Breve Histórico
DSC/CCT/UFCG
Lisa
Apple (1983)
[email protected] [email protected]
 GUI
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
77
Breve Histórico
DSC/CCT/UFCG
Macintosh
Apple (1984)
 Steve Jobs - líder do projeto do
Macintosh
[email protected] [email protected]
 Jef Raskin - projeto original
 Uso
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
profundamente
projeto físico
vinculado
ao
 GUI muito similar à do Lisa
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
78
Breve Histórico
DSC/CCT/UFCG
Macintosh
Apple (1984)
[email protected] [email protected]
 GUI
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
79
Breve Histórico
DSC/CCT/UFCG
Macintosh
Apple (1984)
 Problema do Mac - apenas 128 kB de
memória
[email protected] [email protected]
 Aplicações bem escritas - MacWrite e
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
MacDraw
 Mac 512k, Mac512ke e Mac Plus foram
lançados para “salvar” o Mac
 Novas aplicações - Pagemaker, Word
Excel
 http://www.ideafinder.com/history/inventors/jobs.htm
 http://www.landsnail.com/apple/local/design/macintosh.html
80
Breve Histórico
DSC/CCT/UFCG
Macintosh
Apple (1984)
 Problema do Mac - apenas 128 kB de
memória
[email protected] [email protected]
 Aplicações bem escritas - MacWrite e
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
MacDraw
 Mac 512k, Mac512ke e Mac Plus foram
lançados para “salvar” o Mac
 Novas aplicações - Pagemaker, Word
Excel
 http://www.ideafinder.com/history/inventors/jobs.htm
 http://www.landsnail.com/apple/local/design/macintosh.html
81
Breve Histórico
DSC/CCT/UFCG
Windows
[email protected] [email protected]
(1985)
Microsoft
Descendente do DOS,
Windows 1.0 – 3.11 e Windows 9x
Descendente do
Windows NT
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
82
Exercício 01
DSC/CCT/UFCG
 Realizar um estudo comparativo
[email protected] [email protected]
da família Windows em nível da
interface com o usuário.
1945 M e m e x
1963 Sketchpad
1968 Augment
1969
1973
FLEX
Alto
1974 B r a v o
1981
1983
Star
Lisa
1984
Mac
1985 Windows
83
DSC/CCT/UFCG
José Eustáquio Rangel de Queiroz
UNIVERSIDADE FEDERAL DE CAMPINA GRANDE
CENTRO DE CIÊNCIAS E TECNOLOGIA
[email protected] [email protected]
DEPARTAMENTO DE SISTEMAS E COMPUTAÇÃO