top of page

Project Overview

Role - Lead UX/UI Designer
Timeline - 10 weeks 
Project Type - Independent, Academic BrainStation Diploma
Tools - Figma
Designed For - Mobile

Penguin is a mobile dating app that helps singles find more authentic connections and be able to see their match in real time before meeting and going on a date.

Bio.jpg
4.jpg

Problem Space

Using the experiences of friends and family

Dating apps have become the go-to way to meet new people and find relationships, however millennials in Canada are finding it hard to find genuine matches as 53% of users misrepresent themselves on the apps.

The Approach 

Design thinking process

To ensure I was taking the right approach I utilized the 6 step human-centred design methodology to make sure I prioritized the user in my design process.

Design Thinking.png

Empathize

Secondary Research

How many North Americans face this issue and who does it affect?

In Canada, single adults feel frustrated about meeting people on dating apps as they've faced their matches misrepresenting themselves. 36% of Canadians use online dating platforms. On average 53% lie on their profiles. 

 

Gen Z and Millennials are the main age demographic affected by this issue, as they demonstrate a higher likelihood of using dating apps compared to other age groups. 55% of adult Gen Z individuals and 50% of millennials engage with dating apps daily.

20%

Of women admitted to using an older photo from when they were younger & thinner.

71%

Of Users
think that lying to appear more desirable is a common occurrence.

40%

Of Men
admitted they lied about their jobs in an effort to sound more successful.

User Interviews

How did singles feel?

To get a better understanding of how singles were feeling about this issue, I conducted 5 interviews with individuals between the ages of 24 and 40 who have previously encountered their matches misrepresenting themselves.

 

This really helped me understand the key pain points the users were facing falling under the theme of: Looks And Appearances. All 5 interviewees shared that they felt dissapointed when they met their matches in person and discovered they looked somewhat or significantly different from their online photos.

I went on a couple of dates where they didn’t look like their photos, one guy looked 10 years older and the photos were all old!

-Alice

It would be nice if there was some sort of video confirmation, I know Hinge does that but something different so I know it's recent.

-Mallory

Key Theme: Dishonest about looks and appearances

Felt very disappointed. Made them feel like they'd been deceived or lied to.

People used old photos so they looked completely different then they're profile.
 

Wanted to find someone to share their life with, decided to join a dating app.

Stopped using dating apps for a while because of being disappointed.

“He said he hasn’t talked to his friend in the picture for 3 years.. so ya he looked different.”

Uses dating apps to find potential partners.
 

Pain Points

Motivations

Behaviours

How Might We? 

Turning this problem into an oppurtunity 

With a clearer insight into the problem space, I was able to create my How Might We statement for maintaining focus on the goal.

How might we help single adults in Canada avoid misrepresentation on dating apps in order to help them find more truthful and meaningful connections?

Define

Personas

Establishing our target user

Using the findings of my interviews and to better empathize with my target user I created my persona, Candice. Candice embodies the characteristics, challenges and motivations all the individuals shared with their experience and difficulties meeting people and being lied to on dating apps. Candice was a really important piece of this process as I used her constantly to make sure I wasn't straying away from my target user

Screen Shot 2023-05-27 at 10.08.15 AM.png

Candice Wilson

Marketing Manager

Age​

Location

Status

Identifies

35

Vancouver

Single

Straight

“I feel very misled and disappointed, it’s like no one is taking me seriously, why do I keep getting lied to?”

Bio

Candice is a 35-year-old Scottish marketing manager living in Vancouver, BC and has been using dating apps to meet potential partners. However, she has encountered a frustrating trend of individuals misrepresenting themselves online, wasting her time and leading to disappointing experiences. Now at 35, Candice is determined to break free from the cycle of matching with the wrong people.

Pain Points

  • Getting lied to online.

  • Time is being wasted.

  • Doesn't know truly what her match looks like before meeting.

Behaviours

  • Uses online dating to meet people.

  • Browses multiple profiles a day.

Goals & Motivations

  • Go on a date with someone who looks like their profile.

  • Find someone to share her life with. 

experience.png

Ideate

Choosing The Oppurtunity 

User Stories

Taking into account the significant opportunity pinpointed in the experience map, I generated user stories to portray the users interaction with the app.

Main Epic: Sending a Video and Chatting

As someone seeking a companion, I want to have options so that I can see who's out there.

As someone seeking a companion, I want to view a potential match profile so that I can see if we have similar interests.

As someone seeking a companion, I want to be notified when I match with someone so that I can message them.

As someone seeking a date, I want to receive video confirmation from my match so that I know they look like their picture.

As someone seeking a date, I want to message my match so that we can arrange a date.

Task Flow Diagram

With the help of my user stories, I was able to get a better understanding of how to create my task flow. This helped me lay out the process for my user and better understand what the app process would be like for them.

taskflow.png

Sketching

Exploring ideas with pen and paper 

Using my task flow I created a Ui inspiration board for elements I wanted to include in my app to get a better idea of how I wanted the prototype to look. I sketched out 3 different screens for each page to explore different layouts then narrowed them down picking one for each to help me create a visual of my flow.

Prototype

Wireframes

Turning my sketches into greyscale wireframes

I picked the solutions sketches I believed best addressed the needs of my persona and would contribute to their journey. With the chosen sketches I converted them into greyscale wireframes to start bringing them to life. 

Penguingrey.png
Pixel 7 Pro Mockup.png
its a match.png
camera.png
send.png
popup.png
1discover.png
message.png
texts.png
videofromseb.png
messagesnew.png

Test

User Testing

Is this product functional?

During the process, I conducted 2 rounds of user testing having 5 participants for each round. This helped me get the perspective of future users and also see if there were any potential gaps or room for improvement within my prototype that I didn't notice. The feedback from these tests helped me fine-tune my design and ensure that it aligns with the needs of my target audience.

Key Findings

After conducting the 2 rounds of user testing I put together a design prioritization matrix to identify the key areas that required attention and improvement. This helped me make the proper changes to the app, resulting in a more refined prototype.

lalalaallaaaa.png

Like and dislike CTA's were too high 

Some users had a difficult time trying to tap on the like button as they were trying to get to the next step, as it was higher up than normal. With that in mind, I adjusted the buttons to move them down to make it easier for users to tap.

1discover.png
newnewnewww.png

Notification prompt not noticeable enough 

After sending their video and going back to the discover page, users were not sure where to go next as it took a minute to see they had a message notification. To fix this and make it more exciting I added a notification pop-up at the top of the screen to make it more visable.

Implement

Developing the Brand

Creating Penguin

Before diving in and injecting colour into my wireframes, I needed to define my brand. 

I choose the name Penguin because penguins "mate for life" and this app is about helping users find their person. I also chose this name as I found it friendly and inviting. 

Screen Shot 2023-06-02 at 10.40.40 PM.png

Creating a visual identity 

Hopeful, Optimistic, Trusting, Refreshed, Inviting

Normally, online dating processes can be lengthy, draining, and overwhelming. However, with Penguin I wanted the app to feel inviting. All users to feel hopeful, and optimistic about finding someone, and refreshed after seeing their match knowing they can trust them. 

I created a Moodboard to have a visual of the emotions felt. 

Mooodboard.png

Colours

Enhancing the Experience

I selected orange as my primary colour for Penguin as it's a bright colour and symbolizes optimism, confidence and enthusiasm. As my secondary colour, I used blue as it's opposite to orange on the colour wheel meaning their complementary colours. Blue also symbolizes trust and reliability which is also how I wanted the users to feel.

colour.png
cover.png

Accessibility

While injecting these colours prioritizing accessibility is always my number 1 goal. I wanted to make sure all users would be able to use the app. I ensured all colour combinations passed the standard WCAG AA ratio of 4.5:1 for all text.

 

Before this process I had most call to action buttons orange with white

text and learned that it did not pass for accessibility so I quickly change

to orange with black text where it passed with flying "colours".

Access.png
accessible.png

High-Fidelity Prototype

Ta-Da! Say hello to Penguin

Leveraging my research and brand identity , I'm thrilled to introduce my solution that is geared towards helping users find more authentic and meaningful relationships. This approach aims to improve their overall dating experience, but also saves them time and energy by allowing them to connect through real-time video interactions with their matches.

penguin.png

Key Features

Why Is Penguin different from other dating apps?

disscoverr.png
record.png

Scrolling to find matches

One of Penguin's distinctive feature's is scrolling, setting it apart from the usual left or right swiping.. This allows users the flexibility to easily revisit profiles they may have overlooked.

Recording a video 

Penguin ensures authenticity by requiring both users to exchange photos or videos before chatting. The recipient must send one in return before viewing what they received, ensuring fairness.

Value Proposition

Break the Ice With Penguin!

Say goodbye to endless swiping and hello to authentic connections. With Penguin you no longer have to worry about misleading profiles or disappointing encounters.

 

By taking a photo or recording a video in the moment for your match you can truly see who you're connecting with before even sending a message. But don't worry Penguin likes to play fair. Whoever receives a video first needs to send one back in order to view. This mutual exchange promotes a level playing field users are equally invested in show casing their true selves.

Responsive Marketing Website

Expanding Penguins Brand

I designed a responsive marketing website for Penguin that effectively communicate the key features and values. 

 

By implementing responsive design techniques, the marketing website will appear visually appealing, regardless of the device being used to access it, whether it’s desktop or mobile. 

marketing.png

Next Steps

What's Next For Penguin?

Dating affects almost everyone, there's so much more to uncover from this problem space and further develop my app as time goes on.  

Another thing I would like to add would be A and B testing, while creating this I do understand that some users that would like to use the app are more introverted and sending a video might be hard for them. So I would also like to include sending just images.

 

Also as certain things that work for Gen Z might not work for millennials and baby boomers so having different features to see which works well for users so everyone can have a great experience while using to the app.

Tarot Cards of Tech

Thinking into the Future 

Thinking about how my app would be used in the future I used the Big Bad Wolf Tarot card of tech. 

 

Some things that a bad actor could do with my product would be to use it for the wrong reasons ex. sending explicit and inappropriate images or videos to other users. For this case, I would like to be able to incorporate AI as a safeguard to make sure if anyone were to send explicit photos it would catch it and prevent to misuse of the app.

wolf.png

Key Learnings

How did I grow as a UX Designer

The process of creating Penguin taught me many things and been an amazing learning experience.

 

There are so many things I can think of that I would like to fix or change about Penguin. This process has taught me that design is constantly changing and will evolve.

 

By prioritizing user research, testing, and feedback, I've refined my designs with a sharp focus on empathy and user-centricity in UX. This will guide my future work, ensuring designs are both visually appealing and highly effective creating an impact for users.

bottom of page