Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Small but Stretchy - Responsive Content

Avatar for front front
September 27, 2011
Design
5
350

Small but Stretchy - Responsive Content

Slides for @hishellywilson's talk at #csforum2011. Watch the video at http://vimeo.com/28642885

Avatar for front

front

September 27, 2011
Tweet

More Decks by front

See All by front
Voice of Type Test
Avatar for front front
1
19k
Typecast - What you need to know
Avatar for front front
4
12k

Other Decks in Design

See All in Design
「キャリア」のプロダクトをつくる私の「キャリア」への向き合い方 / JAM de NIGHT DESIGN SESSION Vol3
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
1
680
The Spectacular Lies of Maps
Avatar for Per Axbom axbom
PRO
1
300
デザイナー向けフライル説明資料
Avatar for Toshiaki Arai toshiblues
0
160
1920*1080pxに設定したケース / Google Slide Size Test
Avatar for Arthur arthur1
0
3.5k
Installing and Running decksh/pdfdeck
Avatar for Anthony Starks ajstarks
1
860
Memory Man v3 (WIP)
Avatar for Chad Welson storybychad
PRO
0
2.7k
ランドマークが光る！季節を彩るナビ体験 - Mobility Night #3 -
Avatar for tetsuya kitauji kitau
0
130
株式会社バクタム　会社説明資料
Avatar for Bactum Inc. bactum
0
360
[2025.6.30 もがく中堅デザイナー、キャリアの分岐点] なんでもやる系デザイナーのもがきかた
Avatar for Takahiro Hayashi taka_piya
1
3.8k
企画を動かすデザイナーの思考！「広げて絞る」アプローチ。
Avatar for Hikida Kan hikidakan
0
180
Мышление дизайнера историями. Как текстовые модели человеческого поведения помогают проектировать
Avatar for Andrew Shapiro ashapiro
0
420
【MIXI MEETUP！ー TECH & DESIGN DAYー】【工数98%削減】Xでモンストを話題にせよ！生成AIの活用で日本トレンド6位を獲得した企画の設計&デザイン術
Avatar for MIXI DESIGN mixi_design
PRO
0
130

Featured

See All Featured
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
Avatar for Dan Newman danielanewman
229
22k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
514
110k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
697
190k
Side Projects
Avatar for Sacha Greif sachag
455
43k
KATA
Avatar for Megan Lloyd mclloyd
32
15k
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.5k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
5.8k
Statistics for Hackers
Avatar for Jake VanderPlas jakevdp
799
220k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.2k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
15k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
46
7.6k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
791
250k

Transcript

  1. Small but Stretchy RESPONSIVE CONTENT @designbyfront

  2. sasquatchfestival.com CANVAS SIZE

  3. REPOSITIONED RESIZED CUT BACK TURNED OFF /HIDDEN

  4. google.com/trends Jan 2011 Apr 2011 Jul 2011 RESPONSIVE DESIGN CONTENT

    STRATEGY

  5. “Whatever the device – we need to create layouts from

    the content out.” - Mark Boulton, A Richer Canvas, 24 March 2011 ..

  6. Content Choreography by Trent Walton, July 14th 2011

  7. CONTENT CREATION DESIGN DEVELOPMENT

  8. GET INVOLVED or SUFFER THE CONSEQUENCES

  9. MULTIPLE VERSIONS = BAD

  10. MARKED UP CONTENT?

  11. WE NEED TO: Own it Think small Edit 1 2

    3

  12. CONTENT CREATION DESIGN DEVELOPMENT

  13. STARTING WITH MEANS LESS AND

  14. Photo by Kim Smith

  15. LESS IS MORE

  16. None

  17. GROW vs TRIM Photo by Pink Sherbet Photography

  18. “If I’d had more time, I would have written a

    shorter letter” - Blaise Pascal, 16th Century

  19. WRITING EDITING

  20. Google: Responsive web design Mobile rst design Media Queries Follow

    me @hishellywilson