AIGA: Designing for CMS
-
Upload
yesenia-perez-cruz -
Category
Technology
-
view
3.142 -
download
2
Transcript of AIGA: Designing for CMS
![Page 1: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/1.jpg)
AIGA Philadelphia
DESIGNING FOR CMSPENCIL TO PIXEL
Tuesday, November 15, 2011
![Page 2: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/2.jpg)
WHO IS HAPPY COG?Education
Tuesday, November 15, 2011
![Page 3: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/3.jpg)
Tuesday, November 15, 2011
![Page 4: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/4.jpg)
Tuesday, November 15, 2011
![Page 5: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/5.jpg)
Tuesday, November 15, 2011
![Page 6: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/6.jpg)
WHO IS HAPPY COG?Collaborative Studio
Tuesday, November 15, 2011
![Page 7: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/7.jpg)
2
DEMYSTIFYING THE CMS
Tuesday, November 15, 2011
![Page 8: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/8.jpg)
“
—KAREN MCGRANE, CONTENT STRATEGIST
I know the CMS is this black box you'd really rather not look into.
Tuesday, November 15, 2011
![Page 9: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/9.jpg)
VITSOE 606
Dieter Rams, 1960 http://www.vitsoe.com/en/us
Tuesday, November 15, 2011
![Page 10: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/10.jpg)
ID CHAIR CONCEPT
Vitra, 2011 http://www.vitra.com/en-no/office/products/id-chair-concept/overview/
Tuesday, November 15, 2011
![Page 11: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/11.jpg)
“
—JENNIFER MORLA, 2010 AIGA MEDALIST
Design is like architecture; we structure space to facilitate the experience. Are you creating a minimal, modernist masterpiece, or a dense maze of information?
http://morladesign.com/designisms/
Tuesday, November 15, 2011
![Page 12: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/12.jpg)
DESIGNING FOR A CITY’S WORTH OF CONTENT
Tuesday, November 15, 2011
![Page 13: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/13.jpg)
Tuesday, November 15, 2011
![Page 14: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/14.jpg)
WILLIAM PENN’S PLAN FOR PHILADELPHIA
1683
Tuesday, November 15, 2011
![Page 15: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/15.jpg)
1755MANHATTAN2011 http://www.flickr.com/photos/thisisbossi/6200063720/sizes/l/in/photostream/
EXTINSIBLE PHILADELPHIA
Tuesday, November 15, 2011
![Page 16: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/16.jpg)
Tuesday, November 15, 2011
![Page 17: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/17.jpg)
Tuesday, November 15, 2011
![Page 18: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/18.jpg)
Tuesday, November 15, 2011
![Page 19: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/19.jpg)
Tuesday, November 15, 2011
![Page 20: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/20.jpg)
Tuesday, November 15, 2011
![Page 21: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/21.jpg)
“
—JEFFREY ZELDMAN
Content precedes design. Design in the absence of content is not design, it's decoration.
http://twitter.com/#!/zeldman/status/804159148
Tuesday, November 15, 2011
![Page 22: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/22.jpg)
JUST SAY “NO”
Tuesday, November 15, 2011
![Page 23: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/23.jpg)
3
WHAT IS CONTENT?
Tuesday, November 15, 2011
![Page 24: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/24.jpg)
CONTENT IS ABOUTPEOPLE
Tuesday, November 15, 2011
![Page 25: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/25.jpg)
TEXT
Tuesday, November 15, 2011
![Page 26: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/26.jpg)
Tuesday, November 15, 2011
![Page 27: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/27.jpg)
Tuesday, November 15, 2011
![Page 28: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/28.jpg)
CONTENTneeds to be managed
Tuesday, November 15, 2011
![Page 29: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/29.jpg)
THE OLD WAY: STATIC
Tuesday, November 15, 2011
![Page 30: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/30.jpg)
Tuesday, November 15, 2011
![Page 31: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/31.jpg)
Tuesday, November 15, 2011
![Page 32: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/32.jpg)
Tuesday, November 15, 2011
![Page 33: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/33.jpg)
CMS FTW!
Tuesday, November 15, 2011
![Page 34: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/34.jpg)
Tuesday, November 15, 2011
![Page 35: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/35.jpg)
Tuesday, November 15, 2011
![Page 36: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/36.jpg)
Tuesday, November 15, 2011
![Page 37: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/37.jpg)
Tuesday, November 15, 2011
![Page 38: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/38.jpg)
Tuesday, November 15, 2011
![Page 39: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/39.jpg)
Tuesday, November 15, 2011
![Page 40: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/40.jpg)
is it always the answer?CHOOSING A CMS
Tuesday, November 15, 2011
![Page 41: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/41.jpg)
“—EVERY CLIENT, EVER
I want to be able to update the site myself.
Tuesday, November 15, 2011
![Page 42: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/42.jpg)
‣ No coding experience required
‣ Streamlines the editorial process
‣ Edit/publish from anywhere
‣ Decrease site maintenance costs
Benefits
Tuesday, November 15, 2011
![Page 43: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/43.jpg)
TEXT
Tuesday, November 15, 2011
![Page 44: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/44.jpg)
4Our Process
PROJECTDEFINITION
INFORMATIONARCHITECTURE
GRAPHICDESIGN DEVELOPMENT
Tuesday, November 15, 2011
![Page 45: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/45.jpg)
Project Definition
1. Stakeholder Interviews
2. Comparative Analysis & Benchmarking
3. Kickoff & Workshop
4. Business Requirements
5. Communications Brief
Tuesday, November 15, 2011
![Page 46: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/46.jpg)
MOOD BOARD
Style and tone for a healthcare website
Tuesday, November 15, 2011
![Page 47: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/47.jpg)
WIREFRAMESTuesday, November 15, 2011
![Page 48: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/48.jpg)
Tuesday, November 15, 2011
![Page 49: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/49.jpg)
Tuesday, November 15, 2011
![Page 50: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/50.jpg)
5
SYSTEM PLANNING
Tuesday, November 15, 2011
![Page 51: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/51.jpg)
SITE MAPTuesday, November 15, 2011
![Page 52: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/52.jpg)
“VIP” PAGESTuesday, November 15, 2011
![Page 53: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/53.jpg)
WIREFRAMESTuesday, November 15, 2011
![Page 54: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/54.jpg)
LET’S SKETCH!Tuesday, November 15, 2011
![Page 55: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/55.jpg)
LET’S SKETCH!Tuesday, November 15, 2011
![Page 56: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/56.jpg)
THE GRAYBOX PLAN
Tuesday, November 15, 2011
![Page 57: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/57.jpg)
Tuesday, November 15, 2011
![Page 58: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/58.jpg)
Tuesday, November 15, 2011
![Page 59: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/59.jpg)
‣ Full-Column “Hero”
‣ Primary Events
‣ Secondary News
‣ Secondary Events
‣ Donate Module
‣ Related Links
TEMPLATE A
Tuesday, November 15, 2011
![Page 60: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/60.jpg)
‣ Full-Column “Hero”
‣ Primary Events
‣ Secondary News
‣ Secondary Events
‣ Donate Module
‣ Related Links
TEMPLATE A
Tuesday, November 15, 2011
![Page 61: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/61.jpg)
‣ Full-Column “Hero”
‣ Primary Events
‣ Secondary News
‣ Secondary Events
‣ Donate Module
‣ Related Links
TEMPLATE A
Tuesday, November 15, 2011
![Page 62: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/62.jpg)
‣ Full-Column “Hero”
‣ Primary Events
‣ Secondary News
‣ Secondary Events
‣ Donate Module
‣ Related Links
TEMPLATE A
Tuesday, November 15, 2011
![Page 63: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/63.jpg)
‣ Full-Column “Hero”
‣ Primary Events
‣ Secondary News
‣ Secondary Events
‣ Donate Module
‣ Related Links
TEMPLATE A
Tuesday, November 15, 2011
![Page 64: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/64.jpg)
‣ Full-Column “Hero”
‣ Primary Events
‣ Secondary News
‣ Secondary Events
‣ Donate Module
‣ Related Links
TEMPLATE A
Tuesday, November 15, 2011
![Page 65: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/65.jpg)
‣ Full-Column “Hero”
‣ Primary Events
‣ Secondary News
‣ Secondary Events
‣ Donate Module
‣ Related Links
TEMPLATE A
Tuesday, November 15, 2011
![Page 66: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/66.jpg)
Page Title
NEWS & EVENTS
CENTERS & INSTITUTES
JOURNALS
RELATED LINKS
Page Title
CENTERS & INSTITUTESJOURNALSRELATED LINKS
Page Title
A B C
Page Title
NEWS & EVENTS
CENTERS & INSTITUTES
JOURNALS
RELATED LINKS
Page Title
CENTERS & INSTITUTESJOURNALSRELATED LINKS
Page Title
D E F
Tuesday, November 15, 2011
![Page 67: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/67.jpg)
REVISIT THE SITEMAPTuesday, November 15, 2011
![Page 68: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/68.jpg)
REVISIT THE SITEMAP
A
Tuesday, November 15, 2011
![Page 69: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/69.jpg)
REVISIT THE SITEMAP
A B
Tuesday, November 15, 2011
![Page 70: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/70.jpg)
REVISIT THE SITEMAP
A BC
Tuesday, November 15, 2011
![Page 71: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/71.jpg)
REVISIT THE SITEMAP
A BC
D
E
FA A B
B BB B
FB
B
B
C
C
C
C
C
D
D
D
F F
C
C C
C
B
B
B
B
B
A A
D
D
F F
D
D
D
D
F FB
B
B
B
B
C
C
C
C
C
C
C
C
C
C
C
C
C
C
D
D
Tuesday, November 15, 2011
![Page 72: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/72.jpg)
PRIMARY NEWSSECONDARY NEWSPRIMARY EVENTS
SECONDARY EVENTSPHOTO SLIDESHOW
RELATED LINKSRECENT SCHOLARSHIP
PRIMARY VIDEOSECONDARY VIDEO
RECENT TWEETSFOOTER SUITCASE
LONG-FORM ARTICLEDONATE - HORIZONTAL
DONATE - VERTICALRECENT YOUTUBE VIDEOS
CALENDAR DATE SWITCHER
FROM THE BOOKSTORELARGE PROMO AREASMALL PROMO AREA
PRIMARY NEWSSECONDARY NEWSPRIMARY EVENTS
SECONDARY EVENTSPHOTO SLIDESHOW
RELATED LINKSRECENT SCHOLARSHIP
PRIMARY VIDEOSECONDARY VIDEO
RECENT TWEETSFOOTER SUITCASE
LONG-FORM ARTICLEDONATE - HORIZONTAL
DONATE - VERTICALRECENT YOUTUBE VIDEOS
CALENDAR DATE SWITCHER
FROM THE BOOKSTORELARGE PROMO AREASMALL PROMO AREA
PRIMARY NEWSSECONDARY NEWSPRIMARY EVENTS
SECONDARY EVENTSPHOTO SLIDESHOW
RELATED LINKSRECENT SCHOLARSHIP
PRIMARY VIDEOSECONDARY VIDEO
RECENT TWEETSFOOTER SUITCASE
LONG-FORM ARTICLEDONATE - HORIZONTAL
DONATE - VERTICALRECENT YOUTUBE VIDEOS
CALENDAR DATE SWITCHER
FROM THE BOOKSTORELARGE PROMO AREASMALL PROMO AREA
Tuesday, November 15, 2011
![Page 73: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/73.jpg)
PRIMARY NEWSSECONDARY NEWSPRIMARY EVENTS
SECONDARY EVENTSPHOTO SLIDESHOW
RELATED LINKSRECENT SCHOLARSHIP
PRIMARY VIDEOSECONDARY VIDEO
RECENT TWEETSFOOTER SUITCASE
LONG-FORM ARTICLEDONATE - HORIZONTAL
DONATE - VERTICALRECENT YOUTUBE VIDEOS
CALENDAR DATE SWITCHER
FROM THE BOOKSTORELARGE PROMO AREASMALL PROMO AREA
PRIMARY NEWSSECONDARY NEWSPRIMARY EVENTS
SECONDARY EVENTSPHOTO SLIDESHOW
RELATED LINKSRECENT SCHOLARSHIP
PRIMARY VIDEOSECONDARY VIDEO
RECENT TWEETSFOOTER SUITCASE
LONG-FORM ARTICLEDONATE - HORIZONTAL
DONATE - VERTICALRECENT YOUTUBE VIDEOS
CALENDAR DATE SWITCHER
FROM THE BOOKSTORELARGE PROMO AREASMALL PROMO AREA
PRIMARY NEWSSECONDARY NEWSPRIMARY EVENTS
SECONDARY EVENTSPHOTO SLIDESHOW
RELATED LINKSRECENT SCHOLARSHIP
PRIMARY VIDEOSECONDARY VIDEO
RECENT TWEETSFOOTER SUITCASE
LONG-FORM ARTICLEDONATE - HORIZONTAL
DONATE - VERTICALRECENT YOUTUBE VIDEOS
CALENDAR DATE SWITCHER
FROM THE BOOKSTORELARGE PROMO AREASMALL PROMO AREA
Tuesday, November 15, 2011
![Page 74: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/74.jpg)
THAT’S A LOT OF PATTERNS!Tuesday, November 15, 2011
![Page 75: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/75.jpg)
Page Title
NEWS & EVENTS
CENTERS & INSTITUTES
JOURNALS
RELATED LINKS
PLAN YOUR GRIDTuesday, November 15, 2011
![Page 76: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/76.jpg)
6
GRID SYSTEMS
Tuesday, November 15, 2011
![Page 77: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/77.jpg)
WILLIAM PENN’S PLAN FOR PHILADELPHIA
1683
Tuesday, November 15, 2011
![Page 78: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/78.jpg)
NATIONAL PARK SERVICE UNIGRID
1977
Tuesday, November 15, 2011
![Page 79: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/79.jpg)
NATIONAL PARK SERVICE FOLD-OUTS
http://www.peterme.com/images/nps_mesa_dv_sidebyside.jpg
Tuesday, November 15, 2011
![Page 80: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/80.jpg)
“
—MASSIMO VIGNELLI
There are infinite ways of [applying content] and that is why the grid is a useful tool, rather than a constricting device. However, one should learn to use it so as to retrieve the most advantageous results.
http://www.vignelli.com/canon.pdf
Tuesday, November 15, 2011
![Page 81: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/81.jpg)
960: LOVED & LOATHEDTuesday, November 15, 2011
![Page 82: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/82.jpg)
MODULAR TYPE SCALES
http://modularscale.com/
Tuesday, November 15, 2011
![Page 83: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/83.jpg)
MODULAR TYPE SCALES
http://modularscale.com/
Tuesday, November 15, 2011
![Page 84: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/84.jpg)
MODULAR TYPE SCALES
http://modularscale.com/
Tuesday, November 15, 2011
![Page 85: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/85.jpg)
MODULAR TYPE SCALES
http://modularscale.com/
Tuesday, November 15, 2011
![Page 86: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/86.jpg)
MODULAR TYPE SCALES
http://modularscale.com/
Tuesday, November 15, 2011
![Page 87: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/87.jpg)
MODULAR TYPE SCALES
http://modularscale.com/
Tuesday, November 15, 2011
![Page 88: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/88.jpg)
MODULAR GRID
http://modulargrid.org/#app
Tuesday, November 15, 2011
![Page 89: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/89.jpg)
“
—SOME DESIGNER, RIGHT NOW, NOT THINKING ABOUT THE CMS
It’s just a few pages. We’ll be fine withouta grid.
Tuesday, November 15, 2011
![Page 90: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/90.jpg)
CMS WITHOUT A FLEXIBLE GRID
How pages are made.
Tuesday, November 15, 2011
![Page 91: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/91.jpg)
Think modularly.DON’T LACK DISCIPLINE
Tuesday, November 15, 2011
![Page 92: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/92.jpg)
7
CONTENT PATTERNS
Tuesday, November 15, 2011
![Page 93: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/93.jpg)
Tuesday, November 15, 2011
![Page 94: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/94.jpg)
Tuesday, November 15, 2011
![Page 95: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/95.jpg)
CONTENT LEADS DESIGN
Tuesday, November 15, 2011
![Page 96: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/96.jpg)
Tuesday, November 15, 2011
![Page 97: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/97.jpg)
Tuesday, November 15, 2011
![Page 98: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/98.jpg)
Tuesday, November 15, 2011
![Page 99: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/99.jpg)
EXTENSIBILITYPlanning for the Future!
Tuesday, November 15, 2011
![Page 100: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/100.jpg)
PATTERN LIBRARYTuesday, November 15, 2011
![Page 101: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/101.jpg)
PATTERN LIBRARYTuesday, November 15, 2011
![Page 102: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/102.jpg)
ID CHAIR CONCEPT
Vitra, 2011 http://www.vitra.com/en-no/office/products/id-chair-concept/overview/
Tuesday, November 15, 2011
![Page 103: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/103.jpg)
Tuesday, November 15, 2011
![Page 104: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/104.jpg)
ZAPPOSTuesday, November 15, 2011
![Page 105: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/105.jpg)
Tuesday, November 15, 2011
![Page 106: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/106.jpg)
Tuesday, November 15, 2011
![Page 107: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/107.jpg)
Tuesday, November 15, 2011
![Page 108: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/108.jpg)
EXTENDING THE BRANDTuesday, November 15, 2011
![Page 109: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/109.jpg)
WHAT IF IT BREAKS?!
Tuesday, November 15, 2011
![Page 110: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/110.jpg)
Tuesday, November 15, 2011
![Page 111: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/111.jpg)
Tuesday, November 15, 2011
![Page 112: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/112.jpg)
Tuesday, November 15, 2011
![Page 113: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/113.jpg)
Tuesday, November 15, 2011
![Page 114: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/114.jpg)
Tuesday, November 15, 2011
![Page 115: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/115.jpg)
Tuesday, November 15, 2011
![Page 116: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/116.jpg)
Tuesday, November 15, 2011
![Page 117: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/117.jpg)
Tuesday, November 15, 2011
![Page 118: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/118.jpg)
Tuesday, November 15, 2011
![Page 119: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/119.jpg)
Tuesday, November 15, 2011
![Page 120: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/120.jpg)
Tuesday, November 15, 2011
![Page 121: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/121.jpg)
Tuesday, November 15, 2011
![Page 122: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/122.jpg)
Tuesday, November 15, 2011
![Page 123: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/123.jpg)
Tuesday, November 15, 2011
![Page 124: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/124.jpg)
Tuesday, November 15, 2011
![Page 125: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/125.jpg)
8General Styles
ALL THE TAGS
Tuesday, November 15, 2011
![Page 126: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/126.jpg)
Tuesday, November 15, 2011
![Page 127: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/127.jpg)
Tuesday, November 15, 2011
![Page 128: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/128.jpg)
9
DEVELOPMENT
Tuesday, November 15, 2011
![Page 129: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/129.jpg)
AUDIT THE BLITZ
Tuesday, November 15, 2011
![Page 130: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/130.jpg)
HANDOFF MEETING
Tuesday, November 15, 2011
![Page 131: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/131.jpg)
PSDS TO TEMPLATES
Tuesday, November 15, 2011
![Page 132: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/132.jpg)
ALL THE MODULESTuesday, November 15, 2011
![Page 133: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/133.jpg)
ALL THE MODULESTuesday, November 15, 2011
![Page 134: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/134.jpg)
HTML
CSS
Tuesday, November 15, 2011
![Page 135: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/135.jpg)
CMS INTEGRATION
Tuesday, November 15, 2011
![Page 136: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/136.jpg)
Tuesday, November 15, 2011
![Page 137: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/137.jpg)
‣ Title
‣ Image
‣ Date
‣ Location
‣ Time
‣ Ticket price
‣ Copy
Tuesday, November 15, 2011
![Page 138: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/138.jpg)
‣ Title: {title}
‣ Image: {event-feature-image}
‣ Date: {event-date}
‣ Location {event-location}
‣ Time: {event-time}
‣ Ticket price: {event-price}
‣ Copy: {event-body}
Tuesday, November 15, 2011
![Page 139: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/139.jpg)
{title}
{event-feature-image}
{event-location}
Tuesday, November 15, 2011
![Page 140: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/140.jpg)
{event-date}
{event-time}
{event-body}
{event-price}
Tuesday, November 15, 2011
![Page 141: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/141.jpg)
CREATE EACH PAGE IN THE SITE MAPTuesday, November 15, 2011
![Page 142: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/142.jpg)
CONTENT ENTRY
Tuesday, November 15, 2011
![Page 143: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/143.jpg)
LAUNCH!
Tuesday, November 15, 2011
![Page 144: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/144.jpg)
10Takeaways
1. Don’t be afraid of Content Management
Systems!
2. Plan your system before diving into
Photoshop
3. Think modularly
4. Look ahead
Tuesday, November 15, 2011
![Page 145: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/145.jpg)
THANK YOU!‣ Michael Johnson (@mleland), Senior Designer
‣ Yesenia Perez-Cruz (@yeseniaa), Designer
‣ Allison Wagner (@alliwagner), Developer
Tuesday, November 15, 2011
![Page 146: AIGA: Designing for CMS](https://reader038.fdocuments.us/reader038/viewer/2022110118/554da9c0b4c905047b8b4cf6/html5/thumbnails/146.jpg)
QUESTIONS?
Tuesday, November 15, 2011