You Think Page Titles are Not Important?

Scenario: I've just spent 20 minutes flipping through an online slide presentation. A very good presentation, obviously. Now that I'm done, I'd like to return to the "1 in a million" Google Search that got me here. I had a good keyword combination that provided some great results that I can't afford to lose. I hit the "Back" button in Firefox and realize that I'm gonna have to click the button 100+ times to go back through all the pages/slides. Luckily I'm a savvy user and know that the drop-down menu of history in Mozilla will take me back to my search results page in one glorious click. Below is a screen shot of what I see:






This is major bullshit and I'm not sure if I should be more angry at lazy developer(s) or the browser folks. Even if I have a drop-down menu full of different titles, it's still never been clear to me that the titles near the top are my "recent" visits or if the titles near the bottom are my recent visits.

Keep in mind that these page titles also make minimized browser screens (you know..at the bottom of your computer screen?) easier to scan before maximizing. It's also what is stored when a user bookmarks your page. Titles that are in-line with the page content won't hurt you in the SEO department either.

Personally, I'd also like to see a number assigned to each history record(in the browser) so that it's immediately clear which links I've visited near the beginning of my session vs. the links visited in the latter portion of my session.

Why I Love Southwest Airlines

I'm employed as an IA at a fortune 500 company focused on the travel industry. I try to be a good little IA and check up on our competitor's sites from time to time. Sometime in the past couple of weeks, Southwest Airlines pushed a new home page out to their site. Big Kudos to SW, the home page is wonderful. I've always been turned off by all of the airlines sites. They are extremely cluttered and have way too much "Form" action going on at the home page level. Let me count the things I love about what they have done:

See it Here

Hierarchy
They have put significant visual weight on the actions that travelers need most when coming to their site. I'm talking about the buttons...you saw them right? Of course you did. It's the first thing I saw. It's strange how I noticed them before the big "Hero" photo in the middle of the page...maybe the buttons loaded first..I can't remember.
All of the secondary information is in the bottom-right side of the page. From the global navigation, down to the large action buttons, and all the way down to the secondary information that does not need much weight...the visual hierarchy of this page and information is picture perfect as far as I'm concerned. Someone might say that the large imagery is "secondary" and holds too much weight, but this is the travel industry and a little travel inspiration to get folks "pumped up" is a good thing.

Travel Alert
This is great. Would be even better if it slid open and did not take the user too far away from those great booking and special offers buttons on the home page that convert to dollars for Southwest. There is a lot of red on the page already (the breast of the airplane image, the tagline in the photo, the buttons) so 'travel Alert" in the same color is not really an "Alert' anymore. Maybe a slightly bigger icon, slightly larger font or something of that nature to separate it from the other content. Good location in the top left though.

Progressive Disclosure Link
I'm back to the buttons again...Southwest designers (and IA's maybe) are not forcing customer (like my Grandma) to wade through a sea of form clutter to find what they need. The buttons give the customer enough scent to know where to go next. They only have to see what they want to see. On top of that, clicking these buttons does not take the person away from the page. It's very non-intrusive.
I see a "More" link on this page as well, good stuff. If the customer wants to see more, it's there for them. nothing is being shoved in the customer's face here. There is not one single form entry field on this page....wow.


Some things I did not care for:
- The global nav and the section headers below the graphic are the same images, same color, for the most part. At first glance I thought it was a secondary navigation and actually hovered over it to try to click on it.

- I realize there is not much room for the widget elements under each button, but the labels for each entry field under each button are different. Some are bold, some left-aligned and not bold, some on top of the field and bold, etc.

Need Ideas for WireFrames and/or Functional Specs?

Our team has been looking high and low for example of wireframes, Functional Specs, Design Specs, etc. that fit into our process here. Unfortunately I have not found many examples posted out on the World Wide Inter-Web. The best example of a "toolkit" that I can find is at the IA Institute. But still, nothing we found there tickled our fancy.

I'm sure there are other people searching for documentation ideas as well so...I am going to post our process here (Fortune 500 company with one of the "top 10" commercial websites on the web). The main focus of this post is to show you an example of Functional Specs and Wireframes/Comps that fit nice and snug together with those specs.

Here's our process in a nutshell:
1)Business people "The Suits" and the project manager get together and decide they want to redesign or make a whole new web application. They then meet and come up with Requirements. Out of this meeting comes a Scope document detail at a high level what needs to change.

2)The IAs review the scope and we have a brainstorming session about what we want to do...along with the design team.

3) The IAs work on Wires and maybe a little prototyping using Axure...and once that's going we start the FIS (Functional Information Specs) which I will show you an example of. The Specs detail absolutely everything: what happens when you click on this, when you click on that, if you have to be logged in, what errors you get for any type of action, default values for fields, etc.

4) The FIS, wires and prototype are then sent to the designers who make "comps" with the materials we gave them. We make sure the designers have an idea of what should be most prominent on the page and we basically just check in once in a while to make sure there are no usability concerns and make sure that standards are being followed.

5) Once the designers have something, they show it to us and we work back and forth on feedback.

6) Once satisfied with eveything, the designers take those comps and build the html, find the pretty little images on stock sites, build the style sheets, etc.

7) Then we have Developer Handoff. This is when we give the developers the FIS, Wireframes and HTML. We also give them comps, which are the screen shots of the HTML.

The FIS:
Made with Adobe InDesign.
These are the business rules. I tell the developers exactly what to do for everything. Figures are labeled by letter and everything from Browser title to the Footer is called out. At the end of the project this also serves as official documentation.
Text is using black text. Anything dynamic like maybe images, fields, drop-downs, etc. have [brackets] surrounding them with a corresponding definition for the developers to code to.
The QA team will also build their testing plan based on this while the developers are working their magic. The QA team pretty much makes a testing scenario for every "green" rule.

The Wire:
This is normally what I send to the designers so they have an idea of what we need. However, when the design work is done we will use the nice screen shot comps of the finished HTML to show the developers/business during handoff to them.

Right now I have no place to post this for download. If you would like the .indd file for this, please mail me. I will be more than happy to send it to you.

For the Visio wire, I used some storyboarding shapes that I got from Bryan and Jeffrey Eisenberg, authors of "Waiting for Your Cat to Bark?". The shapes are very helpful and make wires much easier. I'll be happy to send those to anyone interested.

Weekend Project

So on the side of my house I have a tiny patch of grass (weeds) that is landlocked by a fence, patio, and the side of my house. This little "nook" serves no purpose and is a pain in my ass b/c I have to weed it in the summer and it constantly stays wet b/c of a gutter downspout off the side of my house.

Before:

















After $60 and about two hours of work:









Materials Totaling $60:
- 4 bags of Decorative River Rock. Not pebbles.(Lowe's)
- 1 bag of paving base. Sand works as well.(Lowe's)
- 1 bag of topsoil
- 30 6x6 stone pavers (Lowe's)


How-To:
- Spray the grass with roundup a couple days before to kill everything. You don't want weeds
and grass to be popping up b/t the rocks all summer long.
- Use a shover or pick (sharp pick-axe works well) to pull up the grass.
- I sprayed the ground again to be sure all was dead
- Laid 4 bags of River rock. Spread with a steel rake or shovel.
- I dug the area for the stone pavers a tad bit deeper and more uniform edges
- Fill the stone paver area with the paver base. Mine was about half-inch deep.
- Lay the stones and twist into place firmly. I sometimes tapped them with the butt-end of a
shovel to make sure they were sitting tight
- The pavers naturally do not fit tightly together so I tossed about 2-3 handfuls of top-soil on
top and brushed it in with a large broom.
- Spray the top of the pavers with a bit of water so they will set better and VOILA! Done.

Next I need to do something about the gutter downspout. I'll probably buy an extension and run it to the fens so my neighbor can deal with it.

Are you Regimented?

I am a very regimented person. I'm all about being clutter-free and organized. It's not really and obsession but my quest to be a clutter-free organized neat-nick has definitely put a strain on some of my relationships with roommates over the years. (...back in the college days). My freshman year of college I had no earthly idea what I wanted to do with my impending career so I humped it across campus to the career center and laid out $45 hard-earned dollars to take a two hour "Career Aptitude" test. The top two careers they thought I would be suited for are as follows:

1) Career Military Officer

2) Air Traffic Controller

3) Radiologist


How the hell did radiologist end up on my list? The first two were not surprising, but Radiologist? I know nothing about radiology, considering I get queasy just watching an episode of ER. Maybe good radiologists are very organized and "regimented", who knows.

Back to my point, here are some of the things I do that make me destined to have a career in the military:

1) I will NOT get in my bed unless it is made up...tight.
2) I never go to bed with dishes in the sink, coasters all over the coffee table.
3) Everything has it's place. Phone and keys go in left pocket, wallet in right pocket...and if these items are not in my pocket, they are on the right side of my kitchen counter. I NEVER have to look for them...they are either in my pocket or on the kitchen counter. Why cant women be like this with their keys???
4) My radio pre-set channels in my truck are in a specific, low to high order.
5) I wake up every morning at 5am to work out. I feel like a worthless son of a bitch if I ever sleep in. The sky is falling.
6) I eat the same things every day, for every meal. For example, at breakfast I always eat an egg sandwich with two eggs and a bowl of cheerios. This is part of my diet and workout regiment though.
7) I am an incessant list maker. I never go out w/o a list and a plan of what I'm going to do.
8) Taking a different route to work is an adventure to me.
9) Vanilla, always.

After looking over this, I think I'm just "Boring" and predictable....not regimented. You agree?

Don't Forget

I'm willing to wager that I'm the most forgetful person on the face of this earth. i am a constant list maker.....I have a "master" list that sits on the counter in my kitchen and it never moves and is constantly updated. At times, I even put an item on the bottom of a list that says "make another list tomorrow".
Hmmmm...reminding myself on my to-do list to make another list.

I've been known to pull up at a fast-food drive-thru and pay at the first window...then drive right past the second window and not realize I did not have any food until a half-mile down the road.

My point is, there is a site that I ran across that was built with me in mind. This is great stuff, works well too. i should also mention that it works well for pranking your friends.

What I like most about this site is that it's totally idiot-proof as far as data entry is concerned. Whatever format your heart desires, jsut enter it...it knows what you want. it makes things so much quicker. It would be nice if more forms could be designed this way.