Simplicity: can you handle it?

With countless ways to shape down the process of making something, whatever it is, I like to subscribe to a very simple approach. To me such an approach is helpful only if it can be applied to any other project.

That said, here are two graphics to help my clients visualize the step-by-step process to get a website done.

The first is a table that compares the big, essential steps of making a website with totally different fields of creation. The second is a more detailed view of the process.

It can be as simple as this:

  • 1.Define
  • 2.Plan
  • 3.Act

… or, even better:

  • 1.Think it
  • 2.Preview it
  • 3.Make it

The Big Steps

You see? It’s not different than any other thing. Do I make it look too obvious? Well, it should be.

Architecture Movies Website
1 Define Think it Project Briefing Script Specifications
2 Plan Preview it Blueprints Storyboard Wireframes
3 Act Make it Building Shooting
Editing		 Mockup Design
Coding

The Small Steps

This is a more detailed view for the process of making a website.

You can:

  • 1. Mouse over the blocks to see details.
  • 2.
  • Specifications
    • Project briefing & overview
    • Client fills in the worksheet (questionnaire)
    • Copy brief (definition of all aspects)
    • Website structure (diagrams)
    • Approval of the Copy Brief & Website structure
  • Resources
    & Content
    • Corporate elements (logo, colors, typo, …)
    • Texts
    • Images
    • Other media (videos, music, …)
    • Resources analysis
    • Editorial style and format adaptation
  • Information Architecture
    • Define order of importance, visual emphasis of elements, “call to actions”
    • Define navigation & wording
    • Pencil prototypes
    • Wireframes (applying usability)
    • Client feedback / Modifications
    • Approval
  • Mockup
    Design
    • Analysis (guidelines, worksheet, wireframes)
    • Brainstorming & Conception
    • Web pages mockups (templates, unique pages)
    • Client feedback / Modifications
    • Approval
    • Slicing
  • Coding
    • Front-end code (HTML, CSS, JS)
    • Back-end code (PHP, CMS integration)
    • SEO
    • Testing & validations
    • Client feedback / Modifications
    • Approval
  • Publishing
    • Content provisioning
    • Upload website files to server under “test URL”
    • Testing
    • Switch to public URL