SlideShare a Scribd company logo
1 of 86
Download to read 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

More Related Content

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

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 mobileakamud
 
VíDeo Digital
VíDeo DigitalVíDeo Digital
VíDeo Digitalswsocial
 
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 html5Leandro Moreira
 
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 2011Drica Veloso
 
Desenvolvimento para Windows Phone: Truques & Dicas
Desenvolvimento para Windows Phone: Truques & DicasDesenvolvimento para Windows Phone: Truques & Dicas
Desenvolvimento para Windows Phone: Truques & DicasComunidade NetPonto
 
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 10Anderson Andrade
 
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 TestFairyRafael Pacheco
 
teste documentos
teste documentosteste documentos
teste documentosaicjsniper
 
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 VideoJoao Canais
 
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 TVAntonio Marin Neto
 
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 realHenrique Schmidt
 
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 realWilly Salazar
 
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-lousablogbrasil
 
Informatica para Internet - Aula 06
Informatica para Internet - Aula 06Informatica para Internet - Aula 06
Informatica para Internet - Aula 06Anderson Andrade
 
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 newsRicardo Guerra Freitas
 
Progic webinar players para tv corporativa
Progic   webinar players para tv corporativaProgic   webinar players para tv corporativa
Progic webinar players para tv corporativaEric Vazzoler
 

Similar to 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
 

Recently uploaded

Simulado Enem Bernoulli-Primeiro dia.pdf
Simulado Enem Bernoulli-Primeiro dia.pdfSimulado Enem Bernoulli-Primeiro dia.pdf
Simulado Enem Bernoulli-Primeiro dia.pdfAnnaCarolina242437
 
Simulado Bernoulli Enem_2-Primeiro dia.pdf
Simulado Bernoulli Enem_2-Primeiro dia.pdfSimulado Bernoulli Enem_2-Primeiro dia.pdf
Simulado Bernoulli Enem_2-Primeiro dia.pdfAnnaCarolina242437
 
Antonio Pereira_Vale+comunidade_set a dez_2023.pdf
Antonio Pereira_Vale+comunidade_set a dez_2023.pdfAntonio Pereira_Vale+comunidade_set a dez_2023.pdf
Antonio Pereira_Vale+comunidade_set a dez_2023.pdfAnnaCarolina242437
 
Estudo de caso para o aplicativo SÓ FLÔ.
Estudo de caso para o aplicativo SÓ FLÔ.Estudo de caso para o aplicativo SÓ FLÔ.
Estudo de caso para o aplicativo SÓ FLÔ.Érica Pizzino
 
MARANATA - 19_04_2024.pptx | Maranata 2024
MARANATA - 19_04_2024.pptx | Maranata 2024MARANATA - 19_04_2024.pptx | Maranata 2024
MARANATA - 19_04_2024.pptx | Maranata 2024CarolTelles6
 
Exame De Suficiencia Para Obtencao Do Titulo De Especialista Em Medicina De F...
Exame De Suficiencia Para Obtencao Do Titulo De Especialista Em Medicina De F...Exame De Suficiencia Para Obtencao Do Titulo De Especialista Em Medicina De F...
Exame De Suficiencia Para Obtencao Do Titulo De Especialista Em Medicina De F...AnnaCarolina242437
 
GESTÃO FINANceiraaaaaaaaaaaaaaaaaaaaaaaaaa
GESTÃO FINANceiraaaaaaaaaaaaaaaaaaaaaaaaaaGESTÃO FINANceiraaaaaaaaaaaaaaaaaaaaaaaaaa
GESTÃO FINANceiraaaaaaaaaaaaaaaaaaaaaaaaaayasminlarissa371
 
AVALIA_CHUM_EFI_5 ANO_AV_2SEMESTRE_2023.pdf
AVALIA_CHUM_EFI_5 ANO_AV_2SEMESTRE_2023.pdfAVALIA_CHUM_EFI_5 ANO_AV_2SEMESTRE_2023.pdf
AVALIA_CHUM_EFI_5 ANO_AV_2SEMESTRE_2023.pdfAnnaCarolina242437
 
Design para o futuro 2024 - Leiautar.pdf
Design para o futuro 2024 - Leiautar.pdfDesign para o futuro 2024 - Leiautar.pdf
Design para o futuro 2024 - Leiautar.pdfCharlesFranklin13
 

Recently uploaded (9)

Simulado Enem Bernoulli-Primeiro dia.pdf
Simulado Enem Bernoulli-Primeiro dia.pdfSimulado Enem Bernoulli-Primeiro dia.pdf
Simulado Enem Bernoulli-Primeiro dia.pdf
 
Simulado Bernoulli Enem_2-Primeiro dia.pdf
Simulado Bernoulli Enem_2-Primeiro dia.pdfSimulado Bernoulli Enem_2-Primeiro dia.pdf
Simulado Bernoulli Enem_2-Primeiro dia.pdf
 
Antonio Pereira_Vale+comunidade_set a dez_2023.pdf
Antonio Pereira_Vale+comunidade_set a dez_2023.pdfAntonio Pereira_Vale+comunidade_set a dez_2023.pdf
Antonio Pereira_Vale+comunidade_set a dez_2023.pdf
 
Estudo de caso para o aplicativo SÓ FLÔ.
Estudo de caso para o aplicativo SÓ FLÔ.Estudo de caso para o aplicativo SÓ FLÔ.
Estudo de caso para o aplicativo SÓ FLÔ.
 
MARANATA - 19_04_2024.pptx | Maranata 2024
MARANATA - 19_04_2024.pptx | Maranata 2024MARANATA - 19_04_2024.pptx | Maranata 2024
MARANATA - 19_04_2024.pptx | Maranata 2024
 
Exame De Suficiencia Para Obtencao Do Titulo De Especialista Em Medicina De F...
Exame De Suficiencia Para Obtencao Do Titulo De Especialista Em Medicina De F...Exame De Suficiencia Para Obtencao Do Titulo De Especialista Em Medicina De F...
Exame De Suficiencia Para Obtencao Do Titulo De Especialista Em Medicina De F...
 
GESTÃO FINANceiraaaaaaaaaaaaaaaaaaaaaaaaaa
GESTÃO FINANceiraaaaaaaaaaaaaaaaaaaaaaaaaaGESTÃO FINANceiraaaaaaaaaaaaaaaaaaaaaaaaaa
GESTÃO FINANceiraaaaaaaaaaaaaaaaaaaaaaaaaa
 
AVALIA_CHUM_EFI_5 ANO_AV_2SEMESTRE_2023.pdf
AVALIA_CHUM_EFI_5 ANO_AV_2SEMESTRE_2023.pdfAVALIA_CHUM_EFI_5 ANO_AV_2SEMESTRE_2023.pdf
AVALIA_CHUM_EFI_5 ANO_AV_2SEMESTRE_2023.pdf
 
Design para o futuro 2024 - Leiautar.pdf
Design para o futuro 2024 - Leiautar.pdfDesign para o futuro 2024 - Leiautar.pdf
Design para o futuro 2024 - Leiautar.pdf
 

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