Redesigning VIDA’s Website to boost visibility and drive high-converting leads
PRODUCT
Website
UX/UI
Design System
TEAM
Designer (me)
Copywriter
Developer
Marketing
MY ROLE
I led the redesign from the beginning of the process up until the launch
TIMELINE
July to November 2024
OVERVIEW
VIDA is a leading software platform to monitor impact for climate and people
This case study highlights how I integrated design thinking with strategic marketing to align the website with VIDA’s evolving goals – emphasising the platform’s capabilities to boost lead generation and user conversion.
Although a previous design existed, VIDA had since launched new features and refined its value proposition, which were not reflected in the previous website. In this project, I redesigned the website, ensuring these updates were effectively communicated to better resonate with the target audience and enhance visibility.
OUTCOMES
Showcased VIDA's two primary solutions to users
By designing two new dedicated pages
Highlighted VIDA's data focused solutions
By showcasing VIDA's datasets and dataset details
Improved lead pipeline
By redesigning CTAs and newsletter subscription
THE CHALLENGES
Identifying the gap
VIDA's previous website didn’t clearly communicate VIDA’s two distinct solutions and audiences, causing user confusion and marketing challenges. My primary task was to clarify the solutions, educate users, and support the marketing team in meeting business objectives.
How I supported the marketing team
By understanding the insights from the two marketing teams, the main expectation for the website was to generate more leads that could be potential platform users. To achieve this, I focused on two strategies: encouraging users to click “Book a Demo” or subscribe to the newsletter.
INSIGHTS
Requirements turned into opportunities
After identifying users' challenges and VIDA's main business goals, I outlined new sections to include in the redesign.
"How might we design an informative, high-converting website that clearly showcases VIDA’s offerings?"
IDEATION
My design frameworks
From the problem statements and research insights, I shaped guiding approaches that defined the design’s key characteristics.
Designing seamless flow of information
As users couldn’t grasp VIDA’s two solutions and markets, Climate-Intelligent and People-Centric Infrastructure, the previous website lacked clarity. The redesign introduces “Solutions” pages to clearly communicate them.
Sections as blocks
I designed sections and cards as reusable blocks, as scalable components with auto-layout, ensuring consistency across pages and making development faster and easier.
Designing the flows
After defining the information architecture and receiving some feedback from the team, I started designing the wireframe to better understand the user flow. During this process, I collaborated closely with the copywriter and we conducted several feedback sessions with the marketing teams that represent both users from both solutions.
FINAL DESIGN
Designing new sections to showcase VIDA
New sections are defined based on the problem statement and insights from the research. After designing the flow with the wireframes, it's now time to detail the new sections.
Solution pages
New solution pages are the main objective in this redesign project. "Solutions" are placed in the navigation menu to replace the "Stories" which now we renamed into "Use cases" that is placed in each solution page.
Dataset
VIDA is a data-focused company specialising in climate-intelligent and people-centric infrastructure. To highlight this, I designed a comprehensive Dataset section that outlines the types of data VIDA covers. This includes a detailed, interactive Data page where users can explore open datasets from VIDA’s database, access dataset definitions, and view their sources.
Regulatory reporting
To support VIDA’s role in ESG and climate compliance reporting, I designed a dedicated step-by-step guide to demonstrate how users can perform reporting on the platform. Additionally, I enhanced the existing “Features” section by incorporating “Disclosure Readiness” as a key step offered by VIDA.
Testimonials
To enhance VIDA’s credibility and reassure users, I incorporated a Testimonials section featuring feedback from both current and former platform users.
Resources
To enhance VIDA’s credibility and demonstrate its expertise, I designed a Resources section featuring comprehensive reports and engaging webinars. Users can access these resources by submitting their information, facilitating lead generation while providing valuable insights.
Improved CTA
In addition to adding the "Book a Demo" button in the Hero section, I introduced a "Talk to Us" button on the login page. This addition, absent in the previous design, significantly boosted lead generation by offering users a direct and immediate way to engage with the marketing team.
REFLECTIONS
What I learned
Design meet business goals
As a designer, my role is to address user challenges while aligning with business objectives. In this project, prioritising user needs was key to enhancing their understanding of VIDA and driving lead generation.
Design and development are not separate disciplines
By collaborating with the developer and understanding how the website was built, I was able to make more informed design decisions and ship faster.
