Usability Evaluation Report · Web viewUsability Evaluation Report Template Dated 03/12/2015...

05-863/08-763/46-863: Introduction to Human Computer Interaction for Technology Executives

Usability Evaluation Report Template

Dated03/12/2015

of 18

Prepared By

NAME: D.H.S Mahawitahna , M.N.M Amjad

SIGNATURE :

1

2

Brief Description of User

:

The user is a unmarried female user who is still a late teenager. She has experience using computers. She uses computer in her day to day life for entertainment tasks .She is not very good at using them. She owns a mobile phone that operates under Symbian technology. She has no experience in using android phones or applications. So she is completely unaware of Instagram application and even applications which offer the same functionalities

of 18

3

1

4

Process OverviewScript

1) Take a picture2) Then add a filter to the picture taken 3) Add a title to the picture taken4) Share the picture5) Get to the photo gallery and select a pictuee6) Set the brightness of the picture 7) Set the contrast of the picture8) Search for a user and get his page9) Get to the homepage10) Like a photo11) Make a comment on a picture12) Remove current profile picture13) Follow a user14) View all postings of a user in the form of a list15) View an image in full screen mode16) Play a video17) Download a video18) Change profile name

of 18

52

3

6

Transcript

[01:48] Suran : “This is the first interface that you are going to see when you first launch the Instagram applicationon your device and please tell me what are the features that you notice on this interface”

[02:03] User :”I can see a home button, a search button, a camera button ,likes and people button .I think using home button I can go to thehome page and if I want to search a person or something I have to search it through the search button and I can shoot photos using camera button and likes and people button I don’t have any idea about them”

[user is ambiguous about what she can search using search textbox] [User does not get any idea about what likes and people buttons do]

[02:44] Suran : “just try to take a picture from this interface”

[o2:47] User : “I can see a camera button I think if I press that I can go to the camera interface”[user taps on camera button and camera interface appears after tapping on it]

[03:08] Suran : “what do you think you can do with this interface ?”

[03:14] User : “There is a gallery button using this button I can go to the gallery and look for the photos what I have saved before”

[user recognizes capture button and explains what it does]“and the video button I can capture the videos”

[03:40] User : [user recognizes flash on/off toggle button and explains what it does correctlu]

[user notices the appearance of show grid button and toggle front and rear camera buttons but does not have any ideas about them]

[user recognizes close button and explains what it does correctly]

[4:04] User : [taps on the camera capture button ..photo editing interface appears shortly after that]

[4:33] Suran : “Now what i want you to do is I want you to choose a filter for this picture just you have taken”

of 18

74

56789

101112131415161718192021222324252627282930313233343536373839

8

[4:49] User : [user fails to add a filter to the picture]

[4:54] Suran : [Suran guides user to add a picture by explaining what each and every seting controls is for ]

[5;56] User : [selects a filter for the image]

[6:22] Suran : “Now what I want you to do is add a title to the picture you have taken right now”

[6:34] User : [Failed to identify which button to click next .selects the ‘Edit’ button which gives back the previous interface (camera) ]

[6:43] Suran : [guides user by showing the interface she gets when clicked on the Edit button ]

[shows user which button to top on to get to the title editing interface ]

[8.09] [title adding interface is presented to user]

[8:15] Suran : “take a closer look at the interface and tell me where you can add the title”

[user immidiately identifies the text field where title to the image can be added ][user types in the text field using keyboard that pops up ]

[9:03] [user added title to image successfully ]

[9:05] Suran : “What else do you think you can do with this interface ?”

[9:10] User : “I think I can select some friends through this an d share this photo with them”

[9:27] Suran : “I want you to share the picture you have taken few minutes ago ”[User gets confused]

[User strives to understand the interface and fails ]

[9:40] User : “Can I know what this ‘direct’ button is ?”

[Suran explains what ‘direct ’ pagegs does even if so user fails to share picture to all friends instead she shares to few friends]

of 18

940414243444546474849505152535455565758596061626364656667686970717273747576

10

[10:50] Suran : “Now I want you to go to the mobile device gallery and select a picture”[user gets confused ]

[11:30] User : “I will press back button” Suran : “That doesn’t work that will exit the entire Instagram application”

[User fails to get to the gallery and asks for guidance][Suran assists to get to gallery]

[13:27] [User selects a picture with guidance the cropping interface loaded shortly]

[User is presented with the crop interface][14:05] Suran : “Is this what you expected ?” User : “Can I edit the photo ?”

[user seemed confused with the interface]

[14: 20] User : [User notices title of the interface(‘crop’) as a button][Suran explains what each control does in the interface]

[15:00] [user says that she didn’t notice the crop functionality of the interface]

[16:20] [User is presented with the picture editing window]

[16:29] Suran : “Now try to adjust the brightness of the image”

[User struggles to identify the brightness editing button ][User recognizes title of the interface (‘Edit’) as the editing button finally user fails to identify the correct button]

[17:06] Suran : [helps helps in setting brightness]

[19:37] Suran : “Now I want you to adjust the contrast”

[19:43] User : [Immediately recognizes the contrast button and adjusts it successfully]

[20:40] Suran : “Now what I want you to do is I want you to search for a specific user”

[20:48] User : “I think I have to press this ‘back’ button ”

of 18

117778798081828384858687888990919293949596979899

100101102103104105106107108109110111112113

12

[user gets back to previous camera interface by pressing back button][user gets back to home page from camera interface successfully]

[21:46] Suran : “Go ahead and search for a user ”

[21:47] User : “I think I have to press search , ah no the people button ”[User in confusion which button to choose]

[21:54] Suran : “No its not going to work ”

[22:00] User : [Clicks on search button under guidance]

[22:42] [User is presented with the search interface]

[12:43] Suran : “Is this what you expected ?” User : “yeah”

[22:52] Suran : “What do you think you can do with this interface ?”

User : “I can search some friends through the search bar….yeah”

[233:06] Suran : “just search for a person”

[user clicks on the search bar]

[24:07] [User is presented with the user search list][user types in the user she needs to search for]

[24:47] Suran : “Now just go back to your home page”[user successfully goes back to home page]

[26:28] [User gets the home page]

[26:10] Suran : “Now just try to like a photo.For your information you can scroll back and forth”

[26:24] User : [likes a photo sucessfully]

of 18

13114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150

14

[26:43] Suran : “Make a comment on a picture ,any picture you like”[26:54] User : “I will press the comment button”

[User identifies the comment button][User makes a comment successfully ]

[27:52] Suran : “Now what you have to do is just remove your profile picture”

[28:01] User : “I think I have to go to the home page so I will press back arrow button”

[28:40 ] [user gets the homepage]

[28:42 ] Suran : “Now go ahead”

[28:53]User : “So I have to see my profile right ?”[User seemed confused]

[29:00] [User explicitly said that she doesn’t know how to proceed][Suran guided her to remove her profile picture][even if user couldn’t find profile page she could remove profile picture herself once she got to profile page under guidance]

[30:39] Suran : “Now you are in your profile page now what I want you to do is I want you to follow an Instagram application user .Any user you like ”

[31:13] [user couldn’t find a way to proceed she kept clicking on incorrect buttons ][user failed to follow a user]

[31:42] [Suran guided user to follow a user ]

[33:05] Suran : [presented user with the peple search page ]

[33:07] Suran : “Now you are in people page what are the features you notice in this interface ? ”

[33:11] User : “I can see some profiles and some photos of those profiles and there is a search bar, and these photos and people buttons”[user notices the profiles, search bar ,photos and people button at the first glance]

[33:27] Suran : “What I asked you to do ?”

of 18

15151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187

16

User : “To follow a particular person”

[33:32] Suran : “Can you find out a way to do that in this interface ?”

[33: 40] User : “I think I have to press on these plus button ”[User rapidly figures out herself how to follow a person follows one]

[34:00] Suran : “I want you to go to a particular user’s profile and list all his/her postings in the form of a list”

[34:20] Useer : “I think I have to press on a profile picture of a user”[user successfully goes to profile page of a user]

[35:09]Suran : “What do you think you can do with this interface ?”

[35:10] User : “I can see her personal details: her name ,where she is from, her religion and her life events and I can see her posts”

Suran : “What are the features you see right here ?”

[35:31] User : “I can view the photos and that’s all …ah no there’s follow button so if I press on that I can follow her”[User recognizes almost all features of the interface but identifies follow button with a little delay]

[35:44] Suran : “What I asked you to do is list all the postings of her in the form of a list can you do that ?”

[35:52] User : “Ah yeah I have to press on the post button ”[user taps on the wrong button ]

[37:12] [With a delay user identifies the list view button on the interface]

[37: 46] [User gets the list view of postings of a user]

[37:46] Suran : “Now just try to view one of her pictures in full screen mode”

[37:54] [user with confidence taps on one of the picture to view full screen which was thee wrong way]

[38:30] [user without guide recognizes option button and taps on it ][38:45] [user view the image full screen successfully]

[39:15] [User gets full screen view of the image]

of 18

17188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224

18

[39:15] Suran : ‘Now just go back to your previous view and view one of her videos ”

[39:35] [user goes back to previous normal view mode]

[39: 58] [User navigates to video]User : “Ah here is the video”

[user taps on play button to play it][User pauses the video after watching it]

[41:01] Suran : “Now speaking of video is this what you expected ?”[41:26] User : “Can I watch it in fullscreen ?”Suran : ‘yes”

User : “Then its similar to other video players”

[41:40] Suran : “Just try to download the video you just played”

[42:90] [User downloads the video properly]

[42:19] Suran : “I want you to change your profile name”

[user gets to profile page properly][user changes the profile name herself correcly]

[end of usability evaluation]

of 18

19225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261

20

of 18

21262263264265266267268269270271

22

Usability Evaluation Feedback Analysis

# Prototype Screen

Reference User’s feedback/ critical incidence/ problem

Reason for negative feedback / breakdown

Scope Severity(High/ Medium/

Low) andJustification for

giving it that rating

Way(s) to rectify and any Tradeoffs (i.e., why the fix

might not work)

1 See Picture 1 2:03

Instagram application has a bottom menu button which itself displays ‘search’ which was ambiguous to the user since it does not say what to search for

User got overwhelmed when she was first asked to do a search using this button.She had no idea what she can search for

This specific screen

High .Because search is a major functionality in Instagram application that most of the users expect to use oftenly

It would be a good idea to include a little popup menu with the entities we need to search for that pops up once the user taps on the search button .Itd makes the interface easier to use and makes it less messy

Tradeoff : coding complexity increases as interface gets popups

2 See Picture 23:49

In the camera interface there are two button for toggling on/off grid and toggling between front and rear camera with no labels on thme (just icons).When user was scanning the interface she had no idea about what these buttons do when first seen

user expected have flexible and self descriptive controls in camera to take pictures quickly.


High .Since camera is one major part of producing digital imagery which are shared in Instegram application the camera interface should be simple enough to handle and assist self learining

Its better off if those buttons could also display a simple text Describing what they are supposed to do since icons themselves alone are less comprehensive.

Tradeoff: since mobile applications are more concerned with screen space adding descriptive text takes extra space

3 See Picture 3 In the picture editing interface there are 3 separate buttons to access distinct

The user was trying to just scan the icons that appear on each setting


High .Since most of the photo shooters these days are

This can be solved by displaying little text on the buttons describing what they

23272

273274275276277

24

4:49sets of settings grouped together each button only displays less descriptive icon on themr. User was unable to find the button to get to the filters list

button since they are less descriptive .As a result user couldn’t find out a way to get to filter list

concerned with the list of the setting they can play with access to the settings must me comprehensive and simple. Learning curve must be shorter

are for


4 See Picture 4

6:34

In the image editing interface there is a button which has a label of right arrow to get to the title adding page. User couldn’t notice this button so she was incapable of going to next step

The user was trying to get to the title adding page which is next page .So she got stuck in the middle of posting an image since she couldn’t find where to click next to proceed.


High. Continuation/flow of completing a task is a major key thing in almost any application.

I could have been added a little text saying something like ‘Next’ or ‘proceed’. Such text give the user an idea about the flow of the task they are achieving


5 See Picture 5 14:38

In the image cropping interface there is a label saying ‘crop’ as the title of the page placed near to the back button with right arrow label on it. User thought that this label is actually a button by pressing which she could crop the image

When the user was given opportunity to comprehend the interface features she couldn’t identify the interface was designed to for image cropping purpose.


Medium .Cropping images is not so common in Instagram application compared to filters and color effects are concerned

Its advisable to put the interface title at top middle part of the navigation bar so user can distinguish it from other controls and it also highlights what interface is supposed to use for.Tradeoff: since mobile applications are more concerned with screen space adding descriptive text takes extra space

25

278279280

26

Picture 1: 27

281282283

284285286287

28

Picture 2:

29288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327

30

Picture 3 :

Picture 4 :

31328329330

331332333334335336

32

Picture 5 :

33

337338339340341342343344345346347

34

35348

349

36

Usability Evaluation Report · Web viewUsability Evaluation Report Template Dated 03/12/2015...

Documents

Transcript of Usability Evaluation Report · Web viewUsability Evaluation Report Template Dated 03/12/2015...