DESIGNDIGITAL

dDESIGN | UFPE

SUMÁRIO

ARQUITETURA DA MÍDIA
COMPUTACIONAL

PARTE 1

{
}

MÍDIAS

COMPUTACIONAIS

NEW MEDIA

MÍDIA ON

MÍDIA DIGITAL

MÍDIA ALGORÍTIMICA

MÍDIA INTERATIVA

</>

INTERNET

MÍDIAS SOCIAIS

CÓDIGO INTERPRETADO

CÓDIGO COMPILADO

FORMATOS

FRAGMENTAÇÃO

PETER MORVILLE

A INTERNET PRODUZIU UMA GRANDE BAGUNÇA DE INFORMAÇÃO.
WEBSITES CRIADOS SEM PLANEJAMENTO PARA CRESCER; PROBLEMAS NO GERENCIAMENTO DE CONTEÚDO; ALTOS CUSTOS DE REFORMULAÇÃO DE WEBSITES;


USUÁRIOS PREJUDICADOS.

FRONT-END

BACK-END

 </>
 {;}

DIFERENÇAS ENTRE

DISPOSITIVOS DE I/O

E RECURSOS

DISPONÍVEIS

LARGURA DE BANDA

E RESTRIÇÕES DE TRANSFERÊNCIA DE DADOS

CAPACIDADE DE PROCESSAMENTO

CONSUMO DE MEMÓRIA

DISPONIBILIDADE

CAPACIDADE DE PROCESSAMENTO

CONSUMO DE MEMÓRIA

INCOMPATIBILIDADE DE SOFTWARE

LIMITAÇÕES
TÉCNICAS

INCOMPATIBILIDADE DE SOFTWARE

WINDOWS

C#, C++, .NET, JAVA

APPLE

SWIFT, OBJ-C

ANDROID

JAVA

GAMES

XNA, MONO, LUA, UNITY, UNREAL, C++, C#

COMPUTAÇÃO FÍSICA

PROCESING, C++, ARDUINO

SERVIDOR

PHP, JSP, PYTHON, RUBY, .NET

BANCO DE
DADOS

SQL SERVER, POSTEGREE, MYSQL

ARTE
   GENERATIVA

C++, CINDER, OPENFRAMEWORKS, PROCESSING

@

WEB

HTML, CSS, JAVASCRIPT

LINGUAGENS

DE PROGRAMAÇÃO

MEDIA ECOLOGY

SEAMLESS

SECOND SCREEN

DESIGN / PROJETO

PARTE 2

PROCESSOMANIFESTOPROPOSIÇÃO

FORM FOLLOWS FUNCTION

FORM FOLLOWS CONTENT

PROJETAR É UM PROBLEMA METODOLÓGICO

PRODUTO TÍPICO DA APPLE

PRODUTO TÍPICO DO GOOGLE

PRODUTO TÍPICO DA SUA EMPRESA

PROJETO

POR

QUE?

COMO?

O QUE?

PROJETO NÃO É JOB

PROJETO PRECISA DE PESQUISA CONSTANTE

PROJETO PRECISA DE REFLEXÃO PERMANENTE

PROJETO   =   PENSAR   +   FAZER   + 

                         REPENSAR    +    REFAZER

UM PROJETO DESESTRUTURADO / SEM FOCO

ADOÇÃO DE UM MÉTODO PROJETUAL

CONCISÃO

IDENTIDADE

INTEGRIDADE

SOLIDEZ

CLAREZA (LEGIBILIDADE)

UTILIDADE

FRAGMENTAÇÃO

DESESTRUTURAÇÃO

AUSÊNCIA DE FOCO

"PICADINHO"

"QUEIJO SUIÇO"

"PICADINHO" OU FRAGMENTAÇÃO

TRABALHO PROJETUAL NÃO É INSTRUMENTAÇÃO TÉCNICA, MAS UM PROCESSO INVESTIGATIVO E REFLEXIVO

"ENSINAR DESIGN ENVOLVE CRIAR TANTO HÁBITOS MENTAIS QUANTO ARTEFATOS ESTÉTICOS. SE UM ESTUDANTE NÃO PODE REFLETIR SIGNIFICATIVAMENTE SOBRE SEU PRÓPRIO PROCESSO AO FINAL DE UM EXERCÍCIO DE DESIGN, EU CONSIDERO ISSO UM FRACASSO, NÃO IMPORTANDO A QUALIDADE DE SEUS PROJETOS."

TRACY FULLERTON

PROFESSORA ASSOCIADA E CATEDRÁTICA DE ARTES ELETRÔNICAS EM ENTRETENIMENTO INTERATIVO DA UNIVERSITY OF SOUTHERN CALIFORNIA

DESIGN É PROCESSO
(NÃO É O COMO O OBJETO SE APARENTA, MAS ELE FUNCIONA)

EIXO PRAGMÁTICO

EIXO TÉCNICO-CONSTRUTIVO
FORMA
MÍDIA
PLASTICIDADE / APARÊNCIA

EIXO SIMBÓLICO
SENTIDO
LINGUAGEM

USO
FUNÇÃO

DESIGN USADO COMO INSTRUMENTAL TÉCNICO

PROBLEMA

SOLUÇÃO

WATERFALL / ANÁLISE ESTRUTURADA

DP

CP

RD

AD

C

MT

E

M

V

DC

BRUNO MUNARI

PROBLEMATIZAÇÃO E HIPÓTESES

PRÁTICA

REFEIÇÃO PARA 4 PESSOAS

ARROZ VERDE PARA 4

     PESSOAS

ARROZ, SAL, CEBOLA, ESPINAFRE, AZEITE, ETC,

ALGUÉM JÁ FEZ ANTES?

COMO FEZ? COMO POSSO FAZER, TRANSFORMAR

OU CRIAR?

QUAL ARROZ? QUAL PANELA? FOGÃO OU FORNO?

     VARIAÇÕES DA RECEITA, FORMAS DIFERENTES DE PREPARO

MELHOR FORMA DE PREPARO, MANEIRA MAIS

          PRÁTICA DE           COZINHAR

SUFICIENTE?

FICOU BOM?

O QUE MELHORAR?

REGISTRAR

A RECEITA

STANSFORD D.SCHOOL

IDEO

DESIGN THINKING

DEFINIÇÃO (IDEO): É UMA ABORDAGEM CENTRADA NO USUÁRIO PARA A INOVAÇÃO QUE SE APROPRIA DA PRÁTICA DE DE DESIGN PARA INCORPORAR A NECESSIDADE DAS PESSOAS, AS POSSIBILIDADES TECNOLÓGICAS, E OS REQUISITOS NECESSÁRIOS PARA O SUCESSO DE UM NEGÓCIO

DEFORMAÇÃO DO CONCEITO: ORGANIZAÇÕES INVESTINDO EM "DESIGN" COMO UM EMBELEZAMENTO, SEM QUE SEUS PRODUTOS OU SERVIÇOS REFLITAM NECESSIDADES REAIS SENDO RESOLVIDAS

INTERPRETAÇÃO: MÉTODO DE SOLUÇÃO DE PROBLEMAS ATRAVÉS DA EMPATIA. SIGNIFICA PASSAR TEMPO CONSIDERÁVEL COM PESSOAS, CONHECER SUAS NECESSIDADES, APRENDER COM ELAS, ENTENDER SEUS CONTEXTOS E REALIZAR EXPERIMENTOS/TESTES ANTES DE TENTAR SOLUCIONAR PROBLEMAS

NEGÓCIO

DESEJO

VIABILIDADE

NEGÓCIO

DESEJO

VIABILIDADE

ESTRATÉGIA

MARKETING

OPERAÇÃO

FINANÇAS

TECNOLOGIA

ENGENHARIA

CAPACIDADE PRODUTIVA

TÉCNICA

ANTROPOLOGIA

SOCIOLOGIA

PSICOLOGIA

ETNOGRAFIA

PROCESSO DE PRODUÇÃO

TECNOLOGIA PRODUTIVA

CADEIA DE SUPRIMENTOS

PROTOTIPAÇÃO RÁPIDA

MANUFATURA

EQUIPE

RECURSOS HUMANOS

DINÂMICA

GERENCIAMENTO

NEGOCIAÇÕES

COMPORTAMENTO

ORGANIZACIONAL

FORMA+FUNÇÃO

SUSTENTABILIDADE

PRAZER DE USO E USABILIDADE

ESTÉTICA / PROGRAMAÇÃO VISUAL

INTERAÇÃO

INOVAÇÃO

B

P

C

T

H

I

B

P

C

T

IxD

H

I

IMERSÃO / PESQUISA

ANÁLISE / REFLEXÃO

IDEAÇÃO / CRIAÇÃO

PROTOTIPAÇÃO / TESTES

IxD

FASES DO DESIGN SOCIAL

IMERSÃO

ANÁLISE

CRIAÇÃO

PROTÓTIPO

CONHECIMENTO DAS PRÁTICAS E PONTOS DE VISTA

NECESSIDADES E DESEJOS DOS USUÁRIOS

REFERÊNCIAS E REPERTÓRIO

DIAGRAMAS

PAINÉIS DE REFERÊNCIA

PROXIMIDADE DE IDÉIAS

PERSONAS

MAPPING

CONCEITO

REQUISITOS DO PROJETO

(FUNCIONAMENTO)

ESTUDOS E

WIREFRAMES

LAYOUT

SIMULAÇÃO DO USO

PROTÓTIPO FUNCIONAL

PESQUISA

REFLEXÃO

IDÉIA

TESTE

SEPARAR E ANALISAR COMPONENTES E RELACIONAMENTOS

AVALIAR (ATRIBUIR VALORES)

CLASSIFICAR

COMPARAR

EXEMPLIFICAR

INTERPRETAR

EXPLICAR

SINTETIZAR

CRITICAR

 

INVESTIGAR

PESQUISAR

ENTREVISTAR

OBSERVAR

LEVANTAR

DUVIDAR

OUVIR

QUESTIONAR

ANOTAR

REGISTRAR

PROCURAR

 

PROPOR

CRIAR

PENSAR

INVENTAR

PRODUZIR

DESENVOLVER

TENTAR

DESENHAR

MANIFESTAR

MATERIALIZAR

REPRESENTAR

TESTAR

AVERIGUAR

VERIFICAR

AVALIAR

REPENSAR

DISCUTIR

DECIDIR

 

AÇÕES

MDA

MECÂNICAS

DINÂMICAS

VISUAIS

MECHANICS

DYNAMICS

AESTHETICS

CONSUMO

PRODUÇÃO

LeBLANC, HUNICKE & ZUBEK

ARQUITETURA DA
INFORMAÇÃO
 

CONTEÚDO

CONTEXTO

USO

IA

METADADOS

ARQUITETURA DE INFROMAÇÃO APLICADA A UM TICKET DE EMBARQUE POR TYLER THOMPSON

COISAS QUE PODEMOS APRENDER DE UM REDESIGN

MARTIJN DE WALL

THE CITY AS INTERFACE

PLATAFORMA

PROGRAMA

PROTOCOLO

TROCAS, CONVENÇÕES, REGRAS, PADRÕES

CONTEÚDO,
ATIVIDADES

FORMA,
INFRAESTRUTURA

FLUXO

ORGANIZAÇÃO

RELACIONAMENTO

NAVEGAÇÃO

TAXONOMIA

CRITÉRIOS

DESIGN DE INFORMAÇÃO

 ≠

ONTOLOGIAS

PROCESSO DE ANÁLISE

DESIGN       SISTEMATIZAÇÃO

=

INSTRUMENTOS /
FERRAMENTAS
DE PROJETO

CAMPOS/COMPETÊNCIAS DO DESIGN

FORMA

CONTEÚDO

COMPORTAMENTO

DESIGN GRÁFICO

DESIGN DE PRODUTO

ARQUITETURA DE INFORMAÇÃO

SOUND DESIGN

ANIMAÇÃO

DESIGN DE INTERAÇÃO

COOPER, REINMANN & CRONIN

DESIGN DE INTERFACE

DESIGN DE INTERAÇÃO

O QUE É

COMO É. COMO FUNCIONA

ENGENHARIA DE USABILIDADE

PRINCÍPIO FORMULADO POR DONALD NORMAN E JAKOB NIELSEN 

EM SEUS TRABALHOS (1986 E 1991/1993)

PREOCUPAÇÃO COM A FACILIDADE DE USO DOS OBJETOS DO DIA-A-DIA

ESTUDOS E AVALIAÇÕES PARA PROMOVER O APERFEIÇOAMENTO DO USO DE OBJETOS E SUAS INTERFACES COM O USUÁRIO

PRINCÍPIOS DA USABILIDADE

PRATICIDADE

FUNCIONALIDADE

SEGURANÇA

PERFORMANCE

APRENDIZAGEM

RECORDAÇÃO

O QUANTO SIMPLES E FÁCIL É O PROCESSO
PARA QUE ALGO SEJA FEITO?

A INTERFACE DE USO AUXILIA PARA QUE O OBJETO SEJA UTILIZADO NA PLENITUDE DE SEUS RECURSOSE PARA QUE DESEMPENHE SEU PAPEL

A INTERFACE EVITA QUE AÇÕES PERIGOSAS OU INDEVIDAS  SEJAM REALIZADAS  INADVERTIDAMENTE?

A INTERFACE É RÁPIDA E ÁGIL? RESPONDE CONVENIENTEMENTE ÀS EXPECTATIVAS DO USUÁRIO?

É FÁCIL DE APRENDER A USAR?

EU CONSIGO LEMBRAR COMO USA, DEPOIS?

ELEMENTOS DA USABILIDADE

VISIBILIDADE

FEEDBACK

RESTRIÇÕES

MAPEAMENTO

CONSISTÊNCIA

AFFORDANCE

O QUE MOSTRAR E O QUE OCULTAR?

AO ACIONAR UM BOTÃO, HÁ UM SOM PARA CONFIRMAR QUE A FUNÇÃO FOI ACIONADA? HÁ UMA INFORMAÇÃO VISUAL OU SENSORIAL PARA QUE O USUÁRIO TENHA CERTEZA QUE SUA SOLICITAÇÃO ESTÁ SENDO ATENDIDA?

FÍSICAS, LÓGICAS OU CULTURAIS; BARREIRAS PARA QUE AÇÕES SEJAM LIMITADAS?

AÇÕES SEMELHANTES PROVOCAM
INTERAÇÕES SEMELHANTES?

WIREFRAMES

A/B TESTS

HEATMAPS

USER TESTING

PESQUISA

TESTES

PROTOTIPAR NÃO É PROJETAR

PROTÓTIPOS SERVEM PARA VALIDAR / TESTAR IDEIAS

UXKITS.COM

UI PATTERNS

USUÁRIO

USER MAPPING

PENSAMENTO

AUDIÇÃO

VISÃO

MOTIVAÇÃO

CONTEXTO

COMPORTAMENTO

INTERFACE

USER MAPPING

GRAMÁTICA DE AÇÕES

CAPTURAR AS ATIVIDADES DOS USUÁRIOS E TRANSFORMÁ-LAS EM UNIDADES BÁSCIAS DE TAREFAS INTEGRADAS A UM SISTEMA COMPUTACIONAL.

SE PROJETA COM (E NÃO PARA) O USUÁRIO

O MATERIAL DE EXPERIMENTAÇÃO É O PRÓPRIO USUÁRIO, E NÃO A MÍDIA

O PROJETO É SOBRE AÇÕES E COMPORTAMENTOS...

NÃO SOBRE A MÍDIA

USER JOURNEY MAPS

ATENÇÃO

INTENÇÃO

GATILHO

AÇÃO

FEEDBACK

RESULTADO

JOY OF USE, ENJOYMENT, FUNOLOGY & PLAY

FUNCIONAL

CONSISTENTE

ÚTIL

EMOCIONAL

CONFIÁVEL

DIVERTIDO

EXCITANTE

PRÁTICO

IDENTITÁRIO

CRIATIVO

ARROJADO

SÉRIO

USABILIDADE

LIMITES DA ENGENHARIA DA USABILIDADE COMO
SOLUÇÃO PROJETUAL

FUNOLOGY / JOY OF USE

NOS RELACIONAMOS COM OBJETOS NESTES 3 NÍVEIS

INTELIGENTE

ESFORÇADO

PERSPECAZ

ELEGANTE

DESPOJADO

ETC.

LIMITES DA ENGENHARIA DA USABILIDADE COMO
SOLUÇÃO PROJETUAL

FUNOLOGY / JOY OF USE

O SABER DESTINADO AO MUNDO PRODUTIVO É COMPLETAMENTE INADEQUADO PARA O ESTUDO DO PRAZER
E DO VIVER

criatividade 

SUBLIME.FYI

107 OF THE BRIGHTEST CREATIVE PEOPLE IN WEB DESIGN

CRIATIVIDADE É UM JOGO?

UMA BRINCADEIRA?

UM MODO DE AGIR SOBRE O MUNDO

PLAYFULLNESS

...E RISCO!

REDUÇÃO

A FORMA MAIS FÁCIL DE SE ATINGIR A SIMPLICIDADE É PELA REDUÇÃO

ORGANIZAÇÃO

A ORGANIZAÇÃO FAZ UM SISTEMA COMPLEXO PARECER SIMPLES

TEMPO

O QUE DEMANDA MENOS TEMPO PARECE SEMPRE MAIS SIMPLES

CONHECIMENTO

CONHECIMENTO FAZ AS COISAS SEREM MAIS SIMPLE

DIFERENÇA

SIMPLICIDADE E COMPLEXIDADE SÃO COMPLEMENTARES

CONTEXTO

O QUE ESTÁ NO ENTORNO NÃO É IRRELEVANTE

EMOÇÃO

MAIS EMOÇÃO É MELHOR DO QUE MENOS

CONFIANÇA

CONFIAMOS NA SIMPLICIDADE

ERRO

ALGUMAS COISAS NÃO TEM COMO SEREM SIMPLES

REGRA 1

SIMPLICIDADE É SOBRE SUBTRAIR O ÓBVIO E ACRESCENTAR O SIGNIFICATIVO

10 LEIS DE MAEDA

INTERAÇÃO

PARTE 3

O QUE É INTERAÇÃO?

TRANSFORMAÇÕES NO

CULTURA MATERIAL

CONCEITO DE INTERAÇÃO

HCI

IA

ID

UCD

IxD

UX

1970

1980

1990

2000

ENGELBART

XEROX PARC

WURMAN

MORVILLE

SUTHERLAND

NORMAN

NIELSEN

GARRET

MOGGRIDGE

2010

PARADIGMA DA INTERAÇÃO

CONTROLE / DOMÍNIO

1960 - 1975

ENTRAR INSTRUÇÕES NA MÁQUINA

RETER INFORMAÇÕES DA MÁQUINA

INTERAGIR

I/O

RESSONÂNCIA DO PENSAMENTO CIBERNÉTICO

NORBERT WEINER

E TEORIAS MATEMÁTICAS DA COMUNICAÇÃO

HCI

TRANSMITIR É COMUNICAR

CIBERNÉTICO

CONTROLE DA INFORMAÇÃO

A AGE SOBRE B

QUE AGE SOBRE A

A

B

A

SPACEWAR, MIT 1962

NOLAN BUSHNELL, COMPUTER SPACE, 1971

TENNIS FOR TWO, 1958

IVAN SUTHERLAND SKETCHPAD DEMO, 1963

MOUSE, DOUGLAS "DOUG" ENGELBART
STANFORD RESEARCH CENTER, MENLO PARK.
FALL JOINT COMPUTER CONFERENCE, SAN FRANCISCO 1968

 

XEROX PALO ALTO RESEARCH

CENTER (XEROX PARC)

XEROX ALTO, 1973

IT WAS SO OBVIOUS THAT EVERY COMPUTER WOULD WORK THIS WAY SOMEDAY

STEVE JOBS, 1979

PARADIGMA DA INTERAÇÃO

ACESSO À INFORMAÇÃO

1975 - 1990

THE INTERACTION STATES THAT EVERY APPLICATION HAS AN INHERENT AMOUNT OF COMPLEXITY. THIS COMPLEXITY CANNOT BE WISHED AWAY AND HAS TO BE DEALT WITH, EITHER IN PRODUCT DEVELOPMENT OR IN USER INTERACTION

LARRY TESLER, XEROX PARC

NAVEGAR PELA INFORMAÇÃO

INTERAGIR

LEGIBILIDADE

RESSONÂNCIA DO DESIGN GRÁFICO SOBRE

A COMPUTAÇÃO

ARQUITETURA DE INFOMAÇÃO E DESIGN DE INTERFACE

INFORMAR É COMUNICAR

ORGANIZAÇÃO E ESTRUTURAÇÃO DE CAMPO

RICHARD SAUL WURMAN

DAR ORDEM AO CAOS DE INFORMAÇÕES PRODUZIDAS EM LARGA ESCALA

DAR MAIS ATENÇÃO À COMO INFORMAÇÕES SÃO APRESENTADAS

XEROX STAR, 1981

LOGITECH MOUSE, 1983

BUSINESS COMPUTER

X

PERSONAL HOME

COMPUTER

USUÁRIO CORPORATIVO

X USUÁRIO DOMÉSTICO

BANCOS DE DADOS RELACIONAIS

PARADIGMA DA INTERAÇÃO

USO COTIDIANO

1990 - 2000

USAR

INTERAGIR

COMUNICAÇÃO

BULLETIN BOARD SYSTEM (BBS) MAIL SYSTEM, 1994

APPLE NEWTON, 1993

DESIGN CENTRADO NO USUÁRIO

USUFRUIR É COMUNICAR

INTERNET COMERCIAL

COMPUTAÇÃO EM REDE DOMÉSTICA

DESIGN PATTERNS

CHRISTOPHER ALEXANDER

GoF (GANG OF FOUR)

IxD

IA

JESSE JAMES GARRETT

EYE4U.COM

YUGO NAKAMURA

THA.JP

INFORMATION ARCHITECTS

USEIT.COM

PARADIGMA DA INTERAÇÃO

EXPERIÊNCIA / VIVÊNCIA

2000 - 2010

DIALOGAR

INTERAGIR

COMPARTILHAR

CO

WORK

CO

LABORAÇÃO

MULTIPLAYER

CONSTRUIR EXPERIÊNCIAS EXIGE SENSIBILIDADE E LIDERANÇA

USER ADVOCATE

NOKIA COMMUNICATOR 9500

MOBILE OFFICE

COMPAQ/HP IPAQ H6310

NOKIA N95

MOBILE ENTERTAINMENT

PALM PILOT

PERSONAL DIGITAL ASSISTANT

(PDA)

 

 

TECNOLOGIA

A BUSCA PELA INOVAÇÃO DISRUPTIVA
NEM SEMPRE CONSIDEROU O USUÁRIO
OU A INTERFACE

A ÊNFASE POR MUITAS VEZES PERMANECEU
NO HARDWARE E NA TECNOLOGIA, NÃO NO
USO OU NA EXPERIÊNCIA

EXPERIÊNCIA MOBILE APERFEIÇOADA

SIMPLICIDADE DE USO

DISSONÂNCIA

AINDA QUE O VALOR DA EXPERIÊNCIA E DO USO TENHAM SE TORNADO ÓBVIOS, CONTINUA DIFÍCIL CONVENCER O UNIVERSO CORPORATIVO A INVESTIR NESTAS MELHORIAS

NÃO HÁ COMO SE MEDIR A EXPERIÊNCIA

WITTGESTEIN

GRANDE PARTE DAS QUESTÕES DE UX SÃO SUBJETIVAS

LIDAMOS COM A DIFERENÇA, MAS TAMBÉM COM MUITOS TRAÇOS COMUNS 

DEVERÍAMOS SAIR DE UM PARADIGMA DE UM PRODUTO BONITO PARA O DE UMA INTERAÇÃO/EXPERIÊNCIA BELA

OVERBEEKE, FRENS, DJAJADININGRAT, WENSVEEN

INTERAÇÃO FLUÍDA

BOA CONTEXTUALIZAÇÃO
DE USO

BOA INTERFACE

ADAM GREENFIELD

COMO DEFINIR O QUE É UM BOM USER EXPERIENCE?

I INVENTED THE TERM "USER EXPERIENCE" BECAUSE I THOUGHT HUMAN INTERFACE AND USABILITY WERE TOO NARROW; I WANTED TO COVER ALL ASPECTS OF THE PERSON'S EXPERIENCE WITH A SYSTEM, INCLUDING INDUSTRIAL DESIGN, GRAPHICS, THE INTERFACE, THE PHYSICAL INTERACTION, AND THE MANUAL. SINCE THEN, THE TERM HAS SPREAD WIDELY, SO MUCH SO THAT IT IS STARTING TO LOSE ITS MEANING.

DON NORMAN

USABILIDADE?

INTERFACE?

FUNCIONALIDADE?

EXPERIÊNCIA DE USO É

CRIAR FORMAS PARA QUE

OS PRODUTOS SEJAM            

USADOS DE FORMA            

MEMORÁVEL / DESEJÁVEL                 

NENHUMA DAS COISAS?

@MENSÕES?

SOFISTICAÇÃO?

POLIMENTO?

FORMAS

USER EXPERIENCE

DEFINIÇÃO (NN/g): "USER EXPERIENCE" INCORPORA TODOS OS ASPECTOS DA INTERAÇÃO ENTRE O USUÁRIO FINAL E UMA EMPRESA, SEUS SERVIÇOS E SEUS PRODUTOS

INTERPRETAÇÃO: VEJA O QUADRO MAIS AMPLO; VEJA O TODO; SEJA CURIOSO.

DISTORÇÕES: TRATAR
"USER EXPERIENCE" COMO APENAS UMA PARTE DO TODO.

NÃO EXISTE UM UX DESIGNER

MDA

TEMOS LIDADO COM AS QUESTÕES DE AI E UX SUPERFICIALMENTE?

USUÁRIOS SÃO CONSIDERADOS DE MANEIRA MECÂNICA E FISIOLÓGICA

OS PROBLEMAS DE ARQUITETURA E EXPERIÊNCIA SÃO OPERADOS APENAS NO NÍVEL DESCRITIVO

O QUE NOS ESTÁ ESCAPANDO?

A EXPERIÊNCIA EM SI

LIKE IN THE OLD FABLE, WE ARE THE FOOLS LOOKING AT THE FINGER WHEN SOMEONE POINTS AT THE MOON. GAMES ARE THE FINGER; PLAY IS THE MOON.

MIGUEL SICART

EXPERIÊNCIA É ATENÇÃO?

EXPERIÊNCIA ESTÁ RELACIONADA AO VIVER E À VIDA, DIRETAMENTE

PREOCUPAR-SE COM A EXPERIÊNCIA É DEDICAR-SE A FAZER COM QUE UM OBJETO/MÍDIA PASSE A FAZER PARTE DA VIDA DE ALGUÉM

UX É RELEVÂNCIA

UX É UMA LUTA CONTRA A IRRELEVÂNCIA

TODOS ACREDITAM QUE SEUS PRODUTOS E CRIAÇÕES SÃO VITAIS PARA OS USUÁRIOS

A REALIDADE É QUE A ESMAGADORA MAIORIA DOS OBJETOS É IRRELEVANTE PARA A VIDA DAS PESSOAS

SÃO APENAS
FERRAMENTAS

SÃO PROVISÓRIOS

SÃO SUBSTITUÍVEIS

SÃO IRRELEVANTES

A DIFICULDADE DE UX SE ENCONTRA NO ÂMAGO DOS PRÓPRIOS
OBJETOS

MEMÓRIA

O CONTÍNUO PROCESSO DE LEMBRAR / ESQUECER / LEMRAR NOVAMENTE

SIGNIFICAÇÃO

O JOGO NO QUAL COISAS GANHAM E PERDEM SENTIDO PARA NÓS

VALOR

TODOS OS SIGNOS SE RELACIONAM NA MENTE / MEMÓRIA
APENAS AQUELES QUE SE FIXAM EMOCIONALMENTE GANHAM SENTIDO / VALOR

IMPORTÂNCIA DA QUESTÃO ESTÉTICA NA EXPERIÊNCIA

UM PROBLEMA ONTOLÓGICO

A EXPERIÊNCIA DE USO É PARTE DA CONSTRUÇÃO DE UMA ESTÉTICA DE SI

DA FORMA COMO QUEREMOS EXISTIR | VIVER | AGIR

PARADIGMA DA INTERAÇÃO

LIGAÇÃO / CONEXÃO

2010 -

ESTENDER / AMPLIAR O SER

INTERAGIR

PENSANDO FORA DO

SANDBOX

EXTENSÕES DO HUMANO

PENSANDO FORA DO SANDBOX

OBJETOS "INTELIGENTES"

INTELIGÊNCIA ARTIFICIAL

OBJETOS INTERAGINDO ENTRE SI

COMPUTAÇÃO AFETIVA

WEARABLE COMPUTING

QUANTIFIED SELF

COMPUTAÇÃO FÍSICA

REALIDADE AUMENTADA

KINETICS

RECONHECIMENTO DE IMAGEM

BIOHACKING

ROBÓTICA

INTERFACES TANGÍVEIS

INTERFACES HAPTICAS

VIDEO MAPPING

CÓDIGO CRIATIVO / ARTE GENERATIVA

GAMES

CIMÁTICA

INSTALAÇÕES INTERATIVAS

OBJETOS INTELIGENTES
MENTEM E TRAPACEIAM

COMPUTAÇÃO FÍSICA

COMPUTAÇÃO FÍSICA

VIDEO MAPPING

SENSORES & COMPUTAÇÃO FÍSICA; PUBLICIDADE INTERATIVA

CONECTIVIDADE; PUBLICIDADE INTERATIVA

JOGOS ELETRÔNICOS COM VIDEO MAPPING, RECONHECIMENTO DE IMAGEM, COMPUTAÇÃO FÍSICA

REACTABLE, INTERFACES TANGÍVEIS

TANGIBLE MEDIA GROUP, MIT; COMPUTAÇÃO FÍSICA E INTERFACES TANGÍVEIS; REALIDADE AUMENTADA

REALIDADE AUMENTADA

BIOHACKING

TATUAGENS DIGITAIS

BIOHACKING

BIOHACKING - HEADPHONES

CIRCADIA, GRINDHOUSE WETWARES BIOHACKING

STEVE MANN, PAI DA WEARABLE COMPUTING

GOOGLE GLASS

LINGUAGEM

PARTE 4

LINGUAGEM

DISPOSITIVO COGNITIVO DE PREDIÇÃO

 

                       

                 ENQUADRAMENTO DE CLASSES E DE

                                                      DIFERENCIAÇÃO

 

         MECANISMO DO RACIOCÍNIO E PENSAMENTO HUMANO

            PADRÃO, ESTRUTURA, CÓDIGO, LEXICO

 

 

 

GRAMÁTICA, SINTAXE

 

 

                 CODIFICAÇÃO E DECODIFICAÇÃO DE

                                                                SENTIDOS

CONSCIÊNCIA

O SER HUMANO É UMA CRIATURA DE LINGUAGEM

(NOSSO PENSAMENTO FUNCIONA ATRAVÉS DA LINGUAGEM)

O QUE SOMOS NÓS?

NA LINGUAGEM REALIZAMOS TANTO PROCESSOS CRIATIVOS QUANTO PROCESSOS NORMATIVOS

A LINGUAGEM IMPÕE LIMITES AO PENSAR

REAFIRMAÇÃO

INSTITUI / REFORÇA / ENRAIZA         SIGNIFICADOS JÁ PRESENTES NA
                                    CULTURA

NÃO TENTA MUDÁ-LA

LINGUAGEM /

ENTENDER E LIDAR COM A CULTURA E SEUS ARTEFATOS          

DECODIFICAÇÃO
DO MUNDO

PARÁFRASE

POLISSEMIA

REAFIRMAÇÃO

SENTIDOS SEDIMENTADOS

ALGO QUE SE MANTÉM

RETORNO AOS MESMOS ESPAÇOS DO DIZER

ESTABILIZAÇÃO

RUPTURA

DIFERENÇA

MULTIPLICIDADE DO SENTIDO

O QUE ESTÁ FORA DO ORDINÁRIO

DESESTABILIZAÇÃO

DESLOCAMENTO

VARIEDADE

NO INTERIOR DO QUE JÁ ESTÁ DITO

PARÁFRASE

POLISSEMIA

TENSÃO

JOGO

MOVIMENTO

MUDANÇA

O MESMO

O DIFERENTE

ATRAVÉS DA LINGUAGEM

TORNAMOS ALGO COMUM

TORNAMOS EM CUMUM

MÍDIAS COMPUTACIONAIS NÃO MIMETIZAM A LINGUAGEM DE OUTRAS MÍDIAS

HIBRIDIZAÇÃO

HIBRIDIZAÇÃO

HIBRIDIZAÇÃO

VIDEOCLIP INTERATIVO

CARD INTERFACES

TRANSFORMAÇÕES NA LINGUAGEM DAS MÍDIAS COMPUTACIONAIS

MOBILE FIRST

GOOGLE GLASS CARD INTERFACES

RESPONSIVE WEB

TRANSFORMAÇÕES NA LINGUAGEM DAS MÍDIAS COMPUTACIONAIS

RESPONSIVE ICONS

320 PX

480 PX

655 PX

767 PX

835 PX

979 PX

1200 PX

1024 PX

MEDIA QUERY

 WEB PATTERNS

BOOTSTRAP

FLAT DESIGN

SKEUMORPHIC DESIGN

ABSTRAÇÃO

SPECIES IN PIECES, 2015

SWISSINCSS

GOOGLE MATERIAL DESIGN

UMA GRAMÁTICA PARA AS MÍDIAS COMPUTACIONAIS?

MATERIAL DESIGN MUSIC APP INTERFACE

 INTERACTIONS OF THE WEEK

LINGUAGEM  +  NARRATIVA

EM NARRATIVAS INTERATIVAS

NARRATOLOGIA APLICADA AO USO DE MÍDIAS COMPUTACIONAIS

LUDOLOGIA E OS ASPECTOS LÚDICOS DA

LINGUAGEM DAS MÍDIAS COMPUTACIONAIS

NARRATIVAS INTERATIVAS

ESTÉTICA DA INTERAÇÃO

PARTE 5

ESTÉTICA    MODA

ESTÉTICA    BELEZA

ESTÉTICA    PLASTICIDADE

=

=

=

ESTÉTICA = RAMO DA FILOSOFIA QUE ESTUDA A ORIGEM / NATUREZA DA BELEZA

ESTÉTICA = AQUILO QUE PROVOCA A PERCEPÇÃO DA BELEZA, AFETOS, E O SENTIDO
DE SUBLIME

LITTLE ORCHESTRA

VIENNA ART ORCHESTRA

SUBLIME

OS 3 BULES DE CHÁ

PHILLIP STARK

DON NORMAN

ATUALIDADE DAS MÍDIAS COMPUTACIONAIS

AWWWARDS

BRAUN: MID-CENTURY DESIGN / ESCOLA SUIÇA DE DESIGN (ULM) / INTERNATIONAL STYLE

DIETER RAMS

DESIGN QUE PROPORCIONA FELICIDADE

O PRAZER É UMA DISCUSSÃO ANTIGA, PASSANDO PELOS FILÓSOFOS GREGOS (ARISTÓTELES, PLATÃO) ATÉ A PSICANÁLISE MODERNA (FREUD, LACAN)

A EMOÇÃO / SENTIMENTO SÃO TRAÇOS DOS ANIMAIS SUPERIORES, E NÃO SE OPÕEM À RAZÃO

FELICIDADE

PRAZER VISCERAL

PRAZER COMPORTAMENTAL

PRAZER REFLEXIVO

MIHALY CSIKSZENTMIHALYI

FLOW THEORY

FLOW É A PROPORÇÃO ÁUREA ENTRE HABILIDADES E DESAFIOS NA REALIZAÇÃO DE UMA ATIVIDADE

FLOW
IMERSÃO PROFUNDA
EUFORIA

DIMENSÃO LÚDICA

COLOCAR AS MÍDIAS EM UMA CONDIÇÃO DE JOGO 
                                É UMA FORMA DE REVOLTA CONTRA UMA ESTÉTICA MAQUÍNICA E CONTRA RELAÇÕES PROGRAMADAS

(PLAYFULLNESS)

JOHANN SEBASTIAN JOUST

JOGAR

JOGO COMO EXERCÍCIO

JOGO SIMBÓLICO

JOGO ESTRUTURADO

DOMÍNIO

PERÍCIA

HABILIDADE

CONTROLE

CORPO

IMAGINAÇÃO

CRIATIVIDADE

ASSOCIAÇÃO

SENTIDO

DESCOBERTA

SOCIAL

HIERARQUIA

JUÍZO

REGRA

VALOR

IMPROVE EVERYWHERE

IMPROVE EVERYWHERE

TO PLAY IS TO BE IN THE WOLD. PLAYING IS A FORM OF UNDERSTANDING WHAT SURROUNDS US AND WHO WE ARE, AND A WAY OF ENGAGING WITH OTHERS. PLAY IS A MODE OF BEING HUMAN.

MIGUEL SICART

ABSTRAÇÃO

LEGIBILIDADE (CLAREZA)

OBJETIVIDADE

PADRONIZAÇÃO

MATERIALIDADE CONCRETA

DECORAÇÃO

ORNAMENTAÇÃO

EXCEPCIONALIDADE

LEVEZA

AGNOSE/ASSEPSIA

INDECISÃO ENTRE VALORES DA AUTOMAÇÃO

E VALORES DE UMA DANÇA

ESTES PRINCÍPIOS ESTARIAM ARRUINANDO O BOM DESIGN?

?

O ABANDONO AOS GUIDELINES DEFINIDOS POR DON NORMAN ESTÃO CRIANDO PRODUTOS PIORES NA APPLE ATUAL?

A ÊNFASE EM UMA INTEGRIDADE ESTÉTICA PODE SER PREJUDICIAL A EXPERIÊNCIA?

REFERÊNCIAS

 

PARTE 6

PUBLICIDADE

EDITORIAL

Visual Editions

BRANDING

ENTRETENIMENTO

 TRANSMÍDIA & CONVERGÊNCIA

MEDIA ECOLOGY + SECOND SCREEN

INTERFACES

2017 © PROF. DR. GUILHERME RANOYA

[OLD] Design Digital

By Guilherme Ranoya

[OLD] Design Digital

[OLD] APRESENTAÇÃO DA DISCIPLINA DE DESIGN DIGITAL DA UNIVERSIDADE FEDERAL DE PERNAMBUCO (dDESIGN|UFPE)

  • 2,578