Interfaces com Usuário - UI

Porque interfaces são importantes?

Baseado nos trabalhos de Andries Van Dam

Não apenas para computadores!

Percepção é a chave!

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.

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.

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.

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.

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.

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 ...

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.

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.

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.

Histórico

1970: Engelbart patenteia o mouse.

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.

Smalltalk-80

Histórico

1981: Xerox introduz o sistema de informação Star, com janelas sobrepostas.

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.

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.

Características do projeto de UI Colaborativo. Iterativo. Multi-disciplinar.

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.

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.

Etapas da Metodologia de Projeto Conceitual. Semântico. Diálogo. Sintático. Léxico. Gráfico. Documentação.

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!!

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.

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.

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.

Nunca projete interfaces assim

Exemplo de um projeto gráfico confuso

Essa interface é boa?

Essa interface é intuitiva?

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.

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).

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.

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”.

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.

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.

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.

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.

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.