interfaces com usuário - ui porque interfaces são importantes? baseado nos trabalhos de andries...
TRANSCRIPT
![Page 1: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/1.jpg)
Interfaces com Usuário - UI
Porque interfaces são importantes?
Baseado nos trabalhos de Andries Van Dam
![Page 2: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/2.jpg)
Não apenas para computadores!
![Page 3: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/3.jpg)
Percepção é a chave!
![Page 4: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/4.jpg)
Tipos de Interface
WIMP – Windows, icons, menus e point and click.
Non-WIMP – baseadas em reconhecimento de gestos de mouse ou caneta, ou reconhecimento de fala.
![Page 5: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/5.jpg)
Manipulação direta
Um padrão da indústria que é o coração das interfaces WIMP.
Provê metáforas visuais para os comandos, como o famigerado drag-and-drop.
![Page 6: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/6.jpg)
Vantagens
Novatos aprendem a usar o sistema relativamente rápido.
Menor tempo para aprender os comandos. Visualmente atrativa e agradável de usar. Fácil de memorizar os comandos.
![Page 7: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/7.jpg)
Desvantagens
Alguns comandos são esquisitos ou impossíveis. Como apagar todos os arquivos de um disco?
Consome mais recursos computacionais. Deficientes visuais ou desabilitados terão
muita dificuldade para operar o sistema. Difícil de projetar símbolos adequados.
Dependem do contexto e do passado cultural.
![Page 8: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/8.jpg)
Razão do projeto de interfaces Uma interface com o usuário é um diálogo
entre o usuário e o computador. É a chave para a produtividade.
Provê sistemas usáveis, úteis e eficientes para as pessoas.
![Page 9: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/9.jpg)
Projeto centrado no usuário
Projete para o usuário, não para o hardware. Atualmente, a interface é mais importante do
que uma avalanche de funcionalidades. Regra do 90/10
10% das funcionalidades são usadas 90% do tempo.
Pense num manual de DVD ou vídeo cassete ...
![Page 10: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/10.jpg)
Objetivos de alto nível
Faça simples as coisas fáceis e torne possível as complicadas.
Otimize os fatores humanos e ergométricos. Crie interfaces confortáveis e convidativas, bem
como atraentes. Maximize a velocidade de aprendizado.
Incluindo a transição de novato para especialista. Maximize a velocidade e facilidade de uso.
![Page 11: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/11.jpg)
Objetivos de alto nível
Minimize a taxa de erro. Permita um rápido reaprendizado. Uma interface WIMP não necessariamente
maximiza a velocidade e facilita o uso. Normalmente, mouse é mais lento do que atalhos de
teclado. Causam RSI (repetitive stress injuries – lesões por esforço
repetitivo). Evite erros e proveja a recuperação dos mesmos.
Undo e redo.
![Page 12: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/12.jpg)
Histórico de UI
1963: Ivan Sutherland criou a pedra fundamental dos sistemas gráficos, o Sketchpad. Grande quantidade de botões, teclas, pan e
zoom. 1968: Engelbart demonstrou o
NLS/documento aumentado hypermedia na conferência Fall Joint. Tiled windows, mouse, teclado e interface por
linha de comando.
![Page 13: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/13.jpg)
Histórico
1970: Engelbart patenteia o mouse.
![Page 14: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/14.jpg)
Histórico
1973: Xerox cria o Alto, a primeira estação de trabalho pessoal. Baseada em um monitor raster bit-map, mouse
comercial, ethernet e arquitetura cliente-servidor. Primeiro editor WYSIWYG, Smalltalk, interface
WIMP, incluindo gerenciadores de janela e browsers.
![Page 15: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/15.jpg)
Smalltalk-80
![Page 16: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/16.jpg)
Histórico
1981: Xerox introduz o sistema de informação Star, com janelas sobrepostas.
![Page 17: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/17.jpg)
Histórico
1984: Apple lança o Mac, o primeiro computador comercial com desktop gráfico. Fortemente influenciado pelo Alto e o Star. Janelas sobrepostas, pulldown menus, icons e
toolbars, manipulação de arquivos via drag-and-drop.
1985: Microsoft Windows, uma imitação do Mac com poucos melhoramentos, para a linha IBM-PC.
![Page 18: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/18.jpg)
Algumas vezes UI pode ser uma questão de vida ou morte Queda na Colômbia
do primeiro Boeing 757 em 1995, devido a uma ambigüidade no comando digitado.
![Page 19: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/19.jpg)
Características do projeto de UI Colaborativo. Iterativo. Multi-disciplinar.
![Page 20: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/20.jpg)
Profissionais envolvidos
Engenheiros de hardware. Engenheiros de fatores humanos. Projetistas gráficos. Lingüistas. Psicólogos perceptuais. Cientistas da cognição. Engenheiros de software. Sociólogos e antropólogos. Projetistas de UI.
![Page 21: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/21.jpg)
Projeto de UI é difícil
O código da interface pode chegar a 70-80% da aplicação.
É a razão do sucesso ou falha da aplicação. Criar uma boa UI é mais difícil do que
meramente engenharia de software. Requer mais habilidades do que apenas o
conhecimento de engenharia de software.
![Page 22: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/22.jpg)
Etapas da Metodologia de Projeto Conceitual. Semântico. Diálogo. Sintático. Léxico. Gráfico. Documentação.
![Page 23: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/23.jpg)
Fatos
Aqueles que acham que UI não é importante não entendem o processo/metodologia de projeto.
Atualmente, as companhias são muito exigentes quanto a quem projeta suas interfaces. UI define o produto!!
![Page 24: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/24.jpg)
O que está sendo projetado?
Duas linguagens que se entrelaçam: Usuário(s) -> computador -> usuário(s).
Um protocolo de comunicação. Incluindo tempo (clique duplo!)
Interfaces Non-WIMP podem possuir vários canais operando em paralelo. Reconhecimento de voz e gestos. Chamada de interação multi-modal.
![Page 25: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/25.jpg)
Objetivos Principais
Conheça os objetivos dos seus usuários. Defina as tarefas baseado no grau de
experiência do usuário. Ajude o usuário a aprender o sistema. Lidamos com fatores humanos.
Não deixe o seu ego se interpor ao problema. O usuário normalmente está certo. Obter e aceitar críticas ao projeto é difícil.
![Page 26: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/26.jpg)
Objetivos
Várias medidas de eficiência são subjetivas e difíceis de decifrar.
Ajude sempre o usuário a aprender. Em produtos comerciais, a interface pode
custar tanto quanto o resto do sistema.
![Page 27: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/27.jpg)
Nunca projete interfaces assim
![Page 28: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/28.jpg)
Exemplo de um projeto gráfico confuso
![Page 29: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/29.jpg)
Essa interface é boa?
![Page 30: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/30.jpg)
Essa interface é intuitiva?
![Page 31: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/31.jpg)
Ferramentas para criar interfaces
O processo de projeto e implementação de um interface é complexo e trabalhoso.
Ambientes RAD (Rapid Application Development) / IDE (Integrated Development Environment) fornecem um conjunto integrado de ferramentas para construir aplicações. Visam aumentar a produtividade do programador,
principalmente para aplicações simples.
![Page 32: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/32.jpg)
Características
Tipicamente, oferecem compiladores, debuggers, testadores, editores de janela, construtores de interface e editores de texto.
Tradicionalmente criados para plataforma Windows, e.g., Microsoft Visual Studio (C++, C#, Basic, .Net) ou Borland (Delphi, C++ Builder), estão aparecendo cada vez mais em Linux (Lazarus, Klix3, KDevelop e Gambas).
![Page 33: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/33.jpg)
Histórico do Delphi
Delphi é uma linguagem de alto nível, estruturada e orientada a objetos. Baseada em Object Pascal.
Pascal sofreu uma forte influência de Algol. Criada por Niklaus Wirth, em 1971, foi implementada pela primeira vez em 1973.
O Turbo pascal, da Borland, surge em 1983. Introduz o conceito de IDE, que permite editar o programa,
compilar, ver os erros e ir diretamente para as linhas erradas.
Uma das linguagens mais bem sucedidas de todos os tempos.
![Page 34: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/34.jpg)
Histórico
Em 1995, a Borland revive o Pascal desenvolvendo um RAD, chamado Delphi. Torna o Pascal uma linguagem visual.
A decisão estratégica foi tornar ferramentas de banco de dados e de conectividade uma parte central do produto.
“Se você quer falar com o Oráculo, vá a Delphi”.
![Page 35: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/35.jpg)
Versões
1995 – 2002 : Delphi 1 - 8 Fevereiro de 1999 – Lazarus
Uma biblioteca de classes para o Free Pascal que emula o Delphi.
FPC é um compilador GPL que roda em Linux, Win32, OS/2, 68K, e mais... Projetado para entender e compilar a sintaxe do
Delphi. Lazarus é a parte gráfica que permite
escrever programas similares aos do Delphi.
![Page 36: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/36.jpg)
Widgets Gráficos
Widgets são as partes de uma GUI (graphical user interface) que permitem aos usuário interagir com a aplicação e o sistema operacional.
Exibem informação e convidam o usuário a agir de diversas formas.
Incluem botões, caixas de diálogo, pop-up windows, pull-down menus, icons, scroll bars, janelas com arestas que podem ser esticadas, indicadores de progresso, caixas de seleção, janelas, tear-off menus, menu bars, toggle switches e formulários.
![Page 37: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/37.jpg)
Widgets Gráficos
Qual o conjunto de widgets para o GUI do Lazarus? Projetado para ser independente, pode ser
qualquer coisa: GTK+, QT, Win32. Basta ligar, ou na pior das hipóteses, escrever código para o novo conjunto.
Quando chegar a versão 1.0, será possível escrever as unidades para ligar o Lazarus a qualquer conjunto de widgets.
![Page 38: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/38.jpg)
Banco de Dados
Lazarus possui componentes para os principais bancos de dados do Linux: MySQL, PostgreSQL, SQLite, Firebird. Ainda há problemas com alguns destes
componentes, mais é uma mera questão de tempo solucioná-los.
![Page 39: Interfaces com Usuário - UI Porque interfaces são importantes? Baseado nos trabalhos de Andries Van Dam](https://reader035.vdocuments.net/reader035/viewer/2022081602/552fc10b497959413d8c17ce/html5/thumbnails/39.jpg)
Objetivos do Curso
Desenvolver a capacidade de programação usando o Lazarus como plataforma de desenvolvimento. Aplicações com interfaces simples, criadas a
partir de componentes e widgets. Aplicações com banco de dados MySQL e
Firebird.