Hi there everyone – it’s been a while since I last posted. We’ve been head’s down working on a Digital Marketing Maturity Model (a.k.a. DM3) that we unveiled during eMetrics in San Jose.  We released a draft of the model and are currently in the process of collaborating with industry influencers and practitioners, gathering feedback on the model and collecting real-world sample maturity profiles from organizations across multiple industries.  Details of the model and the quick maturity assessment can be found by clicking here.

We have already met or exchanged with folks from Gartner, Zaaz, and other industry influencers (inlcuding Sean Power, Stephane Hamel and Jacques Warren – THANKS GENTLEMEN!) to talk about the model and how we might be able to collaborate moving forward. We’ve also started initial discussions with Jim Sterne on how we can turn this over to the WAA and have it truly become an industry-wide standard. I am looking to continuing the dialog with the community, provide interested folks with the background and thought that went into the model and to solicit feedback from experienced analysts and marketers.

In each of a series of blog entries I will discuss a different aspect of the model and provide readers with details on the progress being made.  So be sure to come back often and comment. In today’s entry I’m going to provide an overview of the model and discuss some of the history and thought that went into it.  I’ll also talk briefly about our near-term plans for the model and how we’ll integrate public feedback into it.

As I mentioned in a prior post about our automated, interactive digital marketing scorecards, Brandon and I started the Digital Marketing Optimization practice here at Webtrends at the end of last year.  Since joining we have brought several new products/services to bear, the aforementioned Digital Marketing Scorecard, a services framework that we now use to guide all of our client engagements, an easy migration process that converts a customer’s historical data (when switching from a competitive solution) over to Webtrends so *no* information is lost, and now the DM3.  We have other offerings in the works that I’m just as excited about – but will write about those in other post.

During all this time we’ve had the opportunity to work in multiple roles across multiple verticals with some of the largest brands in the country, including Microsoft, Coke, Expedia, Orbitz, Toshiba, Disney, Dell, and NBC.  Throughout the experiences we’ve had with these clients from different perspectives we were able to develop the services framework, which ultimately led us to the maturity model.

Now that you know what got us here I’d like to provide an overview of the model itself.  We identified the need for a maturity model when we realized that we were pretty much informally assessing all of our client’s maturity at the outset of all the strategy projects we have done.  In order to establish successful digital strategies for our clients we need a way to understand their current competencies and opportunities for improvement.  As said by someone much more intelligent than myself, “the best map in the world is useless unless you know where you’re starting from.”  The same holds true when setting strategies and developing road maps to meet those strategies.

Once we understood the need for a maturity model we started doing research to see if there was already a proposed model that was gaining traction that would work for our needs.  We found a few proposed models but couldn’t find examples of how they were actually applied.  In addition, the models we found and researched scored an organization on a continuum where we felt what was needed was to score organizations across 6 distinct maturity pillars in order to create what we call a Maturity Profile.

Using our experience and research we landed on the six maturity pillars currently in the model with an assessment to understand ranking within each of the pillars.  We then visualize the results on a radar diagram which we did for several reasons (with an example output below):

1. The actual shape and area of the radar diagram becomes an organization’s maturity profile
2. These can then be overlaid on top of industry averages, competition, or ideal-state profiles
3. It allows for a very quick understanding of maturity deltas between a client’s organization and others

Example Maturity Profile

I’ll wrap up today’s post by briefly speaking to our near-term plans for the model and our next steps.  It is important to note that everything we do with this model is public domain – we strongly feel that the only way to even have a chance at industry adoption that it couldn’t be something that we dictate and hold close.  Also, we purposefully built this model to be completely agnostic of any tool or specific discipline within digital marketing in hopes that it could be adopted more broadly.  That said, we released this first version for a few reasons:

1. To solicit feedback from industry influencers and practitioners
2. To have organizations fill out the quick online maturity assessment in order to start building a database of maturity profiles across multiple verticals – this data will be used in aggregate to allow users to compare their current level of maturity against that of others in their industry

Our next steps will be to collect feedback and tweak the model as dictated by those who participate with us.  We will continue to actively search for individuals who would like to participate so please reach out to me directly if you’d like to be included.

In my next post I’ll go into detail about how we came up with the pillars in the model as well as how we use the assessment tool to develop a maturity profile. In the meantime please comment below or reach out to me at dm3@webtrends.com Thanks!

One of the challenges Webtrends staff and customers share is navigating through reams of information, both current and legacy. With many hundreds of book pages and help topics, sometimes searching for a simple concept or a feature explanation can turn into a crazy scavenger hunt through old printed manuals, saved PDFs, online customer center, and online help.

Which information has the highest value, and what terms, groupings, and search methods make the most sense for different kinds of users? What’s the best way to ensure information is accessible, relevant, and easy to explore? Even Webtrends insiders and industry experts don’t always agree on the answers to these questions. In the end, the real test of documentation usability is whether our customers can find the information they need to generate and understand analytics measurements.

Our Information Development team, formerly Documentation, has been more aggressively collecting information about how the information we publish gets used, understood, reused, transmitted….even crumpled up and discarded.  The investigation methods (which Julia talked about in a prior post) we’ve been using include card sorting (to help create a mental model of the terms and categories customers use to organize information), improved documentation tagging for better usage stats, and direct customer input.

At our Engage event in April we ran through some card sorting alongside our paper prototyping group. A few of you readers may have had the chance to attend the group or  fill out our survey at event. If you haven’t, please take a few minutes to tell us about how you use Webtrends information.

If you are interested in participating in usability testing at our location, online or just have a question - you can contact us at documentation@webtrends.com or comment here. We’re always eager to hear from you.

In the previous two articles*, I introduced the newly redesigned Webtrends custom tracking-code creation tool called Tag Builder and then provided some background into the user centered design methodology, Paper Prototyping, used to construct the flow of the application. In this post, I will highlight the most significant design improvements that defined the new look of Tag Builder and influence products to come.

1. Palette

The most noticeable change with the new Tag Builder is the monochromatic color palette. It is sparse, simple, and gets right to the point. As we push the design of Webtrends applications forward, we are intent on establishing a professional, concise, and highly engineered look and feel. Think German automobile. Think professional photography equipment. Webtrends products are professional products. The palette of charcoal, magnesium, and white dominate the design while hints of litho blue and stop sign red reveal themselves on hover states and error messaging. Color is still there, just reserved for when it is effective.

Color palettes (before and after)

In an addition to Tag Builder, you may have also noticed that the brand identity for Webtrends received a facelift. The webtrends.com website reflects this and is being rolled out across all of our marketing materials. The new wordmark is modern. The new palette, is complimentary to Tag Builder. Both are heavily monochromatic but the modern blue and warm grays have a much stronger presence with the outbound marketing while the product reserves its use of color for important indicators and highlights. This sophistication in coordination is like the outfits of a well dressed Hollywood couple attending the Oscars. Tag Builder was released before the branding update was revealed and so you will see future refinements to product design to reflect alignment.

2. Grid

The grid has received a lot of attention in the web design community in the past couple of years (thanks to pioneers like Khoi Vinh at the New York Times). The grid has been used for decades to organize typographical information in print so that blocks of type define the geometry and patterns of the design. This allows for the elimination of ornamental design clutter and reduces design to its essential elements. The new Tag Builder uses a 960 based grid and this allowed us to simplify the design dramatically. It may seem a bit open at first with excess whitespace, but as soon as you interact with Tag Builder, you’ll notice that the whitespace gives way to hover help text that no longer requires a click just to get the basic concept of each fieldset.

Tag Builder and the grid

3. Language

Because the previous Tag Builder required this additional click to access any help, the field labels ended up being sentence like in places and overly descriptive. This created a wordy design that left the user with a lack of confidence and uncertainty as it required more comprehension even for basic fields. The new labels are short and conversational in tone. This is easier to comprehend and it leads to a more confident user. For instance, a certain label read, “Single first-party cookie (use one first-party cookie across the primary and each subdomain: Cookie domain attribute.” In the new interface it now reads, “The site domain you want to track,” followed by the entry field. When the user hovers over the field, hover help appears and provides the user with an opportunity to confirm their assumptions as well as providing a link if the user wishes to explore the topic in depth. In addition to improving the readability of the labels and hover help, we also improved the error messaging for improperly filled out fields. The language short, concise, and straight to the point.

4. Indicator Dots

One of the most troublesome design challenges we faced with the new Tag Builder was how to clearly communicate completed fields when only one tab was visible at a time. We solved this challenge with a unique solution that we named, “indicator dots.” We noticed in the prototyping tests that users would click through the tabs a few times just as a driver in a car trying to make a left hand turn onto a busy street swings their head back and forth. With the indicator dots, now they at least knew which tabs that had completed some information in. This challenge grew as we realized that there was no clear way to message the user if they had improperly filled out a field on one tab when clicking the “Build Tag” button. So, we also leveraged the indicator dots to turn red when there is a field error on a tab. In the end, the indicator dots communicate to the user three things; how many choices are there on a tab, how many were filled out, and which fields contain errors when submitting the form.

Indicator dots

5. Confirmation

A related challenge to the indicator dots was the lack of any confirmation before the user clicked the “Build Tag” submit button. The previous version of Tag Builder directly triggered the “download” function of the browser when this was clicked. This worked ok in Internet Explorer but in Firefox and Safari, the download function didn’t allow the user to name the file. We realized we needed a confirmation page that condensed the information related to that particular tag setup on one screen paired with the option to name the zip package.

Confirmation page

Summary

We made many additional improvements with Tag Builder and I hope if you are a user, you have noticed an improved workflow. In the next article, I’ll walk through the changes we made regarding the web standards architecture.

I’d love to hear your feedback (thoughts, comments, questions, or critiques) on this new design direction.

*When I set out to write this five part series, I didn’t intend for it to be as drawn out. A new baby and product design improvements beyond Tag Builder are keeping me quite busy.