design Sprint
Microsoft Copilot redesign:
A team project applying Google Design Sprint to improve the shopping flow
Overview
This project was completed as a three-person team design sprint for HCC 629: Fundamentals of Human-Centered Computing. Our team evaluated Microsoft Copilot, identified usability issues, generated redesign ideas, built a prototype, and tested whether users could complete a shopping-related task more efficiently.
I participated in the full sprint process, including problem analysis, ideation, group discussion, prototype iteration, and user testing. In the Figma design phase, my main contribution focused on the Shopping Page sketches and redesign.
To structure the project, we followed five sprint phases: unpack, sketch, decide, prototype, and test. This helped us move from broad usability problems to a focused redesign direction for Copilot’s landing page, sidebar, and shopping flow.
Unpack
We explored Microsoft Copilot as a group, including the experience before and after signing in, the side navigation, settings, content creation, saved content, and connected-system features such as calendar or email access. Our target audience was a busy student who wants help gathering and synthesizing information, while still being able to explore results independently.
Sketch
Each team member created redesign sketches based on the issues we found. The sketches explored problems such as weak Information Scent, Visibility, Fitts’ Law, Gulf of execution, Gulf of evaluation, Feedback, Consistency, and Memorability.
Problems in Original Design
When using the search bar, suggested keywords appear as the user types. Although users can navigate these suggestions using the keyboard and press Enter, there is no clear visual feedback indicating which suggestion is selected. When Enter is pressed, the selected suggestion briefly flashes in the search bar, but the search results still reflect the originally typed query instead of the selected suggestion.
My Design Improvements
The redesign highlights the selected search suggestion during keyboard navigation and ensures that pressing Enter applies the selected suggestion as the search query.
Constraints
Constraints are design limits that control what users can and cannot do, helping them avoid invalid actions.
Problems in Original Design
On the “New Arrivals” page, some products appear identical to purchasable items even though they are not yet available. Users only discover the “Coming Soon” restriction after clicking into the product page, which can feel unexpected and waste time.
My Design Improvements
Instead of only showing “Coming Soon / Notify Me” on the product page, the redesign moves this information one step earlier to the product list page. This way, users can see that the item is not available before clicking into it.
Why it’s better
By showing the same limitation earlier, users do not have to click into a product just to find out they cannot buy it. This makes the browsing experience clearer and avoids unnecessary clicks and frustration by revealing constraints earlier in the interaction flow (Norman, D., The design of everyday things).
Consistency
Consistency means using the same patterns across the interface so users do not have to relearn how things work.
Problems in Original Design
On the desktop version of Zara’s website, the layout options are represented as “View 1 2 3,” which does not clearly indicate how the product layout will change. In contrast, the mobile version uses layout icons (such as grid view) that visually show the arrangement. This inconsistency across platforms makes the interaction harder to understand.
My Design Improvements
The desktop version is redesigned to use the same layout icons as the mobile version (e.g., grid and list view icons) instead of numeric labels. This creates a consistent way to switch layouts across devices.
Why it’s better
Using the same icons across platforms reduces confusion and learning effort. Users can immediately recognize what each layout option does without trial and error, making the experience more intuitive.
“When things always behave the same, users don't have to worry about what will happen. Instead, they know what will happen based on earlier experience. -- Jakob Neilsen”.
Reflection / Lessons Learned
Through this project, I realized that even small interaction details can significantly impact the user experience.
Before this assignment, I often focused more on visual design. However, this project helped me understand that usability is not just about how things look, but how clearly the system communicates with users.
I also learned how important it is to apply design principles such as visibility, feedback, and consistency in a practical way. These principles helped me analyze problems more systematically instead of relying only on intuition.
In the future, I want to continue improving my ability to connect design theory with real interface design, and create products that are not only visually appealing but also easy and intuitive to use.