Wireframes

Here at GyroHSR (I had nothing to do with that site, thankfully) we are all a little bit confused over wireframes. Essentially, I think that the main issue lies in what exactly is a wireframe supposed to deliver.

In my opinion I believe a wireframe should simple layout exactly what information should be displayed on a page and define the importance of that information, in relation to the rest of the content.

With this idea in mind, a wireframe does not necessarily have to provide any sort of guide to the actual layout of a page. There isn’t really anything wrong with this for a simple contact page wireframe:

Header elements

Logo – prominent positioning.
Search box – enable users to search whole site.
Navigation – full site navigation.

Main content

Contact form – main content on page, encourage users to use this method of contact.

Secondary content

Postal address – specify preferred correspondence address.
Email address – link to create email for users that prefer this method of contact.
vCard – Download contact details to an address book for future use.

Other content

Company details – registerd company address and registration number.

That will provide the main information required by a wireframe, and producing this format for every page to be developed should meet the designers needs.

However one point above is always missed, producing a wireframe for every page. Without doing this you are not creating an information architecture for a designer to follow, resulting in questioning why wirframes for any pages were created at all.

The same problem applies to wireframes that incorporate some form of layout:

Example wireframe - courtesy of http://totheweb.com

Example wireframe - courtesy of http://totheweb.com

Creating a wireframe for every page becomes even more important with this wireframe style, in my opinion. Creating this type of wireframe for only a small number of pages during the information architecture stage of a web site process results in designers feeling restricted to make all pages following the same layout. Often the content will lend itself to a completely different layout, which means it needs its own wireframe and if not it should be easy to create another wireframe based on what has already been created.

One other thing I often find missing from wireframes are annotations. Visual representation is fine, but if you really want to let a client or designer know what you plan for the page, it needs to be annotated well. The annotations let the wireframe make sense and are vital to communicating the user experience. A poorly annoted wireframe wil result in poorly communicated ideas and will very probably hinder the final user experience.

So that’s what I think about wireframes, feel free to correct me if you think I’m wrong, or to add to this because wireframes are such an important part of the web development process that I think anyone involved in the industry should input into how wireframes can help ease the pressure on project management, information architecture, design and development.

I’m a Vitruvian!

Which mean I have successfully completed the Vitruvian Triathlon, a half IronMan distance triathlon (almost – the bike is 5km short!). That’s 1.9km swim, 85km bike and 21km run.

I was pretty pleased with the time, 5 hours 08 minutes and 35 seconds, with the following splits:

Swim 00:36:21
T1 00:03:05
Cycle 02:42:46
T2 00:01:33
Run 01:44:47
Total 05:08:35

The swim started bright and early at 6:20am, so I was up and out of the B&B, with Rich from GyroHSR who was also racing, at 5am. We arrived and got transition sorted, I rushed a bit by faffing far too much, but all went relatively smoothly.

Rutland Water, home of the Vitruvian Triathlon

Rutland Water, home of the Vitruvian Triathlon

The water was full of plant life which was a bit annoying to say the least, tangling around my arms a few times but after 2 laps of the 950m course, I emerged feeling quite good. So much so I probably could have taken another minute off the swim time, but it was also a rough swim, with other competitors around me all the way.  I took my time a bit in transition, getting the wetsuit off and making sure I had all the gels and bars I needed and set off on the 2 lap 42.5km course.

It was cold, very cold and a bit too windy on the bike, but the hills got my heart going when they came around. I aimed at keeping my heart rate at 140BPM on the bike, gauging that would be the level I thought I would need to post a sub 3 hours time, turns out it was a great time, as I got through the hills and the wind still feeling strong for the part I had trained most for recently, the half marathon.

Feeling pretty  strong I set the target heart rate of 157 all the way, which should post a 1:35 half marathon, not bad at all. However I expected to flag and while I felt strong most of the way round, the faster runners were a little demoralising.  I kept above 155BPM most of the way round, in the last 7km easing off a little and cruising home at 145BPM, with an average HR of 154BPM for the 21km. I even had a little in the tank for a 50m  sprint at the end!

Only down side to the day was finding Rich at the end, and hearing his race wasn’t ideal – I wish he’d felt as strong so we had a fair comparison of times. Still, I had quite a bit of time on him and better training in the build up may just have given me a sub 5 hour time, but that’s life!

And the day after,  following that monster challenge, I had my Choi Kwang Do yellow belt grading, so now I’m a Vitruvian and a a proper colour belt in martial arts. All in all a good weekend!