Engage in the ceremony with joy.

This was a project in collaboration with the With Joy company as part of The Pixel Project – a 6-week long design challenge. My team of 3 worked with mentors from the With Joy company to create new features and a new UI for the With Joy mobile application.


AKA: The wedding bells are ringing


With Joy came to us with an existing problem that they needed help solving. Though With Joy was a useful online platform for the bride and groom to share information and logistics of their wedding (e-invite, date/location, registry), there was a lack of engagement from the wedding attendees both before and during the wedding.

As Kamat, With Joy Manager and our mentor, informed us…

"Sometimes, users don’t feel like a part of the wedding, because let’s face it, they are not in the picture."

With Joy posed us a question: how can a friction-less mobile application be created to enable wedding attendees to interact with each other and feel more involved before, during, and after the wedding?


We looked at reviews from the existing users and we narrowed down how we will approach this. Through the 15 user reviews considered on the Apple Store, I formed a chart summarizing the pros and deltas.

chart 1-01

This gave a better sense of what should be kept, expanded upon, or improved upon in the With Joy application.  


It was crucial to understand and identify the social capital characteristics of our users. Attendees at weddings are composed of a unique mix of people. There are attendees that have very close relationships with each other, then there are attendees who have never met each other before. However, there is one aspect that brings them all together: their ties to the groom or bride.

We identified two social capital characteristics of our users:


+ Strong-tie relationships

+ Family, partners, close friends

+ Strong personal connections, provide emotional support


+ Weak-tie relationships

+ Previous co-workers, former classmates, your friend’s friend

+ Don’t share similar background, emotional reciprocity


Redesign the Joy mobile app and make it easier for guests to capture the “Joy” that happens at these special events. What other creative things can we do to photos/videos to let guests better express the Joy they experience at these events? How do we encourage guests to capture and share while making it friction-less?  


AKA: Learning from the professionals


During the initial stages of the design phase, the team and I had to consider iterating upon an already existing UI of the mobile application and with an established brand guideline in mind. There were also user pain points from the existing app to address in these iterations.

Stef _ Menu


After receiving feedback from our With Joy mentors on the wireframes, we created high-fidelity iterations with changes to the menu layout and agenda layout. The additional interactions such as tapping on the hamburger menu icon and swiping right to reveal additional information on the agenda was said to detract from a seamless experience that was desired by With Joy. I took this feedback and created the following high-fidelity prototypes of the With Joy mobile app.


Home screen replacing the hamburger menu 

Agenda short_iphone7plussilver_portrait

Wedding itinerary

Agenda (1)_iphone7plussilver_portrait

View of different functions available when holding down on the events of the itinerary. 

Seating Chart_iphone7plussilver_portrait

Virtual map of the venue floor plan with the user's assigned seat highlighted.

Story View 1_iphone7plussilver_portrait

Wedding story displaying the curation of photos taken by wedding attendees.


Working to meet expectations of a company is much, much different than working to meet expectations of an academic project. I experienced designing with a bigger scope of people involved. This not only included users, but also the company and other stakeholders. Collaborating with the With Joy company also exposed me more to designing with an established brand and redesign a UI that is still true to the brand. 


see more!

MimimalUX | UI | Mobile OS

Assistive Technology LibraryUX | UI | Web | Development