Archive

Posts Tagged ‘User Interface Design’

The Wisconsin Governor’s Race: Who’s Winning on the Web

March 8th, 2010

2010 is shaping up to have a number of tight political races.  The Wisconsin Governor’s race will likely be one of them.  A very important component of any political campaign these days is how well the web is utilized.

In this post, I take a look at the websites of each of the three candidates, Scott Walker, Mark Neumann, and Tom Barrett, and evaluate them based on their homepage performance, promoting email signups, usage of video, and available supporter tools and resources.

First, a quick overview of the candidates’ domains:

  • Scott Walker: ScottWalker.org – Has held and used this domain since 1999.  Announced run on April 28, 2009
  • Mark Neumann: MarkForGov.com – Announced run on September 8, 2009 with traffic data for the site showing as starting in July of 2009.
  • Tom BarrettBarrettForWisconsin.com – Launched February 18th, 2010 (very late) – Announced run on November 15, 2009.

Compete.com Data

Barrett clearly has some catching up to do, however the data indicates the race (at least in terms of site unique visitors) is narrowing.

Unique visitors in month of January

  • Walker: 4,052
  • Neumann: 3,651
  • Barrett: 1,251

HOMEPAGE
In this section I take a look at the homepage of each site and outline positives and negatives.

Walker

Positives

  • On entry, an overlay prompts the user to sign up for email updates.  A cookie is placed on your computer and the site remembers you so you aren’t bothered every time you visit the site with the signup form.
  • High up on the page is a list of the ways a supporter can take action and a call to create your own “spot” (more on supporter tools and resources below).
  • The “What’s Your Take?” section highlights recent comments from site visitors.  This is a good way to grab the attention of site visitors.  See the “Negatives” section below for more.

Negatives

  • The prominence and size of the callout for “MyScottSpot.org” does not match its importance.  This is one of, if not the most important call to action of the site.
  • Within the video/presentation area, there are only three frames and each includes a quote and a photo of a citizen with a concern.  Upon clicking these, a page merely reiterates the quote and presents you with another link to “See what Scott says about [topic].”  One would think that there is a video associated with these callouts featuring the citizens concerns.  The actual content is a bit underwhelming.
  • There is a video player integrated within the homepage, however it is too small to expect someone to watch the video in this space.  It would make more sense to incorporate the videos in the main presentation area above.
  • The “What’s Your Take” section only displays three handpicked comments.  It initially appears as if your comment may immediately be submitted to the site, however this is not the case.  It’s understandable why the campaign wouldn’t want comments posted directly, but the site shouldn’t give the impression that it accommodates this action.
  • There’s a “Breaking News” section, however it’s very far down the page in small font.  Easy to miss.

Neumann


Positives

  • The site elevates where you can find the candidate across the major social media properties very high on the page.  They take the most prominent position of all the candidates’ sites.
  • The main presentation area on the homepage is well-designed and does a great job of calling out the key areas of the site and the tools available to supporters.  A much better job is done here than on the Walker site.
  • Next to the presentation area, the site includes a photo of the candidate and a quick summary of why he’s running.  The Barrett site takes a similar approach.  More effective than the hand/card graphic on the Walker site.
  • The “How Can I Help?” section in the right column clearly and succinctly summarizes available features coupled with recognizable icons.
  • Instead of a pseudo comments section, Neumann showcases the latest from his blog.  This is a good approach, however see the Negatives section below.

Negatives

  • The sign-in form for the user account area should be much higher on the page, perhaps as a permanent spot in the header.  Yes, there is a “Login” link up there, but it’s easily missed.
  • Even though “Contribute Now” belongs in a prominent place, it should be preceded by at least a sentence or two enticing the user to take that step.  Clickthrough rates would likely increase.
  • The blog section shows the entirety of each post.  This limits the ability of the user to scan the posts, read a quick summary and then decide which is worth clicking through to.  It’s easy for other posts pushed far lower on the page to be overlooked.
  • Perhaps it was decided to show the full content of each blog post so some content was alongside the overly long series of callouts in the right column (8 in all).  If the blog posts were reduced to a title and summary, more room would be available to present these callouts in a more effective grid form.  Removal of redundancies would also help such as the “Endorse Mark Neumann,” which could be integrated within the “How Can I Help?” section.

Barrett

Positives

  • The main navigation on this site is large, clear, and obvious.  Each button feels like a call to action in itself.  A strong point for a political candidate’s site.
  • An email list is the lifeblood of any candidate, and the Barrett site calls out the signup form most prominently of the three sites.
  • The initial frame of the presentation window includes a welcome video from the candidate.  Unlike the other two sites, you can watch this video right from the homepage in a window large enough for comfortable viewing.
  • The presentation window’s frames are easily navigated and each includes a summary of call to action destination.
  • The blog area lower on the page features each post’s title and summary, with a link to the detail.  This is better for presentation’s sake as well as for tracking of most popular posts.
  • In general, the site is well-organized and easy to scan.  The homepage doesn’t attempt to cram in every conceivable callout.

Negatives

  • Similar to Neumann’s site, the “Contribute” button would be more effective moved underneath the candidate’s photo and intro paragraph giving the user more of a reason to take action.
  • The site does not summarize or callout the ways a supporter can get involved.  This may be because in general the options are limited compared to the other candidates (a rather big negative).  More on this in “Supporter Tools & Features” section below).

EMAIL MARKETING

Each candidate site is relatively similar in that they prominently call out the email signup form.  The Walker site is the most up front about this as mentioned previously, by greeting first-time users with an overlay.

After entering your email address, however, each takes a different approach in terms of gathering more information.

Walker

The Walker site requires confirmation of your email address in order to start receiving updates.  Obviously this was implemented to limit the amount of junk accounts created, but it creates an unnecessary level of friction for the user.  A better practice would allow the user to finalize their subscription and begin receiving messages right away.  The campaign could utilize behavioral targeting to force those who never open emails to validate their address later on.

Neumann

  • Neumann smartly combines the email signup process with the ability to create an account at the same time.  The screen reiterates the email address.  The email address functions as the user name and a password can be selected and confirmed to create an account.
  • It may not be clear to some however, what the, “publicly support and endorse” checkbox is actually for.  What will the campaign do with your information should you check this box?  A simple “What’s this?” which reveals an explanation would be helpful.
  • After submitting the form, you’re directed straight to your account dashboard.  An email is sent to your address asking you to validate your email address; however this doesn’t prevent you from using the system.
  • From the user account, you can specify in-depth the types of emails you want to receive. These range from general campaign updates to specific activity within the community such as friend requests, event and blog postings, and comments.

Barrett

The Barrett site unfortunately doesn’t prompt you to create an account, however it does introduce one feature the others don’t.  A check box at the bottom of the form reads, “Sign me up to receive text messages on my phone.”  Surprisingly, this is the only campaign utilizing mobile notifications.

VIDEO
Some observations regarding the candidates’ use of video:

Walker

  • The tiny homepage video mentioned previously, is definitely a negative, and the main video page isn’t much better.  This page is simply a scrolling list of embedded YouTube players with a .wmv file at the bottom.  There is no way to share to easily share or bookmark individual videos other than the default embed/URL YouTube features.  The entire page can be shared via email but this is only moderately useful.
  • Despite being able to boast the longest-lived website, there are only five videos.

Neumann

  • Best practice dictates publishing videos on your site directly and integrating the content within the user account area.  When not possible, a fully-branded YouTube channel is a good second choice.
  • The Neumann campaign’s YouTube channel integrates the website’s graphics as well as key calls to action such as to contribute or visit other social media profiles.  The channel’s profile information is filled out in detail and includes a “Why I’m Running for Governor” intro.  Well done overall.

Barrett

The Barrett site is sort of a hybrid between the other two in terms of video.   A single page on the site highlights only three videos with many of the same faults as the Walker site.  They do have a YouTube channel (pictured above), however little thought was given to integration of brand or overall look and feel.  The channel lacks an overview statement and calls to action.

SUPPORTER TOOLS & FEATURES
Each site featured tools and resources for supporters; however these differed significantly from site to site.

Walker

The Walker site offers tools both outside and inside the login.  Outside the login there are a series of universally accessible pages on the site under “Get Involved.”

  • Volunteer: A simple signup form with check boxes for ways to help
  • Social Networks: Basic directory of the social media profiles the campaign maintains
  • Attend Events: This is a great feature which offers a detail page for each event and often a link to registration or more details.  Each event can be mailed to yourself or a friend
  • Scott Walker Store:  Not a bad idea to make it easy to buy T-shirts, stickers, signs, and other merchandise to show your support.  This ecommerce store even handles paid event registration

The ability to create a “MyScottSpot.org” also exists and offers a very full-featured experience with innovative tools.

  • Similar to LinkedIn’s “profile completeness” MyScottSpot measures “impact points” and plots where you are on the scale from being a new “Recruit” to becoming an “Operative.”  A page summarizes how their “Personal Impact Engine” is calculated.
  • Your to-do items are summarized on the dashboard with each one displaying its potential score getting you closer to “Operative” status.
  • Recent blog posts are summarized neatly in the right column.  The main site would benefit from this approach as well.
  • Lower on the dashboard are recent comments separated by official comments and user comments.  You can post a comment any time, however there is a 500 character limit.
  • You can form or join a team (by county) or recruit friends or create groups (no groups at time of review).
  • You can RSVP for events or invite others (import contacts from your email system or select friends on Facebook).
  • Repository of all media including documents, images, videos and audio
  • Built-in feedback submission form available on any page

Neumann

The Neumann “Personal Dashboard” area is also very advanced and similar to the offerings of the Walker campaign.  From here a supporter can manage their profile, interact with other supporters, and learn of ways to get involved.  Features include:

  • Invite friends: Includes pre-populated verbiage to make it easy to send.  Contacts can be selected via your own online email account, uploaded file, or manually added.
  • Full profile management and summary including your recent blogs and events, groups you belong to, a summary statement of why you support the candidate and important issues.
  • The ability to create a blog, share your posts, read others’, and search.
  • Events are integrated within the account area along with RSVP capability, social media sharing tools, and even Google Maps integration!
  • Groups:  None exist yet, however the system allows you to create one based on a variety of issues and start inviting your friends. (UPDATE: Some groups do exist however I missed this in the interface.  See comment thread below to read my recommendations for improvement.)
  • Send and receive messages to/from the campaign and other supporters
  • Fundraising: Create your own fundraising page, set financial goals and manage its content.  From there you can choose friends to invite and ask for their support.  Very impressive.
  • Ability to search blog posts, team members and groups separately

Barrett

The Barrett campaign doesn’t offer an actual account, however there are dedicated pages under, “Take Action.”

  • Contribute: A succinct and well-designed form allowing a supporter to quickly donate in pre-set amounts or “other.”
  • A basic volunteer form which actually lacks suggestions for ways to participate.  Not good for those who want to help but need some specific ideas in order to convert.
  • A separate “Join Our Campaign” form which doesn’t explain itself and is too similar to the “Volunteer” form.
  • “Intern With the Campaign”:  A lot of details are provide here in terms of responsibilities.  This much thought should have been given to the “Volunteer” and “Join the Campaign” forms as well.

MY PICKS

Each of the three sites has strengths and weaknesses; some subtle, some glaring.  Of course, there are a number of other criteria one could review the sites by but are beyond the scope of a single blog post.  Here’s my take at scoring the sites based on the criteria discussed above (1-5 with 5 being highest):

YOUR THOUGHTS

As always, comments are encouraged.  In what ways do you think these sites excel or fail?  Please play nice, and keep the discussion focused on digital features and tactics, not politics.

Expert Review, Interactive Industry News & Events, Internet Marketing, Social Media , , , , , , , ,

Super Integration: Four Effective Super Bowl Ad/Digital Experiences

February 11th, 2010

By now, you’ve probably seen all the top-rated ads either during the game itself or afterward online and picked your favorites.  Most of the ads had some sort of mention of their web address, but not all of those sites greeted you with anything special upon arrival.  Here are four that went the extra mile to create experiences to make the most out of their massive Super Bowl ad expenditure.

Boost Mobile - boostmobile.com/shuffle


Right or wrong, Boost brings back the 1985 Bears in an odd (to put it mildly) spot featuring McMahon in a motorized chair getting a spray tan and other antics.  The site is in all Flash for which it loses some points from an analytics perspective, but at least it’s a unique URL which makes it easy to segment their traffic.  There’s also an ever-present banner that calls out Boost’s unlimited mobile plan so users can take the next step toward conversion.

Among the fun features are:

  • An extended version of the ad as well as behind the scenes clips.
  • Downloads and Fun Stuff including wallpapers, ringtones and a Ditka-shaped waffle currently for sale on Ebay!
  • McMahon’s Headband: links to McMahon’s Twitter accounts
  • Mike Singletary Party Police:  During the game and soon after you could rat out your friends for their faux pas during the game (asking what the score is, touching all the wings, etc.).  You pick a message and a recorded Mike Singletary would call their number (after the friend approves this via an email link).  The feature is no longer live, but here’s a screenshot.

You might have the shuffle song stuck in your head along with some weird imagery for a while, but it’s still a fun and engaging site and does a good job of integrating the brand.

Dove Men Care - DoveMenCare.com


While not as entertaining as the Boost Mobile campaign, a vanity URL directs you to a well-designed, targeted site which features the ability to play the ad along side prominent links to product, overview information, and special offers.  The site is a nice blend of Flash and XHTML/CSS to maximize both look and feel yet still provide quick page load times and easier tracking of key metrics such as product pages view, social media sharing, and offer signups.  It’s clear you’re in the right place if you visit the site as a result of seeing the ad, but the Dove smartly doesn’t allow the ad to take up all of the valuable screen real estate.  There’s also a nicely done shower curtain effect and a Drew Brees cameo.

Volkswagen PunchDubVW.com

The automaker’s call to action in the ad is to play PunchDub on VW.com.  Sending  traffic straight to VW.com/PunchDub would have helped them with entry page analysis to segment ad-driven traffic, but that’s a minor negative compared with the overall quality of the site’s execution.  Upon arriving at VW.com, the normal site remains intact, but the presentation/branding area showcases the PunchDub game and a video player to watch the commercial.  VW dealers are getting into the act with “PunchDub Days” special offers and deals that are “So good it hurts.” Ouch. ;)

In a new twist on share with a friend, the game lets you “punch” a friend by selecting a model, choosing a photo, and then picking your attack type and reaction sound.  You then connect with Facebook and send the pain on to one of your friends.  Give it a try, it’s well done, and you might find yourself up on the “Leaderboard” which is a stock ticker-style run down of the most punches, weekly winners, and top vehicles.

For back story you can learn from Sluggy Paterson, the outspoken man who started the whole punching tradition (it was initially the face, not the shoulder!) and even follow him on Twitter.

Overall, VW offers a seamless integration and a great user experience.

HomeAway - HomeAway.com


Everyone remembers the Griswolds and HomeAway brings them back with gusto.  A prominent callout on the homepage leads to an immersive experience that still keeps the site’s main navigation easily accessible.  You could spend half a day watching videos and playing with all the features but here are some of the highlights:

  • Of course, the ad itself, but also a newly-created, 2-part short film (with smartly-placed quick 10-second pre-roll ads from HomeAway), as well as clips from the classic films.
  • Win a Dream Vacation contest by submitting your own hotel vacation stories.  Entries from others are featured on the site which can be rated.
  • Impressively designed Flash video game featuring the Griswold’s Truxter station wagon.

These are just a few examples of good executions tied to the Big Game.  Which ads do you feel were best supported on the web and took customer engagement to the next level, or were just plain fun?

Expert Review, Flash, Interactive Industry News & Events, Internet Marketing, Social Media, User Interface Design, Web Analytics , , , , , ,

Remember the “Why” When Measuring Site Performance: Voice of Customer Methods & Tools

November 29th, 2009

With all that can be learned from clickstream web analytics tools such as Google Analytics, Yahoo! Web Analytics, and Omniture Site Catalyst, it’s important to remember those tools reveal the “what” of your site visitor sessions, but not much about the “why.” Did your visitors see the pages they wanted to see? Were they able to complete their tasks? Is a high page-per-visit rate a result of an engaged visit, or visitors unsuccessfully browsing through pages not finding what they’re looking for? Voice of customer tools are an important component to any website and web analytics initiative and can provide valuable “Aha!” moments.

In this post we’ll take a look at some of the most popular tools and the best ways to utilize them.

SURVEYS

We’re all familiar with surveys, however they come in all shapes and sizes and selecting the right one can be challenging. Some do a great job of collecting and segmenting results, others are annoying and drive your visitors crazy! It’s very important to evaluate not only the technical capabilities of your survey tool, but its user experience as well.

When redesigning a site, ensure survey integration is part of the overall technology set. The benefits of making surveys readily available include:

  • They can be always on and serve as a continuous listening methodology. Surveys don’t always need to be sent out. They can be prominently featured on the site so visitors know they can leave feedback if they’re so inclined.
  • Both qualitative and quantitative data can be collected
  • Feedback can come in real-time so you can evaluate the positive or negative impact of newly-added site features or content
  • A small sample size of responses can still yield valuable insights
  • Surveys have evolved beyond the simple pop up to use cookies and conditional logic as well as integrate with clickstream data

Site-Level Surveys

You’ve likely come across these types of surveys that often fall under the “annoying” category. They are presented either as a popup, or pop under window and ask general questions about your overall experience using the site. Another option is the permission based survey. Upon entering a site, you’re presented with an invitation to take a short survey at the end of your visit.

If you use this approach, be sure to select a vendor that utilizes cookies so that repeat visitors are not invited each time they come to the site. For instance, visitors should only be invited to take the survey once every three months.

iPerceptions offers a great free site-level survey tool called 4Q which asks only the following four crucial questions:

  1. What is the purpose of your visit to our website today?
  2. Were you able to complete your task?
  3. If you were not able to complete your task today, why not?
  4. Based on today’s visit how would you rate your site experience overall?

With answers to these questions, you get a great macro-level view of your site’s performance. Also, you can calculate a valuable metric: Task Completion Rate by Purpose of Visit. There’s almost no clearer indication of whether your site’s doing what it’s supposed to do.

Also, consider prompting users to take the survey from locations other than just the homepage. Be contextual and get segmented data by creating surveys for specific sections of the site. You’ll be more likely to get responses from visitors who have a vested interest in the quality of content and/or features that they use regularly. Used this way, site-level surveys can function closer to (often preferable) page-level surveys.

Other great site-level survey tools include:

Page-Level Surveys

Page-level surveys courteously sit in not-too-obtrusive places waiting for a user to take advantage of them. They often sit at the end of a browser, either on the right or left side or in a bottom corner. They are less likely to annoy visitors and provide the excellent benefit of highly contextual feedback which is the key to actionable data. You’ll hear from your most engaged or upset visitors and will be able to directly attribute their comments to specific elements of your website. This is a great compliment to A/B and Multivariate testing (another form of “what”).

An important thing to remember whether you’re using site-level or page-level surveys is to keep them short! The longer your survey, the less likely your visitors will complete it. Value your users’ time and only ask the questions they need in order to submit feedback.

Great page-level tools include UserVoice and Kampyle.

POLLS

Polls are essentially mini page-level surveys. These are great for quickly taking the temperature of your customers and visitors. They can be easily embedded in a sidebar or even within an email. The best polling tools allow someone to see the results of the poll after taking it. For example, a poll can be displayed in a user account area to solicit votes on which potential features would be most appreciated.

Polling tools:

RATING SYSTEMS

While most commonly featured on ecommerce sites in the form of product ratings, these tools can be used on non-transactional sites as well. A simple YES/NO answer to the question, “Did this [article/FAQ/video] help you?” can quickly let you know if certain content isn’t pulling its weight. More sophisticated sites use this information to dynamically sort content so the best rises to the top of lists.

A nice and inexpensive rating tool is RatingSystem.

Whatever tool or approach you select, make sure it’s appropriate for your site visitors and takes users, content, and context into account. Balance the “what” of your data with the “why” for truly actionable insights.

Let your voice be heard here! What tools, methods, and approaches have brought you success or challenges?

Internet Marketing, Social Media, User Interface Design, Web Analytics, Web Development , , , ,

10 Winning Tips for Your Website Testing & Optimization Program

September 3rd, 2009

Website testing and optimization involves the utilization of software to compare the performance of two or more versions of a page or process to determine which version is the most effective in driving desired user behavior.  Tools such as Google Website Optimizer and more robust options geared toward the sophisticated enterprise such as SiteSpect, are available to automate (as much as possible) the process of conducting A/B or multivariate online tests.

Web analytics expert, Eric T. Peterson of Web Analytics Demystified and website optimization software creator, SiteSpect, recently teamed up to release a white paper entitled, “Successful Web Site Testing Practices.”  This must-read document provides a road map for setting up and leading a web testing team within an organization and leveraging it to yield definitive and dramatic results.  Below is our take on some of the highlights of their recommendations.  However, we strongly recommend you read the document in its entirety and take full advantage of case studies, testimonials, and direct examples including a sample test plan approval form (highly useful)!

Best Practice #1: Form a Great Testing Team
Your testing team must have a mandate for improvement.  This means they need to be charged with improving the website’s condition in a measureable way and be able to clearly demonstrate and communicate results to stakeholders.  It’s crucial to include your organization’s top talent in this team; those folks with the clout and track record to spark enthusiasm and buy-in throughout the company.

Eric T. Peterson labels the project manager and the executive sponsor as the two most important roles within the team.  We couldn’t agree more.  Without a carefully managed process and unwavering support from executive management, objectives can be unclear and the powerful force of entropy can take hold quickly.   Of course, without a key executive at the helm of this initiative, team members will find themselves, as Eric puts it, dead in the water.

The author also values the ability of the project manager to think from the perspective of an end user.  After all, it’s the user interface that’s being optimized, and without a firm grasp of user’s needs and the distinct problems or challenges they face when using the site, tests will be misguided and ineffective.

The efforts, updates, successes and even failures of the testing team should be broadcasted throughout the organization.  Allow for a platform for team members to showcase their results.  Ensure this is not merely one-way communication.  Follow the lessons of social media and allow for comments and suggestions in a structured way.  Demonstrating top-level commitment of both time and critical resources communicates the importance of the initiative.  The changes that incrementally occur to the site as a result of testing won’t be alarming to departments.  They’ll appreciate being informed and involved, and will be far more likely to lend their support.

Best Practice #2: Get Your Stakeholders On Board
Like any website redesign, web analytics, or social media endeavor, without management’s support for your testing initiative, you can essentially guarantee failure.

Be sure to work with management from the very start.  Illustrate to them exactly what you wish to achieve and the results you can expect, communicated in bottom-line financial predictions.  Communicate that a data-driven culture is one that strives to make web improvement decisions based on performance and demonstrated merit rather than assumptions.  As a result, an organization is better able to compete in the marketplace.

Best Practice #3: Write a (Formal) Testing Plan
There needs to be a structure through which requests for testing are considered.  Without this, individuals may try to “skip in line” to push their desired updates through based on their own agenda. They need to understand that a prioritized queue exists and suggested tests must be justified by answering the following questions:

  1. What is being tested?
  2. Why is it being tested?
  3. What are the expectations for the test?
  4. What are the measures of the success for the test?
  5. What are the risks associated with running the test?
  6. What internal resources are required to run the test?
  7. Who is requesting the test?
  8. By when are the results needed?

As mentioned earlier, the white paper authors have included a valuable sample test plan intake form that expands on the above questions.

Best Practice #4: Think about Measurement
Your web testing program should integrate and collaborate closely with your overall web analytics efforts.  This takes extra consideration and possibly technical expertise to ensure data available through analytics tools (such as audience segments) can be applied to tests.  Metrics and KPIs that have been established within a web analytics program should dictate to a large extent which tests should be undertaken.  Make sure one hand is talking to the other.

Also consider how your tests impact more complex measurements such as “return visitation rate” and “lifetime customer value” beyond just clickthrough metrics.

Best Practice #5: Clearly Define “Success” and “Failure”
Success means different things to different stakeholders.  It can range from obvious financial gains, to user engagement, to fewer support calls.  An important point that the author points out is that even a “failed” test yields some measure of success.  That is, you now know more about what doesn’t work thereby narrowing the field of possible creative or interface options getting you closer to the winner.  Don’t view missing the objective as a failure, but rather a learning experience which has actually moved the process forward.  The only real failure is a test that is not properly designed, carefully executed, done within a vacuum, or without executive buy-in.

Best Practice #6: Test Your Test
With this best practice, the author reminds us that while testing is absolutely worthwhile and a potential boon to any company, it’s also “hard.”

Be aware that expectations must be set.  This isn’t going to solve all the issues of the website in a month, quarter, or even year.  This is a long-term shift in the thinking of the company to become data-driven.  Certain technical implementations of tests may be trickier than others and will involve the IT department.  Legacy systems can affect the types of tests that can be conducted.  SEO initiatives can be impacted.  Other departments may push back due to perceived technical or business risks.

Be aware of these challenges, but don’t let them discourage you.  Things of great value don’t come easily, yet are worth the effort.  Set expectations to mitigate disillusionment.

Also, make sure testing periods are long enough to yield a statistically significant sample size.  Isolating factors (individual changes) sufficiently so one can determine which is responsible for better results is crucial as well.

Best Practice #7: Clarify Your Testing Timeline
Testers often forget to take day parts and weekends into account.  To ensure you’re not giving too much weight to lunchtime, early morning, late night, or weekend visitors, allow for enough time to collect a representative sample.  The author recommends a 7+1 strategy so you test over an entire week, but also add one day at the beginning of the test before you actively track results.  This allows the test versions to take hold online across the sample and for any last-minute changes.

Those with more time available can opt for a two week test, in this case a 14+1 timeline.   Good things come to those who wait.

Best Practice #8: Communicate Your Test Results with Actionable Analysis
Some great points here.  As always, it’s best to customize one’s report based on the audience.  When communicating the results to the stakeholders who originally requested the test, go into significant detail.  Reiterate the purpose of the test, the timeline, resources used and extensive information on the results.  If external events occurred during the test such as a major news mention or campaign, illustrate how the results were affected.

The rest of the organization should receive a broad overview.  A big picture, clear summary of the results and the impact on the website and company is sufficient to foster a sense of involvement and ongoing support.  Whenever possible, communicate the financial impact of the test.  As Mr. Peterson puts it, a phrase like, “and we expect this change to result in an estimated $20,000,000 in incremental revenue every year” is hard to ignore.

Also, check out the white paper to see a ready-to-use email example of how to broadcast test results to the organization.

In addition, in-person presentations are always best.  Follow these meetings up with postings to your communication platform be it a blog, wiki, online project management tool, or even Google Wave.  Allow enthusiasm for the results to go viral.

Above all, include actionable recommendations along with your results.  Clearly state what next action steps should be taken to capitalize on the success of the test.  Use this opportunity to suggest additional tests to keep the optimization ball rolling.

Best Practice #9: Test Different Audience Segments
The most revealing tests will be those that utilize targeted audience segmentation.  Knowing that a certain change increased conversions by 5% for all visitors is somewhat helpful, but knowing that same change resulted in a 20% increase for a key target audience is far more valuable.  Next action steps are more obvious in light of this information and those steps are more likely to have greater impact.

Directly reference audience segments when presenting test results to stakeholders to better grab their attention.

Best Practice #10: Mine for Deeper Opportunities
Once the testing program is up and running, and the team has a few wins under its belt, in-depth data analysis and statistical modeling is the next level to strive for.  Companies that are already utilizing robust applications such as SAS, or SPSS have an advantage, but this is not an absolute requirement.

Analysis and comparison of offline data or qualitative voice-of-customer data alongside test results can yield insights that are not immediately obvious through the testing or web analytics tools alone.  The author points out that a significant competitive advantage will be had by those companies who truly leverage their online data.

Your Experience?
We’d love to hear your thoughts on web testing and optimization.  Have you recently formed a team or are you considering it?  What methods and/or tools have brought you success?  What real world challenges has your organization overcome (or is still struggling with)?

Interactive Industry News & Events, Internet Marketing, User Interface Design, Web Analytics, Web Project Management, Web Strategy Consulting , , , ,

Case Study: Briggs & Stratton

July 15th, 2009

THE CHALLENGE
Assist a top-notch interactive agency with redefining the information architecture and user experience of a major global corporation’s flagship website, integrating the content and functions of multiple external sites, and designing over 400 screens within an aggressive timeframe.

THE SOLUTIONS
Briggs & Stratton is the world’s largest producer of air-cooled gasoline engines for outdoor power equipment. With clients worldwide, the Milwaukee-based company has been designing, manufacturing, marketing, and servicing the best-known brand of small engines since 1908. With such a large and diverse client and customer base, Briggs & Stratton’s primary website has many audiences performing a myriad of tasks. From searches for maintenance and repair resources, to direct purchase of products online, thousands of visitors each month use the website seeking education and support for the products their families depend on.

To better serve their customers, connect with existing communities, and introduce new revenue sources, a full redesign was planned.
Interactive experts, Finn Digital of Milwaukee were tasked with the crucial first phase of the overhaul and tapped Molstad Consulting to support internal efforts related to web analytics, information architecture, and prototype design.

Web Analytics
The first step involved a web analytics and conversion assessment of the primary site and 2 key sister sites. Screens and sections were evaluated for their ability to move users to the next stage in the conversion process, track crucial data, and provide a solid overall customer experience. Findings, recommendations, and annotated screenshots were documented and presented to the end client. A detailed report was also submitted with a step-by-step process for implementing a comprehensive web analytics methodology with topics ranging from URLs and meta tag structure to email marketing and social media best practices.

Taxonomy & Sitemaps
Molstad Consulting utilized card sorting methods and led discovery sessions with Finn Digital staff members to define the taxonomy and navigation for the primary website. This process involved the integration of content and functions from a number of external partner sites. Suggestions on labeling, order, syntax, and context were offered throughout. Quality assurance was also provided during the sitemap documentation phase along with assistance with client meeting preparation.

Prototypes & Wireframes
Molstad Consulting acted as a consultative “third eye” ensuring interfaces reflected decisions and strategies defined in the taxonomy phase and showcased optimal usability and intuitive conversion paths. Project management of selected production deliverables was also provided, including updates to an internal online collaboration tool, processing and prioritization of task lists, channeling of communication, and preparation assistance for presentations to the development team and end client.

Design Justification
In advance of final delivery of all sitemaps and prototypes, Molstad Consulting drafted an extensive report tying each site feature and content offering to previously established business goals, and key user tasks illustrating how they are achieved and fulfilled. This report also served as justification for a variety of new, community-building features introduced during the prototyping process and demonstrated the team’s clear understanding of Briggs & Stratton’s current situation and future opportunities.

THE RESPONSE
“Finn Digital has enjoyed a long and mutually beneficial relationship with Molstad Consulting. The strength of our relationship allowed Molstad Consulting to quickly get up to speed for providing carefully considered design specifications within an aggressively paced project schedule. Molstad was required to lead selected analysis and design components and participate as team member in others, and did so flexibly, efficiently and effectively. Most importantly, Molstad Consulting provided clear, concise project communications and relevant review comments that helped the overall project team deliver on challenging project milestones. We select our external strategic partners carefully and will continue to work with Molstad Consulting as a trusted member of our “extended team” for analytics and usability architecture – Molstad meets all of our high standards for success!”
- Bill Finn, Principal, Finn Digital

“Brian has the right mix of expertise and experience to integrate seamlessly with our team. His web analysis and recommendations for improvement are spot on and he is always pleasant, prompt and extremely professional. I highly recommend his work.”
- Jill Schmidt (Thompson), Interactive Strategist, Finn Digital

Molstad Consulting Case Studies , , , , , , ,

Four Reasons Google Wave Will Make You Rethink Online Communication

June 8th, 2009

Microsoft just can’t seem to win these days.  Their huge roll out for 2009 complete with expensive television ads is an effort (Bing) designed to compete with Google’s oldest product.  Shortly thereafter, Google responds with a tool that may revolutionize business e-communication as we know it.

Google Wave is living up to its name by causing more than merely ripples in the blogosphere.  Unveiled at the 2009 Google I/O Developer Conference, the hour and 20 minute YouTube video has received over 2 million views and more than 4,400 ratings (overall five stars).  While not scheduled for release until later this year, Google presented the tool to a highly enthusiastic crowd of select developers and subsequently provided them with accounts to start playing with.  A number of APIs were developed, and Google hopes coders will take full advantage of them, creating a myriad of new tools and apps designed to utilize the power of Google Wave.  Bolstered by this supporting framework of related applications, Google will enjoy firm footing when they launch the tool worldwide.

Below are some of Google Wave’s key features and some insights on how they’ll impact the way you communicate online.

A Permanent Home for a Discussion
When your discussion “goes wave”, from that point forward, you’ll be able to instantly add participants and reference it from any other wave or point online.  Similar to an email thread, you’ll be able to see the history of a discussion, however Google Wave does so much more to group the history as well as notify participants of any updates.  Being Google, the built-in search function received a lot of attention.  As such, searching for waves is powerful, instantly updating the results as you type a query.  You don’t have to rely very heavily on your organization skills, and gone are the tedious days of sorting messages into proper folders.

Streamlined and Realtime Collaboration
Many of Google Wave’s features are forehead-slap-inducing; the kind where you’ll wonder why humanity has trudged along without them.

  • Instant sharing and linking: You can add new participants to a wave simply by dragging them from the contact list into the wave itself.  Similarly, you can link to any other wave by dragging that wave from the list into the current wave.  It automatically creates a neat link at a point of your choosing formed with the title of the wave you’re linking to. Photos?  You guessed it; just drag and drop from your desktop.
  • Inline comments: You’ve seen inline comments in Microsoft Outlook or some other email client.  These go further by neatly containing the statement along with the user’s avatar and a timestamp.  No more alternating colors.  It’s obvious who said what and when.
  • Playback:  Big wow-factor here.  A person new to the wave can get caught up by viewing a post-by-post playback at their own speed.  That person can add comments to any point of the discussion contextually.
  • Editing: Here’s a great way to disseminate meeting notes.  Post your notes as a wave.  Any person can edit the notes and their notations will be clearly identified.  If you have viewed the original message before, you’ll see any changes the next time you view the message. If you see a message for the first time that has multiple edits, you will be able to see who contributed to the edits, but won’t see the markups. To see those, use the playback feature. You’ll know who changed what and can select any version you want as the final and then send it on as the official version as a new wave.
  • Instant messaging: This feature elicited some major applause at the conference.  You can see comments being posted to a wave as they’re being typed; backspaces and all.  This is an optional feature, but when enabled, eliminates having to stare at a “typing” status while the other party keys in their complete comment.  In fact, two people can update a wave at the same time and both participants will see each other’s updates as they’re being typed.
  • Integration with blogging: Waves can be instantly added to a blog and future comments are synced with the wave.  Reach multiple audiences at once.  Even photo captions are synced.

Enhanced Communication Power Through Wave Extensions
It’s incredibly easy to embed and share a wide variety of online media within your waves:

  • “Searchy” lets you do a quick Google search and instantly add results to your wave including destination links, images, videos, even maps.
  • Twitter: Can install a “Twave” which is a wave of tweets. Posts within this portion of a wave will automatically post to Twitter.
  • “Buggy” integrates a full featured bug tracking program with easy options to change assignees or comment on specific bugs using waves.
  • Automatic language translation:  During the demo we saw a conversation between a French speaker and an English speaker being translated in real time. Wow.
  • Forms and polls are native to waves and can be directly embedded. Add whatever fields you want and solicit information from your wave participants.
  • “Linky” automatically creates links (google.com).  No need for “www” or “http://”

Mobile-ready on Day One
The team demonstrated interfaces for both the Android and iPhone operating systems.  You’ll be able to access your waves from anywhere without waiting for a separate app to be developed.

Many companies are accustomed to using some combination of email and instant messaging as part of their normal project communication.  The more savvy also utilize online collaboration/project management tools.  One thing’s for sure, the introduction of Google Wave will make them reevaluate their methods.  A strong reason they’ll be willing to do this is of course, the standard Google price of free.  For long discussions across multiple people, or even mini projects, a single wave could likely handle all related communication.  A big missing element, however, is the ability to manage tasks and assignments, but a third party app (if not an enhancement by Google) will likely surface relatively soon following launch.

In general, email’s dominance in corporate communications will quickly wane and a number of us won’t be too sad to see that.  Google Wave demonstrates that there truly is a better way to collaborate.  Get ready to rethink.

Interactive Industry News & Events, Social Media, User Interface Design, Web Project Management , , ,

Axure RP Pro - Web Prototypes Evolved

April 18th, 2009

Information architects (IAs) and interaction designers have many tools at their disposal, but pull one of them out of the toolbox most often.  Microsoft Visio has been the been the IA’s nail gun since the profession’s early days, however this tool was never designed specifically for interaction design and instead is an all-purpose diagraming tool.

Visio has served us well for many years, however, we here at Molstad Consulting have recently made the switch to Axure RP Pro, a tool that is rapidly gaining momentum within the user experience design community.

The first and most notable benefit is that Axure was built by user experience designers for user experience designers.  Elements are measured in pixels allowing an IA to know exactly how much space is available resulting in wireframes a developer can really use.  Lack of pixel measurement was always a severe shortcoming in Visio, so we’re particularly pleased about this feature.  Also, default spacing can be set to a certain number of pixels (10 by default) so shapes can be dragged and snapped to these ruler marks, giving everything natural spacing which can be exactly replicated when the site goes to development.

Lacking in the early days of Axure, widget libraries are now readily available and extensive.  Frequently used web modules such as calender pickers, carousel photo galleries, form elements, buttons and tabs, even iPhone user interface elements, can be downloaded for free and easily dragged into your prototypes.

Another game-changer is the ability to export prototypes in HTML format.  These can then be zipped up and either emailed or uploaded for review.  Depending on the prototype’s level of detail, the result can be a fully navigable website complete with drop down menus, active form fields, and even dynamic error messages (through the use of dynamic panels).  These exports can be used for stakeholder review or even for in-depth user testing exercises.  You are also not limited by height so prototypes can naturally scroll to reveal all included elements and content just like a web page. 
Try one out yourself
.

Masters can be created for repeating elements such as global navigations, footer navigations or any other module that’s used in a variety of places on the website.  Through creative use of backgrounds in Visio, this was achievable, but the position of the module would be have to be the same throughout the prototypes.  In Axure, you can place these modules anywhere you want, yet still make global updates to the module in one place.

Often times, prototypes need to be annotated to explain operations behind the scenes or to give more details for development teams.  Axure has built this right into the tool.  Simply click an element and a form appears allowing for entries such as specifications, status, benefit, risk, assigned to, and more.  Once exported, a small graphic appears over the element.  When that is clicked, a popup window opens revealing the annotations.

In the interests of building a user community, a lively discussion forum demonstrates the breadth of the user base and keeps everyone connected, sharing ideas.

It’s great to see tools specifically designed for web prototyping reaching maturity.  Consider this tool for your in-house user experience staff.  Even if you don’t have information architects or interaction designers on staff, those in charge of communicating requirements to your external agency can use Axure to relate ideas and concepts quickly and cleanly.  With every one literally on the same web page, the development phase will sail along.

Information Architecture, User Interface Design, Web Development , , , , ,

Case Study: Godfrey & Kahn

February 21st, 2009

The Challenge
Lead the effort to overhaul the web presence for a major Milwaukee law firm with nearly 200 attorneys. Bring a fresh approach to the firms content and the site’s information architecture, and ensure the proper migration of thousands of publications, press releases and news features as well as extensive practice area content and attorney biographical information.

The Solutions
Godfrey and Kahn has been providing expert law services to major businesses and industries for over 50 years with offices in Milwaukee, Madison, Appleton, Green Bay and Waukesha, Wis.; Washington, DC; and Shanghai, PRC. Over that time, their ranks have swelled along with their web content.

Molstad Consulting was brought in by regular partner, CI Design to design and define all information architectures and content requirements and act as liaison to Godfrey & Kahn and the firm’s external development resource. Initial meetings with Godfrey & Kahn focused on key audiences and user tasks as well as project logistics to ensure the varied and occasionally daunting committee structure within the firm didn’t slow the process down. An information architecture was designed to streamline access to key content as well as focus on the benefits of a career with the firm.

From there, interface specifications and wireframes served to bridge the gap between the new information architecture and legacy systems and content. Functions to be re-thought and adapted included a full content management system, robust attorney search, overall site search, practice area content database, career opportunity system, and an extensive news and publications resource area. Molstad Consulting worked closely with the development team mapping new pages and sections to key functions and enhancing overall usability.

The Careers section of the site features a unique brand designed to demonstrate a focus on the needs of this crucial audience. A custom Flash animation showcasing the profiles of successful attorneys and staff members was combined with a new web video and social media delivery system. All this was coordinated around a CI Design photo shoot for nearly 200 attorneys across multiple offices as well as multiple video production sessions.

Once key screen templates were confirmed, all content to be created, collected, and repurposed was outlined and Molstad Consulting led weekly status review meetings tracking each element and resolving issues through to launch.

Next Steps
Godfrey & Kahn enjoyed an enthusiastic response to the new site both internally and from its clients. Molstad Consulting and CI Design continue to collaborate to increase and enhance Godfrey & Kahn’s overall business intelligence and marketing ROI via a targeted web analytics methodology.

Flash, Information Architecture, Molstad Consulting Case Studies, User Interface Design, Web Development, Web Graphic Design, Web Project Management, Web Strategy Consulting , , , ,

Case Study: Discovery World

February 21st, 2009

The Challenge
Guide and lead the definition, launch, and expansion of an extraordinary organization’s new web presence.

The Solutions
Discovery World at Pier Wisconsin provides immersive, experiential learning opportunites and entertainment for many thousands of visitors each year. Offering such attractions as a fresh and saltwater aquarium, the S/V Denis Sullivan, and elaborate exhibits dedicated to science, technology, water stewardship, and overall education, Discovery World is a truly unique destination with something for everyone.

Molstad Consulting worked closely with Discovery World senior management, art directors, developers, and content experts to define a new information architecture and overall website framework that would serve to increase public understanding and drive visitor action in a measurable and scalable way. The massive effort was broken into multiple phases with a focus on quick wins and revenue-driving features. Prototypes of interfaces and key templates were created to serve as context for decisions and blueprints for developers.

The site features detailed content supported by targeted imagery, Flash animations and video specifically tailored for each of the primary audiences. In addition, the development of a state-of-the-art ecommerce/order management system was managed utilizing agile methodology resulting in the ability for users to purchase tickets and buy/renew memberships online. The vast and diverse selection of Discovery World programs and published and managed via a customized, integrated blogging system. In addition to streamlined content management for the staff, site visitors can also take advantage of social media feature, search, tagging and bookmarking of content.

A web analytics methodology has been established which has measurably improved business intelligence and increased conversions. Business goals have been mapped to key audiences, and in turn, to specific metrics. Molstad Consulting regularly monitors site performance, summarizes insights gained from optimized analytics tools, and assists senior staff in prioritizing web initiatives. Email marketing campaigns are also regularly reviewed ensuring their alignment with the website and organizational marketing goals.

Discovery World now enjoys greater visibility than ever before into their site usage and marketing performance due to targeted web analytics and modernized site structure/coding standards.

All communication, tasks, and schedules were (and continue to be) orchestrated via Basecamp and Molstad Consulting’s proprietary methods for online/remote collaboration.

The Results
Discovery World now has a web presence that provides them the page real estate, scalable information architecture, design cohesion, and marketing intelligence befitting a highly visible and ever-evolving organization. The site serves as the foundation of all internet marketing efforts. Insights gained from web analytics has removed the guesswork from web initiative prioritization and keeps web team members focused on key audiences and visitor tasks.

Ecommerce, Flash, Information Architecture, Molstad Consulting Case Studies, User Interface Design, Web Analytics, Web Project Management, Web Strategy Consulting , , , , , , ,

Case Study: Klement’s Sausage

February 21st, 2009

The Challenge
Establish a new website architecture, showcase product lines more attractively, and bring the Klement’s Sausage online presence up to speed with their offline marketing campaigns.

The Solutions
Klement’s Sausage is well known nationally and in the Milwaukee area especially for their delicious sausage products and their beloved Racing Sausages that entertain crowds at every Milwaukee Brewers home game.

Molstad Consulting worked closely with the Klement’s IT and Marketing departments, advising on content strategy and presentation as well as leading discussions on graphic design direction. The Molstad Consulting team analyzed the company’s existing and upcoming marketing materials and designed a look and feel that combines the “taste and fun” as well as the tradition of excellence Klement’s is famous for. Flash animations were created to showcase products and their popular “Patio Daddio” television commercials.

The Famous Klement’s Racing Sausages, were featured on the site complete with their history, bios, downloadable wallpapers and a custom-designed Flash video game. The game allows site visitors to race as their favorite sausage through the streets of Milwaukee to the Brewers opening day game.

The Response
I’m extremely pleased with the way our web site project went from concept to completion. The Molstad team took the time to listen in order to make sure we got what we wanted. Their great service, knowledge and art talent is incomparable. They have assisted in driving our brand image by offering exceptional ideas and a unique design that has also translated into sales. I’ll definitely be calling Molstad Consulting the next time I’m in need of the services they provide.”
- Jim Westerman, Marketing Director for Klement’s Sausage

Ecommerce, Flash, Information Architecture, Molstad Consulting Case Studies, User Interface Design, Web Development, Web Graphic Design, Web Project Management, Web Strategy Consulting , , , , , , ,