UI / UX / Graphics | Product Design
SELECTED WORKS OF JIAMING ZHANG
EDUCATION Anticipated graduation - May 2017
Cornell University, College of Human Ecology Bachelor of Science Design & Environmental Analysis Major Human Factors and Ergonomics Concentration
VISUAL Adobe Illustrator | Indesign | Photoshop | AutoCAD
USER INTERFACE Sketch 3 | InVision | Handsketching HTML + CSS | Adobe Dreamweaver
Information Science (HCI) Minor
3D MODELLING WORK
Google Sketchup | Rhinoceros | Solid Works Keyshot | Vray for Sketchup
June 2016 - August 2016
Product Design Intern - Shanghai, China WOW Design, United Design Group Co. Ltd. (UDg)
LANGUAGES English | Mandarin
June 2015 - August 2015
Web Front End Designer - Ithaca, NY Cornell University, Department of Design & Environmental Analysis
HOBBITS & INTERESTS
September 2015 - October 2015 Web Front End Designer - Ithaca, NY Cornell China Club
TABLE OF CONTENTS
The Elder Stick
Innovative Card Deck
Cornell China Conference
Tableware Big Red Hacks Posters
THE ELDER STICK Human Computer Interaction | 2016 Fall A significant proportion of the elderly have been and are being left behind by the communications technologies of the twenty-first century. We have built a smart TV-based communications device with functionality such as voice call, appointment management, instant messaging, and smart personal assistant that directly, deliberately addresses each challenge faced by elderly users, from the choice of interface sizeâ€”the televisionâ€”to the use of speech recognition to sidestep impairments in vision.
Ethan Arnowitz | Albert Liuqing Zhang| Xin Lin | Jiaming Zhang Color Scheme #
Roberta| Samantha | Mark | Nick (Pseudo Names from Brookdale Nursing Home) Interview Settings The setting for the interviews at Brookdale were conducted in the intervieweeâ€™s room. The room of the residents provided a comfortable, familiar, and contextual environment for the interview. Since the interviewees often use technology in their room, this seemed an appropriate setting for the interview. Our fourth interview was conducted via video chat. The interviewee was asked to sit in a comfortable spot within her home. This interview used video chat because our project is exploring usage with communication tools. This interview provided unique contextual observational opportunities.
Consent Procedure Before starting the interview, we asked each participant to review the printed consent form. After reading the consent form, interviewees were asked to sign and date it. Copies of these signed consent form are located at the end of this assignment. If the interviewees had any questions or reservations they were allowed to ask the interviewer for clarification.
Interview Questions and Tasks After the consent form was signed, the interviewee was read a short introduction on the interview process and themes that would be addressed throughout the course of the interview. Three main themes were covered including interviewees personal experiences and health, experiences with technology, and communication.
End-of-Interview Wrap-Up At the conclusion of the main interview questions, the interviewer asked a series of wrap-up questions, providing an opportunity for the interviewee to ask the interviewer any questions. All of the interviewees said they had a comfortable experience during the interview. Some asked questions about us and what we hope to achieve.
Analysis + Social Model
UNDERSTAND USERS Persona
Sheila Gonzales, 87
Sheila is a vibrant and witty woman who was born in Eastern Germany in 1929. Sheila escaped to America at the beginning of WWII. When she arrived , Sheila met her husband of 66 years in Pittsburgh. Sheila and her husband relocated to Ithaca, NY when her husband began a job as a History professor at Cornell University. Besides a stay-at-home mom, Sheila worked part time as a secretary in a local architecture firm. During her career, Sheila had minimal interaction with technology and did most of her work by hand with pen and paper. Sheila retired in 1975, when she started spending a lot with her daughters, Samantha, Jessica, and Crystal. Crystal recently moved in California, and Sheila misses her dearly. When she was younger, Sheila was an all-star softball player, and was one of the top female pitchers of her day. These days Sheila likes to knit, play shuffle board, and spend time with her grandchildren.
Sheila’s husband died 10 years ago. After his passing, Sheila remained in her home until she fell and displaced her hip last year. Sheila has three daughters, two who live locally and one who lives in California. Sheila has 7 grandchildren, who she admires very much. 2 of these grandchildren live in California, and Sheila wishes she could see them more.
As a 87-year-old woman, Sheila’s life goals are centered around creating meaningful memories and enjoying the time she has left. Something that is very important to Sheila is leaving a legacy behind, especially for her 7 grandchildren. Sheila has a lifetime worth of memories and stories, and she wants to record and save them for future generations.
Physical Limitation Sheila has limited mobility and uses a walker to assist her in walking. Additionally, Sheila’s hearing and visual capabilities are severely limited. When watching the TV, Sheila sets the volume to maximum. Additionally, Sheila’s severe arthritis makes it difficult for her to use small interfaces and devices.
Retired (Former secretary in architecture firm)
Cognitive Limitation Technology Usage
Overall, Sheila’s cognitive health is good. Besides being slightly slower than average to process information, she is articulate, well spoken, and aware of her surroundings.
Current Techonology Currently, Sheila’s only technology use is a flip-phone and a TV set located in her room. She uses the flip-phone to communicate with her family, and doctors. Although Sheila has a TV, she often doesn’t use it. Additionally, Sheila does has an email account, but only uses it when her daughter comes to visit.
Currently Sheila feels stigmatized, intimidated, and limited by the technology she has. Additionally, Sheila’s end goal is to communicate with family, especially with her long-distance grandchildren. Because of these two main problems, Sheila needs a universally accessible, de-stigmizized and enjoyable communication tool. Sheila’s desires a light and portable device. Because of Sheila’s limited vision and hearing, Sheila desires large font sizes with increased audio assistance. Sheila often has trouble unpacking and setting up new products. Because of this, the product needs to be easy to open and set-up as her experience goal.
Communication Currently, all of Sheila’s communication is done via a flip-phone. Sheila video-chatted once on her daughter’s computer, and would like to be able to do this on her own. She misses her grandchildren that recently moved away, and was hoping to see them. Sheila visits her doctor twice a week, and communicates with him in person. Additionally, the staff at Clearwater checks in on Roberta multiple times a day. Sheila is often disoriented by her schedule and doesn’t know when her different appointments and visits are.
R e a l -T i m e
Heuristic evaluation - Neilsen’s heuristics
Description of Violation
Speak the user’s language
The product requires the user to interact via voice command (remote can be used later on) in order to proceed.
User in control
There is no undo or redo. There is no way to quickly withdraw the request. The user must wait for the call to either connect or fail.
Visibility of system status
There is no indication of how far the user is in the setup process.
Error recognition and recovery
There is no indication of what would happen if the appointments conflict.
Help and Documentation
If the user is lost of needs help, there’s no place for them to provide more information.
During the video chatting, the user could say “end“ to end of conversation. However, the user could accidentally say the word and stop the conversation.
Visibility of system status
Although the appointment are listed, and the color is used to match the conatcts, there’s no way to see the detail of the appointments.
IMPLEMENTATION + EVALUATION
1 Facilitator | 1 Note taker | 1 Interviewer | 5 Participates
1 Transition from the set-up section to the home page with added tutorial
Task 1 Set up Elderly Stick 1. Tap the microphone button on remote and say “hello” / Press “begin” button on remote 2. Tap the microphone button on remote and say “[name]” / Enter Name using the remote Final State: set up complete page
· Smoother transition from set-up to the main calendar page · Step by step tutorialbefore the main page · Recur voice input button and text · Increase the learnability
Task 2 Execute an upcoming appointment
1. Tap the microphone button on remote and say “Take” / Press “take” button on remote
Simulate leaving a legacy
2. Talks to the person from the other end 3. Press “end” button on remote to end the conversation 4. A window pops up - “Are you sure you want to end this conversation?”; Press “yes” button to confirm.
· Predictable transition to the new interface.
1. Tap the microphone button on remote and say “Yes” / Press “yes” button
2 Better introduction to the “archive conversation” function.
2. Save the session into a category: Tap the microphone button on remote and say “stories”/ Press down button two times, and then press “yes” button
· Change the button option to “end and save/end/cancel”. · Preview image to the save to the category confirmation page · Add profile picture to the saved conversation. · Reduce user’s memory load · Perceptible information
Findings from User Testing 1
In the name input interface, the microphone button does not offer enough visual cue to allow user to understand that it refers to voice input on remote.
The color coding in the calendar interface, instead of offering clear mapping for participants, it complicates the interface by making mapping from contact to appointment more difficult.
The use of color grey to distinguish from past appointments and unavailable contacts along with color coding of contacts is inappropriate. Although some participants realized that the color coding is a mapping from appointments to contacts, they assumed grey is also the color of a contact. Lack of visual indication on calendar interface that informs users of voice as a means of input. Participants were unaware that they can use voice in the calendar interface. The monthly/weekly view option is not apparent to users and the information presented on monthly view lack appointment details for elderly users. Some participants did not notice the existence of weekly view and complained about the lack of information on monthly views. The transition from the completion of setup to calendar interface is too abrupt.
3 Color coding matching between the contact list and the event in the calendar · Add online/offline status before the name · Match name and time · Remove calendar icons · More visible cues and affordance by using both color and text · Perceptible information · Reduce memory load increased
DESIGN IMPROVEMENTS + EVALUATION Reivised Designs
InVision URL: https://invis.io/8B9KKMNQ2
E N T E R TA I N M E N T S PA C E CARD DECK Creative Product Design | 2015 Fall As a creative solution to increase the efficiency of design brainstorming session, this card deck helps both designers and client to brainstorm about college amenity spaces by using images, verbal description, and installation notes. Our group was focusing on research and develop a card deck for entertainment aspect of amenity space, other groups were working on gallery, gathering, food, information, making, nature, and work-life-balance spaces. GROUP Rebecca Merenbach | Madeline Winer | Kayla Wong | Jiaming Zhang Color Scheme #
Colleges and universities face very different incentives depending on their current student body and the students who the institution hopes to attract (Jacob, McCall, Stange, 2013). That said, a liberal arts school, for example, would not have the same exact entertainment amenities as a Division I sports school .
CO M P E T ITIO N IS F I E R C E
With enrollment rates going up, colleges are starting to compete against one another for the top talent…and unsurprisingly one of the ways schools are recruiting and attracting new students is through their state-of-the-art entertainment amenities.
TO ATTR ACT TH E BE ST STUD E N TS ST UD E N TS ’ P R E F ER E N CES A R E D IV ER S IF Y IN G
Today, college students are more stressed than ever before. In 2014, according to the American Freshman Survey, an annual report surveying over 100,000 full-time, first-year students across the U.S. conducted by UCLA’s Higher Education Research Institute, only 50.7% of the students reported that their emotional health was in the “highest 10 percent” of people in the same age range as them (New, 2015).
A M EN TIT Y S P E N D IN G I S
Schools are spending about the same amount of money towards building new amenities as they are towards supporting academics. With amenity spending at an all-time high, the quality and variety of entertainment spaces on college campuses is getting better.
CLOS IN G IN O N ACAD E M I C S P E N D IN G
I N C R E AS ED STR ESS L E V E L A N D M E N TA L H EA LT H ISS UES A MONG CO L L E G E ST UD EN TS ACR OSS TH E U. S .
E N TER TA IN M EN T S PAC E S R E D UCE ST UD EN TS ’ STR ESS
With emotional health and well-being as a high concern among many college students, there is a great need for more entertainment and leisure spaces on campuses to allow students to take a break from work and enjoy themselves. While students struggle to find a healthy balance between work and play, colleges and universities can help improve student and campus life by providing fun, stress-relieving entertainment amenities.
ROCHESTER INSTITUTE OF TECHNOLOGY
“The Arts District”
“The Global Village”
Working out the creative mind in an open, collaborative space
Stop by and check out the work of local artists and students
Sit outside, watch a performance, or even go ice skating in the winter
Go pick up some groceries and send out mail all in one place
THE COFFEE HOUSE
Grab a cup of coffee and enjoy open-mic sessions
Get the experience of viewing the works of famous artists on campus!
Try out new foods from a variety of global cuisines
Soak up the sun during the warmer months
MULTIPURPOSE DINING HALL
FIRE PIT LOUNGE
Eat dinner on Monday and go dancing on Saturday
Top notch, state-of-the-art concert halls for all to enjoy
Get a quick workout in before grabbing a bite to eat
In the cold winter months, sit back and relax by the fire
The variety of entertainment spaces differs at colleges and universities across the country based on their academic competitiveness
Entertainment spaces help to bridge a gap between college campuses and the surrounding community
Entertainment spaces are used as an important tool to improve the well-being and happiness of the student body
College and universities are spending a great deal of money on expanding and improving their entertainment facilities
Colleges and universities are already starting to revise what we traditionally think of as campus entertainment spaces
As part of our primary research, we conducted interviews with various users to get a wide range of perspectives on entertainment spaces already on campus and “ideal” entertainment spaces that these groups would like to see on campus. Speaking with these different user groups allowed us to identify patterns within each group as well as overall opinions. Our interviews with Cornell alumni revealed that when they come back to campus, they enjoy visiting the iconic landmarks of Cornell, such as McGraw tower and walking across the suspension bridge, rather than spending time inside buildings.
“When I go back to Cornell I like to explore the outdoor spaces rather than try to seek out entertainment indoors.” Cornell Alumna, Class of 1984
“I think it could be really cool to implement However, alumni did express interest in going to more sporting events if the opportunity was presented to them rather than having to seek the experience out themselves. Trends we identified among Cornell students centered around the fact that having a lot of options are important to them whether it has to do with food, music, or the general atmosphere of a place.
a mini-town on campus like Facebook has at their headquarters. There are so many options that are conveniently located in one space.” Cornell Student, Class of 2017
“I love going to the Dairy Bar when I visit When interviewing the parents of Cornell students, one common theme we found is that when looking for entertainment, they tended to go off of the Cornell campus. They described their frustration with the fact that although the Cornell campus has a lot to offer, it was hard for them to stay entertained for long period of time without “organized” activities and more engaging experiences.
Cornell but it would be nice if there were more activities to do there, like an ice cream making demonstration.” Cornell Parent
PERSONAS THE ATTACHED ALUMNI
THE DEDICATED PROFESSOR
THE PROSPECTIVE CO-ED
“ I want a lot of options in one place. ”
“ I want to get my money’s worth out of campus activities. ”
“ There should be organized forms of entertainment. ”
“ I like to get out of my oﬃce in between classes. ”
“ I’m nervous about finding entertainment on campus. ”
Spends most week nights studying in libraries on campus
Works five days a week as a lawyer
Volunteers for her college alumni board
Has been a physics professor for 20 years
Current high school senior
Likes to do outdoor activities on the weekends
Avid cyclist in his spare time
Enjoys talking to and mentoring his students
Narrowing down where she wants to apply to college
Member of on-campus Acapella group
Never misses a Sunday night football game
Visits her almamater at least twice a year
Conducts research on campus
Enjoys going to the movies with friends on the weekends
Hang out with friends more often
Make sure child works hard and has fun at school
Succeed in her businesses
Maintain strong relationship with students and university
To work hard but also have fun in college
Complete homework eﬃciently
Complete a triathalon
Keep consistent relationship with her university
Utilize resources of the large university for research
To make friends quickly
Quiet study space that does not put her in complete isolation
Access to gym and outdoor activities wherever he travels
Organized forms of entertainment on campus
Casual space for students and staﬀ to interact
Convenient access to entertainment spaces on campus
Places on campus to reconnect with college friends and professors
Place to decompress in between classes
To easily find places where she can hang out with friends like at home
B E H AV I O R S
T H E I N V E S T E D PA R E N T
G OA L S
THE BUSY STUDENT
Convenient and quick place to meet friends for coﬀee on campus
To see a college football game when visiting his child at school
THE BUSY STUDENT
THE DEDICATED PROFESSOR
“I like to get out of my office in between classes.”
“I want a lot of options in one place.”
Coffee Before Class
Displaying Class Projects
Talking to Friends
Chatting with Student
Watching a Game
Socializing with Faculty
AMENITY SPACE - CARD DECK
HUE BE AT S APP UI Design | 2015. 09 “HueBeats”, a music and light controlling app finished within 24 hours for RPI’s second Hackathon, aims to create ultimate home disco with music and customizable light most intuitive user interface and user experience to deliver the function and purpose of the app clearly.
Color Scheme #
PROBLEM & RESEARCH
You want the color of the light changing with the beat of the music and be THE DJ at home
Phillips Hue Color Changing Light bulb
Phillips Hue App to control the color of the light
Use Bluetooth to connect to the speaker + Play Music
Internet of Things - Control the lighitngs at home
Satisfied See the entire store Wait in line
Experience Map of Drinking Bubble Teas at Old Tea House Jiaming Zhang | Janelle Jiun Chung | ManĂŠ
Mehrabyan | Giulia Reversi
SEE THE ENTIRE STORE
Read Menu Menu is too small and placed in the place for ordering
Socialize and drink tea
Delight Spot Hot Spot Missing Experience
Wait, check phone, hear TV and people, pickup order, and put in straw
Design Solution 1 separate the places for reading the menu, ordering, and pickup
TV and Machinary too loud
Pickup and order are in the same Straws are location, creates unsanitary and congestion open for touch
Design Solution 2 remove the extraneous TV in the back and lower volume of the one in the front
Design Solution 3 limit touching of the straws ends by hands
Computer Ga Interface and user e
Most Innovative Gam
Sync is a rhythm puzzle platfo complete rhythmic challenges the game environment, as well navigate throu
ame Design experience Design
me Award 2016 Fall
ormer that requires players to s to change and interact with l as use platforming controls to ugh each level.
use music to solve problem Thematic Focus
different zones link to different musical instruments keep a relatively quick pace of the game
primary - get to the end of the level secondary - vsolving puzzles along with the beat of music
intrinsic - constraints of puzzle objects extrinsic - timing | precision | coordination | sense of rhythm | problem solving
GAME MARTKET RESEARCH
College students with different majors and years Professors with expertise in game design Judges from game industry Local residents who are only going to play the game for a short time if itâ€™s attractive
requires actions on beats, relying
players are on rails instead of free
requires reactions to the
only on platforming ablity
NON DIGITAL PROTOTYPE
One avatar character (minim)
Numbered sync tiles (yellow) Wall pieces (green)
Numbered door pieces (red) Rhythm cards
Test the game mechanics by creating a non-digital board game Tested by 15 Cornell Undergraduate Students
showing the acurracy of sync tempo
visually indicating the upcoming beat in advance above avatar
Bear Indicator 2
visually indicating the beat in advance
periodically glowing on beat to show the tempo
Activating Radius reduced syncing radius, allowing precise syncing controlling
Revised Version After User Testing
New Game Tutorial Level Select
World 1 World 2
Next level Level Select Quit
Up Arrow - Jumping Esc - Pause
Spacebar - SYNC
Press quickly to short hop Hold down for full jump
Arrow keys (Left/Right) - Walking
MARKETING + RELEASING
CORNELL CHINE CONFERENCE Web UI/Graphic Design | 2015 Summer
The Cornell China Club was founded under Cornell Universityâ€™s rich history of US-China relationship. The biggest annual event, Cornell China Conference has received prominent guests from a variety of industries and top universities. website link: http://cornellchinaclub.com
Color Scheme #
Advisor Team Sub-team Join Us
Keynote Speech Panel I Panel II Panel III Panel IV Panel V
Home Page Current Sponsors Past Sponsors
Dining Accommodation Campus tour
External event ticket selling page
HOME PAGE UI
Highlighted section directs to tickt page
Direct to Conference page Back to Home page
Contact Information and social media
Involvemnt statistic showing impact
Direct to About page
Featured Guest speaker: Name & Title
QR code directs to offcial wechat account
ABOUT PAGE UI
Sub-title of section
Side menu helps with sub-sections Breadcrumb helps with navigation
Indented title and plus icon showing members in subteams
Back to top icon to help with navigation
Square shape with join us text to resonate with memberâ€™s profile picture
Consistent foot section
H A N D - S K E T C H I N G TA B L E W A R E Visual, Product Design | 2016 Summer Inspired by Marrimekko’s Maija Louekari’s Räsymatto motif tableware, this product uses hand sketching modern ripple lines motif to redefine the border between the plates and bowls. When being put together, the ripple lines are spreading out from both top and side views.
DOTS STORAGE JAR - TEXTILE + PRODUCT DESIGN
50.73 R 5.00 5.00
BIG RED // HACKS - BRANDING
BigRed//Hacks Fall 2016 will be the third iteration of Cornell University’s large-scale, student-run hackathon. Over the weekend of September 16-18, for 46 hours (from registration to closing ceremony), students from all across the northeast will gather to build the coolest and most innovative web, mobile, and hardware applications; meet amazing people; and win prizes and awards! We expect to have roughly 300–400 undergraduate and graduate students participate in this hackathon. With the help of sponsors like you, we will be able to offer an engaging workspace, complementary transportation, as well as free food, drinks, and giveaways. As a tech company, sponsoring BigRed//Hacks is a great way to share your brand with the upcoming talent in the computer science and software development community. Sponsors that are able to attend the hackathon will be allowed to have their own award and/or prize for the team they judge as the best at the demo expo. A full list of sponsorship tiers and corresponding benefits are listed on the next page. As a sponsor, you will get the most out of the hackathon if you… Send Company Swag (t-shirts, water bottles, etc.) for participants, which is an easy way to build company brand recognition as well as general positive spirit. Bring Company Representatives and mentors to the event to provide assistance to participants working with your APIs and other technologies. Mentoring at BigRed// Hacks is a great way to meet participants and also further establish brand recognition. Thank you for helping us make BigRed//Hacks a success!
Interested in sponsoring? contact us at firstname.lastname@example.org http://bigredhacks.com Cornell University | September 16-18, 2016
(co-host: limit 1)
GENERAL Mention at Opening/Final Presentation Branded Prize Permitted Mentors on Site
Table & Stage
1 & Keynote
Reserved Company Table Standing Banner Permitted
BRANDING Logo on Website & Program Distribute Swag Swag in Swagbag Logo on T-Shirt Extended API Demo* Event —1 hour slot
RECRUITING Access to Participant Contact Information Distribute Recruiting Information Access to Participant Resume, GitHub, and LinkedIn
Sponsors who wish to make their API available to participants will get a minute-long API demo at opening presentation. *A 20 minute slot on Friday evening to further demonstrate your API to hackers.
GRAPHICS + DRAWINGS
UI/UX/Graphics | Product Design
Published on Dec 17, 2016