O que é
responsive
web design?

responsive
architecture
Arquitetura Responsiva é um campo que une a parte prática e de
pesquisa da arquitetura. Arquiteturas responsivas são aquelas que
analisam as condições do meio ambiente através de sensores, permitindo
que suas construções adaptem formas, curvas, cores e até personalidade
do ambiente de forma responsiva.

http://www.alistapart.com/ar
ticles/responsive-web-
design/

responsive
webdesign
Projetar para uma melhor visualização, incorporando tecnologias
padronizadas em nossos projetos para torná-los não só flexíveis, mas
mais adaptáveis ao dispositivo que o recebe.

Cases

Live demo

como começar

Prototi
pagem

Paper protyping

Front-end
Framework

como usá-los
juntos

http://www.alistapart.com/ar
ticles/dive-into-responsive-
prototyping-with-foundation/

http://www.alistapart.com/ar
ticles/dive-into-responsive-
prototyping-with-foundation/

http://www.alistapart.com/d/
dive-into-responsive-
prototyping-with-
foundation/code/#

http://lorempixel.com/

http://placehold.it/

Rápido, interativo e flexível.

Separe sua
interface em
módulos

Grid
Texto
Menu
Tabela
...

Grid

http://www.thismanslife.co.uk/p
rojects/lab/responsivewirefram
es/

Texto

http://www.netmagazine.com/tu
torials/handling-typography-
responsive-design

Menu

http://css-
tricks.com/responsive-menu-
concepts/

Tabela

http://css-
tricks.com/responsive-data-
tables/

Truques

Imagem
Responsiva

Vídeo
Responsivo

http://fitvidsjs.com/

http://fittextjs.com/

Como testar?

Showtime

http://html5-pro.com/sanfona

Obrigado :)
@bernarddeluna e @zenorocha