when users at the registration page even though their account or password are incorrect, however, the system provides a message at the same page without redirecting to another extra page, so users don’t have to click back button again. This design has high usability in some specific situations for example: users who are not sure about their password and need to try a few times.
Nevertheless, in the situation of users typed the wrong password, the button next to input box does not change to “X” to erase wrong password, it might cause some inconveniences when users need to correct their password.
Assuming some situations such as the users who has more than one partner, they might need to switch two accounts on the same phone, accordingly, it shows how important of log out function. When users attempt to log out, some of them tried to click the menu button at up right side.(three dots), but it turns out to be home picture setting.
Since the menu buttons cannot link me to log out page, I tried to click the top tab bar menu button (three lines), luckily it led me to the right place, neverthless, beforing clicking log out the two buttons [profile] and [setting] appears it made users confusing and not sure log out function is belonged to which categories.
Design for zero data, when new users who don’t have any data yet. under calendar category there has other two functions are special day and event, however, for new user might not understand the conceptual model of the app, system should try to integrate or clarify these two functions.
Stay at the same page, when users scroling down there has one card about [Our activity], users can scroll left and right to get further infromation. However, when users use gesture , whole page slide to the next page.
Choice design and mental model
Yahoo Digest mobile app is a simple and easy to use. It has limits on the numbers of news by providing only 10 news stories in one page to help users read the news more comfortably with digestible chunks of texts. It also publishes news twice a day, which is the same metaphor like reading newspapers in morning and evening.
In addition, every reading experience collects one little circle dot to complete the big circle. It not only provides feedback to user but nudges them to stay on this news app longer and come back more often.
Unclear visual affordance
However, some elements in Yahoo Digest would be better to be fixed. There is a button on the main page which looks like hamburger menu button. Initially I thought that the button was of the page menu, but it turned out to be not. It was actually for checking the list of past news stories though the graphic interpretation made me confused.
Also, the icons are not really clear if they are clickable or just information. With too much neutralization of UI colors, icons seems to lose their original functions. Users need to read many icons on a article as they are not easily discernable with same colors and styles. In addition, the feedback on UI to let users know is not clear enough. Currently, the background color of the number on an article changes if a user has read it. It is too natural and subtle change to notice and the feedback of UI does not represent ‘have read’. Instead, ‘check’ or other UI elements would be easier for users to understand that they have read the articles.
Loose context in UI
In the news collection circles which shows the article numbers you’ve read. Right next to those circles, there is a calendar button which looks like it is going to show the articles of what I have read and haven’t. However, it is not and the function of the UI is not really clear and not easily understandable. To see what I haven’t read, I had to click the hamburger menu button which has no connection in terms of context. Also, the colors are loosely linked with the information. Sky blue color does not represent ‘America’, purple does not show any relevance with ‘Europe’ and other colors as well. Rather, it would be better to use the colors where they are really needed like the issues of neutralized icon colors mentioned above.
Deep hierarchy of UI
After clicking the hamburger menu button, it shows a few buttons again. Setting button is one of those and if this button is clicked, a new layer of menu comes up on top of hamburger menu page which is not a really common case. It can make users lost on their ways with deep and unclear path of the information architecture on the app.
Content first, Information hierarchy
Airbnb helps users to make decisions efficiently from a large amount of information. First of all, the first page includes big images and texts which are the most useful information for users to help them find out the information they want or need efficiently and effectively. Also, it provides some recommendations which functions as ‘nudge’ for users to make their decisions more easily. Furthermore, the whole process creates the user flow from easy choices to difficult ones which helps users learn how to choose making them satisfied with their final decision.
Airbnb mobile app provides infinite scrolling to navigate information which helps users continue their behavior without a need of clicks. Though they can browse information simply by scrolling, it doesn’t seem to have enough affordance, especially in the page of room details. It would be better to give some hints to let users know that there are more information above the fold.
(good example: google app, users can see a bit of card information above the fold) Users are more likely to scroll down when they understand the context.
In addition, ‘map’ on the room details page is static allowing users to click only without scrolling while some other apps use map iframe. It is not recommendable in mobile scrolling navigation because users can scroll the map by a mistake even if they want to scroll the whole page.
Airbnb user interface shows a clear visual hierarchy. For example, it hides advanced functions like <more filters> to highlight the most important information about rooms. Also, it always locate <request to book> and <check avaiblity> buttons on the most easily visible and clickable position for users.
Light red colors on Airbnb app indicates clickable action and it is consistent in every page to make users to follow this kind of mental model quickly. It is not defined only to button UI but also applied to input text UI as well. With the visual consistency, it enhances usability of UI.