projeto de sites na web aspectos de arquitetura e usabilidade júnia coutinho anacleto silva ufscar...
TRANSCRIPT
![Page 1: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/1.jpg)
PROJETO DE SITES NA WEB
Aspectos de Arquitetura e Usabilidade
Júnia Coutinho Anacleto SilvaUFSCar2004
![Page 2: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/2.jpg)
Roteiro
1. Engenharia de Sistemas Web2. Caracterísitcas de Sistemas Web3. Problemas comuns em Sistemas Web4. Propostas para Sistemas Web5. Usabilidade em Sistemas Web 6. Princípios e Diretivas de Usabilidade no
Projeto Web 7. Ciclo de Vida para Projeto de Sistemas
Web
![Page 3: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/3.jpg)
ARTE X ENGENHARIA
Desenvolver sistema WEB é arte? A WEB oferece espaço
para arte Mas usuários também
querem serviços de qualidade
E clientes querem prazos cumpridos e orçamentos respeitados
Desenvolver sistema WEB é engenharia? complexos e formados por
componentes inter-relacionados
desenvolvidos por equipes de especialistas
Utilizam métodos, técnicas e ferramentas
Devem cumprir prazos e orçamentos
Sem arte seriam muito chatos!
![Page 4: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/4.jpg)
Engenharia de Sistemas Web
Sistemas Web precisam ser desenvolvidos baseados em princípios de engenharia
Engenharia Desenvolvimento de um produto complexo Equipe especializada Métodos, técnicas e ferramentas, modelos e
princípios Planejamento e gerenciamento – custos,
prazos e pessoal Qualidade do produto e do processo
![Page 5: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/5.jpg)
Caracterísitcas de Sistemas Web
Funcional Eficiente Robusto e confiável Bem documentado Manutenível Testável Portável Reutilizável Interoperável
Fácil de usar Legível Atrativo Organizado Correto Atualizado Adequado aos usuários Adequado à tecnologia Adequado ao propósito
![Page 6: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/6.jpg)
Problemas comuns em Sistemas Web
Desempenho Tempo – demora...
Portabilidade browser
Funcionamento Sistema processa errado...
Usabilidade “Eu não sei como...”
![Page 7: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/7.jpg)
Propostas para Sistemas Web
Abordagem de “Design Gráfico” Aborda apenas aspectos estéticos: imagens,
tipografia, diagramação e cores Abordagem da “Usabilidade na Web”
Define critérios de usabilidade, princípios e diretrizes para o design e métricas para a avaliação
Abordagem da “Arquitetura da Informação” Centrada na organização, navegação,
rotulação e busca do conteúdo da informação
![Page 8: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/8.jpg)
Usabilidade - Conceito
Concerne a todas as características que permitem ao usuário interagir com o computador satisfatoriamente
Está relacionada à eficácia, eficiência e satisfação de uso (norma ISO)
Enquadra-se dentro do conceito de aceitabilidade do sistema pelo usuário - sistema ser bom o suficiente para satisfazer todas as necessidades e requisitos do usuário e de outras pessoas relacionadas à utilização do sistema
![Page 9: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/9.jpg)
Usabilidade e Aceitabilidade
aceitabilidadesocial
funcionalidade
utilidade fácil de aprender
aceitabilidade eficiente de usardo sistema custo usabilidade fácil de lembrar
poucos erroscompatibilidade subjetivamente
agradávelaceitabilidade prática confiabilidade
![Page 10: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/10.jpg)
Usabilidade - Exemplos de Problemas
O sistemas tem a informação ou o serviço que eu preciso?
Onde posso encontrar? Como posso solicitar esse serviço?
Quais informações devo fornecer? Qual o resultado? Era o que eu queria? Para que serve esse elemento? O que significa essa figura? Para onde leva esse link?
![Page 11: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/11.jpg)
Problema de Usabilidade - CORES
http://www.fooz.com/eric/bad/
![Page 12: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/12.jpg)
Problema de Usabilidade - Link
http://www.dc.ufscar.br/~felipe
![Page 13: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/13.jpg)
Problema de Usabilidade- Informação
http://www.cade.com.br/
Ausência de
informação
![Page 14: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/14.jpg)
Princípios Básicos de Usabilidade (1/3)
Facilidade de aprendizado interação com o sistema de forma natural,
independente do nível de habilidade e conhecimento Facilidade de utilização
interface preparada para adaptar-se ao nível de conhecimento e habilidade dos usuários (wizards para os inexperientes e teclas de atalho para os mais experientes)
Ser intuitiva comandos claramente visíveis - evitar memorização
![Page 15: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/15.jpg)
Princípios Básicos de Usabilidade (2/3)
Diálogo simples e natural Expressões e conceitos do conhecimento do usuário Evitar termos técnicos da computação Não disponibilizar informações irrelevantes
Feedback ao usuário Mecanismos para informar comportamento do sistema –
localização e tempo de execução Retenção do conhecimento
usuário lembra os principais comandos disponíveis, sem consultar manuais
instruções de utilização sempre visíveis ou recuperáveis
![Page 16: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/16.jpg)
Princípios Básicos de Usabilidade (3/3)
Velocidade na execução das tarefas informações precisas em um curto período de tempo
Preparação do sistema para evitar erros do usuário
Mensagens de erro consistentes informem ao usuário o que foi feito errado, onde
está o erro e ofereça a possibilidade de corrigi-lo Satisfação Subjetiva
como o usuário se sente ao utilizar o sistema relacionada às funcionalidades do sistema
![Page 17: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/17.jpg)
Princípios Básicos de Usabilidade no Projeto Web
(1/5)1. Clareza na Arquitetura da Informação
Usuário consegue discernir o que é prioritário e o que é secundário no site.
Informação deve estar estruturada e bem localizada.
Um mapa do site pode ser muito útil.
2. Facilidade de Navegação Usuário deve chegar até a informação desejada
em até três cliques. Informações bem distribuídas. Links representativos.
![Page 18: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/18.jpg)
Princípios Básicos de Usabilidade no Projeto Web
(2/5)3. Simplicidade
Quanto mais rápido consegue-se chegar até a informação desejada, melhor é.
Evitar adornos desnecessários, sem prejudicar o enfoque da aplicação.
4. Relevância do conteúdo Conteúdo relevante e apropriado para a web. Textos concisos e com credibilidade. Informações relevantes devem ser apresentadas nas
páginas principais. Informações secundárias devem ser disponibilizadas
em páginas de suporte e conectadas através de links.
![Page 19: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/19.jpg)
Princípios Básicos de Usabilidade no Projeto Web
(3/5)5. Manter a consistência
Padrão deve ser sempre adotado. Mesmo que o conteúdo mude com freqüência,
característica relevante em aplicações hipermídia, o usuário terá facilidade em lidar com a aplicação, pois já irá conhecer os procedimentos padrões.
6. Foco no usuário Princípio que reúne todos os demais. Foco deve estar nas atividades dos usuários.
![Page 20: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/20.jpg)
Princípios Básicos de Usabilidade no Projeto Web
(4/5) Ao se falar de usabilidade na web, não se pode
deixar de levar em consideração que se trata de uma rede mundial, portanto deve-se ter uma preocupação com o processo de internacionalização.
Deve-se ter em mente, que somente o uso de interfaces gráficas ou uso de elementos gráficos ao invés de palavras não resolve grande parte dos problemas, já que alguns símbolos podem ter interpretações distintas.
Recomenda-se o uso de símbolos internacionais.
![Page 21: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/21.jpg)
Princípios Básicos de Usabilidade no Projeto Web
(5/5) É necessário que o projetista de IHC tenha, no
mínimo, consciência de que a usabilidade de sua interface não pode ser dimensionada apenas pelos conhecimentos técnicos de sua área específica de atuação.
Usabilidade compreende uma gama de diretivas de diversos ramos de atuação.
Necessitam ser verificados, por exemplo, através de uma consulta ao profissional da área em questão, a fim de produzir uma interface de boa qualidade .
![Page 22: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/22.jpg)
Ciclo de Vida para Projeto com Usabilidade
início
produto final
conhecer usuários e suas tarefas
prototipação
avaliação de
usabilidade
protótipo em trabalho
![Page 23: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/23.jpg)
Ciclo de Vida para Projeto de Sistemas Web
Análise
Engenharia
Formulação
Planejamento
Geração de página teste
Avaliação do usuário
![Page 24: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/24.jpg)
engenharia
formulação
planejamentoanálise
Geração de página teste
Avaliação do usuário
Etapa de Formulação
Conjunto de objetivos comuns para a construção da aplicação
Escopo do esforço de desenvolvimento
![Page 25: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/25.jpg)
Etapa de Planejamento
formulação
planejamentoanálise
engenharia
Geração de página teste
Avaliação do usuário
Estima custos de projeto
Avalia os riscos associados ao esforço de desenvolvimento
Define um cronograma de desenvolvimento
![Page 26: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/26.jpg)
Etapa de Análise
formulação
planejamentoanálise
engenharia
Geração de página teste
Avaliação do usuário
Conjunto de objetivos comuns para a construção da aplicação
Identifica o escopo do esforço de desenvolvimento
Análise de Conteúdo: Identifica conteúdo da aplicação (texto, gráfico, imagem, vídeo e áudio)
Análise de Interação: Descrição detalhada do modo de interação
Análise Funcional: Descrição das funções e operações
Análise de Configuração: Descrição do ambiente e infra-estrutura da aplicação
![Page 27: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/27.jpg)
Etapa de Engenharia
análise
engenharia
formulação
planejamento
Geração de página teste
Avaliação do usuário
Projeto de conteúdo
ProduçãoProjeto de interface
Projeto navegacional
Projeto arquitetural
Projetar, produzir e adquirir todo conteúdo de texto, gráfico, áudio e vídeo integrados à aplicação
Projeto Arquitetural: definição da arquitetura da aplicação
Projeto Navegacional: definição dos caminhos de acesso ao conteúdo e serviços da aplicação
Projeto de Interface: definição da interface ao usuário
![Page 28: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/28.jpg)
Etapa de Geração de Página Teste
formulação
planejamentoanálise
engenharia
Geração de página teste
Avaliação do usuário
Ferramentas Automatizadas para criação da aplicação
Combina o conteúdo definido na etapa de engenharia aos projetos arquitetural, navegacional e de interface
Páginas executáveis
Realização de testes para descobrir erros de função e conteúdo (em diferentes browsers)
![Page 29: PROJETO DE SITES NA WEB Aspectos de Arquitetura e Usabilidade Júnia Coutinho Anacleto Silva UFSCar 2004](https://reader034.vdocuments.pub/reader034/viewer/2022051211/552fc103497959413d8bea6d/html5/thumbnails/29.jpg)
Etapa de Avaliação
formulação
planejamentoanálise
engenharia
Geração de página teste
Avaliação do usuário
Avaliação pelo usuário
Mudanças são solicitadas e integradas às próximas etapas do processo incremental