Crowdsource Tool redesign
Empowering UCD students to improve their class comfort while learning about energy efficiency.
role
Design & Research
Timeline
Sept - Dec 2024
Organization
Davis Conservation Department
Tools
Figma, AdobeXD
results at a glance
users reporting new learning
90%
User Satisfaction
+65%
Final Design
Context
educate, impact, conserve.
TherMOOstat is a site collecting classroom temperature feedback to improve comfort and energy efficiency. Our team redesigned the site to educate users on energy conservation and show how input leads to real impact.
Project Scope
Explain energy concepts to users.
Show real impact of feedback.
Research, content restructure, UI.
Final site delivery.
The Problem
When I joined the project, the team was finalizing a three-map user experience. Users select one of three map versions to explore. I found this unnecessary and worried it would complicate things for students unfamiliar with the site.
Proposed map screen.
To validate my assumptions, I observed five students walk through these prototypes and recorded my findings.
initial testing
five students struggle to navigate
This quick test helped validate my initial assumptions. I created a task-based script and observed students as they walked through the experience, noting where the journey felt unclear. I synthesized my observations into these key pain points.
Pain Points
"Why are there three cows?"
"Isn't it the same stuff on each map?"
Too busy
Flow Friction
"I felt stuck on the screen."
designs fell short on education and impact
Navigation was confusing, so the interface didn’t read as a coherent journey. As a result, users could not explore educational content or understand how their feedback led to change.
next rendition
I then presented my findings to my team and was asked to create a redesign that dealt with the issues found. I began with an information synthesis.
information synthesis
I evaluated every content piece against our goals of educating and conserving energy and made keep, elevate, or cut decisions so only high-impact content remain.
Information Synthesis Chart
After discussing with my team, we landed on two focus areas for iteration: familiarity and education content.
Elements for success
No learning required
Users can use their prior experience with Google Maps to navigate the map.
education content priority
To increase engagement, educational content had to fit naturally into the experience.
To visualize the holistic experience for different users, I created two experience journeys.
experience journeys for two users
As a student at the university, I was immersed enough to recognize and create journey experiences for two re-emerging personas: the doubtful and potential users.
Experience journey map for the doubtful user persona.
time to ideate
Now that our team had a solid understanding of the high-impact information and ideal user experience, we proceeded to the ideation stage.
early concept
a unified map
A single map hub prioritizes high-impact education and data content.
Early concept of the map screen.
Success Stories
Explains energy concepts and shows impact of feedback.
building side bar
Displays key building information, similar to Google Maps.
one comfort tip
Lowered to sidebar to reflect priority in information hierarchy.
more feedback and improvements
To further reprioritize content for the final design, we had our original five tester students walk through the new journey and identified what stood out most to them.
Feedback submission CTA moved to the top.
Story bubble CTA redesigned as narrative card.
final design
The central map prioritizes success stories and building data.
Success stories follow someone's feedback and shows how our team fixed it.
looking back
Lessons Learned
communicate Early
Testing revealed all the content did not support our goal of education, among others. Narrowing our focus allowed us to better support our goals.
Validation testing
We tested with 20 UC Davis students to validate our designs. Here are the results.
Map Markers
85% understood vote size and color.
Vote Breakdown Graph
65% reported improved understanding of temperature trends.
Map Filters
75% found filtering intuitive and useful.
success stories
85% learned about heating and cooling.
Validation testing
We tested with 20 UC Davis students to validate our designs. Here are the results.
Map Markers
85% understood vote size and color.
Vote Breakdown Graph
65% reported improved understanding of temperature trends.
Map Filters
75% found filtering intuitive and useful.
success stories
85% learned about heating and cooling.
