You And Me | Luna Lu

A picture matching social platform

ABOUT THE PROJECT

You & Me is a picture matching social platform, where users are able to upload their own pictures and match them with the ones from others. This project is seeking for a possibility to help people with photo ideas find a creative outlet and get entertained. The idea of You & Me was firstly brought by me as a UX class group project in late 2016. In early 2020, I personally made another round of research and user testing and have updated the entire user interface.

1

SCREEN

OVERVIEW

2

WHERE DID THE IDEA

COME FROM

The initial idea was from a serious of pictures one day I saw online. There were two girls as friends sharing their posts for 100 days. One of them was living in Beijing and the other was in Sydney. Because of the time and location difference, all of their pictures were combined by two parts: one is from Beijing and the other, Sydney. But from entirety, these mashed-up pictures look in completely harmonious. So, what if people can match and share pictures with strangers all around the world? This is how the idea of You & Me came into being.

3

VALIDATE THE IDEA THROUGH

USER RESEARCH

To discover our potential users including their needs and interests, our team conducted in-depth interviews with 28 potential users to get an idea of who we are designing for.

Interviewee's demographics

We chose mostly Millennials as the target audience because around three-quarters of millennials (77%) prefer posting images on social media.

There were 9 males ranged from 22 to 31 years old; while there were 19 female ranged from 17 to 27 years old

Since we wanted to design a product for the users from different locations and cultures to connect each other, we chose mostly the audience with multi-country/culture background: international students, people who work overseas, etc.

There were interviewees from China(12), the United States(10), India(2), Canada(1), Kazakhstan(1), Philippines(1), and South Korea(1).
71% of them were international students or oversea labors (20 of 28).

Interview questions include:

Do you use photo-editing tools or photo-sharing social platforms? what are they?
What is your frequency of using them? When do you usually check them in a day?
What kinds of photos do you prefer to post?

What are the reasons you choose them over other products? Which feature(s) do you like most?
How do you think they can improve their experiences?

What do you think is the main reason that causes the failure of the long-distance relationship? (if the interviewee has this kind of experience)
What do you think of the You & Me? (after we briefly present our idea)

What we found

1. The photo-editing tools or photo-sharing social platforms mentioned include:

Most of the interviewers have more than 2 picture-editing or sharing apps installed on their mobile phones or computers.

Instagram is their most preferred picture sharing platform. It is simple and focuses on pictures.

"People like to share pictures with or get inspirations from strangers."

2. Frequency of using:

When to browse: almost everyone said he or she will check the posts when feeling bored.

"in between free time, on a bus or waiting"
"when wake up, on breaks whether at work or school, or at night before sleep"
"sporadically throughout the day"

When to post: the user will try to take-edit-share pictures when they got time and have/are doing anything they are excited about. key topics are shown below.

3. Key topics user prefer to see and post include:

4. The hardness and failure of long-distance relationship are due to:

Feeling

of Distance

Life Style

Gap

Less

Topic

5. 22 out of 28 of the interviewees were actually interested in the idea of You & Me.

"I'd like to match a group of photos with my favourite pop star!"

Here are the features they were expecting to see in the app:

The product should not add pressure to users of having an entire conversation as other chatting apps do.
Some feature that allows the couples to play together, like games.
It must be interesting to see 2 users match pictures from different time and space. So there should be a timeline feature to keep the record between the users.
Anniversary reminder, as Facebook does.
Can be more feedback emojis than just a heart-shape "like"

4

GOAL

AND SCOPE

Design Goal

Make people (family and friends, long-distance relationships, strangers, etc.) in different locations and timezones together create and share their moments in one picture, in order to stay connected more strongly.

Increase mutual empathy. Provide users with a delightful and deep-involved experience during their photo sharing.

Feature Scope

The initial version only focuses on photo sharing, no further interactions, such as online chatting or videos. But we do allow sharing to Facebook or though SMS.

5

TARGET

USERS

At the very first stage, we want to target two kinds of users:

People who are in a long-distance relationship
Photographers or shutterbugs who love to discover new things, such as food, new cities, attractions, natures and wilds.

Grace

Age: 23

Social Platform: Instagram, Facebook, WeChat

Occupation: Graduate school student

Primary Device: Smart Phone, Mobile devices

Technological Tool: Phone, Laptop,

Location: Manchester, UK

Status: In a long-distance relationship

Goals and Motivations

She likes to connect with peers interested in similar exploration and discussion, in order to blend in the new environment.
She loves travelling during summer and winter breaks, as well as sharing pictures on social platforms.
She misses her family and friends who are living in China
She extremely misses her boyfriend, who has been with her for three years and is currently studying in Japan.

Potential Needs

Recently she became bored about editing and posting photos online. There are very few interactions with other users. She wants to make sharing pictures more fun.
It’s getting hard to find a topic with her boyfriend each day. She wants to find a way to keep recording their relationship and gain more response from him.

Tyler

Age: 39

Social Platform: Instagram, Flickr, Facebook, Personal Blog

Occupation: Freelance Photographer

Primary Device: Smart Phone, Mobile devices

Location: California, US

Technological Tool: DSLR, Phone, Laptop,

Status: Single

Goals and Motivations

His dream is to travel the world to work with clients and to look for sources of inspiration.
He is trying to post work on more social platforms and gain more exposure.
He wants to improve networking and exchange experiences with other photographers and shutterbugs across the globe.
He is seeking potential partners.

Potential Needs

Besides sharing pictures, he is eagerly looking for other ways to keep in touch with the photographer friends he made from different countries.
He wants to launch a new personal project, which is to combine photos from different locations and periods of time. He thinks to work with other people for the project might burst new ideas.

6

FEATURE LIST

AND PRIORITIZATION

After reviewing the user research results and a series of team discussion, we created a list of features.

Key features listing and prioritizing:

log in/sign up (must have)
home feeds (must have)
user profile and related features (must have)
search (user and posts)
in-app chatting
notification
user dashboard
friends timeline
location/attraction check-in
map view
upload/take a picture for others to match (must have)
match other's pictures (must have)
filters and editing
video matching
four-picture matching
stickers
challenge for users to collect badges
catalog for uses to browse posts more easily
smart/auto-match (leverage AI)
share post to other platforms
swipe to fast vote a match
variant emojis to comment
push notification
invite a friend from other platforms
match a picture to win a deal (sponsored)

Besides some must-have features, such as login/signup, the prioritization of other features is decided based on the Impact/Effort Matrix:

Must-have & Great: will be shown in this version

Good & OK: will be put in the backlog and designed in the coming iterations

Bad: Maybe designed in the future if there are good opportunities

7

EXPERIENCE JOURNEY

WITH KEY FEATURES

Boyfriend

Grace

"My boyfriend and I are in a long-distance relationship. Our school programs are both busy and we can hardly find time to chat long. We need some medium to keep our love alive and strong. ”

Travel

buddy

Tyler

“It is nice to see what things out in the world might make for an interesting fit, or what would make for a nice contrast once combined. I want to find people with the same ideas as me.”

8

SITE MAP

About the picture "Publish"

Since You & Me focuses on user-user interaction, the app will only display the matched pictures to the public when both sides agree to "publish". This design is to avoid when one side feels offended when the other side posted aggressive, discriminative, perverted, or any other improper content.

The flow of the "both-agree-to-publish" rule is shown below:

9

FROM WIREFRAME

TO USER INTERFACE

I have tested with potential users for some key features' styles before I made the final design.

1. SHUTTER BUTTON

Style A

Style B - Winner!

The final look

User feedback and thoughts:

It is better to have an "upload" button that allows the user to go directly to the local album instead of triggering the camera first and switching back to the album. (The decision may change after we gather enough user data to figure out if users prefer using freshly-taken pictures or existed assets)
The further action buttons are a little small and may be hard to tap on.
If there are three further action buttons, the thumb is hard to reach all of them when using one hand for operating.

2. CATALOG

Style A

Style B - Winner!

The final look

User feedback and thoughts:

For style A, it's hard to understand what "pool" means for the first time users unless they click it through.
Style B is relatively modern. The tab style design is very common to see in a lot of popular social media.
In style B, users spend less effort to see more content, without constantly clicking through and going back to the menu.

3. User Profile

Style A - Winner!

Style B

The final look

User feedback and thoughts:

If this is a visual-centric social platform, then the user's profile should be his or her personal album. Style B is more like a chatting app or an e-commerce app's user profile page.
In style B, there is very limited space to put user's "what's up" thinking, while in style A, it is good and clear.
"Likes" and "Setting" are not as important as "My Gallery". They should be put into a secondary place.
"Sign out" is not a constructive function, thus it should be "hide" into a menu. Here, the "setting" menu is a good place to put "sign out".

10

DESIGN

GUIDANCE

Color Palette

IOS App Icon

Typography

Logo and Icons

final ui

11

FEATURE

WALKTHROUGH

1. Log In / Sign Up

The system will randomly display one most-liked matched picture on the top of the create-account page.

2. Homepage

The homepage showcases newly published pictures and albums from users that you are currently following.

Each picture is created and matched by two users. Their profiles, usernames, locations, the time and date when they release their pictures, as well as the captions of their own pictures, will be displayed along with the post.

As followers of one or both of them, you can like, make comments, or share the matches that you are interested in on other platforms.

Float Action Button

The camera icon is a Float Action Button. It will trigger out another three options: 1) take a picture for others to match, 2) took a picture for others to match, 3) or find a picture to match.

3. Take/upload a picture for others to match!

Through the 3rd feature, user can either take a new picture or chose a picture from the local album, and then upload it to a Picture Pool. Pictures in the Picture Pool allows other users to match it.

Before being uploaded, users can add more information to the picture. Actions include adding captions and location, inviting friends, and choosing if to auto-publish a picture from the Picture Pool to your profile after it being matched.

4. Find a picture to match !

Before finishing matching, the user can fill out the post details.

The picture in the pool can be matched by taking a new picture in the field, or…

by choosing a pre-existed picture in the local album.

About Publish

In the Picture Pool, the user can find a picture to match. There are filter options to help the user find a picture.

If the user enables “agree to publish”, the system will automatically publish the post to the public when the matching is finished”.

He or she can invite original post to publish as well. Only the two users both agree to publish, can the matched picture be seen by others.

5. Search

In the search page, the system will display the profiles, pictures to match, or the matched posts that the user might like.

6. Catalog

The catalog helps users to randomly browse the posts they may be interested in.

Gallery

Pool

A gallery is a place that contains the publish pictures, User can browse published pictures in galleries of different themes

A pool is storage of half-pictures that are waiting for others to match.

7. Activities

Possible Activities and Challenges

You & Me also features several challenges to improve user engagement.

YOU & ME OF THE DAY

Each day, You & Me will select the top 30 published pictures and showcase them in this section. The picture will be ranked by the Likes they got in the previous day.

10 DAY CHALLENGE

The most recommended one is the 10 Day Challenge. If a user successfully matches pictures every day for ten consecutive days, he or she wins the challenge badge.

SEASONAL CHALLENGES

There can be seasonal challenges launched in holidays as well, such as Christmas and Valentine’s day. User can match pictures either through the challenge page or hashtags, and then get them voted to win badges.

8. Notification

Notifications include:

likes, messages, and new followers
newly matched pictures
matching invitations
requests of publications (from the other matcher)
newly released challenges (system notifications)

9. Personal Page

Gallery

It contains published pictures.

There are two view options: full column view and grid view.

Luna (the user) has 180 “half-pictures” that are waiting for matching.

Luna has 670 pictures that were matched by others but have not been published by Luna.

12

MEASURE

SUCCESS

Here I would like to use a "mobile app conversion funnel" as a tool to show the key metrics of how to define success after the product is launched.

After finalized the entire product design, we exported the pages and prototypes and tested them on real mobile phones. We were pretty excited to find that it was just as awesome as our expectation!

I sincerely hope that one day I can introduce You & Me to everyone and play the exciting picture matching game!! 😊