Happique Mockup - Copy.jpg

Happique

OVERVIEW

It is an app that helps you effortlessly send online invitation cards. You can:

  • Send ready-designed cards

  • Customize invitation cards

  • Respond and get RSVPs effortlessly

  • Send invitations through Email or messaging apps such as WhatsApp, Telegram, Facebook messenger,...

  • Add Wish List, Party Theme, and Virtual event's link to your invitation

Happique UX Project Team

Team

It was a team project where I assumed the UX/UI Designer role.

Tools

Adobe XD
Adobe photoshop
Adobe Illustrator
Miro

Balsamiq

Project Timeline

Dec 2020-Aug 2021

PROBLEM

GOAL AND IDEA

  • "How might we create an application that helps users to send online customized invitation cards instead of spending too much money on printing out invitation cards which also have so many harmful environmental implications due to their high chemical manufacturing process?"

  • Creating an intuitive, personalized, and consistent platform  

  • Making easy the customization of online invitation cards

  • Perfect experience of RSVPs

  • Possible to send well designed ready cards

DESIGN THINKING PROCESS

We used the iterative design thinking process in our project to focus on users' needs and frustrations. Throughout the design process via a variety of research and design techniques, we involved users to create a highly usable and accessible product.

01-Design Thinking Process.jpg

Market Research | Competitive Analysis

We started our research and empathize process by researching our competitors. We want to define gaps in the market and validate our idea.  We analyzed 3 direct competitors (Evite, Hobnob, and Paperless) and one indirect competitor (Greeting Island) which we defined the SWOT chart of Evite and Paperless competitors. The competitive analysis helped us to understand how our product can stand out in the market.

  • The idea of sending an online invitation card app is not completely unique, which meant that a great opportunity for identifying industry patterns lay in competitive analysis.

  • I assessed competitors against their ability to deliver on Happique’s business goals and uncovered some effective ways of bringing these features to the user.

Identifying the Problem
Quantitative & Qualitative Research 

We started our process by some early user research to validate the concept of sending online invitation cards and to identify users' needs, feelings, and pain points that could better inform the design brief. We used quantitative and qualitative research methods during our empathize phase. 

 

Our main research goals were to find more about:

02-Empathize Phase.jpg

Quantitative Research
Learning about our users through the survey

We conducted an online survey with 50 users and collected the following data:

  • Almost 50% of users are aware of the number of papers wasted by sending online invitation cards. 

  • 50% of the users do not want to spend so much money on printing out invitation cards.

03-Quantitative Analysis.jpg

Qualitative Research
User interviews to deeply understand users' pain points

We conducted interviews individually with 4 participants which fit the target user profile.  The user interviews helped us to dig a little deeper and understand users' pain points around the problem. 

Participants are chosen from the ones who volunteered to be interviewed during the user survey. We tried to have 4 participants with different backgrounds and occupancy to get inclusive results. 

06-Persona.jpg

Understanding the Problem
Data Synthesizing & Defining the Problem Statements

"Great research involves analysis + synthesis. Too often, we focus purely on analysis and the identification of facts. However, synthesis can help us to create a pattern in user research results for an excellent overview" 
By Lindsay Ellerby

We synthesized our observations from empathizing with users. According to the user research analysis in general users' pain points are in 4 categories; financial, product, process, and support. So that we tried to define problem statements that will guide our work and help to kick start the ideation process. 

Problem Statements

  • Users as a host need to easily get RSVPs because it helps them to get information about guest numbers.

  • Users as a host need to find their invitation cards effortlessly because they do not want to waste time browsing invitation cards.

  • Users as guests need to access the App without creating an account because it helps them to easily do RSVPs.

User Persona
Identifying Users and Pain points

According to the research analysis and synthesis, we tried to find a common theme in our data and grouped users who personify those themes. So, we created two different personas with different needs and frustrations. 

04-Qualitative Analysis.jpg

Defining
User stories to inform design decisions

To inform design decisions, we wrote user stories according to user personas' pain points. 

Below are four high priority user stories : 

  • As a host and as a guest, I want to easily get and do RSVPs, so that as a host get informed about guest numbers, and as a guest no need to call the host for RSVPs.

  • As a host, I want to find my invitation card effortlessly, so that I can send the invitation cards without wasting time.

  • As a host, I want to be able to customize my own invitation card, so that I can send special invitation cards to my guests.

  • ​As a guest, I want to access the App without creating an account, so that I can easily have access to my invitations and do RSVPs.

​Coming up with Ideas
Brainstorming & Idea Prioritization

We began the ideation phase by brainstorming the possible solutions for each of the problems and needs that users mentioned.

Next, we tried to group the possible solutions into subpages and give these groups labels that reflect the users' mindset. Each group and subgroups are arranged to enhance the efficiency, effectiveness, and satisfying experience of users.

Having figured out all the functionalities, we started to map out the end-to-end user experience and created the sitemap and user flows. Then we created low-Fi digital wireframes and prototypes to iterate the design based on the feedback until we find the best possible way of approaching the problem.

Information Architecture

Sitemap

09-Sitemap_Page_1.jpg

User Flow (Host Flow)

10-User Flow_Page_2.jpg

User Flow (Guest Flow)

10-User Flow_Page_2.jpg

Low-Fidelity Test

The low-fidelity wireframes were built with Balsamiq wireframing software. This step helps us to discover the app pain points at an early stage. we used a clickable prototyping test and ask some users to do some tasks. Then we evaluate their navigation behavior. 

Mid-Fidelity Wireframe

OVERVIEW%20%E2%80%93%203_edited.jpg
Happique Ui Design.jpg