The sponsors and DOER asked PixelMEDIA to consolidate the 6 separate websites into one site and to create a single branded user experience: Mass Save.

Success Factors

Mass Save’s strategic objective was straightforward: to encourage residents and businesses to be energy efficient through increased awareness and through direct energy-saving incentives offered by the Mass Save sponsors. PixelMEDIA identified three key project initiatives to achieve this goal:

Define audience segments and needs-based categories

Working with a team that included each sponsoring company, PixelMEDIA helps to define the target audiences and segment them into Residential, Business, and Professional (contractors, architects, etc.) categories.

With the categories in place, the team defined the needs and goals of each segment, as well as the business rules that would determine eligibility, availability, and call to action for each.  At the same time, PixelMEDIA looked at the six original websites to determine each one’s value proposition; the unique content; and the engagement model and call to action.

The resulting organization model was based on a progressive sequence that matched incentives with the needs of users at several levels: Lighting and Appliances, Heating and Cooling, and Building a House or Addition. Customers could take small, low-cost steps—such as installing compact fluorescent bulbs (CFLs) or replacing a refrigerator—or learn about “whole house” solutions that offered incentives on heat and hot water systems, air conditioning, or home insulation. In addition, customers could easily browse across categories to learn about other energy-saving opportunities and make plans for improvements throughout their homes and businesses.

Since the initial launch, two more categories have been added to accommodate the long-term goals of deeper energy savings and enhanced awareness about energy efficiency: Home Energy Assessments and the Learning Center.

Develop a tool to deliver localized incentives

Because incentives were specific to certain sponsors, PixelMEDIA needed to develop a mechanism that prevented customers from seeing incentives that were not offered in their service areas. A ZIP-code based incentive finder was designed to let customers identify their location, fuel type, and building type.

Once a customer entered a ZIP code, the incentive finder matched it against a database of the sponsors’ service areas. The fuel type and building type data refined the search to return gas or electric incentives and incentives designed for single or multi-family homes. In addition, the incentive finder filtered out out-of-state customers and customers of municipal power companies. The system was intelligent enough, however, to return results to municipal electric customers who heated their homes with gas.

Deploy an enterprise-level content management system

The consolidation of the 6 websites provided an opportunity to reduce production and administrative costs. PixelMEDIA implemented an enterprise-grade content management system (CMS) for Mass Save that streamlines the process of creating, approving, and publishing new content to the website by multiple sponsors and vendors. PixelMEDIA also provides support services for major revisions and user training. In addition to reducing production cost and complexity, the CMS enables a structured approach based on the branded look and feel of the website.

Results

The consolidation of six websites into one resulted in a unified, branded user experience and a single destination to support a range of statewide and regional energy efficiency campaigns. The masssave.com URL provides a simple, easy-to-remember call to action in television, radio, outdoor, and print advertising and provides a recognizable, trusted presence at events across the state.

In the time since the 2010 launch, the website has seen an increase of more than 500% in visitors, and more than 5 million page views—an increase of 570%.

In May, 2011, PixelMEDIA implemented a customized analytics framework that will coordinate site activity—including conversions and downloads—with the growing spectrum of marketing efforts. The tracking tools have enabled the Mass Save team to accurately track the steady increase in active participation on the site.

In the fall of 2011, the residential section was redesigned to add the Home Energy Assessments and Learning Center categories and relaunched in conjunction with a range of marketing efforts.

In October, 2011, Massachusetts was ranked as the country’s leading state in terms of energy efficiency investment and initiatives by the American Council for an Energy-Efficient Economy (ACEEE). The State Energy Efficiency Scorecard ranks the states based on best practices and leadership in energy efficiency policy and program implementation. Prior to the launch of the Mass Save program, marketing campaigns, and website, Massachusetts had been ranked third.

The new Mass Save brand continues to grow as a focal point for sponsors, state agencies, contractors, and energy customers, with an increasing emphasis on no-cost home energy assessments, financing, and contractor participation.

Success Factors

Empirix had a solid internal working group in place to drive the messaging and content of the new website, including the re-alignment of its extensive product offerings with its new solutions framework. In addition, Empirix was developing a new logo and brand identity elements that would be incorporated into the new website. PixelMEDIA identified 3 key elements needed for a successful outcome:

Message Architecture

PixelMEDIA experience designers worked with the Empirix team to focus the company’s value proposition and to articulate a set of proof points for audience segments that needed to design, test, and deploy large call centers and customer service operations. The message architecture stressed a broader solution-based approach built on a proven portfolio of products, and was used by the Empirix team as a guideline for copywriting for both online and traditional media.

Information Architecture

The experience designers at PixelMEDIA created a full inventory of the Empirix website and worked with Empirix to determine which content best supported the new positioning and where content would need to be edited or created. Using the inventory, PixelMEDIA created a new site architecture that put solutions at the forefront while providing a clear and logical organization of the Empirix product portfolio.

Content Design

The goal of the architecture was to present products in the context of a customer challenge and Empirix solution, and to help customers focus on the content that was relevant to their situations. A set of detailed wireframes was created for each level of the website to visualize how the content would be organized and presented on screen. PixelMEDIA also produced a set of Microsoft® Word® content templates and a style guide to help the Empirix team draft and edit page copy within recommended word and character counts.

Solution

Using the wireframes and the new Empirix design elements, PixelMEDIA designers created the Adobe® Photoshop® layouts that would be used to build the final HTML templates. A clean, 3-column grid provided put the new content front and center, while providing clear navigation and focus areas for related topics and calls-to-action. With the final designs and approved content from Empirix, PixelMEDIA’s development team coded and QA’d the new website and spent a full day with the Empirix developers to ensure they had the information needed for a successful launch.

Results

The new Empirix website went live in November, 2011. The redesigned website gives Empirix a powerful new focal point for its outbound marketing programs and news releases. In addition, the website now supports a sales process that is centered around solutions, and helps Empirix to deliver a higher-level value proposition to higher-value customers at the enterprise and solution-provider levels.

That’s what makes working on The Friends Project new website so interesting—and rewarding. The Friends Project is a non-profit organization in Portsmouth, NH, that organizes events and activities for people with disabilities. I met its tireless founder and president, Heidi Chase, as well as Nathaniel, a participant, and his parents, in our project kickoff meeting.

Our meeting agenda was basically the same as for a business client. Why not? The same questions and principles apply: Who is the audience? What are they looking for? What do you have to offer? What do you want them to do? We hit the whiteboards and the Friends Project team dug right in.

Audiences

We listed the potential audiences, which included participants, parents, volunteers, staff, donors and supporters, the press, and the general public. We realized that the audience was divided into two main categories. Participants (including parents and volunteers) use the site to see schedules, event listings, locations, and pictures of past activities. The General Public comes to donate, volunteer, read news, and get more background on the project. Nathaniel gave us great information about the things that participants care about. The resulting organization model pushed participant-focused content to the foreground. Public-focused content was featured in the utility navigation.

Goals

Next, we began to think more strategically about how the new site could help the Friends Project achieve its goals. There was the business side: Attract more donations. Raise awareness about the program and about people with disabilities. Make it easier to publish new content and update event listings. And there was the fun side: build a site that participants could call their own and that had lots of pictures of their friends.

Key tasks

Tasks were organized by the two main audience segments. Donating was at the top of the list for the general public—especially if there was an easy way to make donations on a regular basis through a service like PayPal. For participants, the most important tasks were learning about programs, checking the calendar for updates, and seeing pictures and videos of past events. Key documents were also identified: an emergency contact form and a volunteer information form for download.

Feature List

Finally, we went around the table to brainstorm the features of the new website. Ideas included a monthly calendar that showed upcoming events. A page for comments from parents and participants. A place on the home page for last-minute listings or cancellations. And, most important, an interactive gallery for photos and videos. Nathaniel and his parents focused on features that made it easy to find information about programs and events. For Heidi and her team, it was important that the features be easy to update and maintain.

What we discovered

For every project, success in the end is largely determined by the quality of the information in the beginning. We took a businesslike approach to the Friends Project website. And it worked due to the great insight from Heidi, Nathaniel, and Nathaniel’s parents. Soon, the Friends Project will have a new website that has been designed with the needs of its audience squarely in mind. For us at PixelMEDIA, the opportunity to work with people with disabilities has shown us that audience needs are pretty universal. In fact, the business community might learn a thing or two from the Friends Team.

I realized that this group was trying to decipher the subway map, which had been placed directly above the door.

The directive was unambiguous: DO NOT STAND IN FRONT OF DOORS. Safety and efficiency were the primary concerns. Yet the layout of the car required the users to defy the warning in order to get the information they needed to reach their destination. In addition, the map itself was squeezed into an extremely tight space. The type size was small, crowded, and set at the 45-degree angle. (It was the odd angle of the people’s heads, in fact, that clued me to why they were at the door in the first place.)

Note: necessity trumps instruction
Even dire warnings set in ALL CAPITAL LETTERS.

I speculated on the decision-making that created this potentially dangerous situation. Was there a usability professional involved? Did someone think that putting the stop names near the door would actually facilitate the process of identifying one’s stop and getting off the train?

Note: business trumps usability
I settled on another theory: misplaced priorities. From the front to the back of the car, every space at eye level was dedicated to advertising. Usability, efficiency, and safety were demoted in favor of revenue generation. I imagined the conversations that took place as the interiors of the cars were configured. I hoped that at least one usability advocate pointed out that the doorways presented riders with an impossible choice. But I knew that business concerns held sway.

Note: anxiety trumps brand
I didn’t have to ride the subway to learn this. It’s a scenario that’s common in the world of website design. The people at the door were placed in a state of anxiety: forced to ignore the warning while they struggled to locate their stop. I’m sure that they were relieved when they stepped off the subway. If they were tourists, coveted by the city, what was their impression of Boston? Will they use the subway again to explore other parts of the city? Did the advertisers get a return on their investment,  or were the riders too busy trying to navigate the system to look at the ads?

Advertising may earn short-term dollars, but usability is an investment that earns better feedback, return visitors, and true brand equity.

Since its release in January, 2009, NetMRI 3.0 has been well received by customers. Jay Ennis, Executive VP of Product Development at Netcordia, points to the user interface designed in partnership with PixelMEDIA. “… the new UI has helped us connect with customers,” says Ennis, “Wow” is a common reaction…” At the same time, Netcordia is solidifying its position in the competitive software industry and is capturing the attention of key media leaders like Red Herring, which recently named Netcordia to its annual Red Herring 100 list of America’s most promising technology companies.

A User-centered, Visual Approach
Netcordia’s NetMRI 3.0 improves the product’s Network Configuration and Change Management capabilities by providing multiple views of the network and every device connected to it, and then showing the effects of local changes on interdependent network initiatives. New diagnostic capabilities also help IT managers assess the potential impact of even the smallest changes to a network.

The new NetMRI 3.0 user interface features dashboards to
help IT managers track top problems and troubled devices, 
monitor trends, and identify the most important risks. click to enlarge

“I went to a customer six months ago and he said he loved the product, but he pulled a notebook out of a drawer and showed me all the steps he had to take to get to the feature he wanted,” said Yama Habibzai, product marketing director for Netcordia. “Over the course of the last few years, we’ve added more and more to this product. It was time to think about using a more visual approach to streamline the overall product experience for users at all levels.”

Gathering and incorporating user feedback was a key element in our approach. The Web-based interface consolidates core functionality into a set of dashboards, offering IT managers a fast, at-a-glance visualization of network performance. The dashboards show changes over time and the topology status view shows users exactly where a change took place. A combination view overlays both network health and policy compliance statuses on top of the topology map. The tabbed interface allows users to toggle quickly between different views of the network.

The redesigned NetMRI 3.0 user interface triages complex tasks into bite-size pieces. click to enlarge

When an issue is identified, users can drill down quickly using a system of logically organized “accordion” menus that replace the folder structure of previous versions and competing products. With a product as feature-rich as NetMRI 3.0, a well designed user interface helps customers maximize their return on investment by taking full advantage of everything the product has to offer.

“The new version is much better and very easy to navigate,” said Tod Isaacson, manager of network services at Loyola Marymount University. “Now, you can see several different screens at once that you had to hunt for in the past. I will use a lot more stuff that I didn’t know was there in the past because it’s now easier to find.”

For more information
Founded in 2000, Netcordia is a leading provider of network automation software to the world’s most complex and mission-critical networks. For more information, visit www.netcordia.com

In all, each member of the board had a slightly different definition but it was evident that each description was cut from a similar cloth. Surprised? Not really. Comforted? Yes.

Toby Bottorf, Director of Design, WGBH Interactive, had an interesting observation. He stated that we don’t design a user experience; we design for a user experience. I couldn’t agree with him more. In reality, we are just setting the stage. What happens in the hearts and minds of the audience is relative to their own past experiences, knowledge, environment and, of course, expectations. Since we are trying to mimic physical interactions within a virtual environment, defining expectations is paramount to creating a positive user experience. Much discussion was centered on the ability to enhance the experience by aligning expectations. Chauncey Wilson, Senior Manager, AEC User Research, Autodesk, Inc., discussed user experience in a similar manner to Maslow’s Hierarchy of Needs. Using a three-tiered pyramid, he defined the base as “relative and expected” functions that one would expect for choosing the experience. The second layer represents comfort. I equated this to factors like ease-of-use and thoughtful design. Third, at the top of the pyramid, is delight. Here, expectations are exceeded and the experience becomes an pleasurable one. But, the top tier is a moving target. Technology, design, and culture can easily push what was once a delight to a comfort. (see diagram)

So, what did I gather from all of this? For starters, we all are bombarded with choices and everyone is vying for your audience’s attention. So, when possible, reduce the “noise” level and minimize the need for your audience to make unnecessary choices. This not only reduces the need for complicated information structures but it relieves the stress of making the wrong decision. Second, define your intentions. Set the stage for a pleasurable experience early on. Frustration increases when your message is unclear which then encourages trial and error. And finally, stay current with both your audience and the environment in which the experience is delivered. If technology is the conduit, use good judgment and always precede with proper usability and interaction models. Push the boundaries to drive innovation (think the pyramid’s top layer) but expect to refine them. Some trends are harder for your audience to accept than others.

In closing, I must admit, it was a refreshing to hear others speak about user experience in a way that is subjective and open for interpretation. It’s evident that it means something slightly different to everyone, but with insight, knowledge, and a creative spirit, setting the stage for a captivating experience is well within grasp.

For more information about MITX and upcoming events visit MITX.org

]]> http://www.pixelmedia.com/blog/user-experience-or-user-expectation/feed/ 0 http://www.pixelmedia.com/blog/you-dont-need-a-website/ http://www.pixelmedia.com/blog/you-dont-need-a-website/#comments Thu, 26 Feb 2009 23:26:49 +0000 14 Megan http://blog.pixelmedia.com/?p=213 Continue reading →]]> We get it. You don’t need a website, social community, content management system, brand redesign, or flash demo. You need customers, loyal fans, email from people who want your products, and inquiries about the services you offer. You want to connect with people.

Last night PixelMEDIA hosted the monthly meeting of the NH Usability Professional Association (NH UPA). The meetings are an opportunity for user experience professionals to connect with each other. Talks included our own Luke Michel (watch his crowd-pleasing discussion about punctuation) as well as John Herman, a local media maker in his own right. As a newcomer to the NH UPA gatherings, John said two things that made me think about the way we communicate. The first:

I have no idea what you’ve been saying for the last 45 minutes but you sound like smart people and I think we do about the same thing.

As people engrained in what we do every day, we can all get hung up on industry vernacular, catch phrases, and tech-speak that the audience we’re trying to reach may not understand. And while one may say that it was a gathering of peers—so we can use our language—even within our own networks we can improve understanding by avoiding terms that mean different things to different people.

So the next time you write copy for that print brochure, stick a label on that web page, or talk at a public event, think about what your audience cares about. Remember they don’t know your internal language and won’t take the time to translate your features into their benefits. Connecting with people requires taking the time to understand their needs. And if your web or media partner is using language you don’t understand, remind them of your business goals and make sure they will be addressing them with their solutions. (They should be asking for that information and learning your language in the first place, then applying their process to produce results, not the other way around.)

The second nugget John shared was to:

Lead with your passion, not time or money.

While we all know time and money are important, especially in the current economy, if you put them first people will see through your message and suspect your motives. With all the user-generated content and alternatives to your offering out there, people can spot who’s in it for themselves and will seek other options. Find what your company is truly passionate about and lead with that first. Let the problem you are trying to solve determine what medium you use to connect with your audience. Are you working to find a cure for diseases with your research? Helping save lives with your heart devices? Educating kids with your Rubik’s cubes? Stay true to your passion and fans will follow.

Luke Michel presents at the Feb 25, 2009 New Hampshire Usability Professionals Association monthly meeting in Portsmouth.
(Oops, we forgot the mic, so the sound quality isn’t great.)

NHUPA: Punctuation and Usability from PixelMEDIA on Vimeo.

But it also turned out, that the majority of the client stakeholders were puzzled as to what PixelMEDIA was providing. They didn’t understand what Information Architecture was, and hadn’t even thought about the overall user experience for the product. Yet, they had requested an IA. How odd.

The understanding was that we were to immediately dive in and create a series of wireframes outlining the key screens for the application. This proved a difficult place to start, as we didn’t have (a) a clear design objective (b) we didn’t know what the users needed to do or (c) how the new product would help them do it better and more easily than they imagined possible. At our request we rewound a bit, and after a few meetings, all parties agreed on the basic design objective, which enabled us to ensure the customer’s needs, the brand, and the business objectives were balanced and clearly articulated.

Next, PixelMEDIA took the initiative to craft a set of task flows. This was an interesting decision, because we didn’t think we’d need to create such documentation for the project; but taking this step provided everyone a deeper insight into how we could craft a new experience as the design process continued. We focused our efforts on outlining the user’s primary goals and how they would achieve them in order to form the core of the application’s design. This allowed us to focus on the features that matter most to the customer. The task flows provided a visual mechanic that showed gaps in the requirements documentation, as well as providing a way to further the vision and understanding of the application.

Once the task flows were completed and approved, PixelMEDIA began designing the experience’s basic framework. We kept the requirements focused in a set of wireframes that outlined a typical scenario, to visualize how the customers would walk through the application and achieve their goals.

The client has been exceptionally pleased with the work to date, and PixelMEDIA has developed a more strategic partnership by bringing the project solution to completion. As the wireframes portion of the project nears completion, all parties feel that the resulting solution provides a more elegant, simple and streamlined experience for the customers.

Or in the customer’s own words:

We are obviously very new at some of this stuff and a large part of why we chose to go with PixelMEDIA is because we were confident that you wouldn’t just throw a design over the wall; rather, you would work *with* us, regardless of the fact that we would slow you down. We’re all learning quite a bit from this experience, and I for one am very impressed by what you guys have done and how you’ve helped our team figure out which direction we should try to head in.

By thinking less tactically and more broadly, PixelMEDIA has been able to educate the client on the importance of Information Architecture, and helped the client identify what their customers needed most from the application.

Here’s a quick look at other people’s briefs. No jokes, please.

The Creative Brief
Ad agencies produce a Creative Brief at the earliest possible point in the project. The brief serves as an important internal document that helps the agency’s account teams and creative teams work together more effectively. It’s important to note that the creative brief doesn’t propose any creative approaches. In fact, the creative team is usually not involved in the drafting of the creative brief. The purpose of the creative brief is to give the creative team a reference point for developing a solution.

The Organizational Brief
I came across this post recently and thought it offered a lot of valuable insight. The author, MJ Braide, has developed (and trademarked) the Organizational Brief as a method for companies to align their organizations to their brand strategies. A website redesign can trigger a lot of questions about an organization’s core business models, product lines, and go-to-market strategies. This is especially true for companies that have experienced a recent merger or acquisition: the pressure is on to upgrade the website, even if the organization is still be taking shape (or shaking out).

The Experience Brief
Braide follows up with another good post about the Experience Brief as a tool for effective brand management. Like a Creative Brief, an Experience Brief can foster a better working relationship between client, agency, and team members. In our business, I think a tool like this could help our clients think in terms of “designing a user experience” rather than “designing a website.”

We can tailor an Experience Brief to inform all aspects of Experience Design, including Information Architecture, Content Strategy, User Research, Nomenclature, Visual Design, and Application Design. Because so many disciplines are involved in designing the user experience, there has to be a common point of reference for everyone. Having a brief in hand can prevent the gradual drift away from the original goals as individual interpretations and small variations build one upon the other.

Brand Agencies (and consultants like Braide) usually equate “User Experience” with “Brand Experience” and rely on brand attributes and messaging to define the user experience. From the Interbrand Brand Glossary:

Experience: This is when consumers have been exposed to various brand attributes. A successful brand experience happens with exposure to a brand’s most positive aspects, and this can happen in a store, through advertising and websites, or through word of mouth. The critical aspect is to have the experience match or exceed the customer’s expectations based on promises made in communications.

Messages set expectations; content satisfies expectations. At a strategic level, the Experience Brief balances the user’s needs and expectations with the company’s messages and brand attributes. It also provides a tactical framework for making decisions about content, navigation, and design at every phase of the project and serves as a benchmark for evaluating the outcome.

PixelMEDIA Solution
To get a real feel for Burns & Levinson—its people, practices, and philosophy—PixelMEDIA worked closely with the firm conducting a series of workshops, brainstorms, and interviews. PixelMEDIA’s User Experience and Creative Services teams spent time getting to know key principles who personified the firm’s deep-rooted commitment to client service. The knowledge gained from these sessions helped PixelMEDIA develop a professional, yet welcoming website that projects both credibility and partnership. Balancing custom photography and animation with revealing testimonials and rich content, the new site extends a warm, inviting presence to existing and prospective clients.

On the back end, PixelMEDIA built powerful, data-driven Flash® tools and DHTML scrolling menus of attorneys and their practices, which are easily scalable to support a growing firm. Custom tools enable Burns & Levinson content owners to update the site quickly and efficiently.

The team at PixelMEDIA really listened to us to help us develop a great product. It really shows the firm’s personality. —Angeline Mistretta, Director of Marketing, Burns & Levinson LLP

The Impact
The Burns & Levinson website has quickly become a popular site for a wide range of visitors. The site was a 2006 MITX award finalist in the Professional Services category, after having already won the Legal Marketing Association’s award for best website for a mid-sized law firm.

More importantly, the website meets several targeted objectives:

• Effectively communicates the firm’s breadth of services
• Reinforces the firm’s personable, “client-first” approach to business
• Scales seamlessly to support new areas of expertise in a growing firm
• Offers helpful tools to connect visitors with attorneys

For this initiative, PixelMEDIA provided

• User experience strategy and design
• Content strategy and messaging architecture
• Information architecture
• Custom photography and visual design
• Site design and development
• Custom application development and content management tools
• Search engine strategy