SlideShare a Scribd company logo
1 of 15
Bruna Vaccarezza
Bruno Ribeiro
 O que é usabilidade e qual a sua importância
 na sociedade moderna?
Interface Gráfica é o conceito da forma de interação entre o
usuário do computador e um programa por meio de uma tela ou
representação gráfica, visual, com desenhos, imagens, etc.
Geralmente é entendido como a “tela” de um programa.
Um GUI ruim                  Um bom GUI
      proporciona:                 proporciona:


Dúvidas sobre onde clicar;   Aumento no tráfego de
                             usuários dentro do site;


Demora para carregar;        Diminuição da taxa de
                             abandono do site;


Botões que não levam a       Desafogamento das
lugar nenhum;                centrais de ajuda e
                             atendimento ao usuário;


Dificuldade em               Maior satisfação do
compreender a proposta       usuário e do cliente.
da estrutura.
Diretrizes de aplicabilidade
para web:


Velocidade


Portabilidade


Visibilidade


Aumento de público


Agilidade para Heavy Users


Simplificação do desenvolvimento



Redução de custos
 http://www.youtube.com/watch?v=_bhxZjIqnIY
(Equipe Olhar Digital)

 http://www.youtube.com/watch?v=U_9gtCrQpXA
(Teste de usabilidade do site Bilheteria Virtual)
Ícone, para a Semiologia e a Semiótica, é um signo visual (uma imagem) que
representa outro objeto por força de semelhança. Ícones são signos substitutivos
(podem ser usados no lugar da coisa representada) de conteúdo derivativo.
É possível influenciar na velocidade de leitura dos usuários de acordo com o
uso de alguns recursos tipográficos e é importante se atentar para que todos
os outros elementos estejam em harmonia com a tipografia utilizada.
Usabilidade de Interfaces Gráficas na Web   apresentação
Usabilidade de Interfaces Gráficas na Web   apresentação

More Related Content

What's hot

Desenvolvimento Centrado no Usuário
Desenvolvimento Centrado no UsuárioDesenvolvimento Centrado no Usuário
Desenvolvimento Centrado no UsuárioEdu Agni
 
Usabilidade na web viviane marques
Usabilidade na web viviane marquesUsabilidade na web viviane marques
Usabilidade na web viviane marquesVivi Marques
 
User experiencie douglas e arnon
User experiencie douglas e arnonUser experiencie douglas e arnon
User experiencie douglas e arnonDouglas Nascimento
 
Minicurso de UX Design (Resumo)
Minicurso de UX Design (Resumo)Minicurso de UX Design (Resumo)
Minicurso de UX Design (Resumo)Thiago Esser
 

What's hot (7)

Desenvolvimento Centrado no Usuário
Desenvolvimento Centrado no UsuárioDesenvolvimento Centrado no Usuário
Desenvolvimento Centrado no Usuário
 
Ap iii
Ap iiiAp iii
Ap iii
 
Usabilidade na web viviane marques
Usabilidade na web viviane marquesUsabilidade na web viviane marques
Usabilidade na web viviane marques
 
Apresentação Mural TIC ihc
Apresentação Mural TIC ihcApresentação Mural TIC ihc
Apresentação Mural TIC ihc
 
User experiencie douglas e arnon
User experiencie douglas e arnonUser experiencie douglas e arnon
User experiencie douglas e arnon
 
Minicurso de UX Design (Resumo)
Minicurso de UX Design (Resumo)Minicurso de UX Design (Resumo)
Minicurso de UX Design (Resumo)
 
Acessibilidade-Web
Acessibilidade-Web Acessibilidade-Web
Acessibilidade-Web
 

Viewers also liked

IHC - Java Interface com o Usuário (Parte 1)
IHC - Java Interface com o Usuário (Parte 1)IHC - Java Interface com o Usuário (Parte 1)
IHC - Java Interface com o Usuário (Parte 1)Wellington Oliveira
 
Introdução ao desenvolvimento de aplicativos com interface gráfica
Introdução ao desenvolvimento de aplicativos com interface gráficaIntrodução ao desenvolvimento de aplicativos com interface gráfica
Introdução ao desenvolvimento de aplicativos com interface gráficaArtur Barreto
 
Interfaces.Games.Hud
Interfaces.Games.HudInterfaces.Games.Hud
Interfaces.Games.HudGamecultura
 
Desenvolvimento de Interface Gráfica - Introdução ao desenvolvimento de int...
Desenvolvimento de Interface Gráfica - Introdução ao desenvolvimento de int...Desenvolvimento de Interface Gráfica - Introdução ao desenvolvimento de int...
Desenvolvimento de Interface Gráfica - Introdução ao desenvolvimento de int...Cleber Fonseca
 
Java interface gráfica swing
Java   interface gráfica swingJava   interface gráfica swing
Java interface gráfica swingArmando Daniel
 

Viewers also liked (7)

Ergonomia
Ergonomia Ergonomia
Ergonomia
 
IHC - Java Interface com o Usuário (Parte 1)
IHC - Java Interface com o Usuário (Parte 1)IHC - Java Interface com o Usuário (Parte 1)
IHC - Java Interface com o Usuário (Parte 1)
 
Interface grafica
Interface graficaInterface grafica
Interface grafica
 
Introdução ao desenvolvimento de aplicativos com interface gráfica
Introdução ao desenvolvimento de aplicativos com interface gráficaIntrodução ao desenvolvimento de aplicativos com interface gráfica
Introdução ao desenvolvimento de aplicativos com interface gráfica
 
Interfaces.Games.Hud
Interfaces.Games.HudInterfaces.Games.Hud
Interfaces.Games.Hud
 
Desenvolvimento de Interface Gráfica - Introdução ao desenvolvimento de int...
Desenvolvimento de Interface Gráfica - Introdução ao desenvolvimento de int...Desenvolvimento de Interface Gráfica - Introdução ao desenvolvimento de int...
Desenvolvimento de Interface Gráfica - Introdução ao desenvolvimento de int...
 
Java interface gráfica swing
Java   interface gráfica swingJava   interface gráfica swing
Java interface gráfica swing
 

Similar to Usabilidade de Interfaces Gráficas na Web apresentação

Design: Necessidade ou desperdício de tempo
Design: Necessidade ou desperdício de tempoDesign: Necessidade ou desperdício de tempo
Design: Necessidade ou desperdício de tempoComunidade NetPonto
 
UX e UI Design - O que é? Quais as diferenças?
UX e UI Design - O que é? Quais as diferenças?UX e UI Design - O que é? Quais as diferenças?
UX e UI Design - O que é? Quais as diferenças?Marconi Pacheco
 
A importancia de IHC no desenvolvimento de software
A importancia de IHC no desenvolvimento de softwareA importancia de IHC no desenvolvimento de software
A importancia de IHC no desenvolvimento de softwareFlavia Negrao
 
Desenvolvimento de Sites V.2
Desenvolvimento de Sites V.2Desenvolvimento de Sites V.2
Desenvolvimento de Sites V.2Patricia Mallmann
 
Otimizando os projetos de TI com User Experience
Otimizando os projetos de TI com User ExperienceOtimizando os projetos de TI com User Experience
Otimizando os projetos de TI com User ExperienceTuia
 
A importância do UX no desenvolvimento de softwares
A importância do UX no desenvolvimento de softwaresA importância do UX no desenvolvimento de softwares
A importância do UX no desenvolvimento de softwaresHarry Porto Schroeter
 
UX – User Experience
UX – User ExperienceUX – User Experience
UX – User ExperienceAndré Luís
 
Design de interface (trabalho acadêmico)
Design de interface (trabalho acadêmico)Design de interface (trabalho acadêmico)
Design de interface (trabalho acadêmico)DesignCarminatti
 
Design de Interação - Parte 1
Design de Interação - Parte 1Design de Interação - Parte 1
Design de Interação - Parte 1Flavia Siqueira
 
Back-End e Front-End para Desenvolvimento Web - GELVAZIO CAMARGO.pptx
Back-End e Front-End para Desenvolvimento Web -  GELVAZIO CAMARGO.pptxBack-End e Front-End para Desenvolvimento Web -  GELVAZIO CAMARGO.pptx
Back-End e Front-End para Desenvolvimento Web - GELVAZIO CAMARGO.pptxGelvazioCamargo
 
WordCAmp RJ 2015 - A importância do Design/UX Para os desenvolvedores de Word...
WordCAmp RJ 2015 - A importância do Design/UX Para os desenvolvedores de Word...WordCAmp RJ 2015 - A importância do Design/UX Para os desenvolvedores de Word...
WordCAmp RJ 2015 - A importância do Design/UX Para os desenvolvedores de Word...Leandro Ciccarelli
 
Apresentação PCC - Rodrigo Santiago
Apresentação PCC - Rodrigo SantiagoApresentação PCC - Rodrigo Santiago
Apresentação PCC - Rodrigo SantiagoRodrigo Correia
 
Aula 3. frameworks front end
Aula 3. frameworks front endAula 3. frameworks front end
Aula 3. frameworks front endandreluizlc
 
Semiotica fundamentos da composição visual (atv07)
Semiotica   fundamentos da composição visual (atv07)Semiotica   fundamentos da composição visual (atv07)
Semiotica fundamentos da composição visual (atv07)aline totti
 
Design para a web - da interface ao branding
Design para a web - da interface ao brandingDesign para a web - da interface ao branding
Design para a web - da interface ao brandingJoão Alves
 
Jornalismo para tablets: o aplicativo da revista Veja e avaliação de comunica...
Jornalismo para tablets: o aplicativo da revista Veja e avaliação de comunica...Jornalismo para tablets: o aplicativo da revista Veja e avaliação de comunica...
Jornalismo para tablets: o aplicativo da revista Veja e avaliação de comunica...Luiz Agner
 
12° Encontro de WebDesign (usabilidade)
12° Encontro de WebDesign (usabilidade)12° Encontro de WebDesign (usabilidade)
12° Encontro de WebDesign (usabilidade)maumoreira
 

Similar to Usabilidade de Interfaces Gráficas na Web apresentação (20)

Design: Necessidade ou desperdício de tempo
Design: Necessidade ou desperdício de tempoDesign: Necessidade ou desperdício de tempo
Design: Necessidade ou desperdício de tempo
 
UX e UI Design - O que é? Quais as diferenças?
UX e UI Design - O que é? Quais as diferenças?UX e UI Design - O que é? Quais as diferenças?
UX e UI Design - O que é? Quais as diferenças?
 
A importancia de IHC no desenvolvimento de software
A importancia de IHC no desenvolvimento de softwareA importancia de IHC no desenvolvimento de software
A importancia de IHC no desenvolvimento de software
 
Desenvolvimento de Sites V.2
Desenvolvimento de Sites V.2Desenvolvimento de Sites V.2
Desenvolvimento de Sites V.2
 
Otimizando os projetos de TI com User Experience
Otimizando os projetos de TI com User ExperienceOtimizando os projetos de TI com User Experience
Otimizando os projetos de TI com User Experience
 
A importância do UX no desenvolvimento de softwares
A importância do UX no desenvolvimento de softwaresA importância do UX no desenvolvimento de softwares
A importância do UX no desenvolvimento de softwares
 
UX – User Experience
UX – User ExperienceUX – User Experience
UX – User Experience
 
Design de interface
Design de interfaceDesign de interface
Design de interface
 
Design de interface (trabalho acadêmico)
Design de interface (trabalho acadêmico)Design de interface (trabalho acadêmico)
Design de interface (trabalho acadêmico)
 
Design de Interação - Parte 1
Design de Interação - Parte 1Design de Interação - Parte 1
Design de Interação - Parte 1
 
Back-End e Front-End para Desenvolvimento Web - GELVAZIO CAMARGO.pptx
Back-End e Front-End para Desenvolvimento Web -  GELVAZIO CAMARGO.pptxBack-End e Front-End para Desenvolvimento Web -  GELVAZIO CAMARGO.pptx
Back-End e Front-End para Desenvolvimento Web - GELVAZIO CAMARGO.pptx
 
WordCAmp RJ 2015 - A importância do Design/UX Para os desenvolvedores de Word...
WordCAmp RJ 2015 - A importância do Design/UX Para os desenvolvedores de Word...WordCAmp RJ 2015 - A importância do Design/UX Para os desenvolvedores de Word...
WordCAmp RJ 2015 - A importância do Design/UX Para os desenvolvedores de Word...
 
Usabilidade na tv digital
Usabilidade na tv digitalUsabilidade na tv digital
Usabilidade na tv digital
 
Apresentação PCC - Rodrigo Santiago
Apresentação PCC - Rodrigo SantiagoApresentação PCC - Rodrigo Santiago
Apresentação PCC - Rodrigo Santiago
 
Aula 3. frameworks front end
Aula 3. frameworks front endAula 3. frameworks front end
Aula 3. frameworks front end
 
Hack2B Startups - UX?
Hack2B Startups - UX?Hack2B Startups - UX?
Hack2B Startups - UX?
 
Semiotica fundamentos da composição visual (atv07)
Semiotica   fundamentos da composição visual (atv07)Semiotica   fundamentos da composição visual (atv07)
Semiotica fundamentos da composição visual (atv07)
 
Design para a web - da interface ao branding
Design para a web - da interface ao brandingDesign para a web - da interface ao branding
Design para a web - da interface ao branding
 
Jornalismo para tablets: o aplicativo da revista Veja e avaliação de comunica...
Jornalismo para tablets: o aplicativo da revista Veja e avaliação de comunica...Jornalismo para tablets: o aplicativo da revista Veja e avaliação de comunica...
Jornalismo para tablets: o aplicativo da revista Veja e avaliação de comunica...
 
12° Encontro de WebDesign (usabilidade)
12° Encontro de WebDesign (usabilidade)12° Encontro de WebDesign (usabilidade)
12° Encontro de WebDesign (usabilidade)
 

Usabilidade de Interfaces Gráficas na Web apresentação

  • 2.  O que é usabilidade e qual a sua importância na sociedade moderna?
  • 3. Interface Gráfica é o conceito da forma de interação entre o usuário do computador e um programa por meio de uma tela ou representação gráfica, visual, com desenhos, imagens, etc. Geralmente é entendido como a “tela” de um programa.
  • 4. Um GUI ruim Um bom GUI proporciona: proporciona: Dúvidas sobre onde clicar; Aumento no tráfego de usuários dentro do site; Demora para carregar; Diminuição da taxa de abandono do site; Botões que não levam a Desafogamento das lugar nenhum; centrais de ajuda e atendimento ao usuário; Dificuldade em Maior satisfação do compreender a proposta usuário e do cliente. da estrutura.
  • 5. Diretrizes de aplicabilidade para web: Velocidade Portabilidade Visibilidade Aumento de público Agilidade para Heavy Users Simplificação do desenvolvimento Redução de custos
  • 6.  http://www.youtube.com/watch?v=_bhxZjIqnIY (Equipe Olhar Digital)  http://www.youtube.com/watch?v=U_9gtCrQpXA (Teste de usabilidade do site Bilheteria Virtual)
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12. Ícone, para a Semiologia e a Semiótica, é um signo visual (uma imagem) que representa outro objeto por força de semelhança. Ícones são signos substitutivos (podem ser usados no lugar da coisa representada) de conteúdo derivativo.
  • 13. É possível influenciar na velocidade de leitura dos usuários de acordo com o uso de alguns recursos tipográficos e é importante se atentar para que todos os outros elementos estejam em harmonia com a tipografia utilizada.