Breve História da computação/
interface
2400 A.C. aos dias de hoje!
Prof. Marcio Rocha
Design de Interface / FAV UFG
Linha do tempo
Evolução da interface do Usuário
Ábaco (~2400 a.C.): Uma das primeiras ferramentas de cálculo, usada para operações matemáticas básicas. Embora não seja uma interface de usuário como entendemos hoje, é um exemplo inicial de dispositivos que mediavam
a interação entre humanos e dados.
1642 - Pascaline de Blaise Pascal: Primeira calculadora mecânica, criada por Blaise Pascal, capaz de realizar operações de adição e subtração. Representa o início da automação do cálculo.
1837 - Charles Babbage e a Máquina Analítica: Considerada o primeiro conceito de um computador programável. Babbage imaginou um dispositivo com uma "unidade de processamento", "memória", e um "dispositivo de
entrada/saída", criando a base para futuros computadores.
1843 - Ada Lovelace e o Primeiro Algoritmo: Ada Lovelace, colaboradora de Babbage, é creditada com a criação do primeiro algoritmo destinado a ser processado por uma máquina (a Máquina Analítica). Ela é considerada a
primeira programadora de computadores.
1936 - Alan Turing e a Máquina de Turing: Turing propôs um modelo matemático de computação que poderia simular qualquer algoritmo. Sua ideia de uma "máquina universal" influenciou fortemente o desenvolvimento de
computadores digitais.
1940s - Computadores de Primeira Geração (ENIAC, Colossus, etc.): Computadores como o ENIAC e o Colossus, desenvolvidos durante e após a Segunda Guerra Mundial, marcaram o início da era da computação digital,
com interfaces de interação baseadas em painéis de controle e cartões perfurados.
1963 - Ivan Sutherland e o Sketchpad: O primeiro programa de design gráfico interativo, permitindo manipulação direta de objetos na tela com um lápis de luz. Considerado um marco inicial no design de interfaces gráficas.
1968 - Douglas Engelbart e a "Mother of All Demos": Demonstração de várias inovações de interface de usuário, incluindo o mouse, janelas sobrepostas, hipertexto, videoconferência, edição de texto colaborativa e muito mais.
1973 - Xerox Alto e o Nascimento da Interface Gráfica: Primeiro computador a implementar uma GUI (Graphical User Interface) completa, incluindo ícones, janelas e o uso de mouse. O trabalho no Xerox PARC foi fundamental
para a evolução do design de interfaces.
1981 - Xerox Star: O primeiro computador comercial com uma interface gráfica de usuário. Introduziu elementos como ícones, desktop, e metáforas de papelaria digital.
1984 - Lançamento do Apple Macintosh: Tornou as interfaces gráficas amplamente acessíveis ao público, com uso extensivo do mouse e elementos visuais intuitivos.
1985 - Microsoft Windows 1.0: Primeira versão do Windows, tentando trazer interfaces gráficas aos PCs baseados em MS-DOS, com recursos básicos de janela.
Anos 1990 - Evolução das Interfaces de Navegação Web: Introdução do Mosaic (1993) e, posteriormente, do Netscape Navigator, que estabeleceram novos padrões para interfaces gráficas na web, incluindo o uso de
hiperlinks, gráficos, e multimídia.
2007 - Lançamento do iPhone: Revolução no design de interface com a introdução de uma tela sensível ao toque, gestos multitoque e uma interface simplificada, sem teclado físico.
2010 - Avanços em Realidade Virtual e Aumentada: Interfaces começam a expandir para além das telas tradicionais, incluindo interfaces de voz (Alexa, Siri) e imersão por meio de dispositivos VR/AR.
O ábaco é um antigo instrumento de cálculo, que
Ábaco (~2400 a.C.): Uma das primeiras segundo muitos historiadores foi inventado na
ferramentas de cálculo, usada para operações Mesopotâmia, pelo menos em sua forma primitiva e
depois os chineses e romanos o aperfeiçoaram.
matemáticas básicas. O ábaco (do grego abakos : tábua de cálculos)
ou soroban (japonês), é um antigo instrumento
de cálculo, popularmente em sistema decimal, com
Embora não seja uma interface de usuário como provável origem na Mesopotâmia há mais de 5500 anos,
entendemos hoje, é um exemplo inicial de considerado como uma extensão do ato de contar com
os dedos.
dispositivos que mediavam a interação entre Ele é utilizado ainda hoje para ensinar às crianças as
humanos e dados. operações aritméticas
1642 - Pascaline
de Blaise Pascal:
Primeira
calculadora
mecânica, criada
por Blaise Pascal,
capaz de realizar
operações de
adição e
subtração.
Representa o
A pascalina, também conhecida como máquina de Pascal, calculadora de Pascal e máquina
aritmética, é uma calculadora mecânica inventada por Blaise Pascal em 1642. Pascal foi levado início da
a desenvolver uma calculadora pelos trabalhosos cálculos aritméticos exigidos pelo trabalho de
seu pai como supervisor de impostos. Ele projetou a máquina para adicionar e subtrair dois automação do
números diretamente e realizar multiplicações e divisões através de repetidas adições ou
subtrações. cálculo.
1804 - Joseph-Marie Jacquard e o Jacquard
Loom: Introdução do conceito de automação com
cartões perfurados, influenciando diretamente
futuros desenvolvimentos na computação.
How an 1803 Jacquard Loom Led to Computer Technology - https://www.youtube.com/watch?v=MQzpLLhN0fY
Binary and the Jacquard Mechanism - demonstration - https://www.youtube.com/watch?v=pzYucg3Tmho
1837 - Charles Babbage A máquina analítica, também conhecido
e a Máquina Analítica: como engenho analítico foi proposto
pelo professor de matemática e pioneiro
Considerada o primeiro da ciência da computação Charles
conceito de um Babbage, tornando-o o primeiro projeto
para um computador de uso geral.
computador
programável. Babbage A Maquina analítica é uma das
realizações mais bem sucedidas de
imaginou um dispositivo Charles Babbage. Mas Babbage nunca
com uma "unidade de foi capaz de concluir a construção de
nenhuma de suas máquinas devido a
processamento", conflitos com seu engenheiro-chefe e
"memória", e um financiamento inadequado.
"dispositivo de entrada/ Somente no final da década de 1940 que
saída", criando a base os primeiros computadores de uso geral
foram realmente construídos, mais de um
para futuros século depois de Babbage ter proposto o
computadores. pioneiro mecanismo analítico em 1837
Bubbles Whiting - Using Punch Cards - Hollerith and IBM https://www.youtube.com/watch?v=L7jAOcc9kBU
1964 IBM 029 Keypunch Card Punching Demonstration - https://www.youtube.com/watch?v=YnnGbcM-H8c
1843 - Ada Lovelace
e o Primeiro
Algoritmo: Ada
Lovelace,
colaboradora de
Babbage, é
creditada com a
criação do primeiro
algoritmo destinado
a ser processado
por uma máquina (a
Máquina Analítica).
Ela é considerada a
primeira
programadora de
computadores.
Ada Lovelace é
conhecida por seu
trabalho com o
matemático britânico
Charles Babbage em
particular com sua
proposta de criar um
programa para a
Máquina Analítica de
Babbage, que seria
considerado o primeiro
algoritmo para ser
processado por uma
máquina de
computação.
1936 - Alan Turing e
a Máquina de Turing:
Turing propôs um
modelo matemático
de computação que
poderia simular
qualquer algoritmo.
Sua ideia de uma
"máquina universal"
influenciou
fortemente o
desenvolvimento de
computadores
digitais.
Turing machines explained visually - https://www.youtube.com/watch?v=-ZS_zFg4w5k
Alan Turing - Celebrating the life of a genius - https://www.youtube.com/watch?v=gtRLmL70TH0
1940s -
Computadores de
Primeira Geração
(ENIAC, Colossus,
etc.):
Computadores
como o ENIAC e o
Colossus,
desenvolvidos
durante e após a
Segunda Guerra
Mundial, marcaram
o início da era da
computação
digital, com
interfaces de
interação
baseadas em
painéis de controle
e cartões
perfurados.
Colossus foi um conjunto
de computadores
desenvolvidos por
decifradores britânicos
nos anos de 1943 a
1945 para ajudar
na criptoanálise da cifra
de Lorenz.
A Colossus usava válvulas
termiônicas (tubos a
vácuo) para realizar
operações booleanas e de
contagem.
Colossus é, portanto,
considerado o primeiro
computador digital
programável, eletrônico,
embora tenha sido
programado por
interruptores e plugues e
não por um programa
armazenado.
1963 - Ivan
Sutherland e o
Sketchpad: O
primeiro
programa de
design gráfico
interativo,
permitindo
manipulação
direta de objetos
na tela com um
lápis de luz.
Considerado um
marco inicial no
design de
interfaces
gráficas.
Ivan Sutherland Sketchpad Demo 2 2 - https://www.youtube.com/watch?v=DJwQ7GGRbUE
Em 9 de dezembro de 1968, Douglas C. Engelbart
e um grupo de 17 pesquisadores do 1968 - Douglas Engelbart e a "Mother of All
Augmentation Research Center no Stanford
Research Institute, em Menlo Park, Califórnia, Demos": Demonstração de várias inovações de
apresentaram uma demonstração pública de 90
minutos do sistema online NLS, no qual vinham
interface de usuário, incluindo o mouse, janelas
trabalhando desde 1962, com cerca de 1.000
profissionais de computação presentes.
sobrepostas, hipertexto, videoconferência,
Essa demonstração foi a estreia pública do
mouse de computador, mas o mouse foi apenas
edição de texto colaborativa e muito mais.
uma das muitas inovações apresentadas naquele
dia.
Entre as inovações, estavam o hipertexto, o
endereçamento de objetos, a vinculação dinâmica
de arquivos e a colaboração de tela
compartilhada entre duas pessoas em locais
diferentes, comunicando-se através de uma rede
com interface de áudio e vídeo.
A apresentação de Engelbart ficou conhecida
como "a mãe de todas as demos". Embora tenha
sido revolucionária, as ideias de Engelbart
estavam muito à frente de seu tempo, sendo
difíceis de entender completamente por outros.
Paul Saffo, do Institute for the Future, comparou a
demonstração a "um OVNI pousando no gramado
da Casa Branca". Algumas pessoas presentes
pensaram que tudo aquilo era uma farsa.
Douglas Engelbart - O inventor do mouse - https://www.youtube.com/watch?v=xMvSlIy3on0
1968 “Mother of All Demos” by SRI’s Doug Engelbart and Team - https://www.youtube.com/watch?v=B6rKUf9DWRI
1973 - Xerox Alto e o
Nascimento da
Interface Gráfica:
Primeiro computador
a implementar uma
GUI (Graphical User
Interface) completa,
incluindo ícones,
janelas e o uso de
mouse.
O trabalho no Xerox
PARC foi fundamental
para a evolução do
design de interfaces.
1975 - Altair e Microsoft
Também em 1974, foi desenvolvido o Altair 8800, o
primeiro computador a levar um microprocessador —
uma espécie de ancestral dos microcomputadores
Em 1975, dois estudantes adaptaram um programa
em linguagem de computação básica para uso no
Altair. Esses estudantes eram Bill Gates e Paul Allen,
e este foi o primeiro programa da Microsoft.
1976 - Apple I
Em 1976 foi lançado o primeiro computador oficialmente desenvolvido para uso
pessoal, o Apple I. Ele foi desenvolvido pelos estudantes Steve Jobs e Stephan
Wozniack
1977 - Apple II
No ano seguinte,
Jobs e Wozniack
lançam o Apple II, o
primeiro
computador
pessoal mais
próximo do que
conhecemos
1981 - PC da IBM
O Personal Computer da IBM, ou, para
os mais íntimos, PC, revolucionou o
mercado de computadores pessoais a
partir de 1981.
Ele utilizava o MS-DOS, software
desenvolvido pela Microsoft.
A partir de então, a Microsoft começou
a desenvolver softwares que poderiam
ser usados em computadores de
diversos modelos e marcas.
O PC foi um sucesso comercial. Apesar
de seu alto valor, vendeu mais de 30 mil
unidades em quatro meses.
O PC possuía a tela clássica dos
primeiros computadores pessoais: o
fundo preto com letras e números em
verde.
O conceito do sistema Xerox Star deve
1981 - Xerox muito ao Xerox Alto , uma estação de
trabalho experimental projetada pelo Xerox
Star: O primeiro Palo Alto Research Center (PARC).
computador O primeiro Alto tornou-se operacional em
1972.
comercial com
Embora em 1979 quase 1.000 Altos
vinculados à Ethernet tenham sido
colocados em operação na Xerox e outros
uma interface 500 em universidades e escritórios
governamentais colaboradores, nunca foi
gráfica de pretendido que fosse um produto
comercial.
usuário. Então, em 1977, a Xerox iniciou um
Introduziu
projeto de desenvolvimento que trabalhou
para incorporar as inovações do Alto em
um produto comercial; seu conceito era
elementos um sistema integrado de preparação de
documentos, centrado na cara
como ícones, tecnologia de impressão a laser e
direcionado a grandes corporações e seus
desktop, e parceiros comerciais.
metáforas de
Quando o sistema Star resultante foi
anunciado em 1981, o custo era de cerca
de US$ 75.000 (equivalente a US$
papelaria 251.000 em 2023) para um sistema básico
e US$ 16.000 (equivalente a US$ 54.000
digital. em 2023) para cada estação de trabalho
adicionada.
A filosofia-chave da interface do
usuário é imitar o paradigma do
escritório o máximo possível para
torná-lo intuitivo para os usuários.
O conceito de "o que você vê é o
que você obtém" ( WYSIWYG ) foi
considerado primordial. O texto é
exibido em preto sobre um fundo
branco, assim como papel, e a
impressora replica a tela usando
uma linguagem de descrição de
página desenvolvida no PARC.
Um dos principais designers do
Star, Dr. David Canfield Smith ,
inventou o conceito de ícones de
computador e a metáfora da área
de trabalho, na qual o usuário vê É muito comum dizerem que a Apple, a Microsoft e outras plagiaram a GUI e outras inovações da Xerox Star, e
uma área de trabalho contendo acreditam que a Xerox não protegeu adequadamente sua propriedade intelectual. Muitas divulgações de patentes
foram criadas para as inovações na Star. No entanto, na época havia um Decreto de Consentimento da Xerox de 1975,
documentos e pastas, com baseado em uma ação antitruste da Federal Trade Commission (FTC) , que impunha restrições sobre o que a empresa
diferentes ícones representando era capaz de patentear.
diferentes tipos de documentos. Além disso, quando as divulgações da Star estavam sendo preparadas, os advogados de patentes da Xerox estavam
ocupados com várias outras novas tecnologias, como impressão a laser. Finalmente, as patentes de software,
A interface de usuário Star é particularmente aquelas relacionadas a interfaces de usuário, eram então uma área jurídica não testada.
baseada no conceito de objetos. A Xerox foi a julgamento para proteger a interface de usuário Star. Em 1989, após Apple Computer, Inc. v. Microsoft
Corp. por violação de direitos autorais da interface de usuário do Macintosh no Windows, a Xerox entrou com uma ação
semelhante contra a Apple. No entanto, esta ação foi rejeitada por motivos processuais, não substantivos, porque três
anos havia passado. Em 1994, a Apple perdeu sua ação contra a Microsoft, não apenas as questões originalmente
contestadas, mas todas as reivindicações sobre a interface de usuário.
O projeto do AMIGA
A história do AMIGA remonta a
1982, quando três jovens
doutorados da Flórida decidiram
desenvolver a última palavra em
console de jogos. O negócio
do videogames domésticos
baseados em ROM estava
estourando à época, e ainda não
existia nenhum vestígio da Sega ou
da Nintendo trabalhando nessa
área.
Priorizar a compatibilidade com o
usuário era o elemento-chave dos
três profissionais e foi essa mesma
procura de proximidade que levou
a empresa a chama-lo "Amiga".
O projeto era o de criar aquele que
seria o videogame definitivo da
década de 1980, e o console então
em desenvolvimento foi chamado
de "Lorraine".
"A reação inicial ao Macintosh tem sido
fortemente, mas não esmagadoramente,
favorável. Alguns usuários de computador
tradicionais veem o mouse, as janelas e a
metáfora da área de trabalho como babados
bobos e inúteis, e outros estão indignados
com a falta de gráficos coloridos, mas a
maioria dos usuários está impressionada com
a máquina e suas capacidades.
Ainda assim, algumas pessoas expressaram
preocupação com o tamanho relativamente
pequeno de 128 mil bytes de RAM, a falta de
qualquer linguagem de computador enviada
como parte da unidade básica e a
inconveniência da unidade de disco único”.
1984 - Lançamento do Apple Macintosh:
Tornou as interfaces gráficas No entanto, o Macintosh atraiu pessoas "que
amplamente acessíveis ao público, com antes odiavam computadores (...) Há,
aparentemente, algo sobre mouses e menus
uso extensivo do mouse e elementos suspensos e ícones que atraem pessoas
visuais intuitivos. anteriormente intimidadas
Apple 1984 Super Bowl Commercial Introducing Macintosh Computer (HD) - https://www.youtube.com/watch?v=2zfqw8nhUwA
The Lost 1984 Video: young Steve Jobs introduces the Macintosh https://www.youtube.com/watch?v=2B-XwPjn9YY&t=180s
1985 -
Microsoft
Windows 1.0:
Primeira versão
do Windows,
tentando trazer
interfaces
gráficas aos
PCs baseados
em MS-DOS,
com recursos O Windows 1.0 foi a primeira grande versão do Microsoft Windows, lançado no dia 20 de novembro de 1985 nos Estados Unidos, e
posteriormente em Maio de 1986 foi lançado internacionalmente. O Windows 1.0 é um Shell gráfico pra MS-DOS e fornece uma multitarefa
básicos de
cooperativa, ele pode rodar aplicativos tanto para o próprio o Windows quanto aplicativo de MS-DOS compatíveis. Em 1987 ele foi substituído
pelo Windows 2.x.
O Windows 1.0 ainda não tinha o recurso de "sobrepor janelas" como os windows mais modernos, ao invés disso, as janelas ficavam lado a
janela. lado em uma divisão de tela, ou ficavam em tela cheia. (o Windows 1.0 tinha um recurso de janelas sobrepostas más isso se limitava apenas
há poup-ups e a determinados controles, como menus e menus suspensos.
O Windows 1.0 trouxe uma interface com cores vibrantes ao usuário, porém somente possível sua reprodução em monitores com cores,
pouco comuns à época de seu lançamento. Foi também o primeiro sistema da Microsoft a utilizar Mouse, janelas e ícones.
Anos 90
Nos anos 90 surgem computadores capazes de acessar fax,
impressoras e scanners. Além disso, também começa a surgir a
internet e máquinas que são capazes de acessar a internet.
Anos 1990 - Evolução das Interfaces
de Navegação Web: Introdução do
Mosaic (1993) e, posteriormente, do
Netscape Navigator, que
estabeleceram novos padrões para
interfaces gráficas na web,
incluindo o uso de hiperlinks,
gráficos, e multimídia.
O Mosaic foi um dos primeiros navegadores para a internet e teve
um papel fundamental no desenvolvimento da web. Ele foi
responsável por apresentar vários recursos que hoje são comuns na
internet, além de mostrar como a navegação podia ser mais
acessível e agradável aos usuários.
Quando foi lançado, em 1993, as opções disponíveis eram pouco
práticas e careciam de ferramentas para atrair um público amplo.
Além disso, ele era mais fácil de instalar e rodava melhor nos
computadores que a maioria das pessoas usava na época.
O Mosaic foi o primeiro navegador a exibir imagens incorporadas ao
texto e oferecer hiperlinks clicáveis para ir para outras páginas, além
de incluir botões de navegação e salvar lista de favoritos.
Ainda no ano de 1993, Marc Andreessen saiu da NCSA
para fundar a Mosaic Communications Corporation,
empresa que logo foi rebatizada como Netscape. Em
outubro de 1994, a nova companhia apresentou o seu
navegador Netscape com melhorias significativas em
relação ao Mosaic.
A popularidade do Netscape a partir de 1995 marcou o
início do fim do navegador pioneiro da web. No final
de 1997, o Mosaic já havia perdido a maior parte de
sua base de usuários para concorrentes mais
modernos e teve a sua última versão lançada naquele
ano.
O Netscape deu continuidade ao legado do Mosaic e
contribuiu para o “boom” da internet nos anos 1990.
Ele teve um papel importante no aprimoramento de
tecnologias para a web, como o JavaScript, a
utilização de cookies e a aposta no uso de navegação
em guias.
Após o Netscape perder espaço para concorrentes
como o Internet Explorer da Microsoft, o seu código-
fonte foi aberto ao público em 1998 e deu origem a
outro clássico da internet: o Projeto Mozilla.
Essa iniciativa aproveitou a base do Netscape para
criar a sua versão de navegador em código aberto
chamado Mozilla. Essa é a origem do atual Firefox,
que também serviu e serve de base para o
desenvolvimento de outros navegadores.
2007 - Lançamento do iPhone: Revolução no design de interface
com a introdução de uma tela sensível ao toque, gestos multitoque
e uma interface simplificada, sem teclado físico.
2010 - Avanços em Realidade Virtual e Aumentada: Interfaces
começam a expandir para além das telas tradicionais, incluindo
interfaces de voz (Alexa, Siri) e imersão por meio de dispositivos
VR/AR.
“As metodologias de UX
permanecerão mesmo após a
transição para um novo paradigma no
design de interface.
Mas a execução dos projetos em
UX passará por uma transformação
com as ferramentas de IA.”
— Jakob Nielsen
Para saber mais acesse
https://bootcamp.uxdesign.cc/the-history-and-evolution-of-interfaces-865f3e728f89
https://brasil.uxdesign.cc/ui-design-em-foco-historia-e-conceitos-5b6b3371a097
https://www.a.team/mission/all-time-a-teams-how-jobs-wozniak-harnessed-cognitive-friction
https://en.wikipedia.org/wiki/Graphical_user_interface
https://history.user-interface.io/
https://en.wikipedia.org/wiki/Alan_Kay
Obrigado!
