Annie Portfolio - Digital UI/UX Designer

Available for work

Say hello, let's talk

Available for work

Say hello, let's talk

About me

Resumé • CV

Case Study

Playground

Framer template

Contact

FOWI

Mobille App Design Project

Mobile App

UI & UX Design

Social Networking

Dating

Startup

INITIAL INSIGHTS

FOWI is more than just a dating app; it’s a community for genuine connections. Whether you’re looking for love, friendship, or to expand your network, FOWI offers a unique experience that goes beyond the ordinary.

With FOWI, you’re expanding your world—connect with people who share your passions, from anime and music to professional networking.

SOCIAL NETWORKING ❤︎
MATCH ❤︎
CHAT ❤︎
MAKE FRIEND ❤︎

SOCIAL NETWORKING ❤︎
MATCH ❤︎
CHAT ❤︎
DATING ❤︎
MAKE FRIEND ❤︎

SOCIAL NETWORKING ❤︎
MATCH ❤︎
CHAT ❤︎
DATING ❤︎

MY ROLE

Reseach

User Persona

User Flow

Wireframe

Visual Design

Prototyiping

Year

2018

Category

Social Networking

Role

Digital UI/UX Designer

WHY WE START?

During the unprecedented times of the COVID-19 pandemic
social distancing has become a new norm, significantly impacting how people connect and interact.

Our client identified a unique opportunity to launch a Dating Application not just for romantic connections but as a versatile platform for people to socially engage online during these isolating times.

COMPETITVE AUDIT

I identified similar brands and analyzed their pattern, strategy and features to determine their strengths and weaknesses comparative to FOWI

THIS GOALS

The focus of this app is not to compete with other dating apps like Tinder and Bumble, but to build upon existing dating applications and add a set of features specifically designed for interaction and connection based on proximity.

Developing these two features into key functions will make this application stand out more than the current apps on the market. It will help people interact more, have more fun, and make more friends during the social distancing period of the COVID-19 pandemic.

THE PROBLEMS

Unable to meet in person due to social distancing, there are limitations on emotions and feelings.

Creating events during this period cannot connect people in person to develop emotions.

Organizing large dating events is limited, and during this period, people cannot meet and interact in person.

THIS solutions

Create online events with different themes, providing a place for discussion, exchange, and connecting groups of users based on their interests.

Create interactive board games such as answering questions to find similarities, finding differences, guessing interests, and understanding zodiac signs...

USER PERSONAS

User research focuses on understanding users' perspectives, behaviors, needs, and motivations through observation technology, task analysis, and other feedback methods.

I have followed both quantitative and qualitative research methods. I spent time interviewing potential users within the target age range (18-45 years old) to ask them what they think and want from an online dating app. From the feedback received, I highlighted the weaknesses and from there, I gained a better understanding of what will satisfy users, thus creating a user-centered dating app.

Focal Point 1

Introverts find it easier to connect online but don't know how to start a conversation.

85%

Focal Point 2

Users haven't used dating apps due to lack of trust and fear of scammers.

80%

Focal Point 3

Users haven't used dating apps because they don't believe in finding genuine relationships online.

70%

Focal Point 4

Users don't trust dating apps because the communication methods are limited.

45%

PAINT POINTS

Unable to meet in person

Unable to meet or interact with each other

Difficult to feel and develop emotions

How to organize a group event?

How to organize an engaging online event to attract participants?

No activities for everyone to join and interact together

No support for group video calls

Lack of group interactions and group friendships

Information Architecture
/ User Flow

The User Flow is engineered to mirror the organic progression of relationships, from the first spark of interest to deeper communication.

Paper Wireframes

In order to brainstorm and ideate better, I created seveeal paper prototypes during the ideation phase, the only tools I used were paper, eraser and pencil.

I had to sketch out the user roles and modules before proceeding to create digital wireframes for this project.

Wireframes

After the general idea was formulated in the sketchings, I moved on to the wireframes phase. At this point I concentrate only on the functionality and usability of the app when the goal is to create an intuitive experience with as few frictions as possible.

Splash and Onboarding

Splash and Onboarding

Groups & Blogs

Board Games Event

Video Call

Matching & Searching

Matching & Searching

TOTAL SCREENS

Lessons Learned

Lessons & Experiences Gained After the Project

If there was more time, I would focus on deeper research into user behaviors and desires, and conduct more A/B testing to optimize the interface and user experience.

Continuous testing and early user feedback are also very important.

Try to come up with many good options to convince the client.

Learned the importance of clearly defining goals and expectations from the beginning.

Additionally, the flexible application of Agile and Lean UX design methods during the process yielded positive results.

Feeling of Happiness

When the app I designed gets launched

When realizing the importance of continuous and clear communication with both clients and the development team

The cooperation and mutual understanding helped the project run more smoothly.

Learned and gained many experiences from a new type of client

Built more connections with the BA and Dev team

DESIGN SYSTEM

Consistency was crucial in FOWI’s design. Our bespoke design system ensures future additions align with the existing style, from color palette to typography, icons, grids, and component sizes. This system guarantees uniform design throughout the product.