!
Heuristic Evaluation
Table of Contents Executive Summary Introduction Methods Findings and Recommendations Discussion Conclusion Reference Appendices Appendix A: Jakob Nielsen’s Usability Heuristics (1994) Appendix B: Severity Rating Scale Appendix C: Individual Heuristic Evaluation
2 3 3 5
13 13
1
Executive Summary In this report, our team evaluated the key screens and features of Snapsure through heuristic evaluation in order to uncover any usability issues. By researching the usability heuristics proposed by Jakob Nielsen, inspecting them to identify both good and bad design, our team hoped to find the advantages and shortcomings of the application, and use the analysis to help benefit Snapsure as it undergoes development. This study began with each team member conducting an independent heuristic evaluation according to the ten Nielsen heuristic principles, ranking the severity of the issues found with functionality and design of Snapsure according to this method. We then provided recommendations based on these findings. After this process, the whole team gathered together to discuss the major findings: 1. There is no visual information indicating a user’s current location within the application and users can not navigate through certain functions without going back to the home screen 2. The design of some icons may cause confusion for some users 3. Some buttons are too small and are unclear as to whether or not they are clickable 4. Novice users may not understand the function of the application when they use it at the first time, especially terms, such as “Experts”, or “Credits” 5. There are unnecessary interaction steps in some of the functions, which may slow down the interaction for some expert users 6. There is no information about users’ current credits in pages related to transaction of credits 7. Comment text appears too small in comparison to icon size 8. Users could be confused when trying to discern textboxes from text label elements With these findings in mind, we also offer preliminary corresponding recommendations, including improving the visibility and navigation within the system;; redesigning some icons by modifying the appearance, color, size or position;; providing help instruction for the novice users;; changing the button directions to speed up interactions for experienced users;; adding credits status in certain screens;; and changing the shape of the textbox. In our discussion, we review the constraints that may limit our study. In the appendix, we have provided additional materials including the heuristic evaluation form we produced.
2
Introduction Snapsure is a mobile application that aims to connect shoppers with both trusted voters and other Snapsure users when they need an opinion on a product in a physical store. Snapsure’s interface has been designed to easily and immediately connect users to voters, view a list of the items they have solicited votes on or voted on themselves, and seek advice from style coaches. Still in the prototype phase, Snapsure hopes to reach frequent shoppers and social media users in their target population. In previously conducted exercises, this group has focused on structural, usage, and functionality topics to help Snapsure understand its potential markets and any gaps in offered functions. In this exercise, we reviewed the most recent prototypes of Snapsure with the goal of assessing specific topics of usability and aesthetics within the application. Building directly from our previous surveys, interaction maps, and from interactions with Snapsure’s development team, we factored in the end goals of the application and comments and suggestions from potential users as we reviewed Snapsure’s interface. The purpose of this report is to provide feedback to Snapsure’s development team about the application based on the heuristic principles set forth by Jakob Nielsen, which are a gold standard when reviewing the usability of a given product. These principles prompted the team to look at the accessibility, aesthetics, and overall usability aspects of Snapsure to identify potential issues or room for improvement. As a product still under development, Snapsure can benefit greatly both from a structured, systematic review, such as the one we have completed using Nielsen’s principles. With the review we hoped to answer key questions about how well Snapsure measures up to basic usability principles. We strove to review all functions existing in the current prototype from the view of both novice and experienced users to help Snapsure anticipate not only its first wave of users, but potential long-term benefits or issues. Through this exercise, we found that Snapsure has very good design and has done a good job in harmonizing many of the aspects of the application with popular platforms that will make it very approachable to users, but that there are areas where it could improve. Our specific findings and actionable recommendations are found later in this report.
Methods In this report, Snapsure was evaluated using the method of heuristic evaluation based on principles proposed by Jakob Nielsen (1994, see Appendix A). The method is done by a group of researchers who try using the system and evaluate with the same criteria (Appendix A). Each researcher identifies findings from his/her individual heuristic evaluation;; conducting initial reviews individually allows the researcher to gather information and build impressions of a products without risk of bias from another researcher’s opinion. After this initial review, 3
researchers discuss the outcomes to create a consolidated understanding of the system and generate findings and recommendations. Using this model, our team reviewed the prototype interface provided to us by Snapsure. Each team member performed his or her own review before meeting as a team to discuss our findings as a group and determine our top identified usability issues and recommended corrections. Since Snapsure is still under development and there are now two prototype iterations, we chose to evaluate the latest version for the purposes of this report. We each began our reviews by thoroughly reviewing every screen in the application and every available action or pathway through the application we could. Then, we worked to apply users’ perspectives as novice and experienced users in using the application;; however we only focused on users who routinely seek advice from friends or style coaches. We consciously chose to not evaluate the application from the perspective of a style coach because the main goal of the application rests in the voting process and this usage of the application has been the major design and development focus of Snapsure. As a team, we agreed to evaluate each screen separately and then evaluated the flow of uses secondarily. Given the application has only four main sections: profile, snaps (list of posts), camera and sharing, and list of experts, our evaluations covered all sections in our process. In our individual evaluations, we first discussed the process that we would take to evaluate the application. Sticking to Nielsen’s principles and proposed review structure, we elected to review the application separately in order to decrease influences from each others’ opinions. We then generated individual findings using aspects from the list of heuristics to analyze each screen, and rate the severity of them from 0 to 4 (see Appendix B) in order to suggest how important and mandatory the issues were. After we created our list of our own findings, we would state briefly our recommendation for each issues (Appendix C). After completing our individual heuristic evaluations, we discussed our findings and recommendations together to create our consolidated list. We started by going through each screen and with everyone explaining their individual findings in order to determine which findings more than one person discovered or those we agreed were major items that required attention from the development team. Then, we considered which recommendations were the best and most reasonable or attainable for each finding as options for Snapsure to consider as they review the findings and decide whether or not to take action upon any of them. After we had our list of consolidated findings and recommendations, we completed a final review to assure appropriate severity rating for each using the severity to rank our findings from the highest to lowest severity rate.
4
Findings and Recommendations
Finding #1: There is no visual information indicating a user’s current location within the application, and with this limited navigation menu the user cannot navigate different functions without going back to the home screen Violation: User control and freedom and Visibility of system status. Severity: 4 When users enter into a specific function within the application, there is no information displayed that reflects their current position. For example in the picture below, within the expert page, there is only the search bar on the top of the page without indicating that the user is currently searching or selecting style coaches from a list. Furthermore, users could not navigate different functions without going to back to the home screen, which limits users’ freedom regarding interacting with the application. Both of these issues could severely impact the user experience within Snapsure, especially for novice users who are still getting used to functionality and flow within the application. Not indicating where they are could cause them to become frustrated if they do not find a tool or action pathway within their current view. Having to consistently return to the home screen would also interrupt the user’s flow through the application and could slow experienced users down in the use of the application.
Figure 1: Experts screen from Snapsure
Recommendation #1: Our team recommends that Snapsure developers place a fixed navigation bar at either the bottom or top of the page to help users navigating functions. This bar should have easily identifiable icons to show the various in application views and functions and should 5
have some manner of indicating where the user is currently located (either via icon color, background color, etc). This navigation bar should allow users to move freely between activities and not require the user to route back through the home screen to reach the full menu of services. This type of menu navigation was present in the first Snapsure prototype and should be reintroduced.
Finding #2: The design of some icons may cause the confusion for users Violation: Match between system and the real world Severity: 3 While overall, Snapsure has made icons that are easy to understand and mimic many of those used in other social media applications, there were several our team noticed that do not seem to immediately suggest the functions they represent. This could be confusing to new users or to users from second tier target populations, such as older shoppers who are not social media users but who wish to gain quick feedback while in a store. On the home screen, the “snap” function is represented by a “thumbs-up” image, which may not make sense for some users. Because the “Snap” function is for users to see the images they have sent or the items for others they have voted upon, it would become apparent after a few uses what the icon means, but users new to the application would have no easy way of knowing what kind of feed is meant by the term “Snap” or the “thumbs-up” icon. Similarly, the “experts” function represented by the “star” image may also confusing. In the current released prototype, it is unclear whether or not when a user chooses to follow a style coach a similar star icon will appear on those they follow. Even if it did, it is not clear during the first usage what the star icon represents. Finally, in the camera screen, the icon of the “rotate” button in similar with the “cancel” icon, which may confuse users. Recommendation #2: We recommend Snapsure consider redesigning the icons for features like “snap”, “experts”, and “rotate” because “they don’t speak the users’ languages” (Nielsen 1995), as mentioned by Nielsen’s Heuristics principles. This is most likely to impact first-time and new users or those who are not as tech savvy. By having unclear icons, some users may be discouraged or become frustrated when using the application, feeling as though they cannot navigate the application easily. In our previous research, we found normal users tend to find the functionality more easy to understand if the “snap” icon were represented by more universally used icons for functions like “feeds”, and the “experts” icon were represented by an icon which indicates “people list”. What’s more, Snapsure may also need to redesign the “rotate” icon in order to separate it from “cancel” icon. Harmonizing these icons into more accepted visual cues may help new users move around the application more easily.
6
Figure 2: Confusing icons
Finding #3: Some buttons are too small, unclear on if they are clickable, and may confusing to users looking for their function. Violation: Aesthetic and minimalist design Severity: 3 When choosing a style expert to follow, it is not quite apparent that the black radial button for the style experts is clickable and that it is how a user chooses to follow or favorite that style coach. Additionally, the size of a star radio button is confusing;; it would lead users into thinking that the button is not clickable due to its particularly small size, particularly without any text suggestion of its meaning. In fact, the small size of the button makes it very hard to click in a mobile setting;; also, the placement of the button is such that it looks like a cancel function and may users mistake the button as a method of exiting that style coach’s profile.
Figure 3: Icon position and size leading to misunderstanding
7
Recommendation #3: In the Expert function in the application the current black radial button could be changed to a text button indicating to the user how to follow a given stylist. The star iconography could still be used when the user chose to follow the style coach, but as it currently is structured, it is difficult to determine how to follow a given style coach. The size of the button should be larger regardless of the inclusion of text and the position should be more relevant to the context. Instead of being far to upper right corner, the button could be in the same line with the style coach name or under the profile picture to be an additional visual cue of the button’s purpose.
Finding #4: Novice users may not understand the function of the application when they use it at the first time, especially terms, such as “Experts”, or “Credits” Violation : Match between system and the real world, Help and Documentation Severity: 2 For users new to this application, although the home page is designed in a simple way with only four functions, they might not able to understand each function especially Expert function as this is a unique offering from Snapsure. Additionally, some system-oriented terms such as “Credits” or “Snaps” might be difficult for novice users to comprehend. While they are able to read descriptions of the application and see static screens in the Application store through Apple, there currently is no method for users to be guided through their first use of the application or have a place to quickly find answers to basic questions about Snapsure. While this problem would be lessened through useage, it could create negative first usage experiences for Snapsure clients and could discourage future interaction with the application. Recommendation #4: To prevent such confusion, it is our team’s recommendation that Snapsure development should either include an in application tutorial for first time use or rephrase some of the functions to facilitate the interactions better. For implementing the tutorial, we suggest that Snapsure could provide the users with a short video file walking through the sections or an interactive tutorial function before users actually entering the main page of the application for the first time, or embed the tutorial within each individual function to aid users during their first encounter with that piece of functionality. Furthermore, the system needs to empower users to choose whether take the tutorial or not, and also whether to see the tutorial on subsequent uses. Since users might have the need to look up the functionality while interacting with the application, it would probably be helpful to design a “Help” function so users always have a resource to turn to when they have difficulty interacting with the application as well as a method of submitting issues directly to Snapsure for review and assistance.
8
Finding #5: There are unnecessary interaction steps in some of the functions, which may slow down interaction for some expert users Violation: Flexibility and efficiency of use Severity: 2 Much of the application flows incredibly well and is straightforward in how it is to be used, but there are several functions that require unnecessary actions that may be onerous particularly for expert users. For example, in the “account” function of Snapsure, when users choose to confirm their purchasing for the credits, there will be a text box popping up, which suggests to the users that they have successfully added some credits to their accounts. The confirmation is a useful screen, but after that screen appears, users can only return to home screen and not their account screen. In our research, we found other similar applications tend to allow users to double-check the status of their current credits after the purchasing behavior by returning them to the account screen or offering them an option within the confirmation screen to return home or to their account screen. Being directed to the homepage, rather than the status page, may slow down the interaction for the users who wish to review their account or perform other actions within the account.
Figure 4: Improper interaction step
Recommendation #5: We found in other similar applications that the frequent action after in-app purchasing is to return to the account screen, so we recommend the Snapsure change the destination of the back button to the account status page. Alternatively, Snapsure could add the credits status in the text box, which may streamline the actions of purchasing and checking, thus 9
speeding the interaction for users both inexperienced and experienced. A third option would be to add an option of returning to the account screen or the home screen, allowing the user freedom to choose the destination based on their need at the time. The user may have other, non-credit related actions they wish to carry out in their account or may wish to proceed to the home screen to start a voting process or find an expert. By allowing the user to choose, Snapsure becomes more flexible and able to meet consumer wants and needs.
Finding #6: There is no information about users’ current credits in pages related to transaction of credits. Violation: Recognition rather than recall Severity: 2 The main interactions in Snapsure, the solicitation of votes on items, included the potential for transactions of credits in order to purchase expert opinion on a given item. However, as shown in the below screen captures, the page where credits are purchased, users’ current amount of credits are not visible and in the voting screens, current balances are also not available. Given that users would thus need to memorize their current amount of credits whenever they need to spend or buy credits, use of Snapsure would increase their cognitive load especially when they need to perform calculations. Additionally, unnecessary interaction steps could be incurred when the level of credits needed to purchase votes was insufficient and the user would need to interrupt their voting solicitation process to purchase additional credits. This need for additional steps could be very frustrating to the user or could deter them from seeking the opinions of style coaches altogether.
10
Figure 5: No visibility of current credits a user has
Recommendation #6: Information about users current credit status need not to be shown in every page, but we do recommend that for those functions where the manipulation of credits is involved, such as buying more credits or spending credits on an expert vote, the system should inform users about their current credits. Having this information readily available to user will aid in more efficient usage in the application and avoid frustration in having to view multiple screens for information or even halt a process to purchase more credits. Another potential function that could be useful to users would be a calculation function to facilitate rapid information about their past credit spending habits or required credits for a combination of expert votes.
Finding #7: Comment text appears too small in comparison to icon size. Violation: Aesthetic and minimalist design Severity: 1 When reviewing the icons used in voting on items, useful textual information on feedback (like “just right” for fit) is vital information for both the voter and the shopper. For the voters it makes sure that they are communicating the right information to the shopper about their feelings on the item, and for the shopper, it is an indication of feedback from their voters and allows them to review trends in the feedback. In the current prototype, the sizes of the font and the icons shown would be difficult for users to fully see and understand. The icons are all much larger than the accompanying text. This could be problematic for older users in particular. 11
Figure 6: Improper icon size compared to text size
Recommendation #7: The text should be bigger and more readable. If making the text larger would be problematic for screen real estate, another option could be to add an ellipsis icon beneath voting categories that have accompanying comments to signal users that there were comments and allow them to click the ellipsis for more information. Additionally colors could be used to represent scales of responses if those responses had given scales of ratability. For example, green could reflect positive reactions in a category and red negative.
Finding #8: Users could be confused when trying to discern textboxes from text label elements Violation: Aesthetic and minimalist design Severity: 1 Some textboxes are styled in the similar manner with headers and searchable text element, with only a difference in color to differentiate. This may lead novice users to misunderstand that those are text labels, headers or searchable fields. This could lead to confusion about which elements text boxes are referring to or which boxes users are able to interact with and type into.
Figure 7: Obscure text field that could be misunderstood as a header
Recommendation #8: Relevant icons could be added to those fields to help users differentiate and style of those elements could be made more different from other elements in the application. Such visual cues could help prevent user frustration or confusion on which elements modify which or which elements they are able to use for interaction. For example, search text fields could have magnifying glass icons to indicate its functionality (a widely used industry icon for such functions), instead of using only plain text.
Discussion No study is without limitations. We worked to make our list of findings and recommendations as comprehensive as possible, but also worked to edit this list to reflect what we felt was most 12
pressing and potentially problematic with Snapsure. Obviously there were items we decided not to include in this review. By building this list via group consensus and perceived urgency, we may have left out more in depth discussion or recommendations around items that Snapsure may find more urgent to fix. For that purpose we have included our individual heuristic review matrixes in the appendices of this document (Appendix C) should Snapsure’s development team wish to review them. Additionally, as the four team members are familiar with Snapsure, the goals of the product, and the previous iteration of the prototype, there may have been several novice user usability issues we overlooked in this review. It is our recommendation that Snapsure seek advice from other usability research sources who are not as familiar with Snapsure as an application to determine whether or not all critical issues that may face novice users have been identified and addressed. Finally, Snapsure may wish to review the scale we have used to determine if the ratings and severity descriptions meet with their development approach and philosophy. If there is disagreement in how we have chosen to classify or rank various issues, Snapsure development may wish to reword or retool the ratings scale to better meet needs and reassess our team’s responses accordingly.
Conclusion Snapsure has created a very sleek and straightforward user interface. Using feedback from previous research done by our group, Snapsure has updated their prototype to focus on potential user wants and needs. However, in reviewing the application through the lense of Nielsen’s heuristic principles, there are several potential usability and aesthetic issues that could arise, particularly with users new to Snapsure. A thorough review of terminologies, available help functions, and icon size and placement should be done by Snapsure development to harmonize and close potential gaps. Updates to these areas could help ensure optimal flow through the application for all users and avoid any potential user frustrations. As mentioned in the discussion, our review was limited to the four members of our team and it is our recommendation that as Snapsure develops further, additional heuristic review be performed.
13
Reference Nielsen, J. (1995, January 01). 10 usability heuristics for user interface design. Retrieved from http://www.nngroup.com/articles/ten-usability-heuristics/ Nielsen, J. (1995, January 01). Severity Ratings for Usability Problems. Retrieved from http://www.nngroup.com/articles/how-to-rate-the-severity-of-usability-problems/ Pal, J. (2014). Heuristic Evaluation [lecture slide]. Retrieved from https://ctools.umich.edu Norman, D. (2002, September 19) The Design of Everyday Things. Basic Books;; Reprint edition
14
Appendices Appendix A: Jakob Nielsen’s Usability Heuristics (1994) Visibility of system status The system should always keep users informed about what is going on, through appropriate feedback within reasonable time. Match between system and the real world The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order. User control and freedom Users often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo. Consistency and standards Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions. Error prevention Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action. Recognition rather than recall Minimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate. Flexibility and efficiency of use Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions. Aesthetic and minimalist design Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility. Help users recognize, diagnose, and recover from errors Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution. Help and documentation Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.
15
Appendix B: Severity Rating Scale Score
Explanation
0
I don't agree that this is a usability problem at all
1
Cosmetic problem only: need not be fixed unless extra time is available on project
2
Minor usability problem: fixing this should be given low priority
3
Major usability problem: important to fix, so should be given high priority
4
Usability catastrophe: imperative to fix this before product can be released
Appendix C: Individual Heuristic Evaluation Heuristic Evaluation for Snapsure Version 1.1 Screen
Evaluator (F, X, J, M)
Type
All
F
My F Account
Finding
Recommendation
Severity
Visibility of There is no sign indicating where system the user is currently. status
There should be a sign, icon, or text label indicating which screen the user currently is.
2
Match between system and the real world
The button should be closer and smaller to make it more related to Credits information.
2
The position and size of “Buy More” button seems to be too far and too big respectively. This proximity might separate the button from Credits information group in a user’s understanding.
16
Screen
Evaluator (F, X, J, M)
My F Account
Type
Finding
Recommendation
Severity
Match between system and the real world
The icon of “Buy More” button seems irrelevant to its functionality.
The icon should be more relevant;; a plus sign or a sign with increasing meaning could be used.
2
My F Account
Aesthetic and minimalis t design
Sections are not in the same alignment.
Adjust the space margin from left and right equally, and the elements should snap to grid.
1
My Snaps
F
Flexibility and efficiency of use
It seems hard to recognize a way to slide horizontally through each photo.
There should be an arrow sign or hint of adjacent photos to indicate a horizontal sliding function.
2
My Snaps - Infogra phic
F
Consisten cy and standards & Aesthetic and minimalis t design
the format of infographic and color palette seem to be inconsistent with other parts of the application
the design should have consistency in color and style.
2
My Snaps - Infogra phic
F
Match between system and the real world & Consisten cy and standards
Red and Green color seems not to indicate vote result, and could possibly cause misunderstanding
The vote result part should be more protruding in terms of color contrast, and each section should
3
My Snaps - Infogra phic
F
Aesthetic and minimalis t design
The icons are too big compared to the text
The text should be more prominent and colors could be useful to degrees of the answer apart.
3
use tab bar to navigate instead only back button
3
All
F
User control and freedom
Users cannot redirect or navigate to other parts of application, such as camera screen easily
17
Screen
Evaluator (F, X, J, M)
Type
Finding
Recommendation
Severity
Camer a
F
Aesthetic and minimalis t design
The black buttons might not be noticed if the background is black..
Can use transparent white background like the below one.
2
Share
F
Aesthetic and minimalis t design
The textbox for search seems not be recognized as an input field.
Add search icon or change the border style of textbox to make it different.
2
Share
F
Match between system and the real world & Flexibility and efficiency of use
There is no label indicating functionality of voting time limit in posting screen. This would be confusing for a novice user.
Add label, suggestion or hint to tell what functionality the section has.
3
Match between system and the real world & Flexibility and efficiency of use & Aesthetic and minimalis t design
Users might can't tell if the search box is an input.
Add search icon or change the border style of textbox to make it different.
2
Flexibility and efficiency of use & Aesthetic and minimalis t design
The radio button is too small and novice users would not be able to know that the little button is clickable. In fact, they would not know what it is for.
increase size of the button or change it to text
3
Experts
Experts
F
F
18
Screen
Evaluator (F, X, J, M)
Type
Finding
Recommendation
Severity
Experts
F
Match between system and the real world & Flexibility and efficiency of use
Novice users can find it difficult to understand if it is button or just text label to provide information, and if it is for following a person or something else.
can use text label separate from the button or state about price in parenthesis.
2
Match between system and the real world & Flexibility and efficiency of use
The black circle is hard to understand whether it is button or a status indicator.
use dimmed or transparent button to indicate deactivation
2
Experts
F
Screen
Evaluator Type (F, X, J, M)
Finding
Recommendation
Severity
Main Page
J
Violates Match between system and real world (H2)
“ Snaps & Expert” might not be straightforward for users.
Change phases and the icons to facilitate comprehension.
3
Profile Page
J
Violates “Match between system and real world (H2)”
“ Buy more ” is not be straightforward for users, do not directly represent buying more credits.
Change phases and the icons to facilitate comprehension.
3
Profile Page
J
Violates “Match between system and real world (H2)”
“ Buy more ” is not be straightforward for users, do not directly represent buying more credits.
Change phases and the icons to facilitate comprehension.
3
19
Screen
Evaluator Type (F, X, J, M)
Finding
Recommendation
Severity
After clicking “Buy More”
J
Violates “Recogniti on rather than recall (H6)”
Do not show how many points the user left. This situation could be serious while users try to calculate the exact point they need for purchases.
Indicating users the how many points they have either on the top of the page.
3
Profile page & After clicking “Buy More”
J
Violates “Match between system and real world (H2)”
“Credits” may not be clear for users.
Change phases and the icons to facilitate comprehension, or either the instruction.
3
After J clicking “Credits”
Violates “User control and freedom” (H3)”
“Cancel” is not clickable
Clicking cancel to the previous page.
3
After finishing buying credits
J
Violates “User control and freedom (H3)”
“ Return ” do not direct return users to the previous page but return users to the home page. At least it need to return to the profile page to let user see how many credits they add.
Link to the profile page, or immediately update the total credits on the top of the page.
3
Camera Page
J
Violates “Consiste ncy and standards (H4)”
The return button is on the top right of the page, which is not consistent with the return button in the profile page
Minor problem, do not interfere with the interaction seriously as the icon clearly indicating the cancellation. However, it might be a good idea to keep all button consistent.
2
After taking picture
J
Violates “User control and freedom” (H3)”
Could not delete the picture or retake the picture.
Probably it is a good idea to refer the the iPhone camera.
4
Camera
J
Aesthetic and minimalist design
The black buttons might not be noticed if the background is black..
Can use transparent white background like the below one.
2
20
Screen
Evaluator Type (F, X, J, M)
Finding
Recommendation
Severity
Sending picture page with the time frame
J
Violates “Recogniti on rather than recall (H6)”
Here is the situation that users need to spend their credits, but there is no information about related credits numbers.
Indicating users the how many points they have either on the top of the page.
5
Sending picture page with the time frame
J
Violates “Flexibility and efficiency of use (H7)”
If users is in the shortage of the credits, they need to go back to the profile page and buy the credits, and run through the all process again.
Providing users with the instant function to purchase credits.
4
Sending picture page with the time frame
J
Violates “Match between system and the real world (H2) Consisten cy and standards (H4)”
Do not know the difference between the “ Star “ shown after clicking on the expert and the check shown after clicking the peers.
Changing to some consistent icon or mark.
4
Experts
J
Violates “Match between system and real world (H2)”
Could not understand the functionality of the button on the top right corner
Might need to redesign button or put the instruction, or simply use the phrase to indicate the functionality
4
Screen
Evaluator Type (F, X, J, M)
Finding
Recommendation
Severity
Main Screen/ Home
M
Match between system and real world
“Snaps” function terminology seems incongruous with the actual functionality. It’s the voting function but could also be some sort of feed. Icon is not clear as to what it is.
Rename this function and based on the renaming, chose an icon that better represents the function
3
Main Screen/ Home
M
Recognition
There are no instructions or “help” links from the home screen (or any of the other screens)
Add in consistent links to allow users to find FAQs, links to help forms, or further information on usage
2
rather than recall
21
Screen
Evaluator Type (F, X, J, M)
Finding
Recommendation
Severity
Camera
M
Flexibility and efficiency of use
After picture is taken, the only visual cue to move to next screen is an arrow in the top right corner, but it is not readily apparent this is how to move forward
put text with arrow to help novice users understand function and flow.
2
Camera
M
Recognition rather than recall
The only distinction between user contacts and style coaches in the voting screen is that style coaches have the cost icon in their bars
It would be nice to have a visual separator between style coaches and user imported contacts to help the user quickly recognize the different sets of voter pools
1
Camera - voting screen
M
Recognition rather than recall
In the voting screen, the user should have access to their current credit balance
Add a current balance so users can know how many credits they have and thus do not have to interrupt their flow to buy more
3
All
M
Flexibility and efficiency of use
No central activities/icon bar at the bottom of screen. Only option to go home.
Reintroduce icon bar at the bottom of app that allows users to navigate to any activity from anywhere in the application
4
My Snaps Respon se page
M
User Control and Freedom
In the response screen, it’s not apparent how one could view a list of comments from users, only one displays now, but will they be presented with a list?
have a method of showing vote information from given users or a method of listing votes and expanding information.
1
Expert search
M
Aesthetic and minimal design
The small dot icon does not easily convey that it is clickable and it is hard to tell that this is how you follow a given expert
add text and resize/move button to a more obvious screen location/provide instruction
2
Expert profile view
M
Consistency and Standards
Having the same credits button in the expert profile view and having it jump the user out to the credit purchase page does not make sense with where the user is in their process.
To show how many credits a style coach requires for a vote, the same icon that appears in the camera voting flow should appear in the expert’s profile view
2
User Profile
M
User Control and Freedom
No access to a contacts list in the user profile
User should be able to view a list of their voters/imported contacts from their profile
2
22
Screen
Evaluator Type (F, X, J, M)
Finding
Recommendation
Severity
New Pic received
M
Users should have access to drop down responses under the fit/color/overall categories when voting to help better aggregation of information for shoppers
created buttons or drop-down response options
1
Screen
Evaluator Type (F, X, J, M)
Finding
Recommendation
Severity
All Page
X
The system should always
Providing icons indicating the current status of the users.
3
Users may be little confused about the “snap” on the homescreen
Change the phrase, or change the icon to provide easy understanding
3
Consistency and Standards
Visibility of system status
keep users informed about what is going on, through appropriate feedback within reasonable time.
Home Page
X
Match between system and the real world
Home Page
X
Match between system and the real world
The icon of “expert” is a star, visual meaning doesn’t match the real meaning of the “expert”
Change the image of the icon to be more visually accessible
3
Camera Page
X
Match between system and the real world
The rotate button on the camera page is visually confusing
Change the image of the icon to be more visually accessible
3
Camera Page
X
Match between system and the real world
The album icon on the camera page is visually confusing
Change the image of the icon to be more visually accessible
3
Account Page
X
Match between system and the real world
The “buy more” button on the account page may make users wonder “buy more what” because it is too far from the credits part.
Make the distance between “buy more” and credits closer. Provide proximity
3
23
Screen
Evaluator Type (F, X, J, M)
Finding
Recommendation
Severity
Snap Page
X
Match between system and the Users can only go back to home screen, then other functions. But can not go to other functions directly real world
The “quality” on the infographic may make users confusing. How can users tell the quality of the clothing by picture?
Change the phrase of some functions
3
All Page
X
User control and freedom
Users can only go back to
Always provide the navigation bar at the bottom of the screen
3
Use another format
1
home screen, then other functions. But can not go to other functions directly
Snap Page
X
Consistency and standards
The infographic 2 seems not consistent with other screens
Camera Page
X
Error prevention
Users may ignore the search box because it is too top and too black
Change the position and color palette of the search bar
3
Experts
X
Error prevention
Users may ignore the timer
Change the position and color palette of the timer bar
3
because it is too bottom and too black
account page
X
Flexibility and efficiency of use
In the account page, after the screen pops up the “congratulations for purchasing” page, I assume that when I click the button, I will be directed back to the account page, not the main page, because users may want to check the status of the current credits they have. Being directed to the main page may slow down the interaction
Relocate some pages after the go back button
3
account page
X
Aesthetic and minimalist design
In the account page, the icon button is irrelevant
Delete the icon button
1
24
Screen
Evaluator Type (F, X, J, M)
Finding
Recommendation
Severity
all page
X
No help documentation. Could provide novice users help documentation
Provide help documentation for the novice user.
1
Help and documentation
25
