Wireframing - How the app is going to work

Ryan Carson | The Wireframe, Amigo | Saturday, February 18th, 2006

The sketch of the wireframe for our web app

Once we had come up with the idea, we wanted to get right into deciding how the app would work. We’re big fans of 37signals’ Getting Real process, which worked great on DropSend, our first app.

Gill and started sketching the user interface in my sketch book on a plane to NYC. It was funny because we were paranoid about people overhearing us, so we had to whisper. The above is a photo of our real sketches.

We started with the signup page and hammered out each page. Thankfully, the app was very simple (about 20 screens). We didn’t bother to sketch the admin that Carson Systems would see - just the customer user interface.

We didn’t go into any sort of detail - just the basics. Once we had the pages all sketched out, I refined them in PowerPoint. I know, it’s weird., but it works great for me. I find it quicker than Fireworks, Flash or Photoshop. You can quickly add pages and drawing boxes and writing text is super simple.

After I created the PowerPoint document, we re-visited it about 1 week later to see if we had forgotten anything. Gill went over it in detail and we changed a few things.

Now that we’ve got the wireframe all done, we’re going to have it build in unstyled XHTML to get a real feel of how it will work.

Powered by WordPress | Theme by Roy Tanck