Content Model for Page Design                                                                                             ...
Upcoming SlideShare
Loading in …5
×

Content Model to Page Design

4,870 views

Published on

Here is the poster presentation material for IA Summit 2011 by Atsushi Hasegawa, Ph.D. from Concent, Inc. This poster describe how content model diagram helps page design.

Published in: Design, Technology

Content Model to Page Design

  1. 1. Content Model for Page Design Atsushi HASEGAWA, Ph.D., Hitoshi ENJOJI, Naoko KAWACHI Concent, Inc. (Tokyo, Japan) www.concentinc.jp/lab/ What? - Content Model is a diagram for organizing content and visualizing relationship. - This framework shows Content Model helps define page layout by UX strategy. How? 1. Draw Content Model by categories, relationship, volumes (left diagram). 2. Draw Bold Line an usage comments by UX strategy. Other products 3. Place elements on the page by the priority. and services Why? Basic product - Prioritized Content Model is a basis of the page design. information, and BUY You can discuss the page layout and effect by this model. NOW button1) Other product Other Products Other Contentsinformation andfunctions are low Mainpriority, then features /appear only in the Mac iPod iPhone Store iTunes Support Slideshowglobal navigation. and columns 3) Products basic Instruction2) Instruction and information items are videoexplanation defined by the Instructioncontents are high guideline including Features Videopriority. Especially BUY NOW button.introducing mail They are appear infeatures are appear the local navigationin both the mail area.visual slideshowand content Main Build-incolumn. Features Apps iPad Use 4) The key element of this App Situation page is product mail Store features slideshow. Each slide has a large picture and copy phrases. Use situation iOS 4.3 iOS Buy iPad Featured Contents Tour 5) BUY NOW is the highest priority, so it is placed on the BUY Online Retail local navigation area and has Telephone Spec NOW Store Store special button shape. Other information are less priority. Buy iPad Product Information

×