WeddiMoon

The first stage, DISCOVER, helped me understand the problems as well as the needs and frustrations of WeddiMoon’s potential users. Once I gathered this initial information, I formulated a problem statement and thought of possible solutions. 

Problem Statement

Couples planning a wedding remotely need a way to search and book reliable professionals, vendors, and services at their wedding location because most of them are unable to meet their potential providers in-person before the wedding day.

We will know this to be true when couples find our web app to be the one-stop place to plan Destination Weddings and Elopements. 

‍

Competitor Analysis

I started by identifying the potential competitors of WeddiMoon and focused on 3 of them: WeddingWire, The Knot, and LadyMarry. Afterward, I created a profile for each of them with a company overview, marketing profile, and SWOT analysis. 

Main Findings

• None of them were trying to solve problems intrinsic to Destination Weddings/Elopements, such as getting legal counsel on how to get married at their wedding location. 
• Couples could search for wedding vendors and services but could not book or pay for them using the same platform.

User Research & Personas

During this phase, I started by setting my research goals, creating an interview script, and recruiting four participants that were familiar with planning a wedding remotely. After interviewing them, I confirmed that their biggest challenges were related to finding wedding services and vendors at the wedding location, and figuring out the legal requirements to get married in an unknown country. 

With this information, I outlined two unique user personas that embodied a person in need of help to find wedding venues and services for a Destination Wedding; while the other, need to focus on the legal aspect of an Elopement. 

User Journeys &  Flows

Based on my two personas, I defined key goals for each one and created two user journeys that demonstrated the process of achieving those goals. You can see an example of Diana's Journey from beginning to end (Right Image).

Later on, I mapped out three task analysis sets with clear objectives and made sure to define an entry point and success criteria for each task. Finally, I designed three user flows by integrating my task analysis and drafting screens in the web app as a path (Left Image)‍

Information Architecture 

With the help of OptimalSort, I conducted an open card sorting with seven participants. The takeaways of this exercise shaped a new structure for the website's Sitemap and it enabled users to categorize information based on what they thought was more logical. 

Sitemap's Improvements

• Changing the name of Search Vendors to Find Wedding Experts because nobody categorized them as vendors. 
  
• Allowing the user to search for wedding vendors, venues and legal counsel in the same search page because they were sorted in the same category.  
  

‍

Wireframes

My next step was to sketch both mobile and desktop prototypes for the three core features of WeddiMoon. I started by making a list of screens needed to complete the three functionalities drafted in my user flows and created low, medium and high fidelity prototypes. During this phase, Lean UX was particularly important to improve the design through several iterations that resulted in a product with a higher user value. 

Low-Fidelity Wireframes

In the examples below, I used pen and paper to draw the first wireframes for WeddiMoon as a responsive website. After several rounds of feedback, I decided to focus my MVP design on three flows:

1. Letting users search for wedding professionals and look at their profiles.
2. Booking a Video Call with a Legal Counsel at their wedding location.
3. Starting the Video Call in WeddiMoon's platform.

Below, you can see some low-fidelity wireframes of the main pages. 

High-Fidelity Wireframes

Working with Sketch and based on the user's insights from my low and mid-fidelity prototypes, I designed an improved high-fidelity version in grayscale. This prototype’s main focus was to provide an user friendly experience containing accurate copy, sizing and spacing. 

Main Improvements

• Focusing on Mobile First means designing in limited space. Therefore, I changed the main features in the Home page by making them clearly clickable big buttons. (Image 1)
• I was missing a step in the flow between Home page and Search Results, so I designed a Search page in between. (Image 2)
• The Search Results page in low fidelity did not allow a user to change their search on the same page. Consequently, I added a header with a dropdown menu for categories and a search bar for location. (Image 3) 

Usability Testing & Results

After conducting User Testing Sessions with four participants, I collected the most relevant insights containing observations, positive & negative quotes, and the most recurrent errors.

Afterward, I filled out a Rainbow Spreadsheet to help me classify recurrent issues and prioritized the top five errors to work on for the next iteration. Below, you will see some examples of solutions to these errors. 

Errors

• Users complained that the filter icon was not clear enough on its own.
• The search bar and dropdown menu were not accessible.
• Results were not sorted by ratings by default.

Solutions

• The filter icon was replaced with a labeled button.
• Making the search bar and dropdown menu more accessible by keeping a placeholder at all times.
• Adding the most common filters on the search results and having top rated selected by default.
  ‍

Style guide

To have consistency across different platforms, I created a style guide that would guide contributors on how the elements in WeddiMoon should look and behave. I used this system to polish the final prototype and make the design uniform.

Desktop designs