Role Sole UX Designer, owning end-to-end research, design, and stakeholder alignment
Mentors Jeff Goodwin (Manager), Tosh Sano, Yiming Lyu
Timeline May - August (2023)
Platform Desktop (MATLAB-integrated app)
Project Overview
Designing a scalable future for MATLAB's app-building tool
300+
Analyzed over 300 internal customer complaints reports to understand the product and the issues.
4/7
features from my proposal added to the product roadmap
8/∞
Participated in and incorporated feedback from design reviews, undergoing 8 iterations.
CONTEXT
What is App Designer and why do users use it?
App Designer is a visual environment for building interactive MATLAB apps using drag-and-drop components and integrated code.
With an estimated 3 million potential users, it holds strong reach—but its outdated interface and steep learning curve deter many, especially newcomers, from adopting it as their go-to prototyping tool.
SCOPE
Uncovering the 'Why' behind the redesign
The prompt to "modernize App Designer" was intentionally broad. I reframed the problem by asking "Why?" and conducted stakeholder interviews to uncover:
HOW MIGHT WE?
PRIMARY RESEARCH
Exploring the Research Landscape
Once the ‘Why’ was established, I delved into a comprehensive research phase. The steps I took included:
CONSTRAINTS
Balancing legacy infrastructure with strategic innovation
Working within a legacy system
Developers requested minimal changes to the underlying information architecture. I was to focus on visual and interaction-level improvements.
Alignment with MATLAB's visual future
I consulted senior visual designers from the MATLAB team to understand their evolving design language. This informed my choices for color, iconography, and layout.
PRIORITIZING RESEARCH INSIGHTS
Grounding design direction in real user pain points
I led a workshop with two UXRs to map findings on a Functionality vs. Visual Design impact matrix.
This helped me identify high-ROI updates.
IDEATION & EXPLORING THE POSSIBILITIES
Wireframes
Reiteration Based on Feedback
Switched to lightweight iconography and modular spacing
Pitched bolder, fluid layout concepts
Reimagined App Designer as a modern, scalable, flexible platform
FINAL RECOMMENDATION - 1
Skeleton Screen + Progress Bar
Collaborated with PM and developers to build a two-layer loading feedback system:
Skeleton screen mimics app layout while loading
Progress bar under toolbar gives real-time load status
Together, these reduce user anxiety and improve perceived performance.
RECOMMENDATION - 2
AI Copilot + Agent Model
Proposed dual-mode AI assistant:
Copilot helps with layout suggestions and callbacks
Agent autonomously generates logic-based app templates
RECOMMENDATION - 3
Dark mode toggle
Added a smooth dark mode toggle based on high user demand.
Why It Matters:
73% of devs prefer dark mode (Stack Overflow Survey)
Reduces eye strain in low-light environments
Enhances cognitive focus and modern appeal
Aligns with ongoing dark mode efforts in MATLAB
BEFORE AND AFTER
TESTING
Design reviews and user testing
These are some comments from design review sessions with six senior UX designers, where I iteratively refined my designs to align with team goals.
“I've noticed how the system consistently provides feedback on my status. This makes the app feel more intuitive, almost as if it's communicating directly with me.
”
“The elements appear less cluttered and cleaner. The new UI represents a significant improvement and aligns well with the direction we aim to move in.
”
“These improvements will enhance the user experience by maximizing screen real estate, offering more space for interaction.
”
WHAT MY TEAM SAID ABOUT MY WORK
OUTCOME
4 of 7 proposed features added to the App Designer roadmap
Influenced direction of MATLAB's future UI plans
Positioned App Designer to unlock engagement from over 3 million potential users, encouraging more of the MATLAB community to adopt it as their primary tool for app development
LEARNINGS
Reflections
Deep dive into industry insight and visual development
Initially grappling with the technology, I took a user-centric approach, exploring coding to grasp potential user hurdles. Conversations with App Designer users provided invaluable insights into their workflow challenges, enriching my understanding of industry and visual development landscapes.
Collaboration over isolation
My project highlighted the paramount importance of effective communication and collaboration with multiple stakeholders. Each stakeholder brought invaluable expertise and insights to the project, contributing to a more well-rounded and successful outcome. Learning through this collaborative process was truly enriching.
Balancing functionality and aesthetics
While visual design is crucial, it's vital to recognize when something is 'good enough' and shift focus to the broader functionality for added value.
BEHIND THE SCENES
A summer in Boston: The internship was also a lot of fun
The summer on the east coast was truly unforgettable. Not only did it get to work on cool things and make an impact, I had fun doing it. I tried karaoke, participated in a scavenger hunt and attended a soccer game between New England Revolution and Atlanta United!
I even competed in the Natick Hack Day, a MathWorks hackathon, where my team built a smart code editor with an AI assistant, and I contributed as a UX designer.