UsabilidadeTecnologias Dinâmicas para a Internet1

Grupo 5 2Fábio Santos | 38156Jessica Simões | 38732KarolinaGonzalez | 48513Ricardo Marques | 35725Universidade de Aveiro 09

USABILIDADE = FACILIDADE DE USO

Facilidade de uso é obter afirmações......e não interrogações!Boa Navegabilidade.Alcance de objectivos de formaeficaz, eficiente e simples.

Princípios Usabilidade

Aprendizagem | Eficiência | Memorização | Erros | Satisfação

REGRAS

Clareza na arquitectura da informaçãoFacilidade de navegação Simplicidade A relevância do conteúdo Coerência Rapidez Foco na experiência do usuário

QUESTÕES

Questões com foco no utilizador (o que um utilizador não deverá perguntar)Questões com foco no criador Missão do site Público Alvo

Vantagens| Desvantagens

VantagensSatisfaz o utilizador que visite o sitePermite que o utilizador encontre o que procura (ler, comprar, jogar, etc.)Aquisição de fealdade do utilizador ao site

DesvantagensNão ajuda o utilizador na procura de informação; Causa frustração ao utilizador por não obter o que procura; Perda do utilizador para a concorrência;

Avaliação de Usabilidade

Aspectos(1) Avaliar a extensão das funcionalidades de um sistema(2) Avaliar os efeitos da interface no utilizador(3) Identificar eventuais problemas específicos no sistemaDix et al.’s (1998, pp. 406-407)

Metodologias

Categorização dos métodos e testes de usabilidade - Dixet al. (1998, pp. 405-435) apresentam uma divisão hierárquica; - BenShneiderman (1998, pp. 124-151) apresenta uma visão mais linear; - Apesar desta diferença, ambos Dixet al. e Shneiderman discutem técnicas e métodos semelhantes.

Heurísticas

(1) Viabilidade do estado do sistema(2) Consistência entre o sistema e o mundo real(3) Controle e liberdade para o usuário(4) Consistência e padrões(5) Prevenção de erros(6) Reconhecimento em vez de lembrança(7) Flexibilidade e eficiência de uso(8) Desenho estético e minimalista(9) Auxílio no reconhecimento, no diagnóstico e na recuperação de erros(10) Ajuda e documentação

COERÊNCIA DA NAVEGAÇÃO

PRINCIPIOS BÁSICOS

Apresentar claramente a navegação principal ou global; Acesso claro e rápido para a página inicial ; Explorar a utilização de cabeçalhos e rodapés; Usar com cautela gráficos como parte da navegação; Manter a consistência na selecção de cores atribuídas às ligas epáginas visitadas; Ajudar o utilizador quanto à sua localização no site (breadcrumb);

DESENHO DE INTERFACE

CONVENÇÕES

WIREFRAME

DIRECTIVAS

BOAS VINDASNão oferecer "Boas Vindas" ou "Bem-Vindo" no site;Utilizar o espaço de "Boas Vindas"/"Bem-Vindo" para publicar um slogan ou logótipo referente ao site;

INFORMAR OBJECTIVO DO SITE

CONTEÚDO

ARQUIVO / ACESSO A CONTEÚDO ANTERIOR

LINKS

NAVEGAÇÃO

PESQUISA

ATALHOS

IMAGENS E ANIMAÇÕES - I

IMAGENS E ANIMAÇÕES - II

DESIGN GRÁFICO - I

DESIGN GRÁFICO - II

DESIGN GRÁFICO - III

COMPONENTES DE INTERFACE COM O UTILIZADOR

TÍTULOS DE JANELAS

URL’S – BONS EXEMPLOS

URL’S – MAUS EXEMPLOS

JANELAS POP-UP / JANELAS INTERMÉDIAS- IIIEvitar Janelas intermediárias aquando o digitar do URL pelo utilizador; O URL deve redireccionar o utilizador para a página inerente ao URL digitado; Evitar Janelas de Pop-up (omitem a homepage, são confundidas com publicidade, dificultam a navegação a utilizadores inexperientes ou com dificuldades motoras);

PUBLICIDADE - I

COMUNICAR PROBLEMAS / EMERGÊNCIAS

ACTUALIZAÇÃO DE PÁGINASNão actualizar a homepage automaticamente (provoca a perda de atenção e interesse do utilizador caso este esteja a visualizar algum conteúdo no momento de actualização); Aquando de uma actualização, não modificar conteúdo que não foi modificado, actualizar apenas acrescentando novo conteúdo ou aquele que foi modificado (ex: actualizações de notícias num jornal online);

OBTENÇÃO DE DADOS DO CLIENTEAquando de um registo explicar ao cliente as suas vantagens; Não fornecer links de registo na homepage;

EXEMPLOS A EVITAR

Boas práticas por linguagemInovar SIM!Mas com modos…53

54Loading…BoringPassados10segundosResultado: Backspace

DicasSaber o que o utilizador querDefinir bem objectivo do siteNão descuidar na usabilidade55

Organização da informação56

Organização da informação57Dividir a informação em unidades lógicas. Estabelecer uma hierarquia por ordem de importância e generalidade. Usar esta hierarquia para estabelecer relações entre trecho de informação

Organização da informaçãoLinear58

Organização da informaçãohierarquicamente59

Organização da informaçãoPoli-hierarquicamente60

Organização da informaçãoEm rede61

Disposição dos conteúdos62

63Disposição dos conteúdosAlfabética

Disposição dos conteúdosCronológica64

Disposição dos conteúdosGeográfica65

Disposição dos conteúdos66Miscelânea

Disposição dos conteúdos67Tarefa

Disposição dos conteúdosPúblico-alvo68

Disposição dos conteúdos69Tag Cloud

Usabilidade Conteúdos70

O título é o elemento mais importante!71

Um bom título:Rico e conciso Deverá conter as palavras-chave Confirmar a informação que se segue Não revelar tudo72

O sumário é o segundo elemento mais importante!73

O sumário deve:Conter os principais pontos Não fornecer todas as informações74

TextosPouco textoColunas estreitasEspaços em branco75

Divulgação de conteúdos76

Media Display e Rich MediaSearch Engine MarketingPay-Per-ClickE-mail MarketingRedes sociais virtuaisLink BuildingCusto por Mil ImpressõesCusto por AcçãoMedia tradicionais77

1. Media Display e Rich MediaSão constituídos por banners .Constituídos por uma mensagem e um estímulo para clicar.78

2. SearchEngine Marketing (SEM)Tem como objectivo obter o melhor posicionamento dos Websites nos resultados naturais ou orgânicos dos motores de pesquisa.79

2. SearchEngine Marketing (SEM)Boas práticas:Título sucinto e coerente com o conteúdoPalavra-chave que melhor caracteriza o sitePalavras-chave mais específicas obtém um melhor posicionamentoUma boa estratégia de SEO80

3. Pay-Per-Click (PPC)O anunciante apenas paga por cada clique efectuado no anúncio.VantagensVisitantes qualificados para o WebsiteResultados imediatosFácil e rápido de implementarA campanha segmentada ao público-alvoDesvantagensAs fraudes! Podem acontecer quando uma pessoa ou um script automático imitam um utilizador normal da Web e o anúncio é clicado vezes sem conta81

4. Email MarketingMarketingonline directo para comunicação comercial ou campanhas de sensibilização.Boas práticas-Personalização do e-mail-Medir resultados, calendarizar as acções efectuadas-Segmentar muito bem o público-alvo-Informação bastante clara e objectiva acima de tudo-Corrigirerrosque ocorram (e-mails considerados spam, e-mails inválidos, utilizadores não identificados, etc.)82

5. Redes sociais virtuaisTwitterTwittadFacebookFacebookAdsYoutubeBrandChannelMasthead Video BannerBoas práticasPlanos diferentes para cada rede virtualCriar vinculações marca-cliente83

6. Link Building84Boas práticasEscrever e distribuirartigosoriginaisna WebEscrever e publicar comunicados de imprensa na WebTer o site bem optimizado

7. Custo por Mil ImpressõesO utilizador paga por 1000 vezes que o anúncio for publicado independentemente de ser clicado ou não858. Custo por AcçãoO utilizador paga quando o utilizador cumpre uma tarefa pré definida, como por exemplo a conclusão do formulário de venda.

9. Media TradicionaisSentido da comunicação: emissorreceptorReceptor passivoEnvolve gastos elevadosMedia OnlineSentido da comunicação: emissor receptorReceptor activoPode não envolver gastosComunicação e informação em tempo realSelectividade86

Web semântica 3.087máquina inteligente

Toda a linguagem tem sintaxe e semântica88

Sintaxe estuda a gramática89

Semânticaestuda o significado90

O Problema91

Páginas web são feitas em html92

HTML trata da estrutura(sintaxe) da informação e não da semântica!93

Computadores comunicam por números10101010110101011010010010101010101010010100101010101001100101001011111011010111010101010011001011111000101001110101010100101094

Pessoas comunicam por palavrasBidé corvina pesmacwindows frango chuveiro aroma catinga amor odeio paixão comer chorar jogar brincar ajax flash comunicar aritmética matemática português 95

Se os computadores entenderem as letras por trás dos números96

Poderão “entender” o que nos interessaPoderão ajudar-nos a encontrar o que queremos Maior Usabilidade97

98

Meta-informação99

Estruturas de dados sobre os próprios dados, uma breve descrição do conteúdo da página100

DicasTagssimples e concisasPrioridade às palavras-chave mais importantesEvite o uso da meta tagREFRESHNãoabuse das meta tagsPara o Google, elas não existem101

MICROFORMATOS102

Simples convenções para agregar a semântica ao HTML103

VantagensProvidenciam uma maneira estandardizada e fácil de catalogar os conteúdosPor ser opensource, facilitam o desenvolvimento de ferramentasLigação entre o conteúdo online e aplicações como o Outlook ou iCalDotam o conteúdo de significado para as máquinasPoupam tempo e esforço ao utilizador, logo aumentam a usabilidade104

EXEMPLOSHcardhCalendarGeoEntre outros105

OBRIGADO PELA ATENÇÃO106