Are we there yet?
Kaysiao

Kaysiao

Kaysiao, a Chinese word that means “to refer”, is an online dating platform for Filipino-Chinese all over the world to meet, talk, and have fun.

Meet, talk, and have fun

Kaysiao is a Chinese term that means referral in business or work, but also about matchmaking in the love department. Kaysiao is an online dating platform that aims to matchmake Filipino-Chinese individuals all over the world. Kaysiao wanted to reach out to a wider and younger audience so they have decided to fully switch into a mobile application.

Industry

Online Dating

Role

UI/UX Designer
Visual Designer
Two people dating on a sunset view
The Challenge

Switching from web-based platform to a mobile application

Kaysiao has been in the business for quite some time. They have been using their web-based application since then and was not able to update and keep up with the trends today. In 2017, desktop internet usage is falling and mobile usage is rising. This is the perfect time for the team to switch from a web-based app to a mobile app. This would allow them to reach a wider audience and to compete better with other dating applications.

The Solution

Kaysiao in the palm of your hands

The team has decided to completely switch from web-based application to a mobile app for them to reach a wider audience and to acquire more users for their app. Moreover, this switch will allow them to be up to par with their competitions.

A preview of Kaysiao mobile app
The Process

A new experience for the users

Since Kaysiao will be fully switching to a mobile app, we have to recreate the user flow and interface of the app. We wanted the user flow to be familiar as the other dating apps to make it easier for the users to be familiarized.

Kaysiao Design Library

Playing with the brand's visual identity

Kaysiao’s current visual identity feels outdated and old. We have introduced new colors and typography for Kaysiao to be used in their new mobile app. We also included a set of illustrations for the brand to add a bit of ambiance to their new mobile application.

Organizing everything into one library

With the new visual identity, we wanted to ensure that designs will remain consistent across all pages and screens. We took the initiative to create a design library that would serve as a single source of truth for all the styles, and components for the app’s user interface.

Mockup of Kaysiao mobile app
Mockup of Kaysiao mobile app

Putting the work into action

Prototypes are an effective way to show how the application works. We have created mockups and prototypes based on the new user flow we have created. We have followed design patterns to make sure that users will already be familiar with how the dating app works.

Account Registration

For the registration experience, we wanted it to feel like personal and we are talking to the user. We made sure it is easy for the users to digest by breaking down the registration into different parts.

Kaysiao's account registration
Kaysiao Onboarding

Onboarding

The onboarding experience is really simple and straightforward. We just wanted to demonstrate how the app works and how the users can navigate through the app.

Meet People

This is where the user can browse his possible matches by swiping left and right. This is similar to other dating apps out there and we didn’t change much with the interaction to make it familiar with the users.

Kaysiao Meet with People

Discover

Discover is where the user can view and search for other users without the swipe functionality. This acts as an alternative way for them to search and look for possible matches.

Kaysiao's account registration
Kaysiao Matching

Match with People

A prompt animation will show if you swiped right with a user who likes you too. This would allow you to message them or if you want to keep swiping.

Messaging

You can browse your matches and send them a message. Nothing fancy, we just wanted it to be easy and straightforward.

Kasyiao Messaging

Moving Forward

Due to time constraint of the project, we were not able to conduct a user testing before the development of the application. Moving forward, we are hoping to conduct testings and more research and deep analysis.