SlideShare ist ein Scribd-Unternehmen logo
1 von 58
Downloaden Sie, um offline zu lesen
Social interface Design: projetando interações entre pessoas
As pessoas leem o meu conteúdo,
 mas elas são invisíveis umas para
 as outras. Como posso aproximá-
las, para que elas possam interagir
 umas com as outras sobre o meu
             conteúdo?
Cultura da Interface
Como o computador
transforma a nossa maneira
de criar e se comunicar?
Mapeamento de Bits e o
Espaço Informação

Dados com uma
localização física e
uma localização
virtual, sendo
manipulados
diretamente pelo
usuário.
Espaço-Informação


Ao invés de dizer que o computador execute
 alguma tarefa, os usuários poderiam fazer
     isso através da manipulação direta.




      Social Interface Design | @eduagni - www.agni.art.br
O Mouse: uma revolução
Interface: zona entre
  o meio e a mensagem
Essas metaformas, esses mapeamentos de
bits virão para ocupar praticamente todas
 as facetas da sociedade contemporânea:
trabalho, divertimento, amor, família, arte
     elevada, cultura popular, política.


     Social Interface Design | @eduagni - www.agni.art.br
Usabilidade


                  Criar interfaces fáceis de
                  usar, para possibilitar a
                  interação entre humanos e
                  máquinas.




Social Interface Design | @eduagni - www.agni.art.br
Foi o primeiro software de
  compartilhamento de arquivos em redes
 P2P que ganhou grande destaque mundial.
Foi o software mais usado do planeta no seu
                  momento.

      Social Interface Design | @eduagni - www.agni.art.br
Na janela principal do Napster existiam botões
 onde deveriam haver abas (afordabilidade),
 para que o usuário alternasse entre as telas.
  Essa era uma grande falha de usabilidade.

     Social Interface Design | @eduagni - www.agni.art.br
Usabilidade não era tão importante

     O Napster possibilitava que você
    compartilhasse arquivos com outras
pessoas, e esse tipo de interação atraía cada
             vez mais usuários.

         Isso ia além da usabilidade,
            e era mais importante.

      Social Interface Design | @eduagni - www.agni.art.br
“Nós todos focamos na experiência do
  usuário, ao invés de focarmos na
     especificação ou no código”




 (Christopher Cox, vice-presidente de produto)
Mark Zuckerberg, o criador do Facebook,
era um programador que não entendia nada
  de design, mas que tinha a preocupação
     constante de que o Facebook fosse
    um ambiente legal para as pessoas.

     Social Interface Design | @eduagni - www.agni.art.br
Quais experiências
os usuários querem ter?
A partir do momento que o Facebook
  começou a oferecer a possibilidade de
  interação que as pessoas queriam, ele
começou a se tornar o sucesso que é hoje.


     Social Interface Design | @eduagni - www.agni.art.br
A interface social era considerada como um
adendo em outros sites de fotografias da época,
          como Photoworks e Ofoto.

O que tornou o Flickr um sucesso foi o fato de as
características sociais serem parte integrante do
projeto. Os componentes sociais eram essenciais
                  para o design.

      Social Interface Design | @eduagni - www.agni.art.br
"Se a facilidade de uso fosse o único requisito,
 estaríamos todos andando em triciclos"
 Douglas Engelbart, inventor do mouse




                                        http://flickr.com/photos/sfj/611720154/
Usabilidade é o mais importante?

 Um aplicativo que faz algo bem, que as
pessoas realmente querem fazer, pode ser
difícil de usar, mas ainda será um sucesso.

Um aplicativo pode ser a coisa mais fácil no
 mundo para usar, mas se ele não faz algo
 que todo mundo quer, ele irá fracassar.


      Social Interface Design | @eduagni - www.agni.art.br
Usabilidade ainda é importante...




O próximo nível de problemas de design de
    interface, para além de acertar na
usabilidade, é o projeto da interface social.




      Social Interface Design | @eduagni - www.agni.art.br
Os seres humanos respondem
socialmente em suas interações
        com máquinas.
Você compra de quem tem boa reputação.


     Social Interface Design | @eduagni - www.agni.art.br
Você possui diferentes círculos sociais.




   Social Interface Design | @eduagni - www.agni.art.br
Você tem uma história.
Social Interface Design | @eduagni - www.agni.art.br
Você conversa.




Social Interface Design | @eduagni - www.agni.art.br
"A ideia não é compartilhar
             pensamentos, como ocorre no Twitter,
             mas dividir com o mundo instantêneos
             da vida capturados em imagens"
             (Mike Kriege, brasileiro criador do Instagram)




Social Interface Design | @eduagni - www.agni.art.br
“O like é uma solução tão obvia e tão elegante que
   o design é praticamente invisível, ao mesmo
 tempo é fácil de entender, esteja você usando o
     Facebook no Cairo, em Madrid ou em São
                    Francisco.”

     (Christopher Cox, vice-presidente de produto)
A Internet traz consigo uma outra possibilidade:
    a mediação de interações entre pessoas,
        e não entre pessoas e máquinas.
Seres humanos possuem
necessidades sociais
que buscam
incessantemente
suprir no decorrer
da vida, e caso elas
não consigam,
tornam-se pessoas
frustradas.
Necessidades Sociais
Expressar a  Status e                       Dar e       Pertencer      Senso de
identidade auto-estima                     receber      a grupos,     comunidade
                                            ajuda        afiliação
Blogs
Vídeos, compartilhamento de conteúdo, social bookmarks
Youtube, Delicious


Listas de discussão
Yahoo ou Google Groups


Perfil em redes sociais
Facebook, Orkut


Sites para avaliações, recomendações e resenhas
Yelp, Trip Advisor


Comunidades para objetivos específicos
Slashdot, DiHitt, Linkedin




                     Social Interface Design | @eduagni - www.agni.art.br
Necessidades Sociais
Expressar a                    Status e     Dar e       Pertencer      Senso de
identidade                   auto-estima   receber      a grupos,     comunidade
                                            ajuda        afiliação
Blogs
Vídeos, compartilhamento de conteúdo, social bookmarks
Youtube, Delicious


Listas de discussão
Yahoo ou Google Groups


Perfil em redes sociais
Facebook, Orkut


Sites para avaliações, recomendações e resenhas
Yelp, Trip Advisor


Comunidades para objetivos específicos
Slashdot, DiHitt, Linkedin




                     Social Interface Design | @eduagni - www.agni.art.br
Necessidades Sociais
Expressar a                    Status e     Dar e       Pertencer      Senso de
identidade                   auto-estima   receber      a grupos,     comunidade
                                            ajuda        afiliação
Blogs
Vídeos, compartilhamento de conteúdo, social bookmarks
Youtube, Delicious


Listas de discussão
Yahoo ou Google Groups


Perfil em redes sociais
Facebook, Orkut


Sites para avaliações, recomendações e resenhas
Yelp, Trip Advisor


Comunidades para objetivos específicos
Slashdot, DiHitt, Linkedin




                     Social Interface Design | @eduagni - www.agni.art.br
Necessidades Sociais
Expressar a                    Status e     Dar e       Pertencer      Senso de
identidade                   auto-estima   receber      a grupos,     comunidade
                                            ajuda        afiliação
Blogs
Vídeos, compartilhamento de conteúdo, social bookmarks
Youtube, Delicious


Listas de discussão
Yahoo ou Google Groups


Perfil em redes sociais
Facebook, Orkut


Sites para avaliações, recomendações e resenhas
Yelp, Trip Advisor


Comunidades para objetivos específicos
Slashdot, DiHitt, Linkedin




                     Social Interface Design | @eduagni - www.agni.art.br
Necessidades Sociais
Expressar a                    Status e     Dar e       Pertencer      Senso de
identidade                   auto-estima   receber      a grupos,     comunidade
                                            ajuda        afiliação
Blogs
Vídeos, compartilhamento de conteúdo, social bookmarks
Youtube, Delicious


Listas de discussão
Yahoo ou Google Groups


Perfil em redes sociais
Facebook, Orkut


Sites para avaliações, recomendações e resenhas
Yelp, Trip Advisor


Comunidades para objetivos específicos
Slashdot, DiHitt, Linkedin




                     Social Interface Design | @eduagni - www.agni.art.br
Social interface Design: projetando interações entre pessoas
Interface Social

Foco na interação entre
       pessoas
Usuário

       Re                                        ç   a
         pu                                   en
              taç                          es
                    ão                  Pr




                         Compartilhar

Comunidade                                      Atividade
Usuário
                            Identidade

                            A identidade do usuário e sua
                            capacidade de controlar sua
                            apresentação é um elemento
                            central na construção de um
                            site social.




Social Interface Design | @eduagni - www.agni.art.br
Usuário
                        Perfil

 O usuário precisa de um local
onde todos possam ter acesso
aos conteúdos que ele publica
     ou compartilha, e que são
          relevantes para ele.




         Social Interface Design | @eduagni - www.agni.art.br
Usuário
                            Presença

                            O usuário precisa saber quem
                            está disponível em um
                            determinado contexto social,
                            para compartilhar conteúdos e
                            status.




Social Interface Design | @eduagni - www.agni.art.br
Usuário
       Reputação

 Os usuários querem
  mostrar no que são
melhores, através de
    alguma forma de
classificação em uma
     categoria, ou de
          modo geral.




Social Interface Design | @eduagni - www.agni.art.br
Atividades
                            Coleções

                            As pessoas compartilham
                            coisas que encontram, e
                            querem poder guardar e expor
                            tudo como numa estante de
                            troféus para os outros verem.




Social Interface Design | @eduagni - www.agni.art.br
Atividades
    Compartilhamento

    Permitir que os usuários
 compartilhem espontanea-
mente os conteúdos que elas
  encontram, enviando para
   amigos ou publicando em
     perfis de redes sociais.




        Social Interface Design | @eduagni - www.agni.art.br
Atividades
                            Feedback

                            Os usuários querem dar suas
                            opiniões sobre um conteúdo,
                            objeto, pessoa ou lugar.




Social Interface Design | @eduagni - www.agni.art.br
What Problem Does This Solve?
  When to Use This Pattern
     What's the Solution?
    Why Use This Pattern?
Ubiquidade
Social interface Design: projetando interações entre pessoas
Compartilhar tudo para
definir a personalidade

Observar amigos online em
lugares próximos e encontrar
pessoas ao acaso são as
principais características do
Foursquare, segundo seu
co-fundador Dennis Crowley

•   Serendipismo
•   Dinâmica de jogo
•   Diário pessoal
•   Compartilhar experiências
•   Participar de promoções
Social interface Design: projetando interações entre pessoas
Social interface Design: projetando interações entre pessoas
A tragédia dos comuns
    Usabilidade e Design Defensivo:
dizer ao usuário o que ele fez de errado, e
    dizer como ele pode corrigir isso.

       Design de interface social:
    ajudar a sociedade a ter sucesso,
     mesmo que isso signifique que
       um usuário tem que falhar.

     Social Interface Design | @eduagni - www.agni.art.br
Princípio da Skinner Box
                               Dar aos usuários
                               recompensas pela
                               realização de uma
                               determinada tarefa,
                               incentivando a
                               interação.




 Social Interface Design | @eduagni - www.agni.art.br
As recompensas e o ego
 nos ambientes sociais
                       Desbloquear funções
                       (como os comentários nos
                       votos do Hacker News) ou
                       fornecer Badges (como
                       no Blip.fm) podem
                       motivar os usuários a
                       interagir.


 Social Interface Design | @eduagni - www.agni.art.br
Lembre os usuários de interagir...

                           Avisar os usuários sobre
                           atualizações no conteúdo
                           ou novas respostas para
                           seus comentários, assim
                           como fornecer opções de
                           compartilhamento, são
                           recursos essências para
                           potencializar a interação.

    Social Interface Design | @eduagni - www.agni.art.br
Lembre os usuários de interagir...

                           Avisar os usuários sobre
                           atualizações no conteúdo
                           ou novas respostas para
                           seus comentários, assim
                           como fornecer opções de
                           compartilhamento, são
                           recursos essências para
                           potencializar a interação.

    Social Interface Design | @eduagni - www.agni.art.br
A Day Made of Glass
Antes que você possa vir a ter
uma interface eficaz, você precisa
saber exatamente quais são seus
        objetivos sociais.
É preciso começar a pensar de
  uma forma menos técnica e
matemática, e começar a pensar
 nas interações de forma mais
  antropológica e etnológica.
   É preciso manter o foco na
  interação entre as pessoas.
Social interface Design: projetando interações entre pessoas

Más contenido relacionado

Andere mochten auch

A interface nunca está pronta (1)
A interface nunca está pronta (1)A interface nunca está pronta (1)
A interface nunca está pronta (1)Jefferson de Camargo
 
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
 
HTML, CSS & Style Guides
HTML, CSS & Style GuidesHTML, CSS & Style Guides
HTML, CSS & Style GuidesBruno Trecenti
 
[QCon Rio 2015] UX para desenvolvedores
[QCon Rio 2015] UX para desenvolvedores[QCon Rio 2015] UX para desenvolvedores
[QCon Rio 2015] UX para desenvolvedoresTássia Spinelli
 
Apresentação do livro o guia para projetar ux
Apresentação do livro o guia para projetar uxApresentação do livro o guia para projetar ux
Apresentação do livro o guia para projetar uxLucas Darros Lorençon
 
UX como estratégia para conquistar clientes e impactar negócios
UX como estratégia para conquistar clientes e impactar negóciosUX como estratégia para conquistar clientes e impactar negócios
UX como estratégia para conquistar clientes e impactar negóciosPriscilla Albuquerque
 
UX para desenvolvedores - UX Conf BR 2015
UX para desenvolvedores - UX Conf BR 2015UX para desenvolvedores - UX Conf BR 2015
UX para desenvolvedores - UX Conf BR 2015Samantha Rosa
 
UX para agências de publicidade
UX para agências de publicidadeUX para agências de publicidade
UX para agências de publicidadeRichard Jesus
 

Andere mochten auch (13)

WP BH
WP BHWP BH
WP BH
 
A interface nunca está pronta (1)
A interface nunca está pronta (1)A interface nunca está pronta (1)
A interface nunca está pronta (1)
 
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
 
HTML, CSS & Style Guides
HTML, CSS & Style GuidesHTML, CSS & Style Guides
HTML, CSS & Style Guides
 
HTML/CSS Patterns
HTML/CSS PatternsHTML/CSS Patterns
HTML/CSS Patterns
 
Design de navegação web
Design de navegação webDesign de navegação web
Design de navegação web
 
[QCon Rio 2015] UX para desenvolvedores
[QCon Rio 2015] UX para desenvolvedores[QCon Rio 2015] UX para desenvolvedores
[QCon Rio 2015] UX para desenvolvedores
 
UX Design na AG2
UX Design na AG2UX Design na AG2
UX Design na AG2
 
Apresentação do livro o guia para projetar ux
Apresentação do livro o guia para projetar uxApresentação do livro o guia para projetar ux
Apresentação do livro o guia para projetar ux
 
UX como estratégia para conquistar clientes e impactar negócios
UX como estratégia para conquistar clientes e impactar negóciosUX como estratégia para conquistar clientes e impactar negócios
UX como estratégia para conquistar clientes e impactar negócios
 
UX - Entregaveis
UX - EntregaveisUX - Entregaveis
UX - Entregaveis
 
UX para desenvolvedores - UX Conf BR 2015
UX para desenvolvedores - UX Conf BR 2015UX para desenvolvedores - UX Conf BR 2015
UX para desenvolvedores - UX Conf BR 2015
 
UX para agências de publicidade
UX para agências de publicidadeUX para agências de publicidade
UX para agências de publicidade
 

Ähnlich wie Social interface Design: projetando interações entre pessoas

Redes sociais aabb em tela
Redes sociais   aabb em telaRedes sociais   aabb em tela
Redes sociais aabb em telaLívia Neiva
 
Minicurso Semana Jornalismo UFSC
Minicurso Semana Jornalismo UFSCMinicurso Semana Jornalismo UFSC
Minicurso Semana Jornalismo UFSCVanessa Aguiar
 
Design de Redes Sociais
Design de Redes SociaisDesign de Redes Sociais
Design de Redes SociaisUTFPR
 
Usabilidade em Comunidades Geradas pelos Utilizadores
Usabilidade em Comunidades Geradas pelos UtilizadoresUsabilidade em Comunidades Geradas pelos Utilizadores
Usabilidade em Comunidades Geradas pelos UtilizadoresPedro Custódio
 
Gestao das marcas nas midias sociais
Gestao das marcas nas midias sociaisGestao das marcas nas midias sociais
Gestao das marcas nas midias sociaisComSchool
 
Aula3 Tendencias
Aula3 TendenciasAula3 Tendencias
Aula3 TendenciasAna Paula
 
Mídias sociais, gamification e storytelling: uma breve apresentação
Mídias sociais, gamification e storytelling: uma breve apresentaçãoMídias sociais, gamification e storytelling: uma breve apresentação
Mídias sociais, gamification e storytelling: uma breve apresentaçãoVanissa Wanick
 
Redes Sociais e Publicidade
Redes Sociais e PublicidadeRedes Sociais e Publicidade
Redes Sociais e PublicidadeNicole Simonato
 
Mídias Sociais: Sua Marca está pronta?
Mídias Sociais: Sua Marca está pronta?Mídias Sociais: Sua Marca está pronta?
Mídias Sociais: Sua Marca está pronta?Leonardo Palagi
 
Redes sociais na educação superior
Redes sociais na educação superiorRedes sociais na educação superior
Redes sociais na educação superiorbrazuk
 
Redes sociais na educação superior
Redes sociais na educação superiorRedes sociais na educação superior
Redes sociais na educação superiorCarloney
 
Midia Social como ferramenta de trabalho
Midia Social como ferramenta de trabalhoMidia Social como ferramenta de trabalho
Midia Social como ferramenta de trabalhoMensagens Virtuais
 
Redes sociais - planejamento e dados
Redes sociais - planejamento e dadosRedes sociais - planejamento e dados
Redes sociais - planejamento e dadosJenifer Mendes
 
Uso das redes sociais em marketing de bibliotecas
Uso das redes sociais em marketing de bibliotecasUso das redes sociais em marketing de bibliotecas
Uso das redes sociais em marketing de bibliotecasCarolina Barros
 
Interminas percepção das redes sociais - cuidados e oportunidades
Interminas   percepção das redes sociais - cuidados e oportunidadesInterminas   percepção das redes sociais - cuidados e oportunidades
Interminas percepção das redes sociais - cuidados e oportunidadesEdney Souza
 
Curso Gestão de Rede Sociais - Introdução e tendências das Redes Sociais
Curso Gestão de Rede Sociais - Introdução e tendências das Redes SociaisCurso Gestão de Rede Sociais - Introdução e tendências das Redes Sociais
Curso Gestão de Rede Sociais - Introdução e tendências das Redes SociaisFernando Souza
 

Ähnlich wie Social interface Design: projetando interações entre pessoas (20)

Redes sociais aabb em tela
Redes sociais   aabb em telaRedes sociais   aabb em tela
Redes sociais aabb em tela
 
Minicurso Semana Jornalismo UFSC
Minicurso Semana Jornalismo UFSCMinicurso Semana Jornalismo UFSC
Minicurso Semana Jornalismo UFSC
 
Design de Redes Sociais
Design de Redes SociaisDesign de Redes Sociais
Design de Redes Sociais
 
Vitoria decor
Vitoria decorVitoria decor
Vitoria decor
 
Usabilidade em Comunidades Geradas pelos Utilizadores
Usabilidade em Comunidades Geradas pelos UtilizadoresUsabilidade em Comunidades Geradas pelos Utilizadores
Usabilidade em Comunidades Geradas pelos Utilizadores
 
Gestao das marcas nas midias sociais
Gestao das marcas nas midias sociaisGestao das marcas nas midias sociais
Gestao das marcas nas midias sociais
 
Aula3 Tendencias
Aula3 TendenciasAula3 Tendencias
Aula3 Tendencias
 
Mídias sociais, gamification e storytelling: uma breve apresentação
Mídias sociais, gamification e storytelling: uma breve apresentaçãoMídias sociais, gamification e storytelling: uma breve apresentação
Mídias sociais, gamification e storytelling: uma breve apresentação
 
Redes Sociais e Publicidade
Redes Sociais e PublicidadeRedes Sociais e Publicidade
Redes Sociais e Publicidade
 
Mídias Sociais: Sua Marca está pronta?
Mídias Sociais: Sua Marca está pronta?Mídias Sociais: Sua Marca está pronta?
Mídias Sociais: Sua Marca está pronta?
 
Design de produtos
Design de produtosDesign de produtos
Design de produtos
 
Vitória Decor 02
Vitória Decor 02Vitória Decor 02
Vitória Decor 02
 
Redes sociais na educação superior
Redes sociais na educação superiorRedes sociais na educação superior
Redes sociais na educação superior
 
Redes sociais na educação superior
Redes sociais na educação superiorRedes sociais na educação superior
Redes sociais na educação superior
 
Midia Social como ferramenta de trabalho
Midia Social como ferramenta de trabalhoMidia Social como ferramenta de trabalho
Midia Social como ferramenta de trabalho
 
Redes sociais - planejamento e dados
Redes sociais - planejamento e dadosRedes sociais - planejamento e dados
Redes sociais - planejamento e dados
 
Mídias sociais x rede social
Mídias sociais x rede socialMídias sociais x rede social
Mídias sociais x rede social
 
Uso das redes sociais em marketing de bibliotecas
Uso das redes sociais em marketing de bibliotecasUso das redes sociais em marketing de bibliotecas
Uso das redes sociais em marketing de bibliotecas
 
Interminas percepção das redes sociais - cuidados e oportunidades
Interminas   percepção das redes sociais - cuidados e oportunidadesInterminas   percepção das redes sociais - cuidados e oportunidades
Interminas percepção das redes sociais - cuidados e oportunidades
 
Curso Gestão de Rede Sociais - Introdução e tendências das Redes Sociais
Curso Gestão de Rede Sociais - Introdução e tendências das Redes SociaisCurso Gestão de Rede Sociais - Introdução e tendências das Redes Sociais
Curso Gestão de Rede Sociais - Introdução e tendências das Redes Sociais
 

Mehr von Edu Agni

Emancipação pelo Aprendizado do Design
Emancipação pelo Aprendizado do DesignEmancipação pelo Aprendizado do Design
Emancipação pelo Aprendizado do DesignEdu Agni
 
Ensino do design em tempos de quarentena
Ensino do design em tempos de quarentenaEnsino do design em tempos de quarentena
Ensino do design em tempos de quarentenaEdu Agni
 
Inovação e User Experience
Inovação e User ExperienceInovação e User Experience
Inovação e User ExperienceEdu Agni
 
UX Maturity
UX MaturityUX Maturity
UX MaturityEdu Agni
 
Interfaces Naturais
Interfaces NaturaisInterfaces Naturais
Interfaces NaturaisEdu Agni
 
Pesquisa de Campo e a Entrevista Semi-Estruturada
Pesquisa de Campo e a Entrevista Semi-EstruturadaPesquisa de Campo e a Entrevista Semi-Estruturada
Pesquisa de Campo e a Entrevista Semi-EstruturadaEdu Agni
 
Jornada do Consumidor no E-commerce
Jornada do Consumidor no E-commerceJornada do Consumidor no E-commerce
Jornada do Consumidor no E-commerceEdu Agni
 
Interfaces Naturais
Interfaces NaturaisInterfaces Naturais
Interfaces NaturaisEdu Agni
 
UX é o novo SEO
UX é o novo SEOUX é o novo SEO
UX é o novo SEOEdu Agni
 
Natural User Interface Design
Natural User Interface DesignNatural User Interface Design
Natural User Interface DesignEdu Agni
 
Mobile First (ou boas razões para investir em Mobile)
Mobile First (ou boas razões para investir em Mobile)Mobile First (ou boas razões para investir em Mobile)
Mobile First (ou boas razões para investir em Mobile)Edu Agni
 
As Media Queries são só um detalhe!
As Media Queries são só um detalhe!As Media Queries são só um detalhe!
As Media Queries são só um detalhe!Edu Agni
 
Projetando com Lean UX
Projetando com Lean UXProjetando com Lean UX
Projetando com Lean UXEdu Agni
 
Desenvolvimento Centrado no Usuário
Desenvolvimento Centrado no UsuárioDesenvolvimento Centrado no Usuário
Desenvolvimento Centrado no UsuárioEdu Agni
 
Ux nas organizações
Ux nas organizaçõesUx nas organizações
Ux nas organizaçõesEdu Agni
 
A imersão na experiência digital
A imersão na experiência digitalA imersão na experiência digital
A imersão na experiência digitalEdu Agni
 
Mobile First & Responsive Design
Mobile First & Responsive DesignMobile First & Responsive Design
Mobile First & Responsive DesignEdu Agni
 
Flat Design e a Re-Cultura da Interface
Flat Design e a Re-Cultura da InterfaceFlat Design e a Re-Cultura da Interface
Flat Design e a Re-Cultura da InterfaceEdu Agni
 
Usabilidade, User Experience e Design Emocional no E-commerce
Usabilidade, User Experience e Design Emocional no E-commerceUsabilidade, User Experience e Design Emocional no E-commerce
Usabilidade, User Experience e Design Emocional no E-commerceEdu Agni
 

Mehr von Edu Agni (20)

Emancipação pelo Aprendizado do Design
Emancipação pelo Aprendizado do DesignEmancipação pelo Aprendizado do Design
Emancipação pelo Aprendizado do Design
 
Ensino do design em tempos de quarentena
Ensino do design em tempos de quarentenaEnsino do design em tempos de quarentena
Ensino do design em tempos de quarentena
 
Inovação e User Experience
Inovação e User ExperienceInovação e User Experience
Inovação e User Experience
 
UX Maturity
UX MaturityUX Maturity
UX Maturity
 
Interfaces Naturais
Interfaces NaturaisInterfaces Naturais
Interfaces Naturais
 
Pesquisa de Campo e a Entrevista Semi-Estruturada
Pesquisa de Campo e a Entrevista Semi-EstruturadaPesquisa de Campo e a Entrevista Semi-Estruturada
Pesquisa de Campo e a Entrevista Semi-Estruturada
 
Jornada do Consumidor no E-commerce
Jornada do Consumidor no E-commerceJornada do Consumidor no E-commerce
Jornada do Consumidor no E-commerce
 
DevUX
DevUXDevUX
DevUX
 
Interfaces Naturais
Interfaces NaturaisInterfaces Naturais
Interfaces Naturais
 
UX é o novo SEO
UX é o novo SEOUX é o novo SEO
UX é o novo SEO
 
Natural User Interface Design
Natural User Interface DesignNatural User Interface Design
Natural User Interface Design
 
Mobile First (ou boas razões para investir em Mobile)
Mobile First (ou boas razões para investir em Mobile)Mobile First (ou boas razões para investir em Mobile)
Mobile First (ou boas razões para investir em Mobile)
 
As Media Queries são só um detalhe!
As Media Queries são só um detalhe!As Media Queries são só um detalhe!
As Media Queries são só um detalhe!
 
Projetando com Lean UX
Projetando com Lean UXProjetando com Lean UX
Projetando com Lean UX
 
Desenvolvimento Centrado no Usuário
Desenvolvimento Centrado no UsuárioDesenvolvimento Centrado no Usuário
Desenvolvimento Centrado no Usuário
 
Ux nas organizações
Ux nas organizaçõesUx nas organizações
Ux nas organizações
 
A imersão na experiência digital
A imersão na experiência digitalA imersão na experiência digital
A imersão na experiência digital
 
Mobile First & Responsive Design
Mobile First & Responsive DesignMobile First & Responsive Design
Mobile First & Responsive Design
 
Flat Design e a Re-Cultura da Interface
Flat Design e a Re-Cultura da InterfaceFlat Design e a Re-Cultura da Interface
Flat Design e a Re-Cultura da Interface
 
Usabilidade, User Experience e Design Emocional no E-commerce
Usabilidade, User Experience e Design Emocional no E-commerceUsabilidade, User Experience e Design Emocional no E-commerce
Usabilidade, User Experience e Design Emocional no E-commerce
 

Social interface Design: projetando interações entre pessoas

  • 2. As pessoas leem o meu conteúdo, mas elas são invisíveis umas para as outras. Como posso aproximá- las, para que elas possam interagir umas com as outras sobre o meu conteúdo?
  • 3. Cultura da Interface Como o computador transforma a nossa maneira de criar e se comunicar?
  • 4. Mapeamento de Bits e o Espaço Informação Dados com uma localização física e uma localização virtual, sendo manipulados diretamente pelo usuário.
  • 5. Espaço-Informação Ao invés de dizer que o computador execute alguma tarefa, os usuários poderiam fazer isso através da manipulação direta. Social Interface Design | @eduagni - www.agni.art.br
  • 6. O Mouse: uma revolução
  • 7. Interface: zona entre o meio e a mensagem Essas metaformas, esses mapeamentos de bits virão para ocupar praticamente todas as facetas da sociedade contemporânea: trabalho, divertimento, amor, família, arte elevada, cultura popular, política. Social Interface Design | @eduagni - www.agni.art.br
  • 8. Usabilidade Criar interfaces fáceis de usar, para possibilitar a interação entre humanos e máquinas. Social Interface Design | @eduagni - www.agni.art.br
  • 9. Foi o primeiro software de compartilhamento de arquivos em redes P2P que ganhou grande destaque mundial. Foi o software mais usado do planeta no seu momento. Social Interface Design | @eduagni - www.agni.art.br
  • 10. Na janela principal do Napster existiam botões onde deveriam haver abas (afordabilidade), para que o usuário alternasse entre as telas. Essa era uma grande falha de usabilidade. Social Interface Design | @eduagni - www.agni.art.br
  • 11. Usabilidade não era tão importante O Napster possibilitava que você compartilhasse arquivos com outras pessoas, e esse tipo de interação atraía cada vez mais usuários. Isso ia além da usabilidade, e era mais importante. Social Interface Design | @eduagni - www.agni.art.br
  • 12. “Nós todos focamos na experiência do usuário, ao invés de focarmos na especificação ou no código” (Christopher Cox, vice-presidente de produto)
  • 13. Mark Zuckerberg, o criador do Facebook, era um programador que não entendia nada de design, mas que tinha a preocupação constante de que o Facebook fosse um ambiente legal para as pessoas. Social Interface Design | @eduagni - www.agni.art.br
  • 15. A partir do momento que o Facebook começou a oferecer a possibilidade de interação que as pessoas queriam, ele começou a se tornar o sucesso que é hoje. Social Interface Design | @eduagni - www.agni.art.br
  • 16. A interface social era considerada como um adendo em outros sites de fotografias da época, como Photoworks e Ofoto. O que tornou o Flickr um sucesso foi o fato de as características sociais serem parte integrante do projeto. Os componentes sociais eram essenciais para o design. Social Interface Design | @eduagni - www.agni.art.br
  • 17. "Se a facilidade de uso fosse o único requisito, estaríamos todos andando em triciclos" Douglas Engelbart, inventor do mouse http://flickr.com/photos/sfj/611720154/
  • 18. Usabilidade é o mais importante? Um aplicativo que faz algo bem, que as pessoas realmente querem fazer, pode ser difícil de usar, mas ainda será um sucesso. Um aplicativo pode ser a coisa mais fácil no mundo para usar, mas se ele não faz algo que todo mundo quer, ele irá fracassar. Social Interface Design | @eduagni - www.agni.art.br
  • 19. Usabilidade ainda é importante... O próximo nível de problemas de design de interface, para além de acertar na usabilidade, é o projeto da interface social. Social Interface Design | @eduagni - www.agni.art.br
  • 20. Os seres humanos respondem socialmente em suas interações com máquinas.
  • 21. Você compra de quem tem boa reputação. Social Interface Design | @eduagni - www.agni.art.br
  • 22. Você possui diferentes círculos sociais. Social Interface Design | @eduagni - www.agni.art.br
  • 23. Você tem uma história. Social Interface Design | @eduagni - www.agni.art.br
  • 24. Você conversa. Social Interface Design | @eduagni - www.agni.art.br
  • 25. "A ideia não é compartilhar pensamentos, como ocorre no Twitter, mas dividir com o mundo instantêneos da vida capturados em imagens" (Mike Kriege, brasileiro criador do Instagram) Social Interface Design | @eduagni - www.agni.art.br
  • 26. “O like é uma solução tão obvia e tão elegante que o design é praticamente invisível, ao mesmo tempo é fácil de entender, esteja você usando o Facebook no Cairo, em Madrid ou em São Francisco.” (Christopher Cox, vice-presidente de produto)
  • 27. A Internet traz consigo uma outra possibilidade: a mediação de interações entre pessoas, e não entre pessoas e máquinas.
  • 28. Seres humanos possuem necessidades sociais que buscam incessantemente suprir no decorrer da vida, e caso elas não consigam, tornam-se pessoas frustradas.
  • 29. Necessidades Sociais Expressar a Status e Dar e Pertencer Senso de identidade auto-estima receber a grupos, comunidade ajuda afiliação Blogs Vídeos, compartilhamento de conteúdo, social bookmarks Youtube, Delicious Listas de discussão Yahoo ou Google Groups Perfil em redes sociais Facebook, Orkut Sites para avaliações, recomendações e resenhas Yelp, Trip Advisor Comunidades para objetivos específicos Slashdot, DiHitt, Linkedin Social Interface Design | @eduagni - www.agni.art.br
  • 30. Necessidades Sociais Expressar a Status e Dar e Pertencer Senso de identidade auto-estima receber a grupos, comunidade ajuda afiliação Blogs Vídeos, compartilhamento de conteúdo, social bookmarks Youtube, Delicious Listas de discussão Yahoo ou Google Groups Perfil em redes sociais Facebook, Orkut Sites para avaliações, recomendações e resenhas Yelp, Trip Advisor Comunidades para objetivos específicos Slashdot, DiHitt, Linkedin Social Interface Design | @eduagni - www.agni.art.br
  • 31. Necessidades Sociais Expressar a Status e Dar e Pertencer Senso de identidade auto-estima receber a grupos, comunidade ajuda afiliação Blogs Vídeos, compartilhamento de conteúdo, social bookmarks Youtube, Delicious Listas de discussão Yahoo ou Google Groups Perfil em redes sociais Facebook, Orkut Sites para avaliações, recomendações e resenhas Yelp, Trip Advisor Comunidades para objetivos específicos Slashdot, DiHitt, Linkedin Social Interface Design | @eduagni - www.agni.art.br
  • 32. Necessidades Sociais Expressar a Status e Dar e Pertencer Senso de identidade auto-estima receber a grupos, comunidade ajuda afiliação Blogs Vídeos, compartilhamento de conteúdo, social bookmarks Youtube, Delicious Listas de discussão Yahoo ou Google Groups Perfil em redes sociais Facebook, Orkut Sites para avaliações, recomendações e resenhas Yelp, Trip Advisor Comunidades para objetivos específicos Slashdot, DiHitt, Linkedin Social Interface Design | @eduagni - www.agni.art.br
  • 33. Necessidades Sociais Expressar a Status e Dar e Pertencer Senso de identidade auto-estima receber a grupos, comunidade ajuda afiliação Blogs Vídeos, compartilhamento de conteúdo, social bookmarks Youtube, Delicious Listas de discussão Yahoo ou Google Groups Perfil em redes sociais Facebook, Orkut Sites para avaliações, recomendações e resenhas Yelp, Trip Advisor Comunidades para objetivos específicos Slashdot, DiHitt, Linkedin Social Interface Design | @eduagni - www.agni.art.br
  • 35. Interface Social Foco na interação entre pessoas
  • 36. Usuário Re ç a pu en taç es ão Pr Compartilhar Comunidade Atividade
  • 37. Usuário Identidade A identidade do usuário e sua capacidade de controlar sua apresentação é um elemento central na construção de um site social. Social Interface Design | @eduagni - www.agni.art.br
  • 38. Usuário Perfil O usuário precisa de um local onde todos possam ter acesso aos conteúdos que ele publica ou compartilha, e que são relevantes para ele. Social Interface Design | @eduagni - www.agni.art.br
  • 39. Usuário Presença O usuário precisa saber quem está disponível em um determinado contexto social, para compartilhar conteúdos e status. Social Interface Design | @eduagni - www.agni.art.br
  • 40. Usuário Reputação Os usuários querem mostrar no que são melhores, através de alguma forma de classificação em uma categoria, ou de modo geral. Social Interface Design | @eduagni - www.agni.art.br
  • 41. Atividades Coleções As pessoas compartilham coisas que encontram, e querem poder guardar e expor tudo como numa estante de troféus para os outros verem. Social Interface Design | @eduagni - www.agni.art.br
  • 42. Atividades Compartilhamento Permitir que os usuários compartilhem espontanea- mente os conteúdos que elas encontram, enviando para amigos ou publicando em perfis de redes sociais. Social Interface Design | @eduagni - www.agni.art.br
  • 43. Atividades Feedback Os usuários querem dar suas opiniões sobre um conteúdo, objeto, pessoa ou lugar. Social Interface Design | @eduagni - www.agni.art.br
  • 44. What Problem Does This Solve? When to Use This Pattern What's the Solution? Why Use This Pattern?
  • 47. Compartilhar tudo para definir a personalidade Observar amigos online em lugares próximos e encontrar pessoas ao acaso são as principais características do Foursquare, segundo seu co-fundador Dennis Crowley • Serendipismo • Dinâmica de jogo • Diário pessoal • Compartilhar experiências • Participar de promoções
  • 50. A tragédia dos comuns Usabilidade e Design Defensivo: dizer ao usuário o que ele fez de errado, e dizer como ele pode corrigir isso. Design de interface social: ajudar a sociedade a ter sucesso, mesmo que isso signifique que um usuário tem que falhar. Social Interface Design | @eduagni - www.agni.art.br
  • 51. Princípio da Skinner Box Dar aos usuários recompensas pela realização de uma determinada tarefa, incentivando a interação. Social Interface Design | @eduagni - www.agni.art.br
  • 52. As recompensas e o ego nos ambientes sociais Desbloquear funções (como os comentários nos votos do Hacker News) ou fornecer Badges (como no Blip.fm) podem motivar os usuários a interagir. Social Interface Design | @eduagni - www.agni.art.br
  • 53. Lembre os usuários de interagir... Avisar os usuários sobre atualizações no conteúdo ou novas respostas para seus comentários, assim como fornecer opções de compartilhamento, são recursos essências para potencializar a interação. Social Interface Design | @eduagni - www.agni.art.br
  • 54. Lembre os usuários de interagir... Avisar os usuários sobre atualizações no conteúdo ou novas respostas para seus comentários, assim como fornecer opções de compartilhamento, são recursos essências para potencializar a interação. Social Interface Design | @eduagni - www.agni.art.br
  • 55. A Day Made of Glass
  • 56. Antes que você possa vir a ter uma interface eficaz, você precisa saber exatamente quais são seus objetivos sociais.
  • 57. É preciso começar a pensar de uma forma menos técnica e matemática, e começar a pensar nas interações de forma mais antropológica e etnológica. É preciso manter o foco na interação entre as pessoas.