PORTFOLIO YIYAN DING
Still Walking.
CONTENTS
BeautyChannel Interaction Design
No.1
Pemaily Interaction Design
No.2 Daily VC Web Design, UI/UX
FamilyFashion Web Design, UI/UX
No.3
No.4
Project: BeautyChannel
1 About this work
Beauty Channel is an advanced mobile application which combines with current plastic surgery, weight loss apps and the Image Retrieval and Person Re-Identification techniques, help people predict the risk, cost and postoperative effects efficiently, make the private schemes smartly. Beauty Channel focuses on mobile app design, which is part of '' Intelligent Beauty Slimming Platform based on PCA Neural Network Algorithm'', the latter one is an Electronic Commerce Project.
Honors of ''Intelligent Beauty Slimming Platform based on PCA Neural Network Algorithm'' project: Beijing E-commerce Competition (The Third Prize) National Internet Plus Competition (The Third Prize in Innovation Group)
Type: Teamwork (Personal tasks: Interaciton design + Marketing Strategy) Time: March, 2017 1/
Background
Beauty industry has been the fourth-largest service industry after the Real Estate, Auto Sales and Tourism. Judging from the scale of beauty industry and the population of people who participate the cosmetic surgery, China has become the global plastic surgery power with 22.68% industry compound growth rate within 5 years.
In 2015, there are about 88 million obese adults in America and the obese population in China has reached 89.6 million. Global obesity population has beyond the thin people. While China overtook the US as the country who owns the highest number of obese people in the world.
2/
Design Brief
With more and more attention people paid to their appearance, there emerges various kinds of technologies and medicines help people a great deal to make change. However, not all changes are successful and ideal, some failure cases are no less significant. Since the beauty industry filled with complexity and potential safety hazard but with the enormous profits, which attracts lots of merchants flocked. People are prone to be confused or even defrauded. Therefore, we would like to focus on developing a feasible solution that would help customer filter, choose the BEST FIT and predict the risk, cost and result in advance.
How can we use digital method to predict risk, cost and result in advance for people who would like to make a difference, in order to reduce the worry or concerns of them?
3/
Rationable
4/
User Profile
Kaitong Jiang Age: 22 Gender: Female Professional: University student
Background Story: Jiang is a Beijing native who studies in a famous university and is quite busy with her schoolwork. Without special attention to her body, she seems quite obese. Personally, she thinks that is why she is single for quite a while. For that reason, too, she feels herself inferior, be afraid to look what she looks like in the mirror let along trying on beautiful and chic clothes.
Motivation: Ideal experience: - A clear planning, including the dietary recommendations and the fitness plans. - Pertinent suggestions from experts. - Predict in advance what she looks like after losing weight.
Jiang thinks the key to find her Mr.Right is being slim. After losing weight, she can try on all the stylish clothes and meet more friends.
Frustration: She is really concerned about the expenses, since she is a student, and she is worried about the side effects of diet pills. And she hopes that the fitness plans would not influence her schoolwork.
5/
User Profile
Mei Li Age: 48 Gender: Female Professional: Housewife
Background Story:
Ideal experience:
Motivation:
- Rejuvenate, obvious effect, but do not exaggerate. - More plans to choose and compare, find the BEST FIT one.
Li’s skin aging is caused by being the busy housewife, she decides to make some changes and come back to the youth which is killed by time.
Li became the housewife in five years of marriage and all her family moved to Beijing away from her hometown. She needs to do all the housework and take care of her baby. For that reason, she has no time to care about her appearance. What makes her sad is the time when the young and beautiful girls passed by her, which is prone to remind her own winkle.
Frustration: She is quite confused about the various technology and the distance from the location of the beauty salon, since she needs to pick up the baby everyday. And she is also anxious about the procedure of the operation.
6/
User Profile
Xu Han Age: 31 Gender: Male Professional: Account Manager
Background Story: Han works in a ordinary company with the flat performance. He needs to negotiate with customers, while he is born with buckteeth. However, after the end of each negotiation, he always felt the customers around him whisper, which makes him ashamed and brings him psychological burden.
Motivation: Ideal experience: - Painless - Completed within a short period of time.
Han believes that the normal appearance will help him a great deal whether the job promotion or pay raise.
Frustration: He doubts the professionalism of the beauty store, and he is busy with his work, thus he is concerned about the postoperative rehabilitation period.
7/
Users Demands
Target Users
Demands
Pursue the updated mass aesthetic. Based on the operational need. Pursue a higher quality of life or marriage. Correction of the birth defects.
8/
Attending physician: official recognition, professional, convenient communication
Prediction: accurate, responsive, easy to operate
Scheme: low cost, targeted, alternative, high safety coefficient, private custom
Design Guideline
Since many people are confused or defrauded by various of plastic technology, showing hesitation and worry about that, therefore, we decided to develop an advance and comprehensive design that would inspire people to boldly go forward.
Dr. BJ Fogg’s Behavior Model illustrates that a behavior occurs mainly based on three elements:
Motivation A kind of desire that people want to achieve objectives or perform a certain behavior. Design shall have enough incentives that motivates people to act and engaged actively. Here are three motivators Fogg mentioned: - Sensation: Pleasure / Pain - Anticipation: Hope / Fear - Belonging: Social Acceptance / Rejection 9/
Ability(Simplicity) In order to perform a desire behavior, person must have the ability to do that. While people are born with laziness, it is not easy for them to keep on learning or researching. Design that involves behavior changes and simpler to increase ability. “Simplicity changes behaviors.� (Fogg, 2015) Simplicity consist of six parts: time, money, physical effort, brain cycles, social deviance and non-routine.
Trigger When people have the sufficient motivation and ability, a trigger prompts people to perform an action now. (Fogg, 2015)
Competitive Analysis
ç˜Śç˜Ś Customize nutritional program. Record calories of eating, drinking and sports. Colorful community activities.
No risk assessment relate to health. No targeted, partial weight loss. Can not talk with experts directly.
10 /
China's first healthy weight loss application.
Competitive Analysis
悌瞎 Extensive projects, provide detail descriptions, hot sales. Online Consultation. Colorful community activities, experience sharing.
No precise cost and risk assessment. Can not upload photo to predict result. Online Consultation with slow feedback in a same dialog.
11 /
Medical plastic surgery platform.
Design Thinking In order to make more precise prediction about what the users look like after surgery or do the private custom according to users’ details, what should we do?
12 /
Fisrt Step:
Second Step:
Third Step:
Collect user information accurately.
Base on the PCA neural network algorithm to analyze the photo uploaded by users.
Make sure whether the user wants to lose weight or do the plastic surgery (specific parts) and provide the corresponding plans .Then choose the partial beauty institution.
Information Architecture
13 /
Mobile Wireframes
14 /
User Flow Register ďź? Login Process
15 /
User Flow Person Re-identification Process
16 /
User Flow Consultation & Reservation Process
17 /
User Flow Community
18 /
Design Optimization User Test -- Think Aloud Method
19 /
Test Version V1.0
Optimization V1.1
Test Version V2.0
Optimization V2.1
Problems: Showing all projects’ risk and cost, mess information presented.
Solutions: Using sort and filter functions to manage the assessment of risks and costs.
Problems: 1.Lack information classification. 2. Induced recognition should be in the right side.
Solution: 1.Add information classification. 2. Reset the induced recognition button.
Technical Analysis How does Technology Work in Our Product ?
Source: Bit-Scalable Deep Hashing With Regularized Similarity Learning for Image Retrieval and Person Re-Identification.
During the feature learning, the Deep Hashing is used which contains deep learning and hashing learning. The basic framework used in Deep Hashing.
Person re-indentification Each photo corresponding to one hashing value. Firstly, extracting feature points from each picture, then get the approximate values from the projection relate to features, after quantizing get the binary codes.
20 /
Alexnet: this method is beneficial to convenient and efficient image recognition, and save the storage space.
Project: Pemaily
2
About this work Pemaily= Pet + Family The moblie application 'Pemialy' is commited to creating an intelligent platform for people who love cats and are willing to contribute their love to the missing and stray cats.
Slogan: Where there is Pemaily, there is love. Product Positioning: Social Intercourse + E-commerce + B2C/C2C
Type: Personal Original Work (Interaction Design) Time: May, 2017 21 /
Market Background
In recent years, there are more and more people are obsessed with the lovely cat, some cafes even combine with the theme of ‘cat’, which means people can enjoy coffee and play with cats at the same time. Moreover, with the development of technology, the catpeople use the mobile platform to satisfy themselves. For instance, Cat in the backyard, developed by the Japanese game developers HitPointInc, which has more than 19 million downloads on the mobile platform. Weibo, the Chinese popular social software, which has settled many famous pet bloggers. The most famous one is‘Gua Pi’, it has 2.63 billion reading and 3 million followers.
In summary, even though there are too many limitations which discourage people have cats, the mobile platform seems help a lot.
22 /
Problems
However, in campuses and some communities, it is prone to see the stray cats here and there, according to the statistical data shown, in Beijing, the amount of stray cats of one campus on average of 10, and there are around 2m stray cats in the whole city, 2014. Lucky them are, some people who pass by are willing to help and feed them. Moreover, there are still so many innocent cats affecting people’s normal life and some of them are even cruelly killed. Under the situation when the love for cats are soaring to unprecedented heights, internet can help relive distress for the stray cats to some extent.
Stray cats: excessive breeding, messy and dirty campus environment, easily breeds bacteria. Pet relief stations: insufficient capacity, insufficient manpower for animal care, insufficient founds. Picture shows the stray cat I fed in BUPT.
23 /
Questionaries Analysis
I published a questionnaire which relates to people’s attitude to cat on the internet and social software like WeChat, 150 volunteers participated it and 143 are available.
The most important part in my questionnaire is researching people’s behavior under one specific occasion when they passed by the stray cats, what would they do?
Thankfully, there are 32.43% people choosing feed the poor guys. Even then, 16.99% people and 22.04% ignore or drove them. It is easy to see that people have week awareness to help the stray cat correctly, like sending them to pet shelters or help them find owners, those group of people took up minority.
24 /
Questionaries Analysis
As shown in the pie chart, the majority of people gain cats as gifts form their friends or family, almost 30% people buy cats from pet store. While only 1/10 people choose adopt stray cats.
25 /
From this pie chart, there are half people think stray cats are pitiful, to some extent they are essential rescuers for those poor cats. 19.49% people are afraid of the wild cats, and 6.67% people are worrying about bacteria or scars from Stray cats, however, compared with these two kinds of people, people who have no feelings are prone to convert to cats’ essential rescuers.
User Interview
Zhou, student, 22
Feelings for stray cats: Willingness to help stray cats:
He is a graduate from BUPT, sharing his house with classmates in Guangzhou. He is crazy about cats recent months, however, considering his flat-share and his busy internship, he could not have a cat right now. ''Thanks to Weibo, I can 'lick the screen' for my favorite internet-star cat 'Guapi', and collect photos of him as avatar! '',he said. Moreover, he prefers to spend his spare time in cafe where have cats, stroking the cat makes him satisfied. Actually, he is a neat freak, thus he would not reach out to stray cats actively, but he is willing to do some voluntary works for the poor guys.
Lele, artist, 34 She prefers to create her paintings at home. More importantly, She is willing to stay at home and accompany with her cats, one is lucky, another is Pidan. What she pays more attention on her cats is their health. Thus she tries her best to take care of them, providing them with upper cat food and do the Periodical Inspection in hospitals. Personally, she has registered on some pet apps to know more about cats, buy cat food, toys and use the app to order hospitals, she thinks it’s quiet convenient. And she feels strongly sympathetic to stray cats, but she does not know how to help them in helpful or useful way.
26 /
Feelings for stray cats: Willingness to help stray cats:
Design Inspiration
It’s clear that people who sincerely love cats, no matter how wealthy he is or how much time is he allowed, he will bring cat happiness. By contrast, without feeling love, the cat is prone to run away from home and be the stray cat. It’s hard for us to change people’s mind, but we can not sit back and look unconcerned the sustained growing number of stray cats.
I would like to design a mobile application that catch the wave when people’s love for cats are soaring to unprecedented heights, on the one hand, provide an entertaining platform for people who sincerely love cats. On the other hand, out of humanism and public interests, build up a real-time platform for cats which relates to their life quality, lost & found and so on.
Entertainment + Solve problems
27 /
Mind map
28 /
Competitive Analysis
I picked five representatives competing products to analyze their main functions and operating modes.
LeePet
Epet
Chinese one-stop service, including pet grooming, training, fostering and etc. LeePet is the first platform which focuses on pet 'lost & found' combining with LBS technology.
Epet has the largest e-commerce platfo r m fo r pets’ fo o d, to ys, commodities and other goods.
Yourpet
Smellme
An innovative and comprehensive company which sets foot in online pet community (app), below-theline, e-commerce, photography, smart devices, online games, etc.
Users can build a lovely home for their pets by Smellme, in pet’s perspective to meet new friends, share photos and videos in the harmonious community. It has medium and high grade app, the higher plays the role as pet’s housekeeper.
Viptail Viptail operates an app which focuses on family foster care, by implementing the real-name authentication, enhancing the community security.
29 /
SWOT
Combing with the mind map I drew, besides the basic requirement which must be considered, it’s prone to see that pet industry is attracted by the advanced requirements and the area for human entertainment, these two parts are too crowded, Even though, companies are not interested in entity industry relates to cats like coffee & cat. While there is weak or little competition in the public interests and danger relates to cats. And it would be beneficial to us pay more attention to the public interests and combine with parts of entertainment areas where people are interested in.
Existing problems in pet industry: 1. Basically, almost all app related to pets prefer to use the social intercourse as the entrance, then develop e-commerce and other services. 2. Profit pattern is too single, mainly depends on e-commerce. 3. App homogenization is more serious, there is not much difference between products.
30 /
It would be beneficial to us pay more attention to the public interests and combine with parts of entertainment areas where people are interested in.
Information Architecture Main Functions
31 /
Hand-sketched Prototype
32 /
Wireframes & User Flow
33 /
Main Functions AR Coins
Application scenarios: As a cat person, when you meet the lovely cat, you will be anxious to express your love to him/her. After caressing, do not forget to pay for cats ! Especially when you want to care about the poor stray cat, but have nothing to feed it, just put the AR coins on it in advance. Other kind person who feed the poor guys can collect coins as a reward. Furthermore, you can also use the AR Coins realize the donations to the animal shelters registered in our app, by recognizing cat faces in the pictures they posted, if you worry about the donations whereabouts. However, considering cats’ propensity and security and more important thing is avoiding many with dubious motives will seek to this transition to their advantage, the AR Coins CANNOT BE WITHDREW ! But you can use the AR coins to trade in cat food and toys in our electronic mall with an even better discount !
How to use it : Firstly, you need recharge your virtual AR Coins follow the tips. Secondly, use the AR function to finish capture shoot for the lovely cat, then fill in the form. Finally, click PUT and complete payment.
34 /
Main Functions Lost & Found
Lost & Found Notice Map: After notice posted, system will send message to the app users who are within ten kilometers for help automatically. 35 /
Lost & Found Notice List: Shows the help for urgency, update of information.
Lost & Found Notice Details: Describe the details of the lost/found cat. Additional function: One-touch to contact the owner quickly.
Contact the owner by instant message.
Publish the Lost & Found notice.
Main Functions Video & Images Display
36 /
Usability Test
Application scenarios: Users can use the Cat Map to explore the Cat Cafe, Pet shop or participate the cat party for entertainment according to their locations on map. More important, when they meet the stray, lost cat or injured cat they can share their locations wait for help or according to the nearby pet hospitals/ relief stations’ locations showed on the map, then help the cat.
37 /
However, out of consideration to user’s privacy and security of cats, we remove the Lost & Found part from Cat Map, make this part independent, and add the real time LBS function into the private conservation part, combing the additional photos/ short videos to make sure the reliability of the finding information provided by the strangers.
Technical Analysis AR Coins & Cat Map LBS
AR Augmented reality (VR) technology is a new technology that integrates the information of the real world and the information of the virtual world seamlessly. Real environments and virtual objects are superimposed on the same screen or space in real time. Cat golden AR coins is inspired by Alipay AR red pocket.
Catmap: LBS Location based service, by means of radio communication network or external positioning mobile telecommunications operator, obtain location information of a mobile terminal user, supported by the GIS platform, a value-added service to provide the corresponding service for the user.
38 /
Technical Analysis Cat Faces Recognition
Histograms for the best cat neuron on the test set. Red: the histogram for cat images. Blue: the his- togram for random distractors.
Most responsive stimuli on the test set for the cat neuron.
Click the picture to find more. or https://arxiv.org/pdf/1112.6209v5.pdf 39 /
Use OpenCV (Open Source Computer Vision Library) to make the AR Coins function more accurate and specific, from the most basic read and write pictures to simple image processing (such as noise reduction, filtering, edge detection, image transformation, feature extraction, etc.), and then to more advanced cat face recognition.
Future Opportunity
New opportunity: Cat Map + Smart Pet Collar (Visible to oneself or anyone to whom you grant access)
40 /
Project: FamilyFashion
3
About this work
Real Estate Company Website 20% 80% Copy Original Thanks again, Inspired by Philip Millward's work.
Type: Website Design, UI/UX Time: July, 2017 41 /
FONT COMBINATION
Logo
Regular 20px
Heading 1
Semibold 40px Shadows (Blur 4)
Heading 2
Regular 40px Shadows (Blur 4)
Body Reg
Regular 14px
Body Small
Regular 12px
Captions&Buttons
Regular 24px
COLOR
Project: Daily VC
4
About this work
An E-commerce website which sells organic fruits, vegetables and their by-products. Personal Original Work
Type: Website Design, UI/UX Time: August, 2017
45 /
Desktop Version
Mobile Version
Color
Thank you for reading !
Tel: +86 18211122408 Email: 2014213252@bupt.edu.cn Beijing University of Posts and Telecommunications, Xitucheng Road, Haidian District, Beijing, China Postcode: 100876