The Brief
Oomph has worked with Lifespan since 2010 and created the second version of their intranet on Drupal 7. A critical tool like an intranet needs regular maintenance. Even with regular updates, there comes a time when the whole platform needs a re-architecture to be flexible, secure, and performant.
In 2021, it was time to plan the next phase of the intranet on Drupal 9. Lifespan used the redesign as an opportunity to realign the employee journeys with the evolution of their work. And COVID-19 had provided an opportunity to reevaluate whether a security-first, HIPAA-compliant intranet could be available to those working from home.
Departments
Job & Clinical Tools
Staff Contacts
Critical Top-Tasks
The Oomph team ran a Discovery and research phase to gather requirements and understand employee expectations. We ran workshops with client stakeholders, identified important work tasks and created 5 employee personas, conducted one-on-one interviews with key persona types, and gathered feedback from employees with an online and email survey.
Through this research, we started to see two different types of tasks emerge: those that required speed to a destination and those that required exploration and unstructured browsing.
Tasks requiring speed to completion:
- Access health and safety policies
- Access a staff directory and immediately contact high-value individuals
- Access job tools, which are often 3rd-party digital services, for everything from timesheets to diagnostics to general education
- Access online forms to request items and services
- Access HR and employment benefits
Tasks requiring unstructured browsing:
- Access Department sites, particularly my department for relevant news & events
- Be exposed to company culture through up-to-date news and events, videos, seminars, and important business announcements or press coverage
- Access the internal job board to find advancement opportunities
- If I am a new employee, or a new manager, access onboarding material and quick links for new individuals
- Visit and browse the Bulletin Board
It became clear through our process that Lifespan employees needed to move quickly and slowly, often in the same session, depending on the important tasks they needed to complete. The intranet needed to support both types of journeys to remain a successful platform for getting work done and absorbing company culture.
The Approach
A Focused Priority on Search
Expectations about fast and accurate search are high because of you know who. When designing search for an employee intranet, the baseline requirements are even higher. We knew that we had to get the design and implementation of search right.
We took a learn-once, use-everywhere approach when it came to search interfaces. Search would be a core part of finding many types of content — tools, forms, people, departments, locations, and more. Each had to have a similar structure and set of filtering options to be the most useful.
The list of tools, locations, or people needed smart defaults. Before someone conducts their own search, each screen displays popular searches and the common content people need to access. In some cases, an employee does not even need to search in order to find what they need.
Two search pages, similar interfaces: The Job Tools search and Staff Directory follow similar patterns, adhering to our “learn once, use everywhere” rule
Personalization that follows Employees from Device to Device
Personalization had to be a part of our solution as well. Employees are able to use S.S.O. to access the intranet from their personal devices or workstation computers in the hospitals. Workstations are often shared between multiple clinical staff, therefore, our system needed to support stopping one task on on device and picking it back up on another.
A Favorites feature allows employees to create their own transportable bookmarks. Almost everything on the site can be bookmarked, reducing the need to search for commonly used content and tools. Six custom favorites are available from the left drawer at all times, while the entire list of favorites is one more click away.
Supporting Speed and Engagement
Speed is at the heart of critical tasks and high-quality patient care. A nurse, at a shared workstation, needs to log in quickly, find the tool they need, and administer care. Time is critical. They don’t want extra clicks, a search that doesn’t work intuitively, or slow page load times. Staff don’t want it, and management doesn’t want it, either.
Engagement is slower and the intention is different. Speed is for tasks. Engagement is for exploring. This is how company culture is communicated and absorbed. This is when people catch up with department and company news, find events to attend, view a photo gallery from an event they missed, or browse a bulletin board to swap items with other employees. You can’t have an intranet that is ALL business just like you can’t have an intranet that is NO business.
A Dashboard Built for Speed or Browsing
On the starting page, an employee might be in need for something immediate or might have time to explore. We do not know their intention, therefore, this page needs to support both.
The left drawer is open to employees on the dashboard. It is open to show them what it contains and to remove a click when accessing the important common destinations within. The first seven links are common items for any employee, curated by the Lifespan team. They are a mixture of tactical items — like time sheets — and company culture items — like the CARE recognition program.
Below that are the employee Favorites. The first six favorites are shown while all are available with an extra click.
The top navigation supports speed to common destinations, some of which are search interfaces and others which are built for browsing.
The rest of the page showcases engagement and company culture. Featured news stories with images are balanced with quick news and event lists. Flexible content sections allow authors to add and remove content blocks as new items are required.
Other content pages that were focused on engagement are the deeper News and Events pages, customized Location pages (for each major hospital location), and a community Bulletin Board.
The Results
Smooth Onboarding and Acceptance
No matter how confident our teams were, we didn’t really know if the redesign was a success until employees moved from the older tools they were familiar with. The Lifespan team did a fantastic job creating walk through videos ahead of the launch. Old tools and directories stayed available for a period of overlap, but our teams saw quick adoption into the new tools in favor of the familiar.
Since the intranet is now available off of the closed Lifespan network, we have seen mobile traffic increase dramatically. The responsive design is an improved experience over the previous intranet and the numbers prove it. In fact, we have found that more employees engage in company culture content on their personal devices, while using the company workstations for their tasks.
Oomph is very proud to have worked with one of the largest private employers in the state, and we are very proud to have our work used by over 17,000 people every day. Oomph continues to support the Lifespan team and the intranet project, iteratively improving the features and evolving the toolset to be effective for all.
The Brief
Powering Design With User Feedback
MLH exists to help Massachusetts residents find information to solve common legal issues, like securing public benefits or fighting an eviction. To ensure every aspect of the site was grounded in the audiences’ needs, MLH wanted to incorporate feedback during the discovery and design phases from real people who fit MLH’s primary and secondary audience profiles.
By performing a thorough discovery process — including working group interviews, visitor interviews, cohort site analysis, and wireframe and prototype testing — Oomph was able to create a successful site design dedicated to the needs of visitors.
The Approach
Helping the Audience by Understanding Them
MLH shares insights on heavy topics ranging from housing and homelessness to money, debt, and immigration. The site contains sensitive information that could change their visitors’ lives; by connecting them to domestic violence help or resources to get their children back, for example. When Oomph first jumped into the project, our main goal was to step into the shoes of their user groups to better understand their needs when they seek legal information.
The main audience of MLH is Massachusetts residents who are primarily low-income and may not speak English as a first language. They use the site to become informed about legal issues they’re facing quickly and efficiently. As one visitor stated:
“I’m coming here because I have a problem. I want to know, where’s the search? What can I do here? What can I not do? Don’t waste my time making me read [fluff]…”
To meet this need, the MLH team provides information in plain English at a fourth to sixth-grade reading level, rather than using complicated lawyer jargon, which makes it accessible to a wider group of people. Additionally, many resources have been professionally translated into other languages, such as Spanish.
The secondary audience that visits the site is those who help the primary audience, such as social service providers, legal aid lawyers, and legal librarians. Oomph had to walk a fine line by getting feedback from the secondary audience to help inform information about the primary audience; however, our main goal was to ensure that low-income and non-English-speaking people could find the answers they needed.
Gaining the Audience’s Trust with Thoughtful Design Details
We learned that many visitors found the MLH website by searching Google with their questions. Many primary audience members would visit the site on their mobile phones, perhaps even listening to its content with their text-to-speech tool. Knowing that, we had to design an accessible experience on any phone, tablet, or desktop device. This increased the importance of a mobile-first design so the pages loaded quickly, the information was clear, and the experience made sense for mobile browsing.
A Modernized Design
The site’s look was outdated, making some visitors feel that it either lacked credibility or didn’t contain the latest legal rules and laws (even though it’s been actively maintained and added to for the past 15+ years!). For the Oomph team, the final designs had to walk a fine line between being authoritative, trustworthy, and comforting. To achieve this, we retained the blue color palette but created slightly softer tones to help create a calming aesthetic.
Our team also limited the amount of photography on the site but ensured that any photos we used represented the diverse groups MLH serves. Icons became a tool to guide the visitor through different topics; regardless of the visitor’s language, the icon could help them understand what information may be within that particular topic.
MLH has also accumulated a lot of content over the years. To help organize its search and topic organization feature, we incorporated content filters according to the information type: articles, how-tos, e-books, and videos. Each category has its own icon, and each icon is represented by a color. This helps unify the search based on the type of content the visitor is seeking.
Color Contrast and Accessibility
From the start, MLH made it very clear that their new designs should comply with both 508 and WCAG 2.1 guidelines — ideally conforming to the highest level of contrast, level AAA. As Oomph created the color palette, we were careful to use only high-contrast colors and document how to use them in a system to ensure that the palette satisfied accessibility guidelines.
Supporting the Content With Tools
MLH had several existing tools to assist in digesting content. During our discovery phase, we validated the need for these tools and upgraded them. For example, on the content pages, there are options to print, share, listen to the content, and even switch the language as the visitor lands on the page.
Within the main navigation menu, the design included a “Quick Exit” button. This supports visitors who need to abandon the page when, for example, a domestic violence survivor’s abuser re-entered the room.
We cultivated a passion for this feature through our research and have written an article detailing our best practices for implementing a quick exit button. Additionally, we have created a Drupal Module for this feature so that more people can implement this important tool for sites with sensitive content.
Findability of Content Through the Main Menu Navigation
On a larger scale, the primary and secondary navigation menus needed an upgrade. As it stood, the main categories were wall-to-wall across the desktop, and it was hard to determine where a visitor needed to go. The secondary navigation menu read like a table of contents in a chapter book and didn’t allow the visitor to return to other categories.
We solved for this by creating a survey to test a proposed navigation structure and revised the information architecture (IA). This included a new top menu that supported every step of our primary audience’s journey. We also created a level of navigation that directed visitors to the information they were looking for, no matter how they entered the site.
Search
For search, we used a multi-filter approach which allows visitors to search both by topic and by content type. This filtering allowed them to find questions that might belong to multiple categories, and to narrow down content to the types they are willing to review.
Proactive vs. Reactive Enhancements
Analytics and user interview results showed that most visitors start their journey on either the homepage or pages that are three or more levels down the navigation. Many also reach the site via a specific Google search. While it is likely they found what they needed, they may not be aware of other information that can help them. To mitigate the risk of bouncing away from the website, we created a “Viewers also reviewed…” component on answer pages that showcased related content more naturally.
Repeating Help Footer
Above the footer, we created a “safety net” to help visitors who have browsed the site for a long time but have not found what they are looking for. If they reached the end of the page, this footer would direct them to more content that may hold their answers.
Previously Viewed
We added a “Previously Viewed” section at the bottom of content pages to remind visitors of the content they have already reviewed. This reduces the burden on the visitor when they ask themselves, “I think I’ve seen that already, but I can’t remember where I saw it.”
The Results
A Modern, Helpful Website Design
Through prototype testing with our first design mock-up with real visitors, the participants individually determined that the new site’s design and content organization was easy to navigate, gave them a trustworthy impression, and looked appealing. Today, the MLH website is live with a fresh Oomph design. We hope the structure and design will continue to not only keep visitors on the site longer but also help those visitors find the legal answers that they need.
Have a project that requires a human-first, empathetic approach? Consider talking to Oomph about incorporating user feedback into a user experience-focused design project for your next website refresh.
Go Ask Alice! (GAA!) is a judgment-free, anonymous question-and-answer site. It is part of Alice! Health Promotion, a department of Columbia Health. Their content has always been reliable, accurate, and thoroughly researched by professionals — humans, not Artificial intelligence (AI)! While organic search brings many different kinds of audiences across the globe to their answers, their primary audience is the college students of Columbia University. These digital natives need the content to speak their language and to look modern and relevant. Oomph leaned into the college-aged persona to create a user interface that was fun, unique, and approachable while acknowledging and respecting the gravity of the questions students ask.
The Brief
Empathize with both Visitors and Authors
We began by working to understand and empathize with their audience — which was easy. How many of us have gotten lost searching for answers to questions we might not ask our own close friends? Questions like, “Can I get Hepatitis A from eating raw seafood?”, “Do I have OCD?” or even “Why did my father abandon me?” Analytics supported how these types of questions were prevalent. They also showed that while many visitors found GAA! through search, those visitors found their answer and quickly left. While in some ways, this was positive — someone had a question and found a satisfactory answer — visitors missed lots of other answers to questions they might have.
For the Go Ask Alice! author team, technical issues often arose that were rooted in an overly complex content architecture and workflows that required lengthy workarounds. A complicated review and approval process and ineffective spam filters made combing through user submissions time-consuming. The longer it takes the team to create new answers, the less students will want to send GAA! their questions.
Our shared goals were to:
- Modernize the design and attract more web-savvy students to read answers to questions they didn’t know they should ask.
- Reinforce trust by being open about the process and the real human professionals behind the answers.
- Improve search, filtering, and findability by leading with topics first and guiding visitors to the types of questions that interest them most.
- Mitigate and simplify complex authoring processes to empower the small editorial team to answer more questions, support responses with engaging media, and reduce staff frustration.
The Approach
Modernization & Trust-building
Most Gen-Z students and younger generations won’t trust a site that isn’t designed well for a mobile screen. Our design process emphasized the small screen experience, keeping filters, sharing, citations, and recirculation in logical places. The Columbia Health brand is also a powerful lever for establishing trust with a young audience, but we were careful not to let it overpower GAA!’s own authentic brand.
Human responses feel human
With the rise of AI and Google’s AI-generated search results, our design reinforced the humanity and empathy of GAA! by establishing a clear “Dear Alice” with a unique handwritten font and response from the author. When dealing with potentially sensitive and health-threatening answers, an authentic human voice is essential, and one that puts answers into context — is this thing I am asking about “normal”? What are the additional considerations I should know about? And so on. AI might give you one answer, but it won’t contain the context and nuance these anonymous human-generated questions require.
Unique Colors & Illustrations
Blue is strongly associated with Columbia Health and prevented the previous site from standing independently. Our design reduced focus on blue and shifted the site’s primary colors to maroon and yellow. Several other colors create wayfinding paths associated with answer topics. Scrolling the All Topics category page becomes a delightfully random color experience.
All color combinations adhere to WCAG 2.2 guidelines for Level AA, increasing the accessibility of this color-rich site for all visitors.
A new set of illustrations curates a sense of inclusivity better than stock photos could. A wide variety of humans were chosen to represent the diversity of student populations. Little details, like the randomized person in the site’s footer, add a sense of surprise and delight to the entire browsing experience.
Supporting Trust with New Features
Enhancement ideas started to surface during Discovery and continued throughout the process from both teams. Some of our favorites include:
- The editor’s name, the answer’s published date, and its revision date were moved from the bottom of an answer and brought to the top. This information helps establish credibility quickly before reading an entire answer
- A feedback feature was added to individual answers, giving the GAA! team real-time data about the responses but also giving new visitors a greater sense of social proof
- A “Cite this Response” feature makes cutting and pasting an MLA (Modern Language Association) General Format- or Chicago-style academic citation into research papers easy. Since answers are so well-researched, these citations propagate GAA! further into academic culture
Increased User Engagement & Accessibility
Accessibility & Safety with a Quick Exit Button
Go Ask Alice! has many sensitive questions: questions about sexual abuse, suicide, drug use, and topics generally that you may not want someone else to see on your phone. We introduced a Quick Exit feature on each page of the site. When visitors click the button, a new tab is quickly opened, and the site’s browsing history is removed from their device. While this is not a well-known action in the general population, many in unsafe situations know how they work and what “Exit Site” means.
Oomph has written an in-depth article about the quick exit button and has released a Quick Exit Drupal Module to help other teams implement this feature.
Encouraging Question Browsing over Asking New Questions
It may seem counterintuitive, but one of the major workflows we redesigned was asking a question in the first place. The GAA! team has compiled thousands of great answers over the years and frequently updates old answers with new content to keep them current with changes in medical approaches. The small but mighty team didn’t want to answer the same questions over and over again by referring new askers to pre-published answers.
Our solution emphasized search and intentionally made access to the Question form difficult. Visitors are encouraged to search for answers to previously posted questions first. Quite often, they will discover an answer to their questions (and maybe some helpful answers to questions they did not expect). Only if they have searched first will they encounter the “Can’t find your question” call to action, which leads them through the steps of asking a new question.
The Results
The new site feels like a new beginning for the GAA! team. While the site has only recently launched, we look forward to seeing how it impacts key metrics like time on site and return visits. In the meantime, we’re also excited to see how the newly revamped admin experience helps the GAA! content team serve their audience even better than before.
When faced with a sensitive question about mental, nutritional, emotional, or sexual health, college students can continue to Go Ask Alice!
The Brief
Visit California is a Destination Marketing Organization (DMO) with over 25 years of experience in promoting California as a premier travel destination. The organization, funded through a unique partnership between the state and the travel industry, operates with a substantial budget of over $185 million (2023). As the leader of California’s brand messaging, Visit California previously anchored its campaigns under the “Dream Big” brand positioning. However, following a significant shift in traveler motivations post-pandemic, Visit California recognized a growing desire for experiences that foster joy, connection, and adventure.
This insight led to the evolution of the brand into “The Ultimate Playground,” a strategic repositioning that highlights the state’s unparalleled diversity of geography, activities, and cultural experiences.
The “Let’s Play” campaign leveraged a robust mix of television, out-of-home, digital, and social media activations to showcase California’s diverse offerings — from wine tasting and rock climbing to luxury hotel stays, food truck adventures, and outdoor music festivals. By highlighting the playful spirit inherent in every experience, the campaign aimed to deepen the audience’s emotional connection to the state, reinforcing California’s identity as The Ultimate Playground and setting the stage for sustained brand engagement.
The APPROACH
The initial roll-out of a rebrand update is critical, and transitioning from “Dream Big” to “The Ultimate Playground” required careful internal alignment and thorough message testing. Oomph, alongside Visit California’s partner agencies, began collaborating on this effort about nine months before the campaign launch. During these early planning meetings, our team contributed key ideas and strategic approaches to help shape the campaign.
Our focus remained on the web user and their position in the customer journey. Previous campaigns had not fully optimized the user flow, so we saw this as an opportunity to reimagine the experience. With paid media driving traffic to the website, it was essential to provide visitors with clear actions once they arrived. The advertising had done its job by capturing attention and sparking interest. Now, our challenge was to build on that momentum, guiding users from interest to meaningful engagement and action.
An interactive Quiz
The Ultimate Playground campaign needed to accomplish a few things:
- Educate the consumer about the new brand positioning and why California should be considered the Ultimate Playground
- Inform the consumer about play and how it is more about kids and theme parks. Adults can and should play as well, and serious activities can be conducted in playful ways
- Activate the consumer with inspiration by giving them a unique experience and curating inspirational, playful activities throughout the state
Our teams settled on a quiz as a way to engage visitors and serve them personalized content. Based on initial research, we decided an image-based quiz would be the fastest and most fun way to answer questions and receive a set of recommendations. Choosing preferences from a set of images is a quick way to make progress tangible. We limited the questions to nine, and most visitors took two minutes to complete the quiz.
Play Styles
The eight Play Styles were based on personas researched and created by the National Institute for Play, headquartered in California. Content creators at Visit California crafted a series of TV spots with glimpses into different styles of play. Our Play Quiz would highlight which Play Style matched the participant’s preferences, and our results pages served relevant, curated content, a similar Celebrity personality, and even a secondary play style.
Email collection allowed visitors to send their play style results to themselves and allowed opt-in to more personalized content. Our team worked quickly over three months to solidify the approach, choose the quiz method and weighting criteria of the questions, and design the eight play style pages, two landing pages, a homepage takeover, and supporting pages for the new campaign.
The Results
Play Quiz: Avg. session duration
3m 01s
Play Styles: Avg. session duration
2m 25s
Compared to Site: Avg. session duration
36s
Our approach to the campaign was to support the bottom of the funnel and give visitors coming from digital ads something useful. Given the wealth of content the Visit California website contains, these broad Play Style personas made visitors see themselves in California. It brought curated content to them and provided what we thought of as a personal homepage with relevant recommendations.
“Let’s Play” was the first part of a years-long brand campaign. We are already working on the campaign for 2025 which we hope will be even more engaging than the first!
The Brief
Simplifying Complexity without Losing Power
The biggest challenge as Oomph acclimated to the tax-collection world was rapidly learning enough about the complex regulations and requirements of municipalities in the industry to provide sound advice and recommendations. We started by examining their systems — the workflow of documenting and planning new product features and adding them to the roadmap, of designing the UX of those features, and of leveraging their in-house design system to build and support those features.
RSI’s main product, GOVERNMENT PREMIER, are highly customizable and configurable. Every single screen has options that would display depending on the authenticated user’s role and privileges and the tenant’s own back-office processes. User stories included many requirements based on permissions and configuration. This added challenges when imagining potential interface solutions that need to accommodate growth in multiple directions.
Oomph’s purposefully used our outside perspective to ask many questions about GOVERNMENT PREMIER’s processes. We took our years of experience designing interfaces for a wide range of consumers and applied them here. In this typically slow-to-evolve space, a user-focused experience coupled with GOVERNMENT PREMIER’s technical expertise would revolutionize tax collection as a friendlier, more intuitive, and highly customizable experience.
Our Approach
Maintaining Consistency in a Rapidly Evolving Product
Our findings and recommendations indicated previous UX teams did not create a rulebook that governed their decisions, and so, the system lacked consistency. Quality Assurance reviews would suffer from this lack of governance as well. Therefore, the first thing we did was to establish rules to design by:
- Use Storybook as a source of truth, and expand atomic elements with larger patterns (called molecules in Atomic-design-speak).
- Enforce a global design token system for colors, typography, stateful user feedback, and spacing.
- Use Material UI (MUI) from Google as our foundation. This was a previous decision that was not fully enforced, which led elements to become over-engineered or duplicated. This became known as the “Build on the shoulders of giants” rule.
- Destructive actions (like Delete or Cancel) are placed to the left of creative actions, like “Save” or “Next.”
- Every screen has one primary focus. Complex screens need a focal point for the task and user’s need to feel confident they are using the interface correctly. When long forms are required, break them down into smaller chunks. Users can save their progress and concentrate on smaller groups of tasks. Color should be used to focus users on the most important actions, and to alert them when data errors need to be addressed.
Ultimately, these rules are flexible and have served well as a starting point. Any new screen can adhere to these rules, and when we find cases where these rules are preventing users from completing their tasks or are frequently confusing users, we revisit them to make updates or clarifications. Oomph has continued to consult on new screen design and UX workflows after more than a year of working together.
The Results
Setting a New North Star to Align Our Compasses
To continue to move the product forward without increasing UX and technical debt, the teams needed a well-defined shared understanding for the user experience. Internal teams were moving forward, but not always in the same direction. Within the first month, our teams agreed upon a playbook and then continued to expand it during our engagement. We met twice weekly with product owners across the company and became a sought-after resource when teams were planning new features.
During our time together, we have celebrated these outcomes:
- Oomph consolidated the color palette from 55 colors to just 24 without losing any necessary distinctions. All colors are contrast conformant with WCAG 2.2 Level AA as a baseline.
- Colors, typographic sizes, spacing values, form elements, buttons, icons, and shadows have all been converted to design tokens.
- Figma has been used as the design system record, while Storybook has been strengthened and updated to smartly leverage Material UI. The success of Storybook is largely due to its inclusion as a GOVERNMENT PREMIER project dependency — it has to be used and the latest version is often pinned as the product evolves.
- An internal Design Manager at RSI was established as someone to lead the engineering team and maintain quality oversight as it pertains to the design system.
- Oomph completed designs for 15 features for GOVERNMENT PREMIER, many of which involve designs for three or more screens or modals. Oomph also designed workflows for over a dozen Online Services workflows with a heavier emphasis on mobile-responsive solutions.
As Oomph moves into our second year collaborating with the GOVERNMENT PREMIER teams, we plan to fully investigate user personas on both the admin and taxpayer side of the platform, add more context and governance to the project designs, and provide quality assurance feedback on the working application. We value our partnership with this unique team of experts and look forward to continuing the tax software revolution.
The Brief
New Drupal, New Design
Migrating a massive site like healthdata.org is challenging enough, but implementing a new site design simultaneously made the process even more complex. IHME wanted a partner with the digital expertise to translate its internal design team’s page designs into a flexible, functional set of components — and then bring it all to life in the latest Drupal environment. Key goals included:
- Successfully moving the site from Drupal 7 to the latest release of Drupal
- Auditing and updating IHME’s extensive set of features to meet its authoring needs while staying within budget
- Translating the designs and style guide produced by the IHME team into accessible digital pages
- Enhancing site security by overhauling security endpoints, including an integration with SSO provider OneLogin
The Approach
The new healthdata.org site required a delicate balance of form and function. Oomph consulted closely with IHME on the front-end page designs, then produced a full component-based design system in Drupal that would allow the site’s content to shine now and in the future — all while achieving conformance with WCAG 2.1 standards.
Equipping IHME To Lead the Public Health Conversation
Collaborating on a Comprehensive Content Model
IHME needed the site to support a wide variety of content and give its team complete control over landing page layouts, but the organization had limited resources to achieve its ambitious goals. Oomph and IHME went through several rounds of content modeling and architecture diagramming to right-size the number and type of components. We converted their full-page designs into annotated flex content diagrams so IHME could see how the proposed flex-content architecture would function down to the field level. We also worked with the IHME team to build a comprehensive list of existing features — including out-of-the-box, plugins, and custom — and determine which ones to drop, replace, or upgrade. We then rewrote any custom features that made the grade for the Drupal migration.
Building Custom Teaser Modules
The IHME team’s design relied heavily on node teaser views to highlight articles, events, and other content resources. Depending on the teaser’s placement, each teaser needed to display different data — some displayed author names, for example, while others displayed only a journal title. Oomph built a module encompassing all of the different teaser rules IHME needed depending on the component the teaser was being displayed in. The teaser module we built even became the inspiration for the Shared Fields Display Settings module Oomph is developing for Drupal.
Creating a Fresh, Functional Design System
With IHME’s new content model in place, we used Layout Paragraphs in Drupal to build a full design system and component library for healthdata.org. Layout Paragraphs acts like a visual page builder, enabling the IHME team to construct feature rich pages using a drag and drop editor. We gave IHME added flexibility through customizable templates that make use of its extensive component library, as well as a customized slider layout that provides the team with even more display options.
You all are a fantastic team — professional yet personal; dedicated but not stressed; efficient, well-planned, and organized. Thank you so much and we look forward to more projects together in the future!
CHRIS ODELL Senior Product Manager: Digital Experience, University of Washington
The Results
Working to Make Citizens and Communities Healthier
IHME has long been a leader in population health, and its migration to the latest version of Drupal ensures it can lead for a long time. By working with Oomph to balance technical and design considerations at every step, IHME was able to transform its vision into a powerful and purposeful site — while giving its team the tools to showcase its ever-growing body of insights. The new healthdata.org has already received a Digital Health Award, cementing its reputation as an essential digital resource for the public health community.
From code to launch
Sites launched within a year
Performance improvement
THE BRIEF
A Fractured System
With a network of websites mired in old, outdated platforms, Rhode Island was already struggling to serve the communication needs of government agencies and their constituents. And then the pandemic hit.
COVID accelerated the demand for better, faster communication and greater efficiency amid the rapidly changing pandemic. It also spotlighted an opportunity to create a new centralized information hub. What the government needed was a single, cohesive design system that would allow departments to quickly publish and manage their own content, leverage a common and accessible design language, and use a central notification system to push shared content across multiple sites.
With timely, coordinated news and notifications plus a visually unified set of websites, a new design system could turn the state’s fragmented digital network into a trusted resource, especially in a time of crisis.
THE APPROACH
Custom Tools Leveraging Site Factory
A key goal was being able to quickly provision sites to new or existing agencies. Using Drupal 9 (and updated to Drupal 10) and Acquia’s Site Factory, we gave the state the ability to stand up a new site in just minutes. Batch commands create the site and add it to necessary syndication services; authors can then log in and start creating their own content.
We also created a set of custom tools for the state agencies, to facilitate content migration and distribution. An asynchronous hub-and-spoke syndication system allows sites to share content in a hierarchical manner (from parent to child sites), while a migration helper scrapes existing sites to ensure content is properly migrated from a database source.
Introducing Quahog: A RI.gov Design System
For organizations needing agility and efficiency, composable technology makes it easier to quickly adapt digital platforms as needs and conditions change. We focused on building a comprehensive, component-based visual design system using a strategy of common typography, predefined color themes and built-in user preferences to reinforce accessibility and inclusivity.
The Purpose of the Design System
The new, bespoke design system had to support four key factors: accessibility, user preferences, variation within a family of themes, and speedy performance.
Multiple color themes
Site authors choose from five color themes, each supporting light and dark mode viewing. Every theme was rigorously tested to conform with WCAG AA (and sometimes AAA), with each theme based on a palette of 27 colors (including grays) and 12 transparent colors.
User preferences
Site visitors can toggle between light or dark mode or use their own system preference, along with adjusting font sizes, line height, word spacing, and default language.
Mobile first
Knowing that many site visitors will be on mobile devices, each design component treats the mobile experience as a first-class counterpart to desktop.
Examples: The section menu sticks to the left side of the view port for easy access within sections; Downloads are clearly labelled with file type and human-readable file sizes in case someone has an unreliable network connection; galleries appear on mobile with any text labels stacked underneath and support swipe gestures, while the desktop version layers text over images and supports keyboard navigation.
High Accessibility
Every design pattern is accessible for screen readers and mobile devices. Color contrast, keyboard navigation, semantic labeling, and alt
text enforcement all contribute to a highly accessible site. Extra labels and help text have been added to add context to actions, while also following best practices for use of ARIA attributes.
Performance aware
Each page is given a performance budget, so design components are built as lightly as possible, using the least amount of code and relying on the smallest visual asset file sizes possible.
THE RESULTS
Efficient and Effective Paths to Communication
The first sites to launch on the new system, including covid.ri.gov, went live four and a half months after the first line of code was written. A total of 15 new sites were launched within just 8 months, all showing a 3-4x improvement in speed and performance compared with previous versions.
Every site now meets accessibility guidelines when authors adhere to training and best practices, with Lighthouse accessibility and best practice scores consistently above 95%. This means the content is available to a larger, more diverse audience. In addition, a WAF/CDN provider increases content delivery speeds and prevents downtime or slowdowns due to attacks or event-driven traffic spikes.
State agencies have been universally pleased with the new system, especially because it provides authors with an improved framework for content creation. By working with a finite set of tested design patterns, authors can visualize, preview, and deploy timely and consistent content more efficiently and effectively.
We were always impressed with the Oomph team’s breadth of technical knowledge and welcomed their UX expertise, however, what stood out the most to me was the great synergy that our team developed. All team members were committed to a common goal to create an exceptional, citizen-centered resource that would go above and beyond the technical and design expectations of both agencies and residents .
ROBERT MARTIN ETSS Web Services Manager, State of Rhode Island
THE BRIEF
While One Percent for America (OPA) had an admirable goal of helping eligible immigrants become U.S. citizens, the project faced a major stumbling block. Many immigrants had already been misled by various lending institutions, payday loans, or high-interest credit cards. As a result, the OPA platform would need a sense of trustworthiness and authority to shine through.
The platform also had to handle a broad array of tasks through a complex set of workflows, backstops, and software integrations. These tasks included delivering content, signing up users, verifying eligibility, connecting to financial institutions, managing loan data and investment balances, and electronically sending funds to U.S. Citizenship and Immigration Services.
THE APPROACH
Given the challenges, our work began with a month-long discovery process, probing deeper into the audience, competitive landscape, customer journeys, and technological requirements for the platform. Here’s what we learned.
The Borrower Experience
Among those deep in the citizenship process and close to finishing the paperwork, many are simply waiting to have the funds to conclude their journey. For them, we designed as simple a workflow as possible to create an account, pass a security check, and apply for a loan.
Other users who are just starting the process need to understand whether they’re eligible for citizenship and what the process entails. We knew this would require smart, in-depth content to answer their questions and provide guidance — which was also a crucial component in earning their trust. Giving away genuinely helpful information, combined with carefully chosen language and photography, helped lend authenticity to OPA’s stated mission.
The Investor Experience
OPA sought to crowdfund capital from small investors, not institutions, creating a community-led funding source that could scale to meet borrowers’ needs. A key innovation is that funders can choose between two options: making tax-deductible donations or short-term loans.
If an investor makes a loan, at the end of the term they can decide to reinvest for another term, turn the money into a donation, or withdraw the funds. To reinforce the circular nature of the platform, we designed the experience so that borrowers could become investors themselves. The platform makes it easy for borrowers to change their intent and access different tools. Maturity dates are prominently displayed alongside “Lend Again” and “Donate” actions. Testimonials from borrowers on the dashboard reinforce the kinds of people who are helped by an investment.
The Mobile Experience
Our research made it clear the mobile experience had to be best in class, as many users would either prefer using a phone or didn’t have regular access to a tablet or computer. But, that didn’t mean creating a mobile app in addition to a desktop website. Instead, by designing a universal web app, we built a more robust experience — more powerful than most mobile apps — that can be used anywhere, on any device.
However, tasks like signing up for an account or applying for a loan need to be as easy on a mobile device as on a desktop. Key UX elements like step-by-step workflows, large touch targets, generous spacing on form fields, soft colors, and easy-to-read fonts produced a highly user-friendly interface.
THE RESULTS
Together with our technology partners, Craftsman, Motionpoint, and Platform.sh, we built an innovative digital platform that meets its users exactly where they are, from both a technological and cultural standpoint.
This groundbreaking work earned us a Gold Medal from the inaugural 2022 Anthem Awards, in the Innovation in Human and Civil Rights category. The award recognizes new techniques and services that advance communities and boost contributory funds.
In our ongoing partnership with OPA, Oomph will continue working to expand the business model with new features. We’re proud to have helped build this impactful resource to support the community of new Americans.
THE BRIEF
A Creative Beacon Sets a New Path
The RISD Museum is the 20th largest art museum in the United States with over 100,000 objects in its collection, including Ancient art, costumes, textiles, painting, sculpture, contemporary art, furniture, photography, and more. The museum occupies more than 72,000 square feet in three historic and two contemporary buildings along Providence’s bustling South Main Street and riverfront.
We often say that a website redesign is more like a collective therapy session — it’s an opportunity to air grievances in a safe space, to think about the future untethered to the present situation, and make decisions that could change the course of the organization. Since many websites are more than just a marketing platform, a redesign can affect the entire organization and the way they communicate their value to their own team and the world.
At the heart of this project were large, existential questions:
What does it mean to be a physical institution collecting physical objects in a digital world?
What do viewers want out of a museum experience in an interactive space?
Can a museum be more relaxed about how viewers will interpret the work?
Open Source the Museum’s Entire Collection
Behind the Museum’s initiative to re-platform the website from a closed system to an open source system like Drupal 8 was another, perhaps even larger, initiative: a plan to “open source” the museum’s entire collection. They will bring all 100,000 objects online (they have a little over 13,000 available prior to launch, a mere 13%) and use a Creative Commons license system that allows visitors to download and repurpose high-resolution images whenever the objects are in the public domain. This was the heart of the revolution upon which the RISD Museum was about to embark.
THE APPROACH
MuseumPlus & Drupal 8 equals Open Access
The heavy lift for our engineers was an integration with RISD’s museum software, MuseumPlus. MuseumPlus needed to continue to be the source of truth for any object, artist, or exhibition. The teams again collaborated extensively to work towards an API that could provide all the correct information
between the two databases, and a system of daily jobs and manual overrides to start a synchronization process. As the online connection grows, these connections will be the critical link between the public-facing object data and the internal records.
The aesthetics of the site became a structural backdrop for the objects, artwork, and images of people in the physical spaces of the museum.
Gray and white wireframes evolved into a black and white interface that kept information clear and clean while allowing the colors of the artwork to shine through. Language around the site’s architecture was simplified and tested for clarity. An element of time — words like Soon, Upcoming, Now, Ongoing, Past — keeps the visitor grounded around the idea of a physical visit, while open access to objects online serves a whole community of art lovers and historians that may never be able to visit in person.
A bold storytelling idea came out of our collective collaborative process — the homepage experience opens with four videos, a cinematic exterior shot and three interior videos that explore the three main sections of the navigation. The homepage becomes a gateway into the physical space. Choosing a path via the navigation takes the viewer inside to explore the spaces and the objects. Instead of a homepage that assumes a visitor wants to see everything and then choose something to explore deeper, this one introduces them to the content in a way that connects them to the physical space.
THE RESULTS
An Evolving Partnership
Site visit patterns have seen significant improvement — sessions per user and pages per session have increased while bounce rate has decreased. Thanks are due in part to the new hosting environment with Acquia, which has provided hefty speed increases and stability — page load times have decreased, server response time is significantly less, and page download time is far less as well.
As the RISD Museum grows their online collection even further, we have identified a backlog of ideas that we’d love to address, from a more fully featured search, an integrated audio guide, and a more open and collaborative way for users to share back what they have done with the museum’s assets. A new Drupal 8 (now 10) implementation gives the museum plenty of room to grow virtually. The collaborative relationship between Oomph and the RISD Museum is only beginning.
Humans encounter thousands of words every day. As a website owner, that means your site content is vying for your user’s attention alongside emails from their colleagues, the novel on their nightstand, and even the permission slip scrunched at the bottom of their kid’s backpack.
How do you cut through the clutter to create site content that people actually want to read?
While you may already be choosing topics that are the most interesting and relevant for your audience, the structure of your writing may not be optimized for how people read. By understanding your audience’s reading behaviors following best practices for readability and accessibility, you can make sure your content works with people’s natural tendencies – not against them – to create a more engaging digital experience. An added bonus: Google shares many of those same tendencies, so content that’s designed well for humans is also more likely to perform well for organic SEO.
As a digital platform partner to many clients with content-rich sites, Oomph often works with brands to redesign their content for digital success. Here’s a look at the basic principles we apply to any site design – and how you can use them to your advantage.
How People Read Online
When we dive into a book, we typically settle in for a long haul, ready to soak up each chapter one by one. But when we open up a website, it’s more like scanning a newspaper or the entire bookshelf – we’re looking for something specific to catch our eye. We quickly scan, looking for anything that jumps out at us. If we see something interesting, then we’ll slow down and start reading in more detail.
Think of it like an animal following an information “scent,” identifying a mixture of clues that are likely to lead to the content you’re looking for. Most people will decide which pages to visit based on how likely the page will have the answer they’re looking for and how long it’s going to take to get the answer.
Users need to be hooked within a few moments of looking at a website or they’ll move on. They need to be able to identify and understand key factors like:
- The point of the information and why they should keep reading
- Whether they can trust the information and the source
- The type of content provided and any action expected from them, like signing up for an event
- How visually engaging and readable the content is
The takeaway for brands? Writing with your readers’ needs in mind is a way to show them you care and want to help them solve their problem. It’s also the key to achieving your site goals.
Your site content does more than just convey information – it’s about building trust, establishing rapport, and creating a connection that goes beyond the page. Whether you’re trying to sell a product or promote a cause, crafting content around your audience’s needs, desires, and preferences is the most effective way to compel them to take action. Here are four ways to set your website content up for success.
1. Put your data to work.
If you’re looking to refresh your current site, data can help you make informed choices about everything from your content strategy to your layout and design. Use digital reporting tools to answer questions like:
- Is our target audience visiting our site – and are other audiences visiting that we don’t know about yet?
- Which content do visitors download or engage with most frequently?
- What does a typical site visit look like? Are there places where users are getting stuck or bouncing off?
Google Analytics is a go-to tool for understanding the basics of who is visiting your site and how they’re engaging with your content. You can track metrics like session duration, traffic sources, and top-performing pages, all of which can help you better understand what your audience is looking for and what you want to tell them. (If you haven’t made the switch to Google Analytics’ latest platform, GA4, jump-start the process with our 12-step migration guide.)
Additional tools like Screaming Frog and Hotjar can give you even deeper insights, helping you track content structure and real-time user interactions.
2. Create a simple and consistent content structure.
When it comes to site content, consistency is like the foundation of a house (minus the power tools and hard hats).
A well-structured site not only helps users navigate and understand your content more easily, but also enhances the visual appeal and flow of the site. Think of it like a dance floor – you want your users to be able to move smoothly from one section to the next, without any awkward missteps.
That means focusing on shorter sentences, bullet points, and clear subheadings, all backed up by engaging visuals that serve as resting points for the eye. And while you’re at it, don’t forget to declutter your content — users don’t want to wade through a sea of unnecessary words just to find the nuggets of gold.
Ask yourself: Does this content flow smoothly, is it easy to scan, and does it make my key messages stand out? If the answer is yes, then you’re on your way to successful content.
3. Make sure visuals and content play nicely together.
When it comes to enhancing your content with visuals, the key is to strike a balance between style and substance. Your design should complement your content, not compete or distract from it.
Beyond their aesthetic appeal, well-designed visuals are important for creating a sense of credibility with users. Think back to the concept of information scent: If your design looks sloppy or inconsistent, users are less likely to trust the information you’re presenting. So make sure you’re using design elements wisely, creating ample white space, and avoiding anything that makes your content feel like a sales pitch.
4. Focus on accessibility.
When it comes to site content, accessibility can’t be ignored. Content should be engaging and informative and also conform to the , Website Content Accessibility Guidelines (WCAG). Tools like SortSite can help identify these issues and guide you toward accessibility success.
There are a number of things all sites need to consider:
- Using consistent text stylings, including text color, leading, kerning, and tracking.
- Design to support individuals with visual impairments, assistive technology like screen readers, and those that require navigation via the keyboard only
- Following heading orders and grouping content together to make it easier to scan. For example: Following a heading level 2 with a heading level 3 when the ideas are related, but starting with a new heading 2 if changing to a new section of thought.
- Using multiple methods to indicate action items and descriptive text for buttons and alternative text.
- PDFs can be useful, but are also big accessibility red flags, so it’s best to avoid using them when possible. If a PDF is a must, make sure it follows accessibility best practices.
Designing Engaging Content Doesn’t Need To Be a Full-Time Job
If you already have a library of content, auditing the content that already exists can be daunting. And sometimes, you need a little help from your friends. That’s where third-party experts (like us!) come in.
During our website discovery process, we use strategies like content and analytics audits, UX heuristics, and user journey mapping to help position client sites for success. We’ll help you identify areas for improvement, highlight opportunities for growth, and guide you toward achieving content greatness.
Ready for a fresh perspective on your content? We’d love to talk about it.
Have you ever tried to buy tickets to a concert and experienced the frustration and eventual rage of waiting for pages to load, unresponsive pages, unclear next steps, timers counting down, or buttons not working to submit — and you probably still walked away with zero tickets? Yeah, you probably had some choice words, and your keyboard and mouse might have suffered your ire in the process.
As a website owner, you strive to create a seamless user experience for your audience. Ideally, one that doesn’t involve them preparing to star in their own version of the printer scene in Office Space. Despite your best efforts, there will be times when users get frustrated due to slow page loads, broken links, navigation loops, or any other technical issues. This frustration can lead to what the industry calls “rage clicks” and “thrashed cursors.” When your users are driven to these actions, your website’s reputation, engagement, and return visits can be damaged. Let’s dig in to discuss what rage clicks and thrashed cursors are and how to deal with frustrated users.
First of all, what are Rage Clicks?
Rage clicks are when a user repeatedly clicks on a button or link when it fails to respond immediately — the interface offers no feedback that their first click did something. This bad user experience doesn’t motivate them to return for more. These clicks are likely often accompanied by loud and audible sighs, groans, or even yelling. “Come on, just GO!” might ring a bell if you’ve ever been in this situation. Rage clicks are one of the most frustrating things a user can experience when using a website or app.
Rage Clicks are defined technically by establishing that:
- At least three clicks take place
- These three clicks happen within a two-second time frame
- All clicks occur within a 100px radius
Similarly, what is a Thrashed Cursor?
A thrashed cursor is when a user moves the cursor back and forth over a page or element, indicating impatience or confusion. Various issues, including slow page load times, broken links, unresponsive buttons, and unclear navigation, can cause users to exhibit these digital behaviors. It can also indicate the user is about to leave the site if they cannot find that solution quickly.
Thrashed cursors are defined technically by establishing that:
- There is an area on the page where a user was moving their mouse erratically
- An established pattern of “thrashing” occurs around or on specific elements or pages
- Higher rate of user exits from the identified pages
Why do Rage Clicks and Thrashed Cursor happen?
Common reasons rage clicks and thrashed cursors happen are:
- Poor Design: Poor design is one of the most common reasons for rage clicks and thrashed cursors. If the website has a confusing layout or navigation structure, it can be frustrating for users to find what they’re looking for. Or, they may assume an element is clickable; when it’s not, it can be irksome. Underlined text is an excellent example, as users often associate underlines with links.
- Technical Issues: Technical issues such as slow loading times, broken links, or non-responsive buttons can cause rage clicks and thrashed cursors. Users expect the website to work correctly; when it doesn’t, they can become annoyed or frustrated. If they click a button, they expect the button to do something.
- Lack of Clarity: If the website’s content is unclear or poorly written, it can cause confusion and frustration for users. They may struggle to understand the information provided or find it challenging to complete the intended action. Content loops can be a good example of this. Content loops happen when users repeatedly go back and forth between pages or sections of a website, trying to find the information they need. Eventually, they’ll become frustrated, leading to this user leaving the website.
How do you resolve issues that lead to Rage Clicks and Thrashed Cursors?
Now that we know what rage clicks and thrashed cursors are and why they happen, how do you resolve it, you may be asking. Here are a few things an agency partner can help you with that can significantly reduce the risk of your users resorting to these behaviors.
Use Performance Measuring Tools
By employing performance measuring, you can analyze the data collected, gain valuable insights into how users interact with your platform, and identify areas for improvement. For example, if you notice a high number of rage clicks on a specific button or link, it may indicate that users are confused about its functionality or that it’s not working correctly. Similarly, if you see a high number of thrashed cursors on a particular page, it may suggest that users are struggling to navigate or find the information they need.
Tools that support Friction or Frustration measurement:
- Clarity (from Microsoft)
- ContentSquare
- Heap
- HotJar
- Mouseflow
- Quantum Metric
Conduct User Experience Exercises and Testing
Identifying the root causes of rage clicks and thrashed cursors can be done through a UX audit. An agency can examine your website design, functionality, and usability, identifying areas of improvement.
- User Journey Mapping: User journey mapping involves mapping the user’s journey through your website from a starting point to a goal, identifying pain points along the way, and determining where users may get stuck or frustrated.
- Usability Testing: Usability testing involves putting the website in front of real users and giving them tasks to complete. The tester then looks to identify issues, such as slow loading times, broken links, or confusing navigation.
- User Surveys: User surveys can be conducted in various ways, including online surveys, in-person interviews, and focus groups. These surveys can be designed to gather information about users’ perceptions of the website, interactions with the website, and satisfaction levels. Questions can be designed to identify areas of frustration, such as difficult-to-find information, slow page load times, or confusing navigation. It’s wise to keep surveys short, so work with your agency to select the questions to garner the best feedback.
- Heat Mapping: Heat mapping involves analyzing user behavior on your website, identifying where users are clicking, scrolling, and spending their time. This can identify areas of the website that are causing frustration and leading to rage clicks and thrashed cursors.
Focus on Website Speed Optimization
A digital agency can synthesize findings from UX research and performance-measuring tools and work to optimize your website for quicker page loads and buttons or links that respond immediately to user actions.
- Image Optimization: Optimizing images on your website will significantly improve page loading times. An agency can help you optimize server settings and compress images to reduce their size without sacrificing quality.
- Minification: Minification involves reducing the size of HTML, CSS, and JavaScript files by removing unnecessary characters such as white space, comments, and line breaks. This can significantly improve page loading times.
- Caching: Caching involves storing frequently accessed website data on a user’s device, reducing the need for data retrieval and improving website speed.
- Content Delivery Network (CDN): A CDN is a network of servers distributed worldwide that store website data, improving website speed by reducing the distance between the user and the server.
- Server Optimization: Server optimization involves optimizing server settings and configurations, such as increasing server resources, using a faster server, and reducing request response time. Website owners frequently skip this step and don’t select the right hosting plan, which can cost more money through lost users and lower conversions.
Resolve Technical Issues
A web agency can help resolve any technical issues that may be causing frustration for your users. These issues may include broken links or buttons, 404 errors, slow page load times, and server errors. Technical issue resolution can involve various activities, including code optimization, server maintenance, and bug fixes that work to ensure that everything is working correctly and address any issues that arise promptly. The resolution of technical issues will improve website performance, reducing the likelihood of user frustration and rage clicks.
Next Steps
User frustration can negatively impact user satisfaction and business outcomes. Partnering with a digital agency can be a valuable investment to mitigate these issues. Through the use of tools, UX audits, user surveys, website speed optimization, and technical issue resolution, a digital agency can identify and address the root causes of user frustration, improving the overall user experience — leading to an increase in user engagement, satisfaction, and loyalty, which means improved conversion rates, higher customer retention, and ultimately, increased revenue for your business.
If your customers are hulking out, maybe it’s time to call us!
THE BRIEF
Connecting People and Planet
NEEF’s website is the gateway that connects its audiences to a vast array of learning experiences – but its existing platform was falling short. The organization needed more visually interesting resources and content, but it also knew its legacy Drupal site couldn’t keep up.
NEEF wanted to build a more powerful platform that could seamlessly:
- Communicate its mission and showcase its impact to inspire potential funders
- Broaden its audience reach through enhanced accessibility, content, and SEO
- Be a valuable resource by providing useful and engaging content, maps, toolkits, and online courses
- Build relationships by engaging users on the front end with easy-to-use content, then seamlessly channeling that data into back-end functionality for user-based tracking
THE APPROACH
Strategy is the foundation for effective digital experiences and the intuitive designs they require. Oomph first honed in on NEEF’s key goals, then implemented a plan to meet them: leveraging existing features that work, adding critical front- and back-end capabilities, and packaging it all in an engaging, user-centric new website.
Information architecture is at the core of user experience (UX). We focused on organizing NEEF’s information to make it more accessible and appealing to its core audiences: educators, conservationists, nonprofits, and partners. Our designers then transformed that strategy into strategic wireframes and dynamic designs, all of which we developed into a custom Drupal site.
The New NEEF: User-Centered Design
A Custom Site To Fuel Connection
NEEF needed a digital platform as unique as its organization, which is why Oomph ultimately delivered a suite of custom components designed to accommodate a variety of content needs.
Engaging and thoughtful design
NEEF’s new user experience is simple and streamlined. Visual cues aid in wayfinding (all Explore pages follow the same hero structure, for example), while imagery, micro-interactions (such as hover effects) and a bold color palette draw the user in. The UX also emphasizes accessibility and inclusivity; the high contrast between the font colors and the background make the website more readable for people with visual impairments, while people with different skin tones can now see themselves represented in NEEF’s new library of 100 custom icons.
Topic-based browsing
From water conservation to climate change, visitors often come to the NEEF site to learn about a specific subject. We overhauled NEEF’s existing site map to include topic-based browsing, with pages that roll resources, storytelling, and NEEF’s impact into one cohesive package. Additional links in the footer also make it easier for specific audiences to find information, such as nonprofits seeking grants or teachers looking for educational materials.
NPLD-hosted resources and event locator
Oomph refreshed existing components and added new ones to support one of NEEF’s flagship programs, National Public Lands Day (NPLD). People interested in hosting an event could use the new components to easily set one up, have their own dashboard to manage, and add their event to NEEF’s event locator. Once the event has passed, it’s automatically unlisted from the locator — but archived so hosts can duplicate and relaunch the event in future years.
THE RESULTS
Protecting the Planet, One User at a Time
Oomph helped NEEF launch its beautiful, engaging, and interactive site in May 2023. Within three months, NEEF’s team had built more than 100 new landing pages using the new component library, furthering its goal to build deeper connections with its audiences.
As NEEF’s digital presence continues to grow, so will its impact — all with the new custom site as its foundation.