Prototypes & Designs


Now, it’s time to get creative!  You have a list of Web Parts that have been requested for your Portal Home Page.   You also have a list of Web Parts that have been requested for the majority of your company’s departments.   If you’ve read through them, and I’m sure you have done so several times by now, then you would notice one, major challenge:   There are WAY too many web parts requested to include on a single page!  So the question is…

How the heck are we going to fit all of this on the home page? Ahhh!  That’s the fun part, so let’s get to it!  

The first thing we do is pick a page.   I recommend starting with the Home Page.   Go through the entire list of your Home Page content requests.   You probably have them on index cards from the Card Sorting exercises in the previous posts, so you can use those.  If you don’t have those, a simple whiteboard or pen/paper drawing will suffice.   What we’re going to engage in is another exercise to create “Wireframes”.

Why Wireframes?

Wireframes are simple layout drawings of, in this case, your Portal Home Page.   You can find a sample wireframe diagram that I created, for illustrative purposes, on my Downloads Page, under Outline and Architecture (#4).   The benefit of a wireframe is that you can change it repeatedly, until you find a layout that is acceptable to you and your end users.

Typically, you’ll begin a wireframe by creating several, boxed layout styles.  The sample I provided above is one example.  You may want to consider multiple layout options.   In that case, just create the layout of squares in the shapes and styles you desire.   When completed, you may have 3-4 different layout choices to provide your users.  This is great.  Just remember, the more choices you give them, the more conflict you will encounter.    My suggestion:  Research some best-practice portal layouts, find one or two options that you think are optimal, and move forward with your prototype.   You could also ask your users about layouts and see what they think.

Now that you have a layout, figure out how many of your selected web parts will fit.   In my example, there is potentially room for 12 web parts, plus some elements that may be available via navigation components.   I also chose a drop-down as one of my components, which can hold links to several other sources of content that were requested.    In my example, I may have chosen the Top 20 Web Part Requests to include in my home page layout.   Choose yours wisely, as you will commit these to your end users.

DUDE TIP: Select as many of your users’ requested contents parts as possible, without ruining the design and functionality of your site.   You may choose the top 10, top 15, or top 20.  However many it is that you choose, be wise in your selection.  Your users will notice the functionality you selected immediately and you’ll have them HOOKED before you launch!

Making Your Portal Unique:

Nobody wants their portal to look like an “out of the box” solution.   Instead, we all want something unique – something that reflects who we are and what we’re about.    Keep this in mind during the wireframe phase, as this is the easiest time to toy with design.   When you come to a design that you think you like, mock it up (using Photoshop, Paint, or something like that).  Put a pretty visual concept to it and send it out to your users who took the survey.  Show them your proposed fruits of their labors.   Gather feedback (you may need to go through several iterations of this).

Getting the Design Right:

Here’s a simple rule:
If your design is a hit, meaning, it’s easy to use, productive, and well-received by the users, then you are a HERO to your users.   Make sure you broadcast from the mountain tops that the USERS were the ones who did this (even though you will still get all of the credit).  You’re “teaming up” with the users at this point and they are making you their champion, for, FINALLY – they have been heard!

However!  If you don’t take the users’ feedback to heart, don’t share your wireframes and design layouts with the users and get their feedback, you will pay dearly and suffer the wrath of your people.  Your chosen design has to look good AND be easy to use.  If the users can’t use it, it’s not their fault.

While this sounds potentially daunting, it’s pretty common that the IT group overlooks what the users want/need, in lieu of what the IT Team thinks is right for the users.   Here’s a great article that makes my point.  (The Myth of the stupid user, by Gerry Gaffney)

If you miss the mark, the users will be the ones screaming from the mountain top, and you will not want to hear what they have to say.   So, avoid that.   Do the right thing.   Even if you have to “go back to the drawing board”, literally, do it.   It’ll be worth it in the end.   Don’t get married to your concept without the approval from your company “in-laws”.

Rinse and Repeat (again):

When the users approve of your layout and design, keep the graphical image you created and repeat ALL of this for the Department Pages.    When it comes to the Department Pages, remember this: Consistent and Predictable is a GOOD thing!!

People want to know where things are, whether they are on their department site, or someone else’s.  Keeping the design consistent and predictable makes for ease of use, and rapid “TTP”, or Time to Productivity.

Leave a Reply