PodCast, WebCast e
Inovações em Design
+ Mobile
Horá c io S oa re s
Ac e s s o Dig ital
h ttp:/ a c e s s odig ita l.ne t
/

apresentação
Horácio Soares
Consultor / Designer de Interação
horacio.soares@acessodigital.net
http://horaciosoares.blogspot.com

Inovações e &
Tendências

Forrester research (Junho 2007)
The most important emerging
technologies
#1 mobile devices.
Forrester Research asked 15 of the largest interactive
marketing agencies
http://blog.ragan.com/contentmatters/2007/06/the_most_important_emerging_te.html#m
http://www.forrester.com/Research/Document/Excerpt/0,7211,42561,00.html

O grande desafio?

http://www.slideshare.net/Tableteer/welcome-to-the-mobile-world

Site Wireframe
dotMobi Mobile Web Developers Guide - http://pc.dev.mobi/

Mobile
Wireframe
dotMobi Mobile Web Developers Guide - http://pc.dev.mobi/

dotMobi Mobile Web Developers Guide - http://pc.dev.mobi/

Máxima largura e altura recomendada
200 x 250 pixels
dotMobi Mobile Web Developers Guide - http://pc.dev.mobi/

http://pc.dev.mobi/

Web Standards
Separação do
conteúdo da
apresentação.
Roupa certa,
para ocasião certa!!!

Roupa azul http://internativa.com.br

Trocando de roupa http://internativa.com.br

Roupa laranja http://internativa.com.br

Sem roupa
http://internativa.com.br

Roupa para impressão

Portabilidade – css para impressão
http://acessodigital.net

• Portabilidade
css para dispositivo móvel
MOTO Q
Ac e s s o Dig ita l:
h ttp:/ a c e s s o d ig ita l.n e t
/

Portabilidade
css dispositivo móvel (Palm)
Ho me pag e
Que m s o mo s
c o ntato s
Ac e s s o Dig ita l – s ite de te s te s : h ttp:/ a c e s s o d ig ita l.n e t
/

O uso de CSS para cuidar
da apresentação é um
recurso poderoso, mas não
é indicado para um design
muito complexo, pois não
consegue remover grandes
imagens.

Outras alternativas...

WURFL
the Wireless Universal
Resource File
The WURFL is an XML configuration
file which contains information about
capabilities and features of many
mobile devices.
http://wurfl.sourceforge.net
Em testes pelo Henrique do Revolução Etc.
http://revolucao.etc.br/archives/quer-nos-ajudar-a-fazer-um-teste-com-dispositivos-moveis/

Wireless Application
Protocol (WAP 2.0)
XHTML-MP: É um subset do
XHTML, usado como
linguagem de marcação para
aplicações wireless.
dotMobi Mobile Web Developers Guide - http://pc.dev.mobi/

Forrester research (Junho 2007)
The most important emerging
technologies
Other top emerging technologies of the 30
mentioned:
• Online video
• Ajax
• Social networks
http://blog.ragan.com/contentmatters/2007/06/the_most_important_emerging_te.html#m
http://www.forrester.com/Research/Document/Excerpt/0,7211,42561,00.html

Forrester research (Junho 2007)
The most important emerging
technologies
Less 2 years YouTube the 4th most
visited website on the planet (right
behind Google) – people love video
(especially on-demand video).
http://www.forrester.com/Research/Document/Excerpt/0,7211,42561,00.html

PodCast

PodCast

Meet Charlie
What is Enterprise2.0?
http://www.slideshare.net/slgavin/meet-charlie-what-is-enterprise20

esta é Carole
colega de Charlie e sua mentora
Meet Charlie
What is Enterprise2.0?
http://www.slideshare.net/slgavin/meet-charlie-what-is-enterprise20

Carole normalmente tem muito a
dizer...
então ela criou um
audio podcasts que
será distribuído por
toda a companhia
http://www.slideshare.net/slgavin/meet-charlie-what-is-enterprise20

Quando um novo podcast está
disponível no blog da Carole...
Charlie será notificado via RSS
http://www.slideshare.net/slgavin/meet-charlie-what-is-enterprise20

…ele então efetua o download, ouve e
disponibiliza o podcast no seu próprio blog
http://www.slideshare.net/slgavin/meet-charlie-what-is-enterprise20

Slideshare http://www.slideshare.net/horacio.soares

SlideCast

SlideCast

WebCast

WebCast Unisys

WebCast Benefícios
- Melhoria da comunicação
- Eliminação da rádio tamanco
- Broadcast (todas as filiais)
- “N” reprises
- Diminuição de custos
- Treinamentos à distância

HSM Management –
Set/Out 2007
Pesquisa on-line da
KnowledgeStorm
5,3 mil profissionais de TI
(Georgia , EUA)
76% compartilham vídeo
Desse grupo, 45% têm
perfil em pelo menos um
site de relacionamentos

IBM
-Lançamento
SOA - Service
Otiented
Architecture
Launch - filme de 30 minutos - vídeo viral
Trailer de 2m Youtube, Yahoo!, etc.
Sandy Carter
Vice-presidente de marketing da SOA e da WebSphere

IBM
Lançamento SOA
Resultado do filme Launch
Aumentou 20% a taxa de
aceitação de e-mails
Resultou em dezenas de
milhares de vendas

IBM
Divisão de Mainframe
Criação de vídeos humorísticos para
a reunião anual de vendas em 2005.
Publicaram por diversão no Youtube
Durante o mês postado – duplicou as
visitas aos grupos do site

IBM
Divisão de Mainframe
Aumentou em 10x o trafego do
blog do mainframe
Jan 2007 – o primeiro vídeo da série
tinha sido visto 85mil vezes, outubro
já chegou a 140mil.

Acesso Digital
Acessibilidade na Web:
Custo ou Benefício?
Creative Commom
Usado e replicado em:
Cursos, palestras, blogs, universidades,
empresas, profissionais, estudantes, ...

SlideCast
http://videolog.uol.com.br/video?230205

http://www.prescientdigital.com/about-us/corporate-video

Web 2.0 para sua empresa
Lista básica para explorar o poder do software 2.0 gratuito e
funcional na sua empresa (fonte).
sabros.us - Cópia do Del.icio.us que pode ser instalada na intranet
da sua empresa ajudando organizar e compartilhar links externos
ou internos.
Danbooru - Galeria de imagens tipo flickr para organizar fotos.
ActiveCollab - Ferramenta de gestão de projetos.
RoundCube - Webmail.
Zimbra - Plataforma colaborativa email, calendários, tarefas, etc.
Wordpress - Gestor de conteúdos (blog).
Drupal - Gestor de conteúdos (portal).
MediaWiki - Software livre que sustenta a Wikipedia. Uma
plataforma colaborativa para ser colocada dentro da sua intranet.
Moodle: Software livre para e-learning.
EyeOS: Sistema operacional baseado em web. Ajuda gerir
aplicações web.
http://www.blogcorporativo.net/2007/09/27/agora-vai-web-20-para-sua-empresa/

Antes de listar as
inovações em design,
vejamos o que é, e o
que não é design...

design

Aparência é
importante para
o design

Sim, mas design não é arte!

A arte é um
expressão pessoal,
um ponto de vista.
É sobre a vida, as
emoções, os
pensamentos e
idéias de um
determinado
artista.

Design não é maquiagem...

Muito menos
Sorte

Não deve ser denso, nem pesado

Poluído!

Desorganizado... Onde está o Wally?

Lento...

Ambíguo?

exo
pl
Com

Confuso

Frustrante

Não deve discriminar

Nem
nos fazer
sentir
incapazes

Não
é ambiguo
Ou ser
inacessível

Não
requer
habilidades
especiais

Requer
habilidades
especiais

Ou é difícil de usar

Difícil de usar

Não
é apenas
um rosto
bonito

Afinal,
o que é design

O que é design?
Uma disciplina que
explora o diálogo entre
produtos, pessoas e
contextos.
Fonte: http://www.usabilitybok.org/design/p286

O que é design?
Um processo que cria
soluções para ajudar as
pessoas a alcançar seus
objetivos.
Processes for interaction design in the
context of a User-Centered Design (UCD)
methodology.
Fonte: http://www.usabilitybok.org/design/p286

Qual é o seu objetivo ao
entrar no Google?

Como seria o Google se
fosse como o Yahoo!

O que é
uma
inovação

O que é design?
Um artefato produzido
como resultado de
pesquisas e testes.
Design artifacts include various system models, design
specifications, style guides, and prototypes, including
low-fidelity prototypes, such as sketches and
wireframes, and high-fidelity prototypes, such as
mockups and system demos.
Fonte: http://www.usabilitybok.org/design/p286

Isso tudo para criar…

Satisfação,
Tranqüilidade,
Bem-estar...

Companies large and small are
turning to design as a way to
create better products and
improve consumer loyalty.
Innovation Through Design Thinking
http://poynter.org/column.asp?id=47&aid=98543

Inovações e novas
tendências em design

Portabilidade
Facilidade de uso
Acessibilidade

• Portabilidade
css para dispositivo móvel
MOTO Q
Ac e s s o Dig ita l:
h ttp:/ a c e s s o d ig ita l.n e t
/

Portabilidade - design líquido ( resolução 640x480)

Portabilidade - design líquido (resolução 1024x768)

Simplicidade
Portabilidade

Complexo
“que abrange ou encerra
muitos elementos ou
partes. Confuso,
complicado, intrigado”. Um homem com medo
Simples
“formado de poucos
elementos, e, portanto, de
fácil utilização e
compreensão”.
Um homem feliz

“Os melhores designs são
simples, isto porque eles não
contém nenhum elemento
desnecessário ao contexto”.
Pär Almqvist in KISS –
Keep it simples, stupid!
http://www.digital-web.com/articles/keep_it_simple_stupid/

Os três elementos
fundamentais do design
Design balanceado
Contraste
Linhas invisíveis: 70% x 30%.

Estilo mais
simples e
equilibrado
Facilidade de
uso...
Web 2.0

globo.com
Julho 2007

globo.com
Agosto 2007

G1
setembro 2007

G1
Outubro 2007

Foto da equipe da Acesso Digital – Horácio, Lêda, MAQ e Bruno Torres
http://acessodigital.net
blog: horaciosoares.blogspot.com
e-mail: horacio.soares@acessodigital.net