Considering the User in Mobile Design

Screenshot 2020-03-01 22.34.11After coming to a conclusion on which design to move forward with, my next task was to build out the screens of the entire app. Unfortunately, designing all the screens for the entire application resulted in a few different problems. The first being, that I had not planned out enough time for myself do create all of these screens. When beginning to design the rest of the app, I found the individual building was actually incredibly time-consuming. In addition, I began to realize in the wireframing process, I forgot to create multiple screens. For example, on the discover page, although, I designed a page for what will screen will appear after clicking into a single recipe, I did not account for building that specific page three more times, as well as the navigation bar at the top including, trending dishes, cuisines, breakfast, lunch, dinner and snack options as well.

Screenshot 2020-03-01 22.34.25

Throughout my design process, one aspect that was able to help me stay organized and focused was an article by Cameron Chapman, “Mobile UX Design Principles and Best Practice”. This article stood out as a set of guidelines I used to remind myself while designing. Chapman goes over principles and practices such as:

  1. Put the User First

  2. Make Navigation Intuitive

  3. Create a Seamless Experience Across Devices

  4. Focus on User Goals

  5. Allow for Personalization

  6. Always Make Things Easier

  7. Use Established Gestures

  8. Focus on Speed

  9. Provide Feedback to Users

  10. Minimize Data Input

Overall, each one of these aspects I was consistently thinking about when redesigning Cookbook. The most interesting piece of the entire article, in my opinion, was when Chapman mentioned “the size of touchscreen targets” and the “thumb zone”. She explained,

“One of the biggest considerations is the size of the touchscreen targets. While a mouse or trackpad can click with pinpoint accuracy, fingertips are much less accurate. Ideally, targets should be 7–10mm on a mobile device’s screen. This allows for a fingertip to tap the target without having to aim too carefully.

A related area to consider is hand position controls and the “thumb zone” on mobile devices — the area of a phone’s screen that can be easily accessed with the thumb when a person is holding their phone with one hand. Putting the majority of interactive content (and particularly calls-to-action) in this zone is vital to creating a positive user experience.”

Prior to reading the article, I had never thought about how the thumb can only reach so far depending on the user’s hand position. Therefore, the position of elements within the app is incredibly crucial. In addition, when designing my navigation bar, I questioned myself for placing the bar on the bottom of the app. I wondering about the importance of choosing this specific location rather than the top or a hamburger menu. However, this article was able to confirm my choice. Overall, building the screens for the entire app was actually much more difficult than I originally planned, however, it allowed me to see what else I needed to focus on when building the app.

Full PDF –> ColoneseDiBello_artifacts5

 

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s