ZIJING WANG IXD DESIGN PORTFOLIO
HELLO!
TABLE OF CONTENTS 03
04
11
17
25
31
0
INTRODUCTION About myself
1
LOVETWEETS / PRODUCT DESIGN A product to connect people in long distance relationships
2
PUREBOOK / WECHAT MINI PROGRAM DESIGN An app to help book lovers find the best books
3
RELATIONSHIPS IN MATCHMAKING CORNER / RESEARCH Deisgn research about Chinese marriage pressure
4
RSS MUSIC / WEB APP DESIGN A web app to keep people updated about their favorite music
5
MAGIC BATTLE / GAME DESIGN A game to explore the form of new interactions ZIJING WANG IXD DESIGN PORTFOLIO | Table of Contents
02
INTRODUCTION SKILLS I am currently a Master student majoring in User Experience Engineering at Goldsmith, University of London. I studied software engineering at Tongji University for my Bachelor. As a student with an interdisciplinary background of science and design, I am devoted to using advanced techniques to solve problems for people. I am interested in exploring new ways of interaction and reflecting on the relationship between humans and technology. My strengths are in data analysis, information architecture, and detailed artistry in visualization. I enjoy collaborating with people from different fields on multi-disciplinary projects, to see the miraculous spark from the collision of different ideas and thinking modes.Â
Prototyping Sketch, Axure, Principle
Graphic Design Photoshop, Illustrator, InDesign
Front-end Developing HTML, CSS, Javascript
Hand Drawing Sketching, traditional painting
Besides art and design, I am also passionate about food, travel, and exploring different cultures. Being enthusiastic and innovative, I hope to surprise you with my imagination and creation.
English IELS 7.0 / 9.0, Professional reading & writing
Japanese Daily conversation
ZIJING WANG IXD DESIGN PORTFOLIO | Introduction
03
LOVETWEETS
PRODUCT DESIGN Duration Oct. 2018 - Dec. 2018 Tools
Photoshop, Illustrator, Sketch, Fusion
PROBLEM DEFINE
It is reported that there are one fourth of couples have the experience of being in long distance (LD) relationships. The distance between people, in most cases, is a suffer and could give rise to many problems. I would like to exlpore the painpoints of LD couples and create a product to connect and comfort the lovers.
Problem Tree
PAINPOINTS
PROBLEMS
POTENTIAL ROOTS
Inspiration LD couples find it more difficult to perceive the other's mood and get connected through daily communication.
Conflicts aroused by petty things and emotional insecurity could frequently appear between LD couples.
People apart cannot find a natural and simple way to express and share their current mental state, and get interacted by forms other than plain messages to build a closer connection.
Single form of communication
Cannot keep another accompany
Feeling of insecurity
Fail to timely detect another's mental state
Willing to Say Love According to Absence Makes the Communication Grow Fonder, LD couples treasure more about their relationship and would possess a stronger will to express their true feeling and love to the other compared to people sit sideby-side, cause words is the only way to connect each other. Then how can we make use of it and let us share our moods more naturally?
Desire for Warmth from Others When we are missing others, it is probably that we are in a state of solitude and wish there is someone who can make us feel warm. There are products that can make us see each other, hear the voice or even simulate the touch, but none can provide us with the temperature of another person.
Technology Utilization Technology has changed the way we love. There are numerous products devoting to breaking down the barrier of distance between people. Now why not we use technology to convey our real feeling naturally and directly to our lovers?
ZIJING WANG IXD DESIGN PORTFOLIO | LoveTweets
05
MARKET ANALYSIS
To look for inspiration, I searched through the markets to analysis the competitive products and find out their design concepts and functions realized, exploring how do others solve the problem?
Comparison of Related Products
Forms of Interaction
I found six typical concepts and products designed for LD couples. Some of them are still under research due to realization obstacle. They could be separated into imitating physical touch and passing information. A table of comparison in different aspects is as follows.
I fitted the ways of interaction adopted by LD couples into the concept diagram of diferent senses, then found that there are some regions people never give a try.
Feature
Imitate physical touch
Pass Information
Forms of interaction by LD couples
Taste
Image
Number Product Name
Form of Use
1 Kissinger
Immersive
2
3
HB ring
Pillow talk
Wearable
Wearable & Placement
4 Tap tap
Wearable
5 Goodnight lamp
Placement
6
Visual
Smell
Messages Filimin lamp
Placement
Video Call
Photos 5
6
Voice Phone Call
1 Form of Transmit
Touch of kiss
Heartbeat
Triggered actively
Yes
Effective time
Short time
Heartbeat
Touch of stroke
Status of light
No
No
Yes
Yes
All long
All long, selective use time
Short time
Long status
Status & color of light
Yes
Long status
Touch 2
3 Temperature
4 Where I am interested in
ZIJING WANG IXD DESIGN PORTFOLIO | LoveTweets
06
CONCEPT IDEATION
PHASE 1
PHASE 2
PHASE 3
ZIJING WANG IXD DESIGN PORTFOLIO | LoveTweets
07
USER TESTING What I Want to Test
When I was generating the product concept ideation, user testings are actually carried out iteratively during the process. Testings can be roughly divided into three categories in accord with the ordered phases.
Key Outcomes Sample bird#1
1
Shape of bird and heart are preferred Man with bigger hands will require a bigger size
Sample bird#2
Sample heart
2 3
Sample 1 and 2 are comfortable to hold Sample 2 with flat width is easier to carry Sample 1 is figurative for users to have a favor
Stroke on the bird's head is an understanable interaction to pass love Slient mode is necessary and could be a normal state Man and woman would have different color preference Light on the bird's heart gives a feeling of warmth, and it should beat It should have obvious and undisturbed form of notification
The bird's heart could serve as the button of a sound recorder long-press for voice record, press once for voice play Feedback of successful sent could be vibrate or tweet sound depending on mute mode turned on or not Triggering conditions of reserved messages should get customized by users There should have a backstage for reserved messages and view history of communication
Test scene
PRODUCT PROTOTYPE
Having reflected on learnings from the user testing, I generated the high fidelity prototype of the products by modeling. Then I defined the functions and detailed design based on research I have made.
Touch point
Stroke on the bird's head is the trigger of sending light message.
Sound / Message
A speaker is settled to play the tweet sound notification and voice messaged sent by the lover.
Vibration
In mute mode, vibration substitutes the bird sound as notifications.
Soft Materials
Mute Mode
A switch to turn on/off the mute mode should be provided to the users.
The product is made of soft materials in order to be comfortable to hold and provide a sense of warmth.
Feeling of Warm
The heat of the product when there's a message would comfort the people who holds it a lot.
Microphone
A microphone is necessary to collect voice messages by lovers.
LED Light
The light in the shape of heart will serve as visual notification of messages.
Button for Record & Play
The heart also function as buttons for the record player. With a single button in different interactions, users can get connected with their lovers.
ZIJING WANG IXD DESIGN PORTFOLIO | LoveTweets
09
USAGE SCENARIO
Long Distance Relationship
Lovers Feeling Light emotion
Light Emotion Passing
To illustrate the application scenario, I went through two basic workflow cycles that may appear in the product usage: to pass light weighted messages and to pass strong messages with more emotions and feelings. I also designed a page of an app along with the product for lovers to view their message history.
Interaction Stroke on
LoveTweets
LoveTweets History Interaction
Vibration / Sound Bird's heart lighten
Vibration / Sound Get connected
Perceive
Bird start heating
Bird's heart lighten Bird start heating
Strong emotion
Action
Pass Message1 on
Stroke on
Vibration / Sound Bird's heart beating
Response
Perceive
Vibration / Sound Comfort
Bird's heart lighten
Stroke on
Response
Reserved message triggered
Not available
Bird start heating
Strong Emotion Passing Happy with the message
Play reserved message0 Bird's heart lighten Bird start heating
Play Message1 on Bird's heart lighten Bird start heating
Get connected
Available to check message
Vibration / Sound Bird's heart beating
Pass Message2 on
Make a reply
ZIJING WANG IXD DESIGN PORTFOLIO | LoveTweets
10
PUREBOOK
Customized books specially recommended for you, to share your love with others.
WECHAT MINI PROGRAM DESIGN Tools Role
Product & Interface Design, Front-end Development
Duration Oct. 2017 - Mar. 2018
INSPIRATION In the emerging information age, people's time is consumed by pieces of short videos and articles. With fewer people enjoying "pure" reading, the remaining book-lovers can hardly find their favorite books and share their love with others.
Findings on reading According to the 15th National Reading Survey Report, China's national per capita reading is 4.65 books in 2016. At the same time, it shows that people would spend 26 minutes in WeChat reading per day.
4.65
books per year
VS.
A questionnaire collected in Tongji University shows that more than half of people would read books based on their interests; one-third of the interviewees would buy books when casually browsing through libraries or bookshops.
26
minutes per day
Find books based on interests
What I want to do I decided to design an app called PureBook, based on the lightweight WeChat Mini Program, which is more easy to spread among WeChat users in China. By using the app, people can easily find their favorite books, learn about the contents and share their impressions of the books with other book-lovers. More importantly, the app should learn the users' preferences as they mark their loved books, and
recommend potential new favorite books to them. With emotional interaction with users, our PureBook will make pure-reading more accessible to people who love books.
For the reason that reading is private and personal behavior, it's hard for us to find books customized for our personal prefereneces. “There are a thousand Hamlets in a thousand people's eyes.� Nowadays most book comment platforms will let users rate the book, while it depends on every user's direct feeling to love a book or not. ZIJING WANG IXD DESIGN PORTFOLIO | PureBook
12
PAPER MOCKUP
Disike the book: Swipe left
Homepage
Like the book: Tap heart
To illustrate my idea of the product, I use paper to make a basic prototype of the app. Workflow of primary scenarios is shown by wire-frame.
Legend
Like feedback
Main page Direct to new page
Book count added.
I emphasize the interaction design of the app, to explore a smooth and user-friendly experience. Making the paper mockup 1:1 size with the phone screen, I was able to simulate gestures in the app.
Interaction Interact result Gesture
Book marked with liked
Book-review
Book-excerpt
Book deleted from recommended list.
Book-intro
Swipe down to show more
Tap
Search page
Typing keywords to search
Search result
Booklist list
Booklist content
Collect feedback
Slide or tap to switch tabs of different sections of the book. Add book review page
Add excerpt pop-up
Read feedback
Mark as loved or read
User page
Creat a new booklist
Collect to one's booklist
ZIJING WANG IXD DESIGN PORTFOLIO | PureBook
13
VISUAL ELEMENTS Font Type Choice
云书集
Typeface: Qing Carving Song To build a literary atmosphere, I chose a font used for carving copies in Qing dynasty. It is relatively simple to read while possessing the traditional atmosphere.
Colour Palettes
Theme colours used in the app are picked from the Dunhuang frescoes. Colours with low saturation will create a sense of elegant simplicity, helping people get immersed in the world of classical books.
Cover Card Design The card to provide an overview of a recommended book on the homepage.
Book title Author Excerpt
Love button
Booklist Book cover
Highlight Quote Layout
I put a highlight quote of the book in the top of the book detail, for users to get a glimpse of the content of the book. The vertical type layout comes from ancient Chinese books, which is in line with people's aesthetics of literary products.
ZIJING WANG IXD DESIGN PORTFOLIO | PureBook
14
HIFI PROTOTYPE Take a look at the app demo in WeChat
SCENARIO
Keith, with his love for Chinese literature, was standing in front of the bookshelves in the library, having no idea which book he would like.
He opened PureBook and checked what the app had recommended for him. After reading the brief introductions of the books in the app, he decided on one to read.
Having borrowed the book from the library, Keith became immersed in reading his beloved book.
When Keth found some good sentences in the book, he would like to extract them and put them into his PureBook app to share with others.
Viewing excerpts and book reviews from other users who loved the book, and sharing his own thoughts with others, makes Keith very happy.
After reading, Keith found the book interesting and decided to “like� the book. The homepage is then updated to recommend more books Keith is likely to love.
ZIJING WANG IXD DESIGN PORTFOLIO | PureBook
16
RESEARCH PROJECT
Relationships in Matchmaking Corner
Duration Sep. 2018 - Nov. 2018 Location People's Park, Shanghai
INSPIRATION & BACKGROUND RESEARCH Matchmaking Corners
Chinese Marriage Pressure
In recent years, there’s been a trend of impromptu matchmaking markets popping up in the parks of major cities. They’re started spontaneously by elderly residents, not looking for a spouse for themselves, but for their children.
To explore the cause of the phenomenon, I conducted basic research on the Chinese marriage market. The data shows that China is facing the fourth single tide, possessing a single population of more than 200 million people. With the rate of marriage decreasing since 2013, the rate of divorce increasing, and a rising delay in the age of marriage; young people from 20 - 40 reported getting more and more marriage pressure from their parents.
Chang chun
Nanjing
Chengdu
Cities with famouse match-making corner
Beijing
Wuhan
Shenzhen
Shanghai
100+VQ 85+ 84.78%
Beijing
Shanghai
of young people have the experience of being urged to marriage
55+27+18 18%
27%
Chengdu
Nanjing
55%
Aged below 25
Aged between 25-30 Aged over 30
ZIJING WANG IXD DESIGN PORTFOLIO | Relationships in Matchmaking Corner
18
OBSERVATION
To explore why parents choose this way to find a mate for their child, how effective the meetings by parents rather than the young people themselves will be, and what stands behind the phenomenon; I went to People's Park in Shanghai to observe how parents perform in one day of the weekend in the matchmaking corner.
Key Observation
8AM 1. People's Park is filled with parents coming for matchmaking for their children.
2. A row of billboards are placing on umbrellas along the road, listing children's information.
3. Parents with glasses and masks sit with their own stools.
4. A father is roaming around with numb face, holding a billboard of his daughter.
12PM 8. Parents are talking and showing each other photos of their children.
7. A divorced father is finding spouses for both himself and his poor-relationship daughter.
6. Parents will have instant food like noodles or cakes for lunch on the spot.
5PM 9. Good handwriting board could reflect high quality of the parents.
5. Parents would calculate matching-index, including date of birth, height and Chinese Zodiac.
7PM 10. “Of course I keep her from my coming here.” a mother eating pastry said.
11. Pack up billboards, cup, folding stool, umbrella and others into draw-bar box.
12. Night falls, with information collected, parents will go home to meet their children, expecting them to find a love…
ZIJING WANG IXD DESIGN PORTFOLIO | Relationships in Matchmaking Corner
19
DATA ANALYSIS
During observation, I collected 80 samples of billboards at random and extracted the essential information to make a table of described elements of children in matchmaking corner. The data not only demonstrates the image of young singles in Shanghai but also reflects their parents' views on marriage.
46+48+3L 10+30+555L Children's educational distribution
48% Master 47% Bachelor
High Frequency Character Descriptions in the billboards
Gender Age Height Profession
3% Doctor 3% Junior
Eductaion
Learning 1: Children in the corner are most with high education.
Character Registration House
Whose contact details?
55% Mother’s 30% Father's
10% Parents' 5% Child’s
Learning 2: Parents take control of the matchmaking issue.
Personal Information Referred in the billboards
Salary Parents’ profession Female
Male
Learning 3: Characteristic descriptions by parents in the billboards are presented to be duplicate and out-dated, sketching only the image of the children from their perspective and imagination.
Female
480+320= 480+320= 460+300= 460+260= 440+260= 400+260= 360+240= 300+180= 140+120= 80+100= Male
Learning 4: The billboards written by parents focus on listing material conditions, with little information to describe what kind of person the child is.
ZIJING WANG IXD DESIGN PORTFOLIO | Relationships in Matchmaking Corner
20
HYPOTHESIS GENERATING
1
2
3
Although it has a low success rate, the corner still attracts many parents, partly because it provides parents with a sense of trustworthiness. It offers a non-profit, voluntary and practical chance to meet participants face-to-face.
The description of non-material conditions on billboards may deviate significantly from the real image of the new generation. The disconnection and the different sense of value between two generations make it hard for parents to find an ideal mate for their children.
Parents' negative experience when their child is judged negatively by others may stem from a tendency to project their sense of worth on their children and measure their achievements with their children’s lives.
ZIJING WANG IXD DESIGN PORTFOLIO | Relationships in Matchmaking Corner
21
INTERVIEW DESIGN
In order to validate my hypothesis, I spent several days at the matchmaking corner interviewing parents there to find their real thoughts.
Question List
What I Want to Learn To determine the attractive aspects of the corner compared to other ways of matchmaking, as well as pain points to be improved, considering what kind of things it can and cannot bring to the parents.
To discover the reason and motivation behind parents’ coming to the corner for their children and how they feel about this behavior.
To see how well parents know their children, seek the role of children in the events, and explore the relationship between parents and children in the field of marriage.
To find parents’ attitudes towards the place and explore the potential improvement measures in the matchmaking corner from both parents’ and children’s perspective.
ZIJING WANG IXD DESIGN PORTFOLIO | Relationships in Matchmaking Corner
22
INTERVIEW RESULTS
After interviewing ten different people at the matchmaking corner, including Shanghai native fathers, non-local parents, young mothers and some young people coming on their own, I collected and analyzed their answers to find some interesting viewpoints in the relationship reflected by the corner.
The Place Keywords “I heard from my friends that this place could add the chance to find love for the child.” “The platform gives a little more hope and opportunity for me.” “Parents here will communicate honestly.” “It's bad to have too many miscellaneous freeloaders here.”
Keywords "It will be good to have a nice talk with other parents about their children." "It's frustrated when I prefer a child but not all his information is shown on the board, and my child gets picky by his parents." "Marriage is a combination of two families." "You can imagine what their child will be like when communicating with the parents."
“People online is virtual and untrustworthy.”
Finding 1
Finding 2
This place provides a platform for parents to communicate frankly and sincerely without cover.
Parents are reported to come with more worries than expectations.
Parents are afraid of fraud and need the authenticated information.
As there's an information gap of the billboard, attitude towards their child of the other parents is concerned.
Although they know there’s little chance, they have no way but here to keep a gleam of hope.
Relationship between Parents & Children
Relationship between Parents
It would make them happy to communicate with congenial parents and expect the successful marriage of two families.
Keywords "It's a suffer here for the anxiety of my child's marriage." "My daughter is casual to marriage and are just filial to let me come here." "It will be helpful if children provide some information, or they can come and meet each other by themselves." "I don't know what kind of girl my son prefers, I just give him the photos, and he'll decide himself."
Finding 3
Relationship between Children Keywords "Our children are too shy, and they cannot come up with a common language." "We're afraid of meeting a girl whose photo is much prettier than herself." "It's more easy to date with a girl introduced by my friend. Those introduced by parents are too much focusing on material conditions." "I'm new here in the city with narrow social circles and have few friends. "
Finding 4
Many children are not that much want their parents to push them to marriage and they have their own ideas on mate selection.
Photos and other conditions of the children are too much glorified, making it an extreme drop experience when meeting in reality.
Parents are in some degree autocratic in the topic of marriage, and they seldom talk deeply with their child about this issue.
It’s hard to break the embarrassment of the first meeting, for that children are introverted and know nothing about the other side, hard finding common topics.
ZIJING WANG IXD DESIGN PORTFOLIO | Relationships in Matchmaking Corner
23
INSIGHT & RECOMMENDATIONS INSIGHTS Matchmaking corner is for parents, not children. The matchmaking corner is not only a place for the marriage of children but also sustenance of parents’ love and hope for their children. It serves as a link between retired parents and the young generation.
It's children's real preference that matters. Parents’ lack of communication with children in issues of love and marriage make it hard for them to find an ideal mate for their children. They are not conscious that children’s participation and initiative in self-expression is crucial in successful matchmaking.
RECOMMENDATIONS A bridge could be constructed between parents and children and make children more involved in the behavior of matchmaking.
There should be ways to guide parents through communication with their children and understand what their appeal is in mate selection.
More standardized management and orientation instruction should be carried out in the corner to make it an uncluttered place with honest communication.
ZIJING WANG IXD DESIGN PORTFOLIO | Relationships in Matchmaking Corner
24
Website to get your favorite singers’ music in the first place
RSSMusic
WEB APP DESIGN Tools Duration Mar. 2018 - May 2018
MOTIVATION
Inspired by an accident in which I missed my favorite singer’s concert. I didn’t even see the news because it was released on a platform I don’t follow. The problems of an ununified Chinese music market caught my attention.
Music Markets in China
Case Analysis
Ticketing websites in China: each monopolize different types of shows Pick one singer Hua Chenyu, popular in recent years and see where can we get the ticket each time for his live shows and which music portal the copyright of record music belongs to.
Damai
Focus on music concert for new generation
Yongle
An old brand comprehensive ticketing website
Moretickets
Focus on youth entertain mainly in Shanghai
bilibili tickets
Focus on music from Japan youth culture
Performance
Ticketing source
Rec. Copyright
Hyun Dance DreamWorks inMusic Concert
Music portal websites in China: each license copyrights of different singers
Beijing 2017 "Mars" Concert S-LOLI's Lolita Music Storm Festival
QQ Music
Netease Music
Xiami Music
Kugou Music
2017 Summer Supersonic Festival Shanghai Station 2018 Shanghai Drip Lake Sunshine Music Festival
Jay Chou
Kris Wu
Hebe
F.I.R
Mayday
Yoga Lin
JJ Lin
Black Panther
Scattered distribution of ticketing sources and music licensing of different singers
It’s evident that the origin of tickets and licenses for the music of any one singer
make it hard for users to follow the latest activity of their favorite musicians.
is rather intricate. It’s hard to find a unified platform for this information.
ZIJING WANG IXD DESIGN PORTFOLIO | RSS Music
26
USER JOURNEY Scenario
Use his familiar music portal to check for his favorite music
In order to figure out pain points when users are searching for the music of their favorite singers through websites, I created a user journey to explore what could happen during the process and the corresponding user experience at each stage.
Find that a loved singer has released a new album
Find the portal does not poseess copyright of the new album
Go to other portals to find music and news of the singer
Web enginee Music portal B Music portal C …
Music portal A
Channel
Open web search engine to search for the particular album
Find news of the singer’s recently concert live
Music portal C
Information Asymmetry
Find tickets of the concert have been snapped up once on sale
Ticketing website X
Search for place to subscribe news of the singer but failed
Web enginee
News Update Delay
Experience
Goal
Find some good music to listen at a place conveniently
Find music from his favorite singer
Listen to the new album
Find music portal which contains the very new album
Listen to the new album and browse news of the singer
Know more about the concert live
Buy tickets for the loved concert
Find place to get the singer’s news informed
ZIJING WANG IXD DESIGN PORTFOLIO | RSS Music
27
ARCHITECTURE How do I solve Information Asymmetry To solve the pain of information asymmetry in multi-platforms, I want to collect data from the internet to make up a singer-centered information gathering website.
Taking advantage on the technique of web crawler, we can get information on albums and concerts of the singers through fetching data from wikis, music portals, and ticketing websites.
My goal is to create a bridge between users and their favorite singers to help them more easily find the music they want, and get the news of their favorite singers at first hand.
How do I solve News Update Delay
To solve the problem of delay in the news update, I refer to the popular RSS technique, where news on the Internet is captured and pushed to users in real time.
Sending feeds of news to users with notifications on phones could rescue them from missing hot news from their concerned singers.
With links to origin web pages, users can easily obtain their favorite music without separately checking different music portals.
ZIJING WANG IXD DESIGN PORTFOLIO | RSS Music
28
WORKFLOW
After generating the underlying architecture of my product, another thing I want to figure out is the pathway of experience. I went through all the steps and generated a workflow to organize my ideas. The diagram below shows the entire process of using the website.
ZIJING WANG IXD DESIGN PORTFOLIO | RSS Music
29
PROTOTYPE Responsive web page Adaptive to both PC and mobile browsing
Mobile Notification
User Feedpage in mobile
Singer page in web browser
3D INTERACTIVE MOTION SENSING GAME
GAME DESIGN Tools Role
Game Logic Design, Interface Design
Duration Apr. 2017 - Jun. 2017
BACKGROUND RESEARCH Game Market Analysis
Kinect, a device that replaces traditional gaming controllers with motion sensitive 3d cameras, shows a great expectation for the future of technology. However, this potential has mostly been speculative, as there are few games take the advantage. With much curiosity, I did some research on the current game market.
Findings
1.
Tracking failure is the most frequently reported bad experience.
poses could cause frustration for 2. Complicated users and low fluency for the game.
game market for Kinect shows is fairly 3. The homogenous; with dance, fitness and family
entertainment representing the majority of titles. It lacks fierce and novel combat games.
ZIJING WANG IXD DESIGN PORTFOLIO | Magic Battle
32
IDEA GENERATING
Basing on findings from user comments on game sites, I designed a questionnaire to collect more feedback from users to explore how they would imagine a good motion-based game from user point of view.
Questionnaire Results
Outcome Essentials
Testers are found from game experience stores in Shanghai.
After interviewing our potential users, I summarize five essentials for our game corresponding to the questions.
ZIJING WANG IXD DESIGN PORTFOLIO | Magic Battle
33
MAKE INTERACTIONS
Judging from the five essentials, experience with interacting is the primary concern of users when playing Kinect games. I decided to explore the way of interacting with the device without a controller. The main purpose is to design interactions which can be quickly and accurately detected.
INTERFACE INTERACTION
GAMEPLAY INTERACTION
Technical Limits
Technical Guidance
Kinect can only recognize simple hand gesture of Rock, Paper, Scissors.
Simple body pose with less skeleton nodes can be detected most quickly and accurately.
Gesture Design
Pose Design
In order to solve the problem of gesture limits, I combine rock and paper as a whole dynamic gesture to simulate people’s natural movement: to grip something when intending to select.
of pose sets to conform to users’ intuition.
+
=
For skill releasing in the battle game, I design simple combinations
GRIP to make selections
Move left
Context of Use Assume to select UI button in place of click
Move right
Skill 1
Skill 2
Skill 3
Context of Use Assume to release different skills during the game in place of key pressing.
ZIJING WANG IXD DESIGN PORTFOLIO | Magic Battle
34
GAME & CODING WORKFLOW
ZIJING WANG IXD DESIGN PORTFOLIO | Magic Battle
35
DESIGN ASSETS
ZIJING WANG IXD DESIGN PORTFOLIO | Magic Battle
36
GAME INTERFACE
Start Screen
In Battle
TAKE A LOOK AT THE DEMO
Select Power
Win victory
THANK YOU.