Template Refreshment
For Onpoint Global - In collaboration with the UX/UI Team
A template for government help information sites, redesigned to improve conversion rates, featuring a streamlined user experience that makes accessing and applying for assistance programs easier and more engaging.
The Problem
The original website template design was created several years ago to offer a free guide on how to apply for different government services (and other financial information). The same template was used across numerous domains, but it was no longer converting as well as it once had. Compliance limitations made any adjustments in the page challenging, while several elements on the site appeared broken, making the user experience increasingly worse.
Previous Version
The Proposed Solution
The idea was to make a quick site redesign (which we called "Refreshment") in a way that we could increase our metrics and make a more modern design, without loosing our current template implementation and making sure we were compliant with FTC requirements for government information sites.
What
A simple redesign of our government help information template.
Who
Individuals who need to apply for any program of government assistance but can't find all the information easily and often find the process confusing if they try to apply on their own.
When/Where
Website
The Analysis
After reviewing the original design along with heatmaps and user recordings, several key issues were identified:
-
Unclear value proposition: It was not clear to the user why they were asked to provide their email.
-
Confusing layout: The site’s layout did not effectively communicate the primary offer and did not guide users to the next steps.
-
Poor user flow: Users struggled to navigate the site and reach the conversion point easily.
-
Non-working features: Various site elements were not functioning as intended, negatively impacting the experience and conversion rates.
Wireframing
During the wireframing phase of Refreshment, our primary goal was to simplify and clarify the user experience while overcoming the compliance constraints. We started with basic layouts, focusing on improving user flow and presenting information more clearly.
Key ideas integrated into the new design included:
-
Rearranging and rewriting content: Making clear what the user will receive after submitting their information, highlighting it's advantages upfront.
-
Highlighting key product perks: Ensuring users understand the benefits without confusing them when they submit their info.
-
Multiple CTAs: Including several points where users can navigate to the landing page, like a sticky element that keeps this primary goal in focus.
-
Compliance workarounds: Adjusting the design to appear fresh, turning constraints into visual features while staying compliant.
Creative Direction
After finalizing the wireframes, we started exploring visual references to update the design while keeping it easy to navigate. Maintaining the primary blue color was a requirement since it was already established with the brands and resonated well with the government topics.
We aimed to present the brand as Reliable, Modern, and Approachable. To emphasize the modern aspect, we experimented with organic, water-like shapes for a smoother flow. Additionally, we carefully selected realistic imagery that reflected both the broad audience of the sites and the product itself.
Visual Design
After defining the visual elements, I incorporated them into the approved structure to create a cohesive and engaging design. The organic shapes were strategically placed to enhance the flow between sections, breaking the rigidity of the previous layout.
We refined the imagery to ensure it reflected both the audience and the product, adding warmth and relatability. The color palette was defined and applied thoughtfully to both reinforce brand recognition and ensure that the call-to-action buttons were eye-catching and intuitive to easily interact with the primary objective of the site.
Testing
We began testing the new design by implementing it on a few high-traffic sites to observe its impact on conversion rates through A/B testing.
After two weeks of gathering data, it was evident that the redesigned version significantly outperformed the original, with over 20% increase in conversion rates. Once the success of the new design was confirmed, we proceeded with its implementation across all remaining sites, ensuring a consistent improvement in user engagement and conversions.
20%
Increase in Conversion Rate
Conclusion
Working on the Refreshment project was both challenging and rewarding. I faced the complexity of redesigning a government information site while adhering to strict compliance constraints, which pushed me to find creative solutions within those limitations. Leading the initiative to improve conversion rates while enhancing user clarity taught me a great deal about balancing business goals with user needs. The collaborative effort, from wireframing to visual design and testing, gave me the opportunity to refine my skills in problem-solving, communication, and iterative design processes.