Internal Project – Step 1 – Document the UI

I’ve started putting together the UI for my home project.

You can see this in all it’s glory at https://github.com/dcamdupe/status.

Here is a sneak peek:

Home page version 1
Home page version 2
These high quality wireframes help illustrate a number of things:
  1. I don’t have access to appropriate tools at home. Rather than buying them, I’m using the highly technical approach of pen + paper + iPhone camera to capture my wireframes
  2. My hand writing is frighteningly messy
  3. In version 2 I’ve avoided the traditional wooden table for a far more attractive red table cloth with stars
For version 2 of the wireframes, I’ve tightened things up a little and used more consistent UI elements. This might not be apparent, given my limited ability with a pen. I also noticed I missed a page and a few other major elements on the pages.
I’m skipping a few normal user lifecycle elements (forgotten password etc) for simplicity’s sake.
The only thing that might not make immediate sense is the popularity box. This will be some sort of synthesis of the number of views and likes to provide an overall popularity. This could be represented by a number, an image or just a colour.

2014-01-05 Updated to link to earlier article.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s