Loading...

11
Mar 12

SXSW: Day Two, Designing for CMS

Author: Trevor | Filed under: SXSW | No Comments »
It’s still raining on our second day in Austin, driving people off the streets and into the conference.
I attended many events today but found the designing for CMS the most satisfying.
Here are a couple take aways I think Designers and CMS content updaters would do well to remember.
Design process
  1. content types= start by modeling content, not styling content. Set goals for each type of content.
  2. context= “If this then that” Decide what pages show what content
  3. user types = Anonymous or authenticated? Think like a creator, figure out who will be using/updating the site. Anonymous users don’t need to login and usually have less access, example: “hulu”. Authenticated users login and usually have more access, example:” hulu plus”.
Why use this process?
  1. It helps you know your tool.
  2. It simplifies the complexity.
  3. You can’t design for each piece of content on a dynamic site.
A Good Practice
  1. Don’t start with the home page.
  2. Pick the most important or complex content on the site and start from that.
Don’t forget hierarchy.
Create three groups, 1,2,3. Create these through out each content type.
Fundamentals designers learned but sometimes forget:
  • Position: Our eye reads top to bottom, left to right.
  • Proportion: We tend to notice big things, proportion overrides position.
  • Proximity: Proximity creates visual relationships. Proximity overrides all other elements. Example www.expertsexchange.com. Is it experts ex change or expert sex change?
  • Alignment: Alignment groups objects.
  • Contrast: Creates visual importance.
  • Color: Cool colors recede, warm colors come forward.
  • Isomorphism: Brain wants make things right. the Brain Wants to make things like what we’ve seen in the past. Surprise can be great and horrible.
  • Unity: Make graphical connections.
  • Pause: Create awkward silence in design. White space. Good video on the topic http://vimeo.com/17084428
  • Visual weight: Blur your eyes on the wire frame mock up to test visual weight.
  • Lastly remember to use Style guides mocked up so user can see the style and use it.
  • Otherwise they may use the space bar and bold to design.

Leave a Reply