THE BRIEF
Transform the Experience
The core Earthwatch experience happens outdoors in the form of an expedition — usually for about a week and far away from technology in locations like the Amazon Basin, Uganda, or the Great Barrier Reef. But before this in-person experience happens, an expedition volunteer encounters a dizzying array of digital touchpoints that can sow confusion and lead to distrust. Earthwatch needed “Experience Transformation.”
SURVEY THE LANDSCAPE
Starting with a deep strategy and research engagement, Oomph left no stone unturned in cataloging users and their journeys through a decade’s worth of websites and custom applications. We were able to conduct multiple interview sessions with engaged advocates of the organization. Through these interviews, the Earthwatch staff learned how to conduct more interviews themselves and listen to their constituents to internalize what they find wonderful about the experience as well as what they find daunting.
CREATE THE MAP
With a high-level service blueprint in place, Oomph then set out to transform the digital experiences most essential to the organization: the discovery and booking journey for individuals and the discovery, research, and inquiry journey for corporate sustainability programs.
The solution took shape as an overhaul and consolidation of Earthwatch’s public-facing websites.
THE RESULTS
The Journey Before the Journey
A fresh design approach that introduces new colors, beautiful illustrations, and captivating photography.
Expedition discovery, research, and booking was transformed into a modern e-commerce shopping experience.
Corporate social responsibility content architecture was overhauled with trust-building case studies and testimonials to drive an increase in inquiries.
IN THEIR WORDS
The Oomph team far surpassed our (already high!) expectations. As a nonprofit, we had a tight budget and knew it would be a massive undertaking to overhaul our 7-year-old site while simultaneously launching an organizational rebrand. Oomph helped to guide us through the entire process, providing the right level of objective, data-driven expertise to ensure we were implementing user experience and design best practices. They listened closely to our needs and helped to make the website highly visual and engaging while streamlining the user journey. Thanks to their meticulous project management and time tracking, we successfully launched the site on time and exactly on budget.
ALIX MORRIS MHS, MS, Director of Communications, Earthwatch
THE BRIEF
The American Veterinary Medical Association (AVMA) advocates on behalf of 91,000+ members — mostly doctors but some veterinary support staff as well. With roots as far back as 1863, their mission is to advance the science and practice of veterinary medicine and improve animal and human health. They are the most widely recognized member organization in the field.
Make the Brand Shine
The AVMA website is the main communications vehicle for the organization. But the framework was very out of date — the site was not mobile-friendly and some pages were downright broken. The brand was strong, but the delivery on screen was weak and the tools reflected poorly.
Our goals were to:
IMPROVE THE SITE MAP
Content bloat over the years created a site tree that was in bad need of pruning.
IMPROVE SEARCH
When a site has so much content to offer, search can be the quickest way to find relevant information for a motivated user. Our goals were to make search more powerful while maintaining clarity of use.
COMMUNICATE THE VALUE OF MEMBERSHIP
Resources and benefits that come with membership were not clearly illustrated and while members were renewing regularly, they were not interacting with the site as a resource as often as they could.
STRENGTHEN THE BRAND
If the site was easier to navigate and search, if it had a clear value proposition for existing and prospective members, and if the visual design were modern and device-friendly, the brand would be stronger.
THE APPROACH
Put Members First
Oomph embarked on an extensive research and discovery phase which included:
- A competitor Analysis of 5 groups in direct competition and 5 similar membership-driven organizations
- An online survey for the existing audience
- A content and SEO audits
- Several in-person workshops with stakeholder groups, including attendance at their annual convention to conduct on-the-spot surveys
- More phone interviews with volunteers, members, and additional stakeholders
With a deep bed of research and personal anecdotes, we began to architect the new site. Communication was high as well, with numerous marketing, communications, and IT team check-ins along the way:
- An extensive card sort exercise for information architecture improvements — 200+ cards sorted by 6 groups from throughout the organization
- A new information architecture and audience testing
- A content modeling and content wireframe exercises
- A brand color accessibility audit
- Over a dozen wireframes
- Three style tiles (mood boards) with revisions and refinements
- Wireframe user testing
- A set of deep-dive technical audits
- Several full design mockups with flexible component architecture
Several rounds of style tiles explored a new set of typefaces to support a modern refresh of the brand. Our ideas included darkening colored typography to meet WCAG thresholds, adding more colored tints for design variability, and designing a set of components that could be used to create marketing pages using Drupal’s Layout Builder system.
THE RESULTS
The design update brought the main brand vehicle fully into the modern web. Large headlines and images, chunks of color, and a clearer hierarchy of information makes each pages’ purpose shine. A mega-menu system breaks complex navigation into digestible parts, with icons and color to help differentiate important sections. The important yearly convention pages got a facelift as well, with their own sub-navigation system.
FINAL THOUGHTS
Supporting Animals & Humans Alike
Membership to the AVMA for a working veterinary doctor is an important way to keep in touch with the wider community while also learning about the latest policy changes, health updates, and events. The general public can more easily find information about common pet health problems, topical issues around animal well-being during natural disasters, and food and toy recalls. The goal of supporting members first while more broadly providing value to prospective members and non-members alike has coalesced into this updated digital property.
We look forward to supporting animal health and human safety as we continue to support and improve the site over the next year.
THE BRIEF
“Out of Home” (OHH) advertising is widely understood as billboards, transit stops, and street furniture. But OHH advertising is also place-based mobile advertising and digital messages that can react to the time of day and weather. These emerging avenues were some of the customer education messages that OUTFRONT Media, one of the top three outdoor advertising companies in the country, needed a new website to convey.
OHH was new to us, but we enjoy diving deep into new industries and absorbing information from all directions. While getting to know OUTFRONT Media during our initial explorations and discovery meetings, Oomph and Straightline Media were surprised to learn:
THE DISCOVERY
Expanding Outfront’s reach from Agencies to Mom-and-Pops
OUR RESEARCH & UNDERSTANDING
“The United States of Audiences” is the demographic landscape made up of microcosms centered around interests and activities. OUTFRONT understands all these niche groups and can hyper target them to get businesses those audiences.
Through information architecture testing, an understanding of their business goals, and internalization of this new brand message, we crafted a main navigation that spoke directly to OUTFRONT’s target audiences. These pages communicate they “get” them in two ways — OUTFRONT understands these audiences’ needs and
CUSTOMER ACTIONS
To buy media placements from OUTFRONT, a business needs to:
- Understand the value of OHH advertising
- Explore the media options in their location
- Investigate the costs of these different options
- Call a sales associate in their area to discuss custom packages
Finding a market lets a potential customer define themselves even further by gathering their location
they can put the right message in front of the right people to get clients new business.
Large brands already understand how important it is to have OHH in their advertising mix. An emerging market for companies like OUTFRONT is actually smaller businesses — local chains and even mom and pop businesses. To court these new customers, OUTFRONT has to create a customer portal that supports do-it-yourself media management, and the website messaging has to educate a small business about the process and how to buy.
data. From here, they can easily access the media that is available specifically to their geographic area. After a sale is made, a customer needs continuing support. The website should:
- Make it easy for a customer to find production specs for various media
- Provide links to a portal that give them analytics and reporting statistics
- Give them a clear path to extending their current campaign or starting a new one
THE APPROACH
Defining Audience Destinations
OUTFRONT narrowed its focus to the audiences that it needs to win and continue to support — new advertisers, new and existing agency relationships, and property owners who lease their real estate to OUTFRONT for displays (these could be individual real estate owners, large municipalities, or large destinations like airports, stadiums, and entire city transit systems). The journey for these new customers is the main navigation, and these journies funnel through the Market Finder to become more personalized.
Returning customers will find inspiration, case studies, galleries, and support resources in the footer navigation. One of the reasons for this bifurcation was the amount of content that OUTFRONT Media needs to manage. Their previous navigation tried to be everything to everyone, and therefore, was confusing. Labels like “Who We Are / What We Do / Where We Are…” contained too much “we” and not enough “you”. A modern customer doesn’t have time to figure out the navigation — it should speak to them directly in language that they understand.
Giving Visitors Clear Directions
he previous market finder used “inside baseball” language — terms that people at OUTFRONT understand, but that the general populace does not. Markets were labeled by city and state with vague geographic terms like “non-metro”. It was not friendly to the DIY customer. We helped guide technical conversations around how a better flow might work and captured the journey in wireframes and external working examples.
The Market finder is an integral part of the customer journey, so we placed it in page content to support the education process. As a customer understands how OHH and OUTFRONT works, they are prompted to enter their location and get more direct information. As part of wireframes and design, the language was an important aspect to try out and sharpen. Vague button text like “Get Started” was replaced with stronger and more descriptive actions like “Start Building Your Campaign.”
THE RESULTS
Focusing Attention on Results
OHH is a powerful mechanism to reach people even as consumers become blind to advertising in traditional media — a billboard or subway poster can’t be ad-blocked. One of the most powerful ways to tell this story is through data. OUTFRONT has a number of “Insights” but potential customers are less likely to seek this information out themselves. Instead, we made sure to include teasers along their journies that highlight the effectiveness of sample campaigns. These Insights provide powerful results with brands that visitors are familiar with.
The entire journey from discovery to wireframing, testing, and design was an exciting and challenging process that pushed both teams towards an excellent outcome. We hope that the clarity of the navigation, message, and visitor journey continues to get new eyeballs and customers.
THE BRIEF
Supporting the Organizations You Love Should Be as Easy as Banking Online
After a successful redesign experience for their main property, United Way Rhode Island (UWRI) came to Oomph with an idea — modernize and rebrand their philanthropic giving platform as a mobile-responsive web app. They already had the software team building back-office integrations, but what they didn’t have was the all-important name, URL and brand.
The name set the tone for the platform — easily understood, distinct in the marketplace, and personal. UWRI prides itself on being a personal organization, helping Rhode Islanders who need it most. And giving one’s time, one’s energy, and one’s assets is as personal as it gets. After some research into competitors, the banking space, logo and app naming trends, plus a whiteboard full of other ideas, a clear winner emerged — MyFund.
THE NEW BRAND
A New Sibling for a Recognizable Community Organizer
There is great public trust in UWRI that a new brand should leverage. After visual explorations, we decided to make the connection in a subtle way. The main color scheme borrowed from the recent redesign of UWRI’s website, using a highlight color of light teal as its primary color. The main typeface was Meta, which is the secondary typeface for much of UWRI’s print collateral. These subtle connections helped maintain a family resemblance, while allowing MyFund to stand on its own.
The simple circle with “M” mark abstractly suggests two bodies, side by side and with linked arms. The tagline, “Because Giving is Personal,” was the result of one of those serendipitous moments during an all-hands meeting. Someone floated it to the group and everyone just lit up and exclaimed, “That’s it!” Along the way, the name, the logo, the colors, the typeface, and the tagline just felt right. We all felt it, and it was very exciting to be a part of it.
THE RESULTS
Web-app Interface Design
The interface was designed to follow many conventions of online banking in order to leverage customers’ intuition and expectations, but the result is softer and less like a typical financial institution. The concept of MyFund is similar to online banking in that the customer can make a donation through an online portal from a predetermined balance. The differences are in the workflow; MyFund transactions occur both on and offline. All transactions are guaranteed to go to registered 501c3 organizations in good standing with the IRS, therefore, when a request is made to send money to an organization, the final check is cut by a person. A customer may cancel a transaction before it has been fully processed but the back-office may also cancel it if the organization is not compliant. These nuances needed to be clear in the interface and messaging.
All along the way, the wireframes and designs were verified with real people. At the early stages, wireframes and workflows were tested with online tools and an HTML prototype. This not only gave the development team a live example of a customer’s workflow, but it gave the entire team a clear picture of how the responsive site was going to work.
The Marketing Site
While the software was nearing completion and a beta launch, Oomph began work on a marketing site to promote the new web app. We were involved in writing the copy and crafting the story for prospective customers.
We scripted a series of videos to help explain how individual features worked, while one explainer video on the marketing site gave new customers a broad overview of why this platform is such a great idea. A list of primary features as well as some social proof in the form of personal testimonials help frame the platform as more than just a convenience — it can really help you make a difference in your community.
See the marketing site in action at MyFund.org.