This is the design story of ESG Labs, the AI platform I helped build in just 3 months to tackle the complex daily ESG compliance challenges facing large global companies.
I directed UX research and product design, navigating significant uncertainty to produce an initial version that delivered key results.
Efficiency
95%
Slashed manual effort
Timeline
3mo
Delivered actionable MVP
Satisfaction
4/5
User satisfaction achieved
01. Challenge
It’s a regulation avalanche 😟
What's the problem?
To begin, I conducted discovery sessions with stakeholders to pinpoint the core challenges for CSOs.
- Overload: Chief Sustainability Officers (CSOs) and their teams are overwhelmed by the sheer volume of regulations, and complexity of global ESG rules.
- Inefficiency: They lack efficient, reliable tools to automatically identify applicable regulations across diverse jurisdictions and track ongoing changes.
- High stakes: This leads to significant time wasted on manual research, a high risk of non-compliance, resulting in fines and reputational damage.
It's like trying to find a needle in a haystack, but the haystack's on fire!
Ethan, CSO (top 10 multinational)
Ethan, CSO (top 10 multinational)
02. Project goals
Reducing manual effort by 95%
Clarity and direction
🎯 KPI: Reduced time spent on regulation discovery and increased accuracy of surfaced regulations.
Efficient decision making
🎯 KPI: Increase the number of potential compliance issues accurately flagged by the platform by 25%.
Comprehensive compliance
🎯 KPI: Achieved 4/5 average user satisfaction from post-beta surveys on platform usability and effectiveness.
Data transparency
🎯 KPI: Secure confirmation of willingness to pay from at least 60% of participating beta customers.
03. My role
Lead product designer
Insights
Led discovery
Interviewed customers for initial concept validation
Strategic planning
Led projects
Involved in ideation, planning and defining the product strategy
Execution and validation
Led delivery
Created user journeys, prototyping and delivered to engineering
My impact
- Deep user discovery: Uncovered three critical 'Jobs To Be Done' for CSOs via 50+ interviews and workshops.
- AI accelerated prototyping: Rapidly prototyped and validated concepts using Vercel's v0.
- Collaborative design sprints: Facilitated ideation workshops mapping the MVP journey with Product, Engineering and QA teams.
My design process
Step 1
Discovery
Validating with the customers
Validated the core problem of 'regulatory overload' through in-depth user interviews.
Step 2
Ideation
Engaging the team in the solution
Developed initial concepts and created low-fidelity wireframes for the dashboard and regulation discovery workflow.
Step 3
RITE
Increase of velocity of feedback
Built an interactive prototype and used the RITE method to quickly iterate on the design based on user feedback.
Step 4
Solution
Delivering and tracking the solution
Developed final high-fidelity UI and a style guide, working with engineering to ensure accurate implementation.
04. Research
Critical jobs steps
We mapped 19 key job steps in the user’s compliance journey. Within the area of ESG compliance, we pinpointed three job steps as the most relevant and urgent.
Job 1: Identify
The relevant internal policies, regulations, and standards for each product/company in each market.
Job 2: Interpret
The relevant regulations and standards to understand how they impact your products/company in each market.
Job 3: Stay on the top
Of upcoming changes in the relevant regulations or standards.
The JCAB program
Target user
CSO
Chief Sustainability Officer
Panel size
+20
Customers signed for the advisory program
Approach
50mins
In depth interviews
JCABs (Jobs-to-be-Done Customer Advisory Boards) are structured interviews or workshops that allow us to gain a deep understanding of user needs and inform product development.
Discovery questions
- Can you provide an overview of your role and key responsibilities?
- Explain your compliance process duration?
- Will today's screens enhance your efficiency?
- Would you use AI to streamline your process?
The product team working with the complex content we must design for
05. Ideation
How might we...
The major question was 'how might we' create an AI-powered ESG platform that simplifies compliance and empowers informed decision-making'
As the facilitator, I designed and ran this workshop to ensure we captured diverse perspectives from product, engineering, and QA.
Ideation workshop for MVP 1
Attendees
Product team, Engineering team and QA. I was the facilitator.
Objective
To build a shared understanding of what a seamless experience looks like for a Compliance executive in a ESG world. Collaboratively explore conceptual ideas for the Compliance Executive journey.
Task
Map out a best-in-class product that empowers ESG executives to confidently take the necessary steps to comply with ESG regulations, while prioritizing actions that have the most significant impact on their business
Groups
The team was split into three groups to make the session more manageable and give a chance for everyone to contribute to the session.
Takeaways from sessions
The team discussed and agreed on the app flow and the following approach:
- User centric approach
- Automation is crucial
- Data driven compliance
- Multiple compliance perspectives
- Granular action items
- Prioritisation based on risk and deadlines
- Ethical considerations
- Need for monitoring
Release timeline
The team also came up with a timeline of features we wanted to launch, from most critical with willingness to pay in mind at the beginning.
Benefits of AI driven prototyping
- Rapid prototyping: v0 quickly creates interactive prototypes, speeding up the creation of testable designs.
- Realistic content: Showing realistic content to customers saves time and is more meaningful.
- Easy prompting: Easy to use natural language prompts which allowing for flexible design exploration.
Concept one:
Visual dashboard
A traditional dashboard approach with rolled-up data and high-level summaries, emphasising charts and graphs.
Concept two:
Detailed content list
A content-rich list focused on providing specific regulatory information and actionable details, prioritising text and structured data.
06. Design approach
Actionable ESG intelligence
Beyond AI integration, our overall design approach was heavily influenced by the need for clarity and usability. This led us to adopt a content first strategy, prioritising clear and concise communication.
Collaboration: Balancing AI automation with human expertise
Balancing AI automation with human oversight for MVP compliance actions created initial tension. Engineering advocated for max AI efficiency, while Design, driven by user trust concerns, wanted robust human validation.
Through collaborative discussions, Engineering and Design combined a hybrid solution. AI now generates initial suggestions, but human experts retain control by validating these actions, effectively merging AI's speed with vital human oversight and building user confidence.
Designing for new AI interactions
AI has changed how I interact with technology. While fundamental design principles remain true, the evolution of AI interfaces demand a new approach to user interaction.
Suggestions
Sample suggestions guide users by offering potential next steps in a conversation, presented as a list of 3-5 options.
Primary sources
Providing specific reference points helps guide the AI's response, offering a richer dataset for analysis than a single prompt.
Nudges
Nudges provide in-app guidance, alerting users to AI features and how to utilize them effectively, especially during onboarding.
Citations
Citations enable users to trace information back to its origin, as AI aggregates data from multiple sources to provide comprehensive responses.
👉 View the collection of AI UX patterns
07. Solution
Delivering actionable intelligence
The final product delivers a user-friendly platform through clear visuals and intuitive design. It provides actionable insights, streamlines workflows, and allows for informed decision-making. The product was launched as a beta program with select customers, demonstrating their willingness to pay for its capabilities.
Onboarding
Welcome screen
User receive an email with the invitation to join Compliance Labs.
Data store location
Necessary to meet data protection regulations.
Company details
AI gathered publicly available information about the company.
Get started
AI identifies the relevant regulations and the app is ready to launch.
Learning from the PLG leaders
We analysed over 20 onboarding examples from product-led companies that excel at showing quick product value through straightforward web access.
The goal for the official Labs launch is to enable customers to start a trial directly from the website.
Onboarding flow
With the goal of enabling customers to start a trial directly from the website for the Labs launch, we developed the following intuitive four-step onboarding experience.
List view
- Clear categorisation: Regulations are grouped by risk level, making it easy for users to prioritise.
- Key information at a glance: Date added, regulation title, and a short summary are visible, allowing for quick scanning.
- Actionable elements: Compliance status indicators and 'Mark as not applicable' options are readily available, enabling efficient workflow management.
Action center
- Clarity and Hierarchy: Using visual cues like colour and typography to establish a clear hierarchy of information.
- Efficiency: Providing quick access to key actions and filters to streamline task management.
- Actionability: Making it easy for users to understand what needs to be done and take appropriate action.
Styles
Designing the beta version without a dedicated brand style guide, as the product will be rebranded, required a flexible approach. We selected generic colours and styles to ensure alignment with the company brand and the typical aesthetic of the ESG compliance world.
08. Impact
Happy beta customers 😊
Prior to piloting our new product with select customers, the team defined key metrics to measure our proposed streamlined compliance review process.
We created a Gainsight dashboard to track duration times for user actions (regulation searches, regulation assessments and status changes), session recording tool FullStory to review users interactions. We also gave customers a short questionnaire to complete.
The results...
Efficiency
95%
Reduction in manual compliant effort
Avg. regulations reviewed per session increased from 12 to 25!
Revenue
20%
Increase in willingness to pay
This shows that the platform's value proposition clearly resonated with our target audience 👏
Accuracy
34%
Increase in accurately flagged compliance issues
Enhanced relevancy driving proactive compliance.
Satisfaction
4/5
Average user satisfaction score
Customers loved that they could now see what was relevant for them and the system flagged what was most critical.
That's amazing. Quite frankly, it's not easy what you just did there.
John, former Head of Sustainability, Lexmark
John, former Head of Sustainability, Lexmark
09. Learnings
Evolving with AI
Core learnings
- Designers now have an extra layer of daily uncertainty when it comes to desiging for AI.
- The importance of frequent communication, especially with engineering and data team.
- There is a challenge of balancing the perceived 'magic' of AI with the need for user trust and expectations.
- Using AI to rapid prototyping speeded up our design time and made it easier to communciate the design vision to customers and engineering.
Future focus
- Spend more time user testing that is specifically focused on AI driven features.
- Explore how to visually explain AI decision making to communicate with users.
- Better onboarding experiences that explain the AI and its limitations.