Site planning: Letting User Experience Guide Workflow

Drupal site planning
Letting user experience guide workflow
@danigrrl

The process
Identify who you want – and who you don't want – to visit your site
Use “want” list to identify specific audience targets. Establish:
Personality traits
Content preferences
Key content “landing areas”
Interaction preferences
Turn “landing areas” into wireframes/prototypes based on established content and interactive preferences.
Use wireframes to determine site workflow: modules, views, blocks, etc.

Getting down to basics t
Think on your feet
Use mindmaps, sketchbooks and whiteboards to quickly sketch out ideas
Iterate
Refine through research

Want/Not Want
Helps figure out content (i.e. how do you attract the people you want and turn off the ones you don't?)
Makes it easier to lose functionality that doesn't fit the ultimate goal

Practical example.
Here's a guy. His name is Joe. Joe is a serial entrepreneur. Type A, with a wicked case of ADD. He launches new businesses because he can't sit still for too long, and finds the best people he can to run them. While he tries to be smart with his money, he has no issue paying well if he's confident he has the right person for the job. He's looking for someone to help him launch a website for his latest venture.

What does Joe want to see?
The quality of your work (portfolio)
The types of clients you work for (client list, home page)
Insight on how you think (process, blog)
How to get in touch with you (contact information)
AND REALLY NOTHING ELSE.

How does he want to interact with these things?
Joe's a busy guy. He thinks visually, not verbally. He will likely click around on a couple of different links, but he's a skimmer. Priorities:
Focus on visuals rather than text
Give the option of reading, but don't require it
Don't make him work to find important information (especially contact info)

So where are Joe's “landing pages?”
Project landing page
Project node page
Clients page
Process page
Contact page

Constructing the wireframes
Portfolio: will probably click around, maybe wants to see a bit of information about the project, but mostly wants to see the pictures. New >> Current ^

Process: Joe's a busy guy. He prefers visuals to words, and tends to skim. He doesn't need all the details; just a high-level overview. He needs to trust that you know what you're doing. New >> Current ^

Blog: will probably skim through a couple of entries, click on a couple that interest him, maybe check out a couple of tags here and there. If he likes what he sees, he wants to be able to comment or subscribe to the feed. v New >> Current ^

Breaking it down
Use the wireframes to identify the key views, classes, blocks, etc. that you need to create.

Thanks!
Any questions?
@danigrrl

Thanks!
Any questions?

Site planning: Letting User Experience Guide Workflow

by Dani Nordin

Accessibility

Categories

Upload Details

Usage Rights

1 Embed 1

Statistics