O documento discute a evolução da interface gráfica de usuário ao longo do tempo, desde as primeiras interfaces baseadas em texto e ícones até as interfaces modernas com animações e efeitos visuais. Apresenta os principais marcos como o desenvolvimento do mouse na década de 1960, a introdução de janelas e menus gráficos na década de 1970 e a popularização de interfaces intuitivas e amigáveis nos anos 1990 e 2000.

1. USER EXPERIENCE

2. USER EXPERIENCE
A definição padrão de UX é "percepções e respostas que resultam do uso ou utilização prevista de um produto, sistema ou serviço".
O design não tem a ver só com a questão estética e visual. Cada vez mais o design assume uma posição estratégica e tem muito mais relação com usabilidade e aproximação com o usuário, do que com apenas deixar algo bonito.
2

3. USER EXPERIENCE
Esses fatores estão relacionados ao design, usabilidade e acessibilidade, mas também a emoções e sentimento ligados no usuário.
3

4. USER EXPERIENCE
Os controles de interface devem ser intuitivos e fáceis de usar. O usuário deve saber como movimentar, entender e interagir com um site sem a necessidade de explicações ou preparação prévia, na medida do possível.
4

5. USER EXPERIENCE
5

6. USER EXPERIENCE
6

7. A HISTÓRIA DA INTERFACE GRÁFICA
A forma como o ser humanos interagem com os computadores esta sempre em constante revolução!
Passou da linha de comando de texto para desktops em três dimensões e softwares que aceitam comandos por voz ou gestos.
7

8. O PAI DO MOUSE E DA INTERFACE GRÁFICA
Com o simples propósito de facilitar e tornar mais intuitiva a utilização das máquinas.
Inspirado pelo trabalho de Bush, Douglas Engelbart. Ele acreditava que, com informações dispostas em uma tela, o usuário poderia se organizar de maneira gráfica e pular de uma informação para outra, sempre que necessário.
8

9. Periféricos demonstrados por Engelbart em 1968
O PAI DO MOUSE E DA INTERFACE GRÁFICA
9

10. Como no caso do Memex, as idéias de Engelbart estavam muito à frente de sua época.
Em 1962, até mesmo interfaces em modo texto, com comandos sendo executados em tempo real, em vez da concorrência que usava cartões perfurados.
O PAI DO MOUSE E DA INTERFACE GRÁFICA
10

11. O PAI DO MOUSE E DA INTERFACE GRÁFICA
Mas o mouse foi apenas uma das muitas inovações demonstradas naquele dia.
Que também trouxeram o hipertexto, comunicação por rede e tela compartilhada em locais diferentes, que trabalham em conjunto, a videoconferência
Porem os softwares desenvolvidos na época ainda não trabalhavam com o conceito de janelas.
11

12. SURGIMENTO DE JANELAS (1974)
Só veio depois do surgimento da Smalltalk ( uma linguagem de programação e ambiente de desenvolvimento) que possuía uma interface gráfica diferenciada, a GUI começou a ganhar aspectos mais modernos, em 1974.
Ela possui uma particularidade:
TUDO É OBJETO: os números, as classes, os métodos, blocos de código, etc.
Smalltalk-72 (no qual muitas das funcionalidades de mídia foram implementadas, da capacidade de desenhar até programas de música e linguagens de programação icônicas)
12

13. PARECE BOBAGEM, MAIS:
A grande inovação foram as janelas, já que ela não existiam nem possuíam bordas e barras de títulos que permitiam a identificação e o reposicionamento delas.
oO conceito de ícones também surgiu na mesma época, assim como o menu de contexto. No mesmo período, também foram apresentadas as barras de rolagem, as caixas de diálogo e os botões de opções (radio buttons).
13

14. LISA
A criação do Lisa em 1978, foi um divisor de águas. Já que ele contava com a contratação de ex-funcionários da Xerox, podendo assim a Apple iniciar o desenvolvimento do computador pessoal Lisa, em 1978.
Tendo uma interface baseada em ícones, em que cada um deles indicava um documento ou uma aplicação.
Além disso, a equipe criou a primeira barra de menu desdobrável (pull- down), que hospedava todos os menus logo nas primeiras linhas da tela.
14

15. TAMBÉM FICARAM DO LISA:
A marcas de verificação (checkmarks), que ajudam a destacar os itens do menu que estejam ativados, o conceito de atalhos de teclado.
Outra novidade que ficou foi o ícone da Lixeira, para onde o usuário podia arrastar arquivos para removê-los posteriormente.
O mouse, que havia se consagrado com três botões, passou a ter apenas um no Lisa e, como a interface exigia pelo menos duas ações para cada ícone, uma para selecionar e outra para executar o programa ou arquivo, foi criado o conceito de duplo clique.
15

16. OUTRA EMPRESA QUE TRABALHOU COM INTERFACE
A VisiCorp, também estava trabalhando em interfaces gráficas para computadores pessoais.
Só que para planilha eletrônica VisiCalc, a empresa lançou uma interface para PCs, em 1983, não fez muito sucesso.
Além do preço alto e de exigir muito recurso de hardware, a VisiOn, e como deixar de usar ícones e eliminar o cursor do mouse. Então caiu em desuso.
16

17. Interface GEM (interface gráfica para o DOS )
1º versão do Microsoft Windows (cada janela tinha a sua própria barra de menus,)
Dock, 1º a usar fontes com anti-aliasing, mesmo em modo de 16 cores.
Introduziu uma aparência 3D aos seus componentes 1ª a usar o botão em forma de “X”.
ENTRE OUTROS
17

18. ENTRE OUTROS
Executado com suporte à rede, se tornou a base dos ambientes gráficos do Linux.Trouxe o fato de poder habilitar o foco em uma janela apenas posicionando o mouse sobre ela, sem clicar.
Atualmente, muitos projetos gráficos ainda fazem uso do X, com o KDE e o GNOME.
GNOME
18

19. ANOS 90
Durante os anos 90, apenas duas empresas resistiram: a Microsoft e a Apple.
As demais entraram em falência ou foram adquiridas por outras companhias.
19

20. APPLE (ANTES E DEPOIS)
Continuou inovando e lançou a interface Aqua, o Mac OS X. Uma aparência nova, mais a principal novidades era o fato de que as janelas podiam ser redesenhadas rapidamente, e de uma maneira imperceptível aos olhos, quando movidas ou redimensionadas.
Antes do Aqua
Depois do Aqua
20

21. AQUA
Ele trouxe os efeitos de animação executados para o ato de minimizar programas. Atualmente usa-se o conceito de Epxosé ( é uma ferramenta do Mac OS X, que facilita o gerenciamento das janelas dos programas abertos, permitindo que o usuário possa ter uma rápida visualização de todos os aplicativos em funcionamento, sem a necessidade de clicar em cada um deles.)
Não há dúvida de que uma enorme influência na aparência do Aqua com todos os seus botões e riscas e translucidez foi a enorme popularidade do iMac:
21

22. AQUA INFLUENCIOU
Quando o Aqua foi lançado ele influenciou tanto o mundo gráfico que nos próximos 5 anos ou mais cada coisa que os designers produziam tinha um brilho desnecessário:
Seguindo esta mesma idéia o Windows XP, em 2001; lançou a Interface de Usuário Luna.
22

23. MICROSOFT
Com o lançamento do Windows Vista, pudemos ver a estréia do Aero, responsável pelos efeitos visuais de sombra e transparência da Área de trabalho.
 Com o Windows 7, a interface foi aprimorada, ganhando suporte a telas touchscreen e multitouch, além de apresentar uma barra de ferramentas totalmente reformulada e o Aero Shake, que permite interação com as janelas ao sacudi-las.
23

24. WINDOWS AERO
O estilo visual diferenciado do Aero combina a aparência de janelas leves e translúcidas com poderosos avanços gráficos.
Bordas de vidro das janelas, os comportamento de janelas também foi reprojetado, animações sutis ao minimização, a maximização e o reposicionamento das janelas para um efeito mais suave e fácil.
Windows Flip 3D, permite organizar as janelas abertas em uma pilha tridimensional que você pode percorrer rapidamente sem precisar clicar na barra de tarefas.
24

25. LINUX
Um exemplo é o Compiz-Fusion, é um software que dinamiza o seu ambiente de trabalho com fantásticas animações gráficas, direcionando para a placa de vídeo algumas instruções especiais proporcionando efeitos que usufruem da capacidade de aceleração 3D que ela pode oferecer.
O mais importante é que mesmo com essa grande quantidade de efeitos, o Compiz-Fusion (XGL) é bem leve e não transforma seu computador em uma carroça.
25

26. APPLE, MUDA NOVAMENTE (SIMPLIFICAÇÃO)
Mas, mesmo apesar da popularidade da estética de plástico colorida, translúcida e brilhante, a Apple tornou-se mais e mais contida, com seus projetos de hardware ao longo do tempo:
A marcha implacável do design, simplificação e estilo no hardware teve um efeito semelhante no software, com a transparência sendo reduzida, a visibilidade das riscas sumindo até desaparecer por completo, a introdução de interfaces de metal escovado, todo o caminho para algo não muito diferente para a interface antiga, predominantemente cinza de MacOS 9:
26

27. 27

28. EM PARALELO
Apple lançou o famoso iPhone, a grande revolução no mercado de celular.
Na época, não havia nada semelhante ao smartphone e sistema da Maçã.
O iOS foi criado com base no OS X e introduziu ao mundo recursos de fácil uso. Recentemente, o sistema passou por uma reformulação em seu visual e continua dando passos largos na introdução de novos recursos.
28

29. SIMPLIFICAÇÃO ATÉ POR IPHONE, :
Esta mudança não é específica ou exclusiva para o Mac; Isso aconteceu em toda a indústria.
Inclusive no Iphone, muitos aplicativos (incluindo o Skype) foram liberados com as sobreposições de ícones brilhantes.
Mas, como o Mac OS X passou de olhar excitante e refrescante para uma monstruosidade berrante ao longo dos anos, que a interface de tela inicial do iPhone OS mudou, é agora 6 anos de idade.
29

30. SE VOCÊ NÃO ESTÁ MELHORANDO, VOCÊ ESTÁ INDO PARA TRÁS.
E como o Iphone esta ficando mais ou menos o mesmo, a concorrência aproveitaram a oportunidade para fazer algo radicalmente diferente, avançando na tecnologia passaram a ter este visual:
5 anos de Android
Depois do Aqua
30

31. WINDOWS PHONE
linguagem de design Metro, Microsoft decidiu redesenhar a interface e com mais foco em tipografia limpa e menos na UI cromo.
Estes princípios e do novo Zune UI foram transportados para Windows Phone e também para o Windows 8.
O cliente Zune Desktop também foi redesenhado, com ênfase em tipografia e design clean que era diferente da anterior
31

32. LIMPEZA
Criar uma experiência limpa e propositiva, deixando apenas os elementos mais relevantes sobre tela. Quando se trata de projetar grandes experiências de aplicativos, acreditamos no conteúdo, e não o Chrome.
Concentrando-se em conteúdo sobre cromo reduz elementos desnecessários.
32

33. INTEGRANTES DO GRUPO
Diego Vieira;
Wesley Luan;
Yasmim Luiza;
33

34. BIBLIOGRAFIA:
http://www.tecmundo.com.br/historia/9528-a-historia-da-
http://ux.stackexchange.com/questions/35576/what- explains-the-current-shift-from-glossy-uis-to-matte-uis
http://forum.outerspace.terra.com.br/index.php?threads/especial-a-historia-dos-antigos-computadores-da-apple- computer.85739/
http://news.squeak.org/2007/12/29/old-smalltalk-pics-from- parc-place/
http://windows.microsoft.com/pt-br/windows-vista/what-is- windows-aero
http://www.baixaki.com.br/linux/download/compiz- fusion.htm
http://www.tecmundo.com.br/linux/2031-a-historia-dos- sistemas-operacionais.htm
34