Immersive Events in Teams
Microsoft Mesh is a platform that enhances remote collaboration in mixed reality. Mesh allows people in different physical locations, using various devices, to participate and collaborate in a shared immersive space.
As part of the efforts to better integrate Mesh Immersive Experiences within the Teams ecosystem, I led UI and system design work for creating the new immersive events in Teams. This work simplified Mesh’s product offerings and improved discoverability and accessibility for users, by presenting all the benefits of spatial co-presence and immersive remote collaboration from Mesh within the recognizable confines of Teams.
I framed this new experience and how it fits in with existing Teams events and meetings and then created all the UI needed for the experience. Major areas of focus for the end-to-end experience here were the UI for scheduling and managing immersive events as a host, along with the UI for joining and experiencing an event as an attendee, while also accounting for small edge case scenarios and how to best onboard users to these new experiences. I meticulously reviewed all the existing UI systems from Mesh, built with Mixed Reality Design Language and translated each control type and pattern into new UI systems for Teams, using the Fluent design language and established Teams UI patterns. I also documented detailed information architecture for these product changes.
UI Manipulations on PC
Using Figma, I designed the interactions for moving individual UI panels around the screen in the Mesh app for PC.
To keep the experience consistent with the behavior found across other apps in Windows, I determined that users should only grab individual panels by the top title bars. Since the system mouse cursor is replaced by a custom cursor in the Mesh app, I also incorporated a grab state for the cursor to increase visibility for this new functionality. Additionally, in the event that there are multiple UI panels open at once, I added distinct visual states to the panels themselves to reflect whether they are in focus or not.
IndiBulk Online Grocery Serive
I designed the front-end of the website for IndiBulk, an online grocery delivery service from the early 2010s, before UberEast and Doordash cornered the market.
I used natural colors to invoke a sense of fresh and healthy food and created a simple ordering flow for customers, which enabled them to easily find the products they want and quickly proceed to checkout.