Green Energy Foundation
I was brought into a highly specialized project for a sustainable energy solutions provider offering a suite of five complex products spanning hardware, SaaS, and IaaS models. Each product addressed distinct use cases — from grid infrastructure and energy trading to data monitoring and operations management.My role focused strictly on the UX phase of the project: conducting deep research, synthesizing complex technical data, and delivering wireframes, design logic, and annotated documentation for the UI and development teams. The challenge was to bridge technical specificity with clarity, helping diverse user groups understand each product’s value without oversimplifying critical functionality.
Type
Research, Analytics, Wireframes
Tools
Figma
Team Size
1 UX Designer (me), 1 UI Designer, PM, Marketing Manager
Date
2024
Scroll pictures to see more -->
Goals & Constraints
The client’s internal team had already defined a high-level sitemap and outlined their strategic business goals. My task was to build upon this foundation - aligning it with nuanced user research, product capabilities, and real-world usage patterns.
Key objectives included:
Translating extremely technical product information into clear, value-driven messaging
Mapping five primary products to 15+ user sub-groups, each with different levels of expertise and goals
Creating a scalable wireframe system that could support future UI expansion and automation
Ensuring the product showcase page could serve both executive buyers and technical stakeholders
Research Approach
The project required me to immerse myself in an entirely unfamiliar and technically dense industry. I took a layered research approach that blended client-provided assets with self-initiated deep dives.
My research process included:
Desk research: Studied internal documentation, technical product sheets, and customer-facing materials
Product immersion: Conducted demo walkthroughs and technical feature mapping for all five products
User persona expansion: Refined and validated user types based on existing data, job roles, and product interactions
Heatmap analysis: Assessed legacy site behavior to identify scroll drop-off, navigation confusion, and underperforming content areas
Competitive benchmarking: Compared product positioning and presentation across key industry competitors to uncover UX gaps and storytelling opportunities
Analysis & Synthesis
I translated raw data into actionable insights through a set of structured, cross-referenced deliverables:
Key deliverables included:
A Research Report consolidating user goals, needs, pain points, and opportunities
A Product Matrix connecting each product’s features with relevant user segments and value propositions
A Strategic Alignment Map linking user needs and business objectives to individual sections of the planned product pages
My analysis focused on the interplay between:
Product function and user comprehension
Technical language and communication clarity
Audience segmentation and narrative pathways
Business value and conversion signals
Each user segment was analyzed by:
Role and responsibilities (e.g., QA Manager, Asset Manager, Trader, Technician)
Technical expertise level
Goals, blockers, workflows, and tool preferences
How they interact with and evaluate the products
This mapping helped inform layered content design - providing just enough information at each step based on role and context.
UX Strategy & Wireframe Design
Instead of jumping into interface visuals, I focused on creating a content logic framework that could support the future UI. I took a goal-oriented, user-behavior-first approach across wireframes.
Core strategy decisions I made:
Developed two navigational entry paths for each product: one for business decision-makers, another for technical users
Structured every product page around four critical sections:
1. Who it’s for – role-specific audience callouts
2. Why it matters – value proposition driven by user goals
3. How it works – product capabilities and feature breakdown
4. How it connects – integration into existing systems, use cases
1. Who it’s for – role-specific audience callouts
2. Why it matters – value proposition driven by user goals
3. How it works – product capabilities and feature breakdown
4. How it connects – integration into existing systems, use cases
Recommended progressive disclosure techniques so users could access more detail without overwhelming first-time visitors
Designed layouts to support future automation and content modularity (e.g., product tiles reused across pages)
Handoff & Documentation
At the end of the UX phase, I delivered:
Research Report documenting entire research done for this project
Analytical Report documenting all findings, opportunities and needs
A complete wireframe set for each product showcase page and core navigation components
UX-focused content and copy recommendations tailored to user expertise levels
A detailed annotation file for UI designers and developers, outlining interaction logic, user pathways, and component relationships
Strategic recommendations on how to handle varying levels of technical literacy through layout, content depth, and design tone
The final deliverables created a scalable foundation that would allow future UI designers to confidently apply brand visuals while maintaining UX intent.
