You can often tell a website whose owner thinks design is a product. They’re the ones with slick edges and generic guts, where paragraphs flow into a given space like gel into a bucket. If the text is well written, you wouldn’t know it from the slapdash presentation. It’s like a $100 Merlot in a styrofoam cup or Jonathan Ive’s résumé written in 12pt Arial.
To be fair, I’ve seem some impressive WordPress templates. But using a template requires a different set of skills than solving problems.
In my experience, design the noun is different than design the verb. The noun describes a product, like a downloadable template. The verb describes the process of solving problems.
Design-by-process is a flexible approach. Pages vary in layout, color and style to fit the content they hold and to influence visitors’ first impressions. The overall site template is kept to a minimum, usually the logo, navigation bar and footer, so visitors don’t need to hunt for site-wide features. The design process is more difficult than the design product, but when done well results in a better site. It begins with questions and ends with informed decisions.
Four vital questions
1. What is this project about?
Start by describing the project in one complete sentence with buzzword-free language. That’s the project, not the website. A website is often the means to a goal, not the goal itself.
2. How will this project change people’s lives?
Change doesn’t have to be drastic. Convincing someone to buy, change their minds about an issue or making them laugh is reason enough. If a site isn’t working to make a difference, then why does it exist?
3. What are we doing that hasn’t been done before?
A project doesn’t have to be wholly original, but to stand out it should include something new. A twist, a combination, a new perception—something people can’t find anywhere else. The best way to start is to ask “what if?” For example:
- Sports sites usually provide statistics. What if a sports website showed nothing but stats—just a running stream of factoids?
- Clothes stores entice buyers with trendy brands. What if a store website let people create “name brands” with their own names?
- Checklists are supposed to be simple. What if a checklist website provided resources for its tasks?
4. How will we measure success?
At some point, a project’s owners will wonder if their effort was worth the trouble. A “measure of success” is a specific benchmark used to rate a site’s effectiveness. For example:
- Sell 20 widgets per month.
- Sign up 200 participants before a seminar.
- Reminding one person to call his or her grandparents on their birthdays.
Other not-so-big questions
- Who are we trying to help, inform or influence? Do we know the target audience?
- In producing this project, who is responsible for what?
- What do we need for launch, and what can wait for later?
- What content will we have stored for future publication?
- How shall we maintain this site? Who will make changes, monitor traffic and troubleshoot problems?
- When should we review the site’s progress after launch?
- Has this been done before? If so, how can we improve on it? What mistakes can we learn from?
Direct design questions
- Our message is ____. It says so on the home page. How can we work in subtle reminders throughout the site?
- We want our visitors to feel (reassured, empowered, excited). What non-verbal cues will reflect that mood?
- I like this other site so well I’d like to steal its design. What can we do that they’d want to steal from us?
What about design?
Few of the questions above mention the web, let alone design. But “process” doesn’t mean abandoning line, color, form, type, layout, negative space, etc. It means using them as tools to answer the questions.
Design as problem-solving process
- Problem: “What’s the best way to publish events that people can review to see progress?” Idea: A blog is a good platform for presenting both current and archived updates.
- Problem: “We have a lot to say, but what if too much text bores people?” Idea: Use videos to say the same thing with videos. Flash supports videos on desktop browsers.
- Problem: “We like our neutral background, but the text is hard to read. How can we increase readability?” Idea: Drop shadows on white text are one way to help.
Design the noun thinks of features
- “I want a blog.”
- “I want to use Flash.”
- “I want to use drop shadows.”
- “I like how this other site looks.”
The solutions above aren’t necessarily the best, but it’s the idea that counts. Designing solutions to problems leads to possibilities, not fixed answers. It’s also empowering. Instead of fitting a pre-determined setup, problem solving is adaptable. It creates a mindset better suited for such a flexible publishing medium.