Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥

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
デザインシステムの「種」を使って、受託開発を加速させる
Avatar for akane akane___ui
0
12k
株式会社ログラス - 会社説明資料【デザイナー】/ Loglass Designer
Avatar for 株式会社ログラス loglass2019
1
6.2k
Franks Myth
Avatar for George Frank Hayford-Taylor gfht1
0
380
第4回関東Kaggler会LT HCD-Net人間中心設計スペシャリストが語るNotebookメダルの取り方
Avatar for Isao utm529f
0
1.7k
Figmaレクチャー会Part1 基本のき編＠千株式会社 社内勉強会
Avatar for ぽん designer_no_pon
0
180
【MIXI MEETUP！ー TECH & DESIGN DAYー】新たなSNS「mixi2」の “0→1”開発の舞台裏：デザイナーが語るプロダクト誕生秘話
Avatar for MIXI DESIGN mixi_design
PRO
0
180
AI業務アプリケーションの体験デザイン
Avatar for kim kazuhirokimura
0
240
地理院地図をもっと楽しく！れきちず新機能のご紹介
Avatar for Hajime Kato hjmkth
1
260
AIを身近に感じるために、デザイナー全員で一つのサービスを使ってみた
Avatar for Saiko.T _psyc0_
0
350
【pmconf2025】PdMの頭の中を見える化する体験構造図
Avatar for Shigeyuki Kameda kamechi7222222
1
1.5k
新卒の目から見たサイボウズのデザイン組織
Avatar for 小林諒大 ryota5884
0
270
Diverse Design Team Deck
Avatar for Diverse diverse
0
220

Featured

See All Featured
A Soul's Torment
Avatar for Nat Ma seathinner
1
2k
AI Search:
Where Are We & What Can We Do About It?
Avatar for Aleyda Solis aleyda
0
6.7k
Paper Plane
Avatar for Katie Cordina Lindsey katiecoart
PRO
0
44k
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
Avatar for Liv Day livdayseo
0
29
Visual Storytelling: How to be a Superhuman Communicator
Avatar for David Neal reverentgeek
2
400
How GitHub (no longer) Works
Avatar for Zach Holman holman
316
140k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
210
24k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
Avatar for Kenny Baas-Schwegler baasie
0
400
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.4k
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
370
20k
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
0
250
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
615
210k

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