SlideShare uma empresa Scribd logo
1 de 86
Baixar para ler offline
Hoje eu vim
falar sobre
meus erros
Oi gente :)
1 ano e meio
Dupla de UX
5 Devs
Tudo aconteceu em…
Multi-plataforma
Consumo de vídeo
On-demand
TV por assinatura
chromecast
chromecast
Fabricante
Sistema Operacional
Aplicativos
E para
SmarTVs?
Algumas já adotam Android…
Tizen
Orsay
Android
Sony Internet TV
WebOS
NetCast
Viera Cast
Firefox OS
Mas outras…
Cadê minhas guidelines?!
Tecnologia
Dev web
Tecnologia
Dev web
Hardware
Tecnologia
Dev web
Hardware
APIs
Tecnologia
Dev web
Hardware
APIs
4k é realidade?
Tecnologia
Dev web
Hardware
APIs
4k é realidade?
Copa? TV nova!
O consumo
Lean Back
O consumo
Lean Back
Second Screen
O consumo
Lean Back
Second Screen
Compartilhamento
e personalização
Vamos ao que
interessa :)
Aí vem as 5
cabeçadas
1
Briguei com o
controle remoto
O dito cujo…
D-Pad
D-Pad
Atalhos TVD
D-Pad
Atalhos TVD
Controles de consumo
D-Pad
Atalhos TVD
Controles de consumo
Teclado numérico
D-Pad
Atalhos TVD
Controles de consumo
Teclado Numérico
Navegação nativa
D-Pad
Atalhos TVD
Controles de consumo
Teclado Numérico
Navegação nativa
Scroll wheel
D-Pad
Atalhos TVD
Controles de consumo
Teclado Numérico
Navegação nativa
Scroll wheel
Sensor de movimento
D-Pad
Atalhos TVD
Controles de consumo
Teclado Numérico
Navegação nativa
Scroll wheel
Sensor de movimento
Voz
D-Pad
Atalhos TVD
Controles de consumo
Teclado Numérico
Navegação nativa
Scroll wheel
Sensor de movimento
Voz
Game Pads
Vou precisar
mapear tudo?
2013 20162018
Você não pode culpar o
controle remoto.
Muito menos o usuário.
A culpa é do seu
aplicativo.
Seja sempre
mais do que
redundante!
2
Projetei na minha
mesa, em CNTP
Um ambiente
perfeito e não tinha:
Claridade
Um ambiente
perfeito e não tinha:
Reflexos
Um ambiente
perfeito e não tinha:
Telas ruins
Um ambiente
perfeito e não tinha:
Outros ângulos
Levante e saia da
sua mesa
Levante e saia da
sua mesa
Teste
Teste
Teste
Teste
Teste
TesteTeste
Teste
Teste
Teste
Teste
Teste
Teste
Teste
Teste
Teste
Teste
Teste
Teste
Teste
Teste
Teste
3
Surtei com a
paleta de cores
Como as cores
renderizam na TV?
Do fabricante
Do hardware
Da configuração do usuário
Do contexto de uso
…
Depende
Mudar a cor
da sua marca
Original
OriginalAjustado
Observar
muito bem
os contrastes
Preto
Branco
Evitar
Evitar
Parcimônia nas
transparências
4
"Essa fonte é linda,
vamos usar!”
Renderização
das fontes
Do fabricante
Do hardware
Do navegador
Da fonte
Depende
Proxima Nova
Proxima Nova
GOOGLE FONTS
NAVEGADORES
Proxima Nova
GOOGLE FONTS
NAVEGADORES
Proxima Nova
Montserrat
GOOGLE FONTS
NAVEGADORES
Na dúvida?
Aumenta a fonte.
Escolhe a simples.
Na dúvida?
Aumenta a fonte.
Escolhe a simples.
Elimine o que é
desnecessário.
5
Gastei os valiosos
cliques dos usuários
O objetivo era
fazer o usuário:
Chegar rápido
no vídeo
Voltar para
onde parou
O objetivo era
fazer o usuário:
O objetivo era
fazer o usuário:
Pegar menos no controle
O objetivo era
fazer o usuário:
Clicar menos
Antecipação
Tomada de decisão
Redução de interações
Seja mais rápido
que a dúvida.
Seja mais rápido
que a dúvida.
Se desafie a ter
menos cliques.
Não deu para
resolver
Métricas
Prototipação
Teste de
usabilidade
Acessibilidade
Pra onde vamos?
Podemos ir além do
vídeo?
Desafios
Aprendizados
Erros
Vamos conversar?
Tamy Lemos
www.linkedin.com/in/tamylemos
Obrigada!
Gracias!
tamylemosm@gmail.com

Mais conteúdo relacionado

Semelhante a Isso a TV não mostra: as cabeçadas que dei projetando para SmarTVs!

teste documentos
teste documentosteste documentos
teste documentos
aicjsniper
 
DevDays2009 - Construir Soluções de Internet Video
DevDays2009 - Construir Soluções de Internet VideoDevDays2009 - Construir Soluções de Internet Video
DevDays2009 - Construir Soluções de Internet Video
Joao Canais
 
06 hardwere (monitores)
06   hardwere (monitores)06   hardwere (monitores)
06 hardwere (monitores)
Elizeu Ferro
 
Oficina 2011 2012-lousa
Oficina 2011 2012-lousaOficina 2011 2012-lousa
Oficina 2011 2012-lousa
blogbrasil
 

Semelhante a Isso a TV não mostra: as cabeçadas que dei projetando para SmarTVs! (20)

Bdd e ci
Bdd e ciBdd e ci
Bdd e ci
 
Xamarin + TDD - Reagindo rápido à mudanças no mundo mobile
Xamarin + TDD - Reagindo rápido à mudanças no mundo mobileXamarin + TDD - Reagindo rápido à mudanças no mundo mobile
Xamarin + TDD - Reagindo rápido à mudanças no mundo mobile
 
VíDeo Digital
VíDeo DigitalVíDeo Digital
VíDeo Digital
 
Material screenr
Material screenrMaterial screenr
Material screenr
 
Globo.com - migração do player flash para html5
Globo.com  - migração do player flash para html5Globo.com  - migração do player flash para html5
Globo.com - migração do player flash para html5
 
Palestra sobre produção de Vídeo em Software Livre no Latinoware 2011
Palestra sobre produção de Vídeo em Software Livre no Latinoware 2011Palestra sobre produção de Vídeo em Software Livre no Latinoware 2011
Palestra sobre produção de Vídeo em Software Livre no Latinoware 2011
 
Desenvolvimento para Windows Phone: Truques & Dicas
Desenvolvimento para Windows Phone: Truques & DicasDesenvolvimento para Windows Phone: Truques & Dicas
Desenvolvimento para Windows Phone: Truques & Dicas
 
Informática para Internet - Informática Aplicada - Aula 10
Informática para Internet - Informática Aplicada - Aula 10Informática para Internet - Informática Aplicada - Aula 10
Informática para Internet - Informática Aplicada - Aula 10
 
Criando um ambiente real de distribuição de aplicativos usando TestFairy
Criando um ambiente real de distribuição de aplicativos usando TestFairyCriando um ambiente real de distribuição de aplicativos usando TestFairy
Criando um ambiente real de distribuição de aplicativos usando TestFairy
 
teste documentos
teste documentosteste documentos
teste documentos
 
DevDays2009 - Construir Soluções de Internet Video
DevDays2009 - Construir Soluções de Internet VideoDevDays2009 - Construir Soluções de Internet Video
DevDays2009 - Construir Soluções de Internet Video
 
Explorando novas telas com o Google TV
Explorando novas telas com o Google TVExplorando novas telas com o Google TV
Explorando novas telas com o Google TV
 
Desenvolvimento de software: Mundo ideal x Mundo real
Desenvolvimento de software: Mundo ideal x Mundo realDesenvolvimento de software: Mundo ideal x Mundo real
Desenvolvimento de software: Mundo ideal x Mundo real
 
Desenvolvimento de software mundo ideal x mundo real
Desenvolvimento de software  mundo ideal x mundo realDesenvolvimento de software  mundo ideal x mundo real
Desenvolvimento de software mundo ideal x mundo real
 
Novo Tutorial Sobre Videos
Novo Tutorial Sobre VideosNovo Tutorial Sobre Videos
Novo Tutorial Sobre Videos
 
06 hardwere (monitores)
06   hardwere (monitores)06   hardwere (monitores)
06 hardwere (monitores)
 
Oficina 2011 2012-lousa
Oficina 2011 2012-lousaOficina 2011 2012-lousa
Oficina 2011 2012-lousa
 
Informatica para Internet - Aula 06
Informatica para Internet - Aula 06Informatica para Internet - Aula 06
Informatica para Internet - Aula 06
 
Windows 10 technical preview - design and news
Windows 10 technical preview - design and newsWindows 10 technical preview - design and news
Windows 10 technical preview - design and news
 
Progic webinar players para tv corporativa
Progic   webinar players para tv corporativaProgic   webinar players para tv corporativa
Progic webinar players para tv corporativa
 

Isso a TV não mostra: as cabeçadas que dei projetando para SmarTVs!