Week 2_Qinwen

3 User Insights

  1. User expected something happens after tapping the image and want to view more about the restaurant, such the map, distance, rating and etc..

  2. Add function “start a plan” (same with facebook messenger) that can add plans to calendar directly when the user invites a friend in the dialogue box.
             
  3. User wants to see who they went to the places together rather than the posts from others about this restaurant.

 

 

 

 

 

 

Qinwen_Week 1

About Me

I’m Qinwen Xing. My background is graphic design. Most of my previous work are focused on branding, book design, and packaging.

3 things I don’t know from the Apple HIG

  1. Apple changed their system fonts to a new typeface “San Francisco” since ios 9.
  2. 3D touch gives the user more possibility to interact with contents, such as peek and pop allows the user to preview photos, links, page and etc. It’s important that the peek view is designed big enough so that fingers don’t obscure its content.
  3. Make animations optional. When the option to reduce motion is enabled in accessibility preferences, the app should minimize or eliminate application animations.

App Map 

App Wireframe

App Wireframe

 

Week 2 – Franky Wang

User insights from paper prototyping on Feb 1st

1 – The order of functions after logging in the APP

The APP is originally designed to immediately enter the page of capturing dish photo after logging in. Some users think it’s kind of inconsiderable for a dish recommendation APP to start camera function at the very beginning (Usually filter application does). It might be more reasonable to enter the “Expo” page, where dish photos are displayed when users first enter the APP. Then they could decide whether touching the camera button to upload photos, or just having a random glance.

 

Currently, the camera is designed as the index page, which might be better if replaced by the photo display page.

 

 

 

2 – Imprecision of categorizing in filter descriptions

In the filter page where users select choices to screen out their favorite kinds of dishes, the users gave feedback that the descriptions are not precise, which causes misunderstanding.

For example, the description “categories” is easily interpreted as terms like “breakfast”, “dessert”, “drink”… On the other hand, if the dish is categorized by cultures and countries, it would be better to use the word “Nationality”. And the description of calories is also not reasonable to simply use the term “high” or “low” without the specific number of the range. These are detailed problems but still worth considering.

 

 

3 – The unreasonable settings of “All Posts”


In the “Expo” page (currently defined as the index page), I created a segmented bar and separated the posts into the “all” tab, which includes all the current users’ photo upload, and the “friends” tab, which only shows the photos of connected users. However, there would be a huge amount of information refresh for displaying posts from millions of online users, which would definitely cause a mass flow and challenge the capability of the backend system. Also, users do not tend to see the photos which have little connections to them.

It might be better if the first tab is displayed based on location, showing the users the photos from nearby restaurants. The location-based recommendation could be more practical and build up the solid connections between users and information in this case.

Wireframe 2.0

APP Map 2.0

Week2- Kelsey (Yue Yu)

  • Note 2-3 user insights that you learned from paper prototyping

1:country selections and calendar is too small

2: The saved menu should exchange the position with current menu.The Current menu is important and it’s should in the tab-bar.

3: Add a remind interface to ask people if they want to generate a new plan and covered the original one during a week.

 

Week2 wireframe

WK1_Yin Hu

Three things I didn’t know about HIG

  1. Navigation: Hierarchical Navigation, Flat Navigation, Content-Driven or Experience-Driven Navigation. I didn’t consider much about the types of navigations. This helps me to analyze the information architecture.
  2. 3D touch: in the past, when I design interactions, I didn’t consider applying varying levels of pressure to the touchscreen to access additional functions.
  3. Layout Guides and Safe Area: it aids with the positioning, alignment, and spacing of content. I didn’t know safe areas and margins in UI.

About me

 My name is Yin Hu, currently a first-year student in MFA DT. I studied Mass Communication in the undergraduate study. And I have two internships in UI&UX area. One is at the user experience lab of Tongji University, in China, the other one is at an internet company. I want to further study UI&UX design more systematically in my graduate study, so I chose Designing for Usability the last semester.

 

App Map

Wireframe

wireframe

 

Week 1

3 things I didn’t know from the HIG

System capability – Multitasking (Slide Over, Split View, Picture in Picture) It lets people to quickly switch from one app to another at any time through a multitasking interface.

Layout Guides and Safe Area: Guide to leaving some margin space.
Every time I create a mobile digital prototype, it was not 100% fit to screen, sometimes it was oversized or looked ugly. Also, a great thing to know about was, how to deal with a screen when people play a game vertically.

Drag and Drop function in new iOS: With a single finger, a user can move or duplicate selected photos, text, or other content by dragging the content from one location to another, then raising a finger to drop it. Never know about this function.

About me

Hello, I am Haemin Kwon. I am an interaction designer from Korea. I am interested in User experience design (UX research, sketches, wireframes, prototypes) and UI design.

 

User Flow

 

wireframe

Week1_Ting

Hello! This is Ting.

My background is Industrial Design with a year experience in exhibition design.

3 things I learn form IOS Human Interface Guideline is mostly about iPhone X:

1.Bolder navigation. To improve clarity and context when browsing and searching, apps can implement navigation bars that include large, bold titles.

2.Safe area layout guides. Adhering to the system’s safe area ensures appropriate insetting of content within layouts and prevents content from underlapping the status bar, navigation bar, toolbar, and tab bar.

3.Minimize the use of modality. Generally, people prefer to interact with apps in nonlinear ways. Consider creating a modal context only when it’s critical to get someone’s attention, when a task must be completed or abandoned to continue using the app, or to save important data.

Week1_Qizhao(Eric)

 

                           

My name is Qizhao Chen, you can call me Eric. I come from Guangzhou, China. I am a digital designer. I am interested in UI & UX design and want to develop more skills about them.

Three things I didn’t know from the Apple HIG:

  1. Modality:

    Modality creates focus by preventing people from doing other things until they complete a task or dismiss a message or view. Action sheets, alerts, and activity views provide modal experiences. When a modal view appears onscreen, the user must make a choice by tapping a button or otherwise exiting the modal experience.

  2. Auto Layout.

  3. Differences between Hierarchical Navigation and Flat Navigation.

 

Here is my app map:

 

Here is my wireframe: