jÁ nÃo viria tudo decido? sim, porém nem tudo foi prototipado, padronizado ou componentizado nÃo...
TRANSCRIPT
![Page 1: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/1.jpg)
PADRÕES DE INTERFACENO DATASUL BY YOU
CLEITON LUIZ CORADELLIARQUITETURA DE INTERFACES COM USABILIDADE E DESIGN
![Page 2: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/2.jpg)
HORA DE CORRIGIR OS CAMINHOS
![Page 3: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/3.jpg)
ALGUMAS CONSIDERAÇÕESJÁ NÃO VIRIA TUDO DECIDO?Sim, porém nem tudo foi prototipado, padronizado ou componentizado
NÃO POSSO “CUSTOMIZAR” PADRÕES NO MEU CASO?- Teremos retrabalho quando algum padrão for atualizado- Fazer coisas parecidas de formas diferentes confunde e baixa a qualidade da experiência
ISSO DEVERIA SER PREOCUPAÇÃO MINHA?SIM E NÃO. Até certo ponto os padrões devem garantir consistência, mas sempre teremos níveis específicos a tratar
![Page 4: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/4.jpg)
USABILIDADE
![Page 5: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/5.jpg)
Abra a Porta
LEIA O TEXTO ABAIXO…
comusabilidadeconsegui
mosfazerascoisasmaisra
pidocommenoserroseco
mmaissatisfacaoeumaqu
alidadealcancadaatraves
demecanismosquemuita
svezesnosparecemapena
sdetalhesmasquefazem
muitafaltaquandonaote
mos
![Page 6: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/6.jpg)
TENTE NOVAMENTE
Com usabilidade,
conseguimos fazer as coisas
mais rápido, com menos erros
e com mais satisfação. É uma
qualidade alcançada através
de mecanismos que muitas
vezes nos parecem apenas
detalhes, mas que fazem
muita falta quando não
temos.
Abra a Porta
Agora sim >
![Page 7: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/7.jpg)
FOCALIDADE “Quando perguntamos
aos usuários o que eles queriam que o Office tivesse, 9 de cada 10 vezes, eles citam algo que já está no produto, eles só não conseguem encontrar”
Chris Capossela, Microsoft VP
![Page 8: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/8.jpg)
VERSÕESO Word já foi bem básico, porém teve sucesso nas questões primáriasNas evoluções foram adicionados mecanismos avançados como botão direito, Drag’nDrop e combinações de teclas, que melhoram a produtividade
Evoluiu tanto que a metáfora foi reprojetada
![Page 9: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/9.jpg)
![Page 10: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/10.jpg)
Gera percepção Impressão do usuário Conquista o usuário “Dá vontade de usar” Apelo visual, Design, IPod...
Mantém o usuário satisfeito Números de Erros Performance Cobertura de tarefas Gera referência
USABILIDADE PERCEBIDA
USABILIDADE REAL
![Page 11: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/11.jpg)
Novos SkinsOriginal
AS VEZES O DESIGN ATRAPALHA O USO
Qual skin é melhor de usar?
![Page 12: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/12.jpg)
ALGO USÁVEL É
Fácil de aprender
Fácil de lembrar
Eficiente
Confiável
Traz satisfação
2 FORMATO DA INTERAÇÃOeventos, comportamentos, estados, ...
PARA O USUÁRIO A INTERFACE É O SISTEMA!
Projetar com usabilidade inclui
1 APRESENTAÇÃO estrutura, design, informações, ações, …
É PENSAR EM: o que, onde e como apresentar como interagir (usuário) como se comportar (sistema)
![Page 13: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/13.jpg)
“FILOSOFIAS” DA INTERFACE BY YOU
![Page 14: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/14.jpg)
Produto Padrão Sistemas Internos
ESTRATÉGIA DE INTERFACE
![Page 15: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/15.jpg)
Ter uma forma única para acessar os produtos e interagir com a Datasul
Central de Acessos
Login Unificado
SSO - Integração
com SO
Suporte onLine
Datasul By You
O QUE O USUÁRIO QUER?
![Page 16: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/16.jpg)
Acessar rápida e facilmente as funcionalidades
Seletor de Aplicativos Web ou Não
Menus Rápidos e Personalizáveis
Troca de Empresana sessão
Datasul By You
O QUE O USUÁRIO QUER?
![Page 17: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/17.jpg)
1 Ter a atenção gerenciada2 Decidir 3 Ser conduzido nos processos de negócioDesktop de trabalho orientado a papéis e tarefas 1 Monitoramento2 Detalhamento3 Ação 4 Colaboração
Datasul By You
O QUE O USUÁRIO QUER?
![Page 18: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/18.jpg)
OS PADRÕES VEM DOS PROJETOS - REUSO
Framework:Reuso da “metáfora”, templates e tudo que independe de contexto
ProjetosAproveitam itens reusáveis ou geram itens reusáveis pro framework
![Page 19: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/19.jpg)
INTERFACE EXPLORER – MEIU
![Page 20: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/20.jpg)
ORIENTAÇÕES, PADRÕES E EXEMPLOS
VERSÃO 1.0Ricardo Santos
INTERFACE EXPLORER – MEIU
![Page 21: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/21.jpg)
SITUAÇÕES DA ONDA 2 EM CORREÇÃO
![Page 22: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/22.jpg)
RESOLUÇÃO
Somos contra 800x600, mas…
Base de clientes (40% 800x600)
Vendedores, projetores
1024 com área lateral restam 800x600
EMS 640 X 480
![Page 23: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/23.jpg)
![Page 24: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/24.jpg)
LAYOUTS E MARGENS (ESPAÇAMENTOS) Alinhamentos e ancoramentos com
layoutConstraints
Agrupamentos (áreas da interface)
Falta de margens nos containers e entre
itens
![Page 25: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/25.jpg)
![Page 26: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/26.jpg)
CABEÇALHOS
Alinhar itens do cabeçalho à esquerda
Agrupadores de cabeçalho
Filtros (próximo slide)
Cabeçalho duplicado
Altura do cabeçalho
![Page 27: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/27.jpg)
![Page 28: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/28.jpg)
FILTROS Filtros rápidos (checkboxes)
Filtros simples que não encontram partes
de um texto.
Filtros de períodos não são exibidos no
cabeçalho dando a ilusão de que a
consulta corrente reflete toda a base de
dados, porém o filtro de período pode
estar ocultando muita informação.
Filtros avançados, vários modelos
![Page 29: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/29.jpg)
![Page 30: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/30.jpg)
AGRUPADORES
Hierarquia da informação
Organização da interface (agrupamento por
localização)
Melhor Orientação
![Page 31: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/31.jpg)
RODAPÉS – PAINÉIS DE AÇÕES
Diferenciação das ações botões (focal,
normais) e Ações Relacionadas
Botão ou ação focal com clique, Enter e
duplo clique
Relação ações da folder (botões) e ações
de entidades internas (links em grids)
![Page 32: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/32.jpg)
PORTLETS
Portlets que não exploram ou se adaptam aos estados e tamanhos possíveis, por vezes ficando vazios e outras com muitas barras de rolagem.
Sempre que não houver dados nos portlets informar o usuário para verificar as configurações do portlet para identificar inconsistência dos dados atuais.
Ao selecionar uma série de um gráfico e clicar em detalhar, a consulta que abre deve trazer filtro aplicado.
Vários estão com o cabeçalho vazio Portlets sem atalhos além do detalhar
(ações possíveis)
![Page 33: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/33.jpg)
FORMULÁRIOS
I18n - Layout apresenta campos sem espaçamento (grudados). Utilizar o component formItem com label interno para posicionar em cima do campo
Falta de margens na esquerda e topo do form (20px)
Pista de obrigatoriedades(*) Falta de agrupadores de conteudo
(groupContent) Falta de Validadores (modelo CRUD) Falta de Máscaras Falta de painél agrupador (ao redor do form)
![Page 34: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/34.jpg)
DATAGRIDS
Falta de itens definidos (gridtools, painel agrupador com total de registros e nome da entidade, seleção múltipla com checkboxes, Ordenar não funciona
Ordenar coluna do Grid em bases grandes, leva muito tempo e não tem feedback de carga, só trava e retorna depois do tempo de carga total. O mesmo ocorre com o scroll que gera nova carga no servidor.
As ordens das colunas do grid nas buscas e consultas não estão sendo salvas.
Falta tratamento de botão direito do mouse
![Page 35: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/35.jpg)
COMPORTAMENTOS
Falta de tratamento de duplo clique e
teclado (Enter/ESC) e botão direito.
Painéis internos não são maximizáveis
(resolução)
Não há workflows entre os papéis e quando
há, não temos feedback das ações (via
toaster)
Interface permite ao usuário executar ações
que não estão nas suas metas (ex.: Técnico
alterar OMs)
![Page 36: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/36.jpg)
EXEMPLO DO MEIUPROCURE POR PASTA DE
INTERAÇÃO
![Page 37: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/37.jpg)
![Page 38: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/38.jpg)
PRINCÍPIOS E BOAS PRÁTICAS
![Page 39: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/39.jpg)
DETALHES DETALHES DETALHES…
![Page 40: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/40.jpg)
PLATAFORMAS DE INTERFACE Windows Macintosh Gnome Web Adobe Flex/Flash
Vantagens: usuários já familiarizados guia de estilo ferramentas para prototipação e implementação
VEJA SLIDES DE
REFERÊNCIA
![Page 41: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/41.jpg)
EXEMPLO: NAVEGADOR BI - DO ITUNES
![Page 42: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/42.jpg)
MEMÓRIA
Gato Maracujá Elefante Semblante Ocorrência Definição
Oliveira Santos Goiabada Cabo Domingo Rádio
Origami Vassoura Pastel Amarelo Distância Som
![Page 43: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/43.jpg)
QUANTAS PALAVRAS VOCÊ RECONHECE? Gato Cachorro Maracujá Arquitetura Amarelo Semblante Domingo Sábado Origami
Caixa Documento Oliveira Distância Ocorrência Santos Goiabada Cabo
Rádio Som Vassoura Cobra Elefante Pastel Velocidade Definição
![Page 44: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/44.jpg)
RECONHECIMENTO
DECORA RECONHECE
![Page 45: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/45.jpg)
EVITANDO PROBLEMAS Os rótulos (labels) devem casar com a
maneira que os usuários pensam sobre a tarefa
Dê algum retorno - o usuário precisa saber o que uma operação realmente fez…. ou está fazendo para ações demoradas
Usuários vão errar, tente cercá-lo com mecanismos como voltar, máscaras, valores default, auto seleções
?
![Page 46: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/46.jpg)
CHAME A ATENÇÃO
Informação com uma grande mudança na tela tem maior probabilidade de ser lida
Informação próxima de onde o usuário está lendo também
Sinais acústicos não podem ser ignorados tão facilmente quanto sinais visuais (faca de dois gumes – as vezes queremos poder ignorar as coisas)
![Page 47: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/47.jpg)
CONVENÇÃO – EX.: FECHAR NO CANTO
Gerando interfaces na maneira que seu usuário
está acostumado o deixará mais satisfeito
menor frustração inicial e assim menor ansiedade
aprendizagem mais rápida
reforça noção do empréstimo
Convenções passaram pelo teste do tempo,
qualquer inovação ainda não, teremos problemas difíceis de
prever
Norman: Efeito de transferência
Dialetos e Estereótipos da população
![Page 48: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/48.jpg)
CONVENÇÃO
![Page 49: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/49.jpg)
PRINCÍPIO DA CONSISTÊNCIA
USE TELAS SIMILARES PARA FUNÇÕES SIMILARES
MESMO QUE NÃO SEJA UMA CONVENÇÃO EXTERNA
Label
Label
Label
Label
CADA VEZ DE UM JEITO??
![Page 50: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/50.jpg)
PARETTO - IMPORTÂNCIA DOS UCS
Interações Importantes
Merecem Mais Atenção
Criar Novas Interações20%
80%
Interações Comuns
Não reinventar
Usar Templates
![Page 51: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/51.jpg)
PARETTO - FOCALIDADE NAS INTERFACESAplique Paretto - Destacar os 20% mais importantes, ocultar
o resto
Itens nas Telas e Espaço ocupado
Resultado
20%
80%
80%
20%
![Page 52: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/52.jpg)
PARETTO 80/20 – O CONTEÚDO É O REI
![Page 53: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/53.jpg)
AFFORDANCE – É CLICÁVEL, É LINK…
![Page 54: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/54.jpg)
REAPROVEITE OS ESPAÇOS COM ESTADOS
Isto gera interfaces menos carregadas por não termos tudo na tela ao mesmo tempo
![Page 55: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/55.jpg)
LEI DE FITTS
Modelo do movimento humano, que prevê que o tempo necessário para se mover de uma posição inicial para um posição meta, é uma função da distância da meta e do tamanho da meta (Paul Fitts, 1954).
Teste na web: http://www.tele-actor.net/fitts/index.html
TAMANHO INFINITO
TAMANHO INFINITO
MENOS “MIRA”
MAIS “MIRA”
![Page 56: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/56.jpg)
PRINCÍPIO DO AGRUPAMENTO
![Page 57: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/57.jpg)
AGRUPAMENTO POR FORMATO
![Page 58: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/58.jpg)
PRINCÍPIO “A VISIBILIDADE REFLETE A UTILIDADE”
Controles freqüentemente usados visíveis, e fáceis de acessar; Esconda ou encolha controles que são usados com menor freqüência.
![Page 59: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/59.jpg)
PRINCÍPIO DA BAIXA POLUIÇÃO DA TELA
MENOS É MAIS
PENSE POR PAPEL
![Page 60: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/60.jpg)
NÃO ME FAÇA PENSAR! Formulários preenchidos com valores padrão
Responsabilidades, ação é do usuário ou do sistema?
Guiar o usuário em processos complexos “wizards”.
Crie formas simples e avançadas (apenas se necessário) de fazer as coisas
![Page 61: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/61.jpg)
EQUILÍBRIO NAS DECISÕES
USABILIDADE DESIGN TECNOLOGIA
![Page 62: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/62.jpg)
Não há certo ou errado, tudo depende das premissas e critérios que queremos atender
EQUILÍBRIO NAS DECISÕES
![Page 63: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/63.jpg)
REFERÊNCIAS
![Page 64: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/64.jpg)
REFERÊNCIAS - OS QUERIDINHOS Apple MAC OS - Apple IPod IPhone MS Windows Vista - Office Google - Gmail Nintendo Wii…
![Page 65: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/65.jpg)
HALL OF FAME AND SHAME
Há outros… google it!
http://www.frankmahler.de/mshame/HallFame.htm
http://homepage.mac.com/bradster/iarchitect/shame.htm
![Page 66: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/66.jpg)
REFERÊNCIAS
Flex ( e componentes além do básico)
http://www.flex.org/
http://www.onflex.org/
http://flexbox.mrinalwadhwa.com/
http://www.adobe.com/devnet/flex/
http://www.adobe.com/cfusion/exchange/index.cfm?view=sn610#loc=en_us&view=sn610&viewName=Adobe%20Exchange&avm=1
http://code.google.com/p/flexlib/
http://www.quietlyscheming.com
http://www.cflex.net/
Dia Mundial da Usabilidade – 03/11
![Page 67: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/67.jpg)
REFERÊNCIAS
Patterns e GuiasApple
http://developer.apple.com/documentation/UserExperience/Conceptual/OSXHIGuidelinesMicrosoft http://msdn.microsoft.com/library/?url=/library/en-us/UxGuide/UXGuide/Home.asphttp://designinginterfaces.com/http://www.welie.com/patterns/http://www.mit.edu/~jtidwell/interaction_patterns.html
Dia Mundial da Usabilidade – 03/11
Usabilidade e UI Designhttp://www.foruse.com (Larry Constantine)
http://www.usabilitybok.org/
http://www.lukew.com/
http://www.ivogomes.com
http://www.useit.com (Jakob Nielsen)
http://www.usabilidoido.com.br
http://www.mhavila.com.br/link/prog/usability.html
Usabilidade e UI Designhttp://www.ixda.org/en/
http://www.uie.com/
http://gmoura.com/blog
http://www.usabilitynet.org/home.htm
http://www.ok-cancel.com/
http://www.ergonomia.com.br/
http://www.sapdesignguild.org/
![Page 68: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/68.jpg)
REFERÊNCIASLivros
Contextual Design: A Customer-Centered Approach to Systems Designs - Beyer, Hugh; Holtzblatt, Karen
Writing Effective Use Cases - Cockburn, Alistair
Software for Use: A Practical Guide to the Models and Methods of Usage-Centered Design - Constantine, Larry; Lockwood,A.D.
Usability Engineering - Nielsen, Jakob
The Usability Engineering Life Cycle - Mayhew, Deborah
Institutionalization of Usability: A Step-by-Step Guide - Eric Schaffer
http://www.sapdesignguild.org/community/book_people/books.asp
![Page 70: JÁ NÃO VIRIA TUDO DECIDO? Sim, porém nem tudo foi prototipado, padronizado ou componentizado NÃO POSSO CUSTOMIZAR PADRÕES NO MEU CASO? - Teremos retrabalho](https://reader035.vdocuments.com.br/reader035/viewer/2022062700/552fc12a497959413d8ce121/html5/thumbnails/70.jpg)
PORTLETS
• - Portlets não exploram ou se adaptam aos estados e tamanhos possíveis, por vezes ficando vazios e outras com muitas barras de rolagem.- Sempre que não houver dados nos portlets informar o usuário para verificar as configurações do portlet para identificar inconsistência dos dados atuais. - Ao selecionar uma série de um gráfico e clicar em detalhar, a consulta aberta não vem com o filtro avançado.- Várias interfaces estão com o cabeçalho de portlet vazio.