UXD User Research and Persona

User research

I know I have a big problem: replacing the act of seeking others’ opinion on whatever I am working on—never a good idea. Which is why I actually started to listen to the user from ideation. But in order to identify a more concrete and specific end user this exercise was very useful, and turned out to have some surprising data.

First, I considered the following questions:

  1. Objectives. What are the knowledge gaps I need to fill?
  2. Hypotheses. What do I think I understand about my users?
  3. Methods. Based on time and manpower, what methods should I select?

1. Objectives – I was curious what would be the most ideal medium: website, app, web app or maybe a mobile web app? I needed more information regarding internet, computer and phone usage to be able to answer that. I also specifically asked what steps do they take when planning a meeting. In addition to this, I needed to know more about expectations, what would make a meet-up planner good, usable, what features would they look for? I also needed some information about similar existing sites such as Yelp and SmartShanghai, what makes them good or what they are lacking.

2. Hypothesis – I presumed people would be more open for a website, since apps take up too much memory on the phone and SUS would not be an app users would use every day. I derived the general plan-making routine from my own experience. I usually come up with the type of meetup at first, meaning if it is for studying, just catching up, treat day, date etc, then I would choose to do something that I am familiar with so there is not a lot of variety in my selection. After that, I would look up the specific place such as a restaurant or bar, and book a table. This takes a lot of time and as the number of people involved increases, it get more complicated and frustrating because noone ever knows what they want.

3. Method – For the survey, I compiled a list of questions, most of them multiple-choice because that is the  easiest way to collect quantitative data. There is one open-ended, which I would analyze later. In order to fast and effectively get around the strength and weaknesses of the competition (Yelp and SmartShanghai), I conducted a 45min Focus Group Discussion with 5people. And finally, I conducted 2 one-on-one interviews just to get to know better other people’s attitude towards the topic.

Here is the link for the data analyses from the survey: https://docs.google.com/document/d/1_TBpphQ8CffJql1ELVxySoPcG9u8HJ39AIAIjBUMo2s/edit?usp=sharing

From the Focus Group and the interviews I found out more about personal preferences. Everyone of them was a student at NYU Shanghai, between ages 20-23, girls. I asked similar questions to the survey but went into motivations more deeply. The most important part in these sessions was finding out what attracts visitors to the similar concept ideas like SmartShanghai, Yelp, Chop, Time Out etc. The most attractive feature they had was the location based search and the deals. Originally, I did not think about building a deals section into the project, but at the end I put it there. But most importantly they all reinforced me that they would use a website that would combine a location-based search with the best deals in town.

Additional interesting finding was how participants found the word meeting confusing, they all associated to something more formal. I realized I have to play close attention to the wording as it may be deceiving for others.

Persona

Both my personas are based on real people. While Olivia is a mixture of NYU Shanghai girls, Marianna is actually my own mother. I interview her specifically for making a persona.

The persona clarifies who is in my target audience by answering the following questions:

  1. Who is my ideal customer?
  2. What are the current behavior patterns of my users?
  3. What are the needs and goals of my users?

I tried to keep them brief, specific yet realistic.

Link to the personas: https://app.xtensio.com/somgzeg7

UX Design |Usability Test| Se)( App (Forum)

Usability Test:

For this week’s assignment, I first did the usability test based on my wireframe and got many feedbacks.

Most users gave feedback on the login page takes long time but after I explained the reason (I want to have different content face different user), they understood, but I think there must be some good way to fix this problem, but I’m not very sure right now.

User 1:

Change the parent-kid part to a specific age range will be better.

Give a back button.

Give people a hit where they can click.

Give people a hit that they can scroll.

Sign out button/private code to open it.

User 2:

Can add a “quiz” section for the user to get a little gift.

Give people more topic choices on the education part/courses.

Really like the community idea.

User 3:

DIY section is very good.

Should give users a hit that they can go to any section that is under their age.

Will younger children are curious if they can not go to another section?

Callum and Catt || Usability Testing

For our usability testing, we reached out to four people and recorded their thoughts as they went through the app. You can find their comments below. We have the audio recordings as well, but unfortunately, it takes way too long to upload them to the site, so we will have them as a back up in case we need to go back and reference anything.

Franklin

Student

3 hr something min/day

Wechat

 

Usability Issues:

  1. Text is a little small (hard to see)
  2. A “submit” button on the questions so that you can change your answers
  3. Tries to scroll but can’t

 

  • Likes the recommendations***
  • Would use it when travelling bc he prepares/researches a lot before travel

 

  • Clear invitation of where to start
  • Include a “back” button
  • “Don’t make me think”

 

Helena Ma

Student

4-5 hours/day

Instagram, Youtube, Wechat, Didi, Eleme

 

  • Thought the initial questions were a little weird, would have preferred to just choose what museum she wanted (didn’t seem like she would just scroll through the app, would only use it for a reason with a set destination in mind)

 

Usability Issues:

  1. Font was unattractive
  2. Wished to “skip” on the questions
  3. Wished you could go back on the questions

 

Floyd Son

Student

15 hours/week

Wechat, Instagram, Baidu

 

  • Seemed to like the idea of it
  • Thought it was visually appealing even though he’s not sure he would use it himself

 

Usability Issues:

  1. Didn’t want to sign in
  2. Didn’t want to answer the questions
  3. Text was hard to read

 

Rhys Dhinsa

Student

8 hours/week

Instagram, Wechat, snapchat

 

  • Liked the name/slogan of the app
  • Liked the recommendation option
  • Wondered what the “dive deeper” option was next to “play audioguide” option

 

Usability Issues:

  1. Text was hard to read
  2. If you can jump around to different times once the audioguide had started
  3. Font was small

 

Arshaun Dharabnia

Student

10 hours/week

Instagram, Whatsapp, Facebook

 

  • Seemed interested in the concept
  • Wondered aloud about the cities we chose to include, about how many cities/museums/options there were
  • Liked the recommendation aspect but wondered how accurate it could be

 

Usability issues:

  1. Thought the registration process was easy but that there should be an email verification
  2. Wanted to see the other options and hear a sample audio guide (but obviously our prototype isn’t that advanced yet)
  3. Wondered if the globe was interactive and you could choose a destination that way

 

It seemed like two common dislikes were the text and the sign in process with questions, which if there is two things wrong these are the ideal things as the text/font has not yet been chosen and the sign in process is generally not included as it can be extremely tedious. So then looking a the comments overall, it seemed alot of people vibed with the idea and enjoyed the thought of possibly using it. We’re definitely on the right step going forward and im excited to see what sort of style and font we give it going forward.

In terms of color scheme, we chose to play with blue and yellow because blue is generally calming and yellow is warm and happy, so I think given our slogo of “The Happy Traveler” it makes sense.

 

 

Week 5: User Interaction Design | User Testing

This week I was focusing on designing the user interaction and user testing. I designed the interaction mode first in order to give the user a clearer understanding of how to use this app when doing testing. This video shows how it works:

TapTop

I also uploaded it to YouTube:

I designed this user interaction with InVision Studio, a digital UX design software. Compared to Marvel we used in class, InVision Studio allows the user to design a more complex animation and transition. It’s very user-friendly, in which user can easily design the connection between different views and edit them in an intuitive way. The image below shows how I drew the connections between different views. And it allows the user to directly import files from Sketch, which saved me a lot of effort.

The transitional animation can be easily designed with the InVision Studio. Similar to the magic transition function in Apple’s Keynote, the animation building process in the InVision Studio requires the user to set a starting and ending point between two views and it will automatically calculate the transition for you. This also requires the object to remain the same between two views, which also requires a lost of copy-and-paste work. Once the animation has been set up, the user can edit the timeline to polish the transition process.

My basic idea of designing this animation is that I wanted to build a so-called leading object between different views in order to integrate them together, in other words, no matter how the user switch between different views, there will be some objects they are familiar remain on the screen with a smooth animation. For instance, when the user switches from the main screen to the short-video screen by swiping up, all those bubbles represent different people will automatically change their size and move to the top of the screen. And it’s similar to the ME bubble which exists almost in every screen. Through this way, I am hoping to design an integrated and elegant experience, and the leading object will serve as a guide to lead the user go through different views and encourage them to try new things.

The user testing gave me some positive feedbacks. It showed that most of the users were able to tell what they are doing in each step. The controversy was among two views, the homepage and the friend list. Some users were wondering what if they have hundreds of friends who are using this app, the homepage will become too crowded. The same concern applies to the friend list view, users were confused about searching for certain friends and cared about how to find the person among hundreds of friends. Also, some user raised the concern that will they be able to see their friends in a far distance. During the testing, some users proposed some quite useful using scenario such as finding nearby friends to go to eat together and using it for dating, which were quite inspiring and I might document those thoughts in my later posts.

To deal with those feedbacks, I will focus on redesigning those views and adding new views in my later work. A testing user suggested me to change the friend list view to clusters of bubbles, which are categorized by their names, which I thought is very inspiring. I will also add a map of large scale for the user to see where their friends are regardless of the distance. And different places, such as theaters and restaurants will be added to this view, so the user can easily plan their activities with friends. And I am also working on the business model of this app.

And I also designed the logo using Sketch:

 

 

UX Design| Amber Wang & Theresa Lin| Scenario and Persona

Class: User Experience Design

Instructor: Azure Qian

Documented by: Amber Wang and Theresa Lin

Zoe Richard

Zoe’s been working hard part time for the past month because she’s been trying to save up for a cake for her grandma. Since her college is too far from her grandma’s house, she can’t visit her grandma. Unfortunately, her school doesn’t have a break on her grandma’s birthday. However, Zoe still wanted to get her grandma a cake. Originally she wanted to just buy a pre-designed cake and have it delivered to her grandma’s house but she happen to come across a cake design of a mahjong piece on Instagram. Remembering that her grandma loves to play mahjong, she decided she wanted a design of that. Unfortunately after looking through several bakeries, she either couldn’t find a mahjong design or the ones that had it didn’t look so great. Suddenly she came across the “3D Cake Lab” website. After reading their ‘About’ page, Zoe was excited about being able to design her own. She looked at the price and it was reasonable for a custom cake, especially one she could design on her own. Zoe went through the design process on the website and was also delighted that they had a delivery option. After she finished designing the cake, she selected the delivery option and inputted her grandma’s address. She could also select which day and what time to have it delivered. On the day of her grandma’s birthday. She received a call from her grandma just several minutes after the cake was set to be delivered. Her grandma sounded really excited and thanked Zoe for the surprise cake. She also told her how much she loved the design and was surprised at how bakeries offer this kind of design. Zoe then told her grandma all about the 3D Cake Lab.

Jessica Lai

Jessica Lai loves to hang out with her friends at cafes especially when they have to study. She loves exploring different kinds of dessert and beverages while at cafes. One day, while she was walking around the city looking for a new cafe with her friends, they stumbled upon the “3D Cake Lab.” The name peaked their curiosity and they went in to have a look. When they were shown to their table, they were surprised that they could design their own cake. They each picked up an iPad with the screen “Start Design.” They each chose a single serving size cake as well as cake flavor and icing then immediately began to design. They were surprised by how simple the interface was and how easy it made the designing process. They searched for pictures of their favorite character and attempted to design it on the cake. When they were done, they were given a choice to upload their design. Jessica felt confident in her design so she uploaded hers while some of her other friends didn’t. Then they chose the print now option and each received a number. When the cake was about to start printing, the iPad buzzed and displayed the number machine. They all hurry to the machine and watch in awe as the design is 3D printed on the cake. When it’s done, they all pull out their phones and start taking pictures for Instagram. Jessica captions her post, “Omg you guys HAVE to come here to design your own cake if you haven’t yet!!! It’s 3D printed!”
Jessica and her friends feel like it’s a waste eating their masterpiece, but they take a bite and decide that they’re definitely coming back again.

 

 

Michael Sun

It is almost their 5th anniversary. Michael has been searching around for the best place to celebrate their anniversary. Michael is such a crazy worker that he hardly has time left for his family. He really needs an amazing date to cheer his beautiful wife up. Money is not a big problem for Michael, a banker. He wants the date to be the combination of his interests in technology and his wife’s love in design. Then 3D cake lab becomes his optimal choice.

Michael and his wife Susan walked into the mysterious modern cafe called “3D Cake Lab”. They were assigned to a beautifully decorated couch with an iPad on it. The interface asked them to “Start Your Design” with a simple click. Then they were led to choose their cake size, layers and flavor. “6 inch should be enough… honey you like chocolate, lets choose the chocolate base flavor.” After they were done, a magic 3D modeling design interface appeared. There were tons of different basic 3D shape on the right side bar. Susan was very excited about the designing process. She expertly dragged a ball shape and two pyramids to create a shape of cat. She happily played with the different characters, colors, and texts. “Happy Anniversary!” Michael added the text on the top of the cake with a beautiful font and a rosy color. Then they were asked whether to upload their design to the big screen in the cafe. Susan clicked “YES!”. “I want to share this beautiful moment with everyone here!” They got an order number and was told by the interface there were only 3 more orders before them. After 15 minutes, the iPad vibrated and made sounds. They were instructed to go to machine No. 12. Michael couldn’t wait to show Susan the most cutting-edge 3D cake printer. They ran to the machine and saw the cake being printed out. “It is so amazing!This is the best anniversary I have ever had! I love you Michael!” Susan said.

 

Domenico Russo

It was Domenico’s third year in China. He still keeps the weekly habit of exploring the city of Shanghai. He reads art magazines, follows the most trendy events in Shanghai. This week, he surprisingly found that two of his most favorite blogger all recommended a cafe called “3D cake lab”. He became very interested. After reading different posts and reviews about the cafe, he found it align perfectly with his art affection. “I should find someone to go with me…” Domenico thought this could be a perfect chance for him to show his crush on his classmate, a Chinese girl called Fangfang.

Like most Italian man, Domenico is very romantic and has a born taste of art. He had secretly drew a portrait of Fangfang combining Italian art and Chinese traditional ink painting. As usual, he asked Fangfang out for coffee using the excuse of studying. They passed by the “3D cake lab” and walked in. Unlike other customers, Domenico directly walked to the front desk and showed a code in his mobile App, and then they were directed to a 3D printing machine. “I thought we are coming for a coffee and then study, aren’t we,” Fangfang asked. “Coffee would be too bitter for a girl like you. Why don’t we have some dessert as sweet as you?” Fangfang blushed. However, what made Fangfang surprised was that she saw a painting of her being printed out on the top of the cake. It turned out that Domenico has finished the cake design three days ago and selected the pick-up date. He found an amazing function of the design interface to upload a picture or pre-made design on the surface of the cake. He uploaded his favorite painting work of Fangfang and scaled it on top of the cake.

“Domenico, you really surprised me! This is like a miracle!” Fangfang said. “Meeting you was already a miracle for me.” Domenico smiled. “We should come back often!” Fangfang laughed.

 

UX Design Week 4 | WireFrame / Interface Design

I directly jumped to the interface design. Those different views below were designed using Sketch. The relation between different views is shown in the last picture.

Based on the feedback from the survey and focus group, I added two functions to this App. The first one is the texting function. I abandoned this function at the beginning but the feedback from the focus group showed that the texting function was still very important for people to make things clear. And another one is the short-video function which provides a user experience like the Tik Tok. So the mission of this App changes a little bit, now it’s an app which stresses on the quick interaction feature, such as sending vibration and images, but also keep a lot of functions of the traditional social app.

When designing this interface, I tried to make both the logic of interaction and graphic design as simple as possible. The basic logic of interaction are just short click, long click, and scrolling. When those interactions are applied in different views, it will trigger different functions. I chose back as the background color and use high-contrast gradient color as a way to attract user’s attention. There are some consistency in the color schema, for instance, the blue color normally refers to the user and the red color refers to the user’s friend. And when a friend request is sent to a stranger, the color of its bubble will turn to a gradient color between red and blue.

 

1. Mainpage: This page shows the people who are using this app around the user. The user’s friends are colored as red and strangers are colored as green. Those bubbles suggest their locations and the user is represented as the blue bubble in the button. Those pink circles indicates the distance.

When the user turns left or right, this view will change regarding to the direction that the user faces to show more people.

Long click the user’s bubble, its filling color will fade out to indicate that the user has entered the invisible mode. In this mode, the user can’t be seen on other’s phone. User can use this mode to avoid being disturbed or play with his friends.

User can send vibration to strangers by short clicking their bubble. Long click stranger’s bubble will send them a friend request. Their bubble will change to this half-red-half-blue color with a check icon on it. Once the request is approved, the color will change to red, same as friends’ bubble.

Scroll up on the mainpage, user will go to the short-video section where show short videos shot by all the people around the user. The user can also shoot his own on this section by clicking the orange bubble. Tap on the screen will send a vibration to the owner of the video.

3. Log in page: on this page, the user can choose to sign in or register a new account.

3. Chat: Long clicking the friends’ bubble to go to the chat section with this friend. Apart from the texting, the user can choose to send other forms of massages such as image, sound and videos by changing the mode on the right button.

5. Friend list: All the user’s friends will be shown no this page no matter the distance. The interaction logic is the same as the mainpage.

6. Friend list: All the user’s friends will be shown in this view no matter the distance. The interaction logic is the same as the mainpage

 

The status user added to his profile will appear as bubbles on the button of the page. User can click those bubbles to change their sizes to indicates the degree of their feelings.

 

 

UX Design | User Research and Persona – Zane Fadul (Qian)

Oftentimes, we find the process of learning a language to be a long and grueling one; no matter how much you practice, the mastery of a language ultimately comes from your mastery of that so Candy and I wanted to alleviate that problem by creating an app that would aid language learners in better improving their word choice and thus their vocabulary. When I write essays in Chinese, I’m often corrected for my word choice, but because dictionaries cannot exactly tell me which word is the best choice for what I want to talk about, I need to consult a native Chinese speaker to help me out. However, not everyone has this luxury. So our project plan is “Melt,” a dictionary app that utilizes user verification to dynamically list words that closely match the definition of the word inputted by the user. We call it Melt as we equated it to a melting pot of culture, and turned the meaning into one that focuses on the melting together of languages.

For example, if I were a native Chinese speaker and I wanted to find a good English word that meant “牛仔裤”,  rather than the top result being “Cowboy Pants,” the first word would be “Jeans.” The user interface would then convey that the word was voted as the most-used words by English speakers. This would typically be shown using some type of small bar underneath the word.

 

Story:

As we began the design for this process, we used a story arc to dictate what a user could see themselves using Melt for. We start our scene with an interracial couple: Nick—a native English speaker—and Lily—a native Mandarin speaker. Despite not being able to completely understand each other at times, they are in love. Nick decides that he wants to propose to Lily on Valentine’s Day, but he just cannot find the words he wants to say to her to express his love in Mandarin. Using Melt, he is able to effectively melt her heart as well, as his proposal leaves her teary eyed, ending the scene in her saying “yes.” Another way we can show that it is the app that helps him to communicate better with her could be to include some smaller tidbits of them having some communication barriers earlier in the scene.

 

User Research:

To begin thinking about our persona for our project, we began drafting out some questions. These things included questions that you would see on the persona, such as age, location, etc. We also focused on asking questions regarding the persons cell phone usage habits. Since we know for a fact that almost every user is on their phone for a majority of the day, we wanted to ask what type of apps that users used most rather than how much they used them.

Here are some of our results:

In terms of qualitative data, we asked users what they thought our app’s main functions would extend to given just a simple description of the app’s functionalities.

Here are some of our results:

Surveys were done using Google Forms and WenJuanXing to accommodate those with and without a VPN.

 

Persona:

We based personality traits and characteristics based on our qualitative data.

Reflection:

When creating a persona, it’s important to ask a variety of questions that may not necessarily fit the mold of what your project is. This will ensure that we get more information about the user in terms of general interests instead of kind of “gearing” them towards a conclusion that we want.