Showing posts with label interface. Show all posts
Showing posts with label interface. Show all posts

Saturday, March 25, 2017

Heuristic Evaluation of LinkedIn

By Harpreet Kaur
Usability is to measure the ease-of-use in user-centered interaction designs. I will discuss usability issues found on LinkedIn. These issues were discovered during heuristic evaluation following Jakob Nielsen’s heuristics (1990) [1]. Heuristic evaluation is a usability inspection method that helps in identifying usability issues in the user interface design. The aim of this inspection is to evaluate the website, to discuss the issues and propose the recommendations to improve the usability of user interface design. Below mentioned ten heuristics were used, focusing on the core functionality of LinkedIn. The following table highlights Nielsen’s ten heuristics:



Application and system configuration:
I performed heuristic evaluation on LinkedIn, a social networking website for professionals to connect and manage their network. Members of LinkedIn can look for jobs, search for new contacts and interact with each other using this reliable connection.  Windows 10 and Mozilla Firefox were used for this evaluation.
Usability Issues
  1. Inefficient color coding scheme
As demonstrated in Figure 1, the font colour of text, buttons, and hyperlinks provided throughout LinkedIn is light grey in colour which is very dull. Due to the light-colour text, the user has to strain their eyes, making it difficult to read long posts; for users with low vision, this problem is particularly evident. In addition, same font colour has been used throughout the website to display different content. Due to this, it is tough for users to identify the difference between normal text, action buttons, and hyperlinks. It doesn’t instinctively makes the user click the hyperlinks and buttons because it resembles just a normal readable text. This violates Heuristic #1 which states that simple and natural dialog should be used.   

Recommendation:
It is recommended that the important items should stand out such as the title of the articles, action buttons, and hyperlinks. The font colour should be darker shade so that users can read it without the strain on their eyes, headings should be large and bold.  The font used for the action buttons such as like, comment & share and hyperlinks should be assorted from the normal text so that users can easily differentiate between items and perform their actions accordingly.

  1. Comments cannot be edited
LinkedIn offers their users a functionality to add or share posts and on these posts, users can write their comments, but it does not provide an option to edit the posted comment. To correct the wrong posted comment a user has to follow a lengthy path of deleting the posted comment followed by reposting the correct comment. By just giving delete option on the comments it is not proving user the flexibility to undo their mistakes as demonstrated in Figure 2 below. This violates Heuristic #6, which states that clearly marked exits should be provided.
Recommendation:
It is suggested that LinkedIn should add functionality to edit the comment along with the delete functionality so that users can rectify their mistakes. This will enhance user’s experience and confidence in commenting on the posts. Also, it will keep away users to follow the long path of deleting the comment first and then reposting the correct.

  1. Withdraw the request to connect
LinkedIn helps their members to build their professional network by sending and accepting invitations to connect. But, the process to delete any wrong sent invitation is very complicated, which is ambiguous to the users. The option to delete or withdraw the sent invitations is hard to find for users in LinkedIn which forces users to try several different options before reaching to the correct destination. There is a button titled ‘Manage all’ which is placed adjacent to the text field ‘Received invitation’ as shown in Figure 3, firstly the font colour for both button and text is same grey colour. Secondly, it is inside the received invitation panel which makes the user think that this button only manages received requests, however, ‘Manage all’ button is to manage all sent and received invitations.  Thus, the user never clicks this button in the first place.
Addition to this, there is no option to delete the request on the main page of the person whom user sent the request. There is just a text which shows that request is still pending from that person’s side.
This violates heuristic #1, #3 which states that a simple and natural dialogue should be used, and memory load should be minimized.


Recommendation:
Just like the Received invitations section, LinkedIn should provide another panel for sent invitations where users can view and manage all their sent invitations. Also, ’Manage all’ button should stand out so that users can identify it as the action button. Furthermore, an option to delete the sent invitation should appear on the homepage of the user to whom it is sent. This will provide users another option to quickly delete the request from that person’s main page whom they sent the invitation. This will save a lot of user’s time as unnecessary navigation trail is avoided and will provide them the straightforward way to perform their action.

  1. No Button to close the window
There is no option to close the sub-window which pops up when the user selects to write their post on the homepage. On the user’s homepage, there is a window with the text ‘Share an article, photo, or update’ as shown in Figure 4, when the user clicks on that, a sub-window pops up as shown in Figure 5, which let the user write or share in that provided space. But if the user needs to exit from that section without performing any task, then there is no cancel or close button. This violates Heuristic #6, which states provide clearly marked exits.

Recommendation:
LinkedIn has provided clearly marked exits as the close button throughout the website but failed to do so for post option. So, it is recommended that there should be cancel or close button on the sub-window which pops up when users try to post their content. It would help users to come out from that sub-window without performing any tasks and also support consistency.
  1. Error while adding new contacts using registered email address.
LinkedIn provides a functionality where users can use their stored contacts from their personal email account to connect with them. To do this, users have to import their address book with the provided email address and upon doing so, a new window pops up. This window has an option to allow or deny the permission which is imperative to complete the task. But those options are not visible and to make them visible, users need to maximize the window. Furthermost, there is no scroll bar to indicate more options down the page. This is not an instinctive action and often forces the users to try several options before reaching to the correct solution. Figure 6 highlights this error in the popped-up window. This is violating Heuristic #5 which states Provide feedback.


Recommendation:
There could be several options to rectify this glitch. One could be, to align the content in such a way that the permission buttons should be visible in the default window which pops up. Another recommendation is to provide a scrollbar so that users can easily scroll down and click on the desired options. Yet Another recommendation is to open the window in maximized size so that the options are visible by default.

Conclusion   

There is much functionality on the LinkedIn platform which aids us in achieving our tasks. But most of the content is disorganized and this pattern is reflected throughout the layout. Despite numerous changes and improvement, LinkedIn still needs improvement so that users can use the application more efficiently. We highlighted several usability issues in their User-Interface. The content of the website should be clear in terms, easy to navigate and important items should stand out. For experienced users, it would be relatively easy to perform their trivial tasks but the new users struggle due to complexities and usability issue in the interface design. The recommended changes could be helpful in removing the issues mentioned and could also make its user-interface more efficient, adaptable, and interactive. 

References

 
[1]     Nielsen, J. (n.d.). Ten Usability Heuristics. Accessed February 9, 2005,
              at https://www.nngroup.com/articles/ten-usability-heuristics/

[2]    Nielsen, J., and Molich, R. (1990). Heuristic evaluation of user interfaces,
at Proc. ACM CHI'90 Conf. (Seattle, WA, 1-5 April), 249-256

[3]    Lethbridge, Timothy. Studying user-interfaces, heuristics evaluations, task analysis,
at http://www.site.uottawa.ca/~tcl/csi5122/coursenotes/ 
[4]    Ali H. Al-Badi, Michelle, O. Okam, Roobaea Al Roobaea and Pam J. Mayhew (2013), "Improving Usability of Social Networking Systems: A Case Study of LinkedIn," Journal of Internet Social Networking & Virtual Communities, Vol. 2013 (2013), Article ID 889433, DOI: 10.5171/2013.889433

Monday, March 28, 2016


Usability Evaluation: Uber

By Rawan Bahmid

As most people know, Uber provides a enhanced form of taxi service for which anyone can be a driver. It provides private transportation options in such a way that benefits both consumers and drivers. The company uses multiple media to deliver its services [2].


We evaluated its consumer mobile application to asses its learnability, simplicity and discoverability. The evaluation was been performed on the Uber Android application version 3.93.4, which was the latest available version for Android 5.1.1 when the evaluation started. Two evaluation techniques were used, heuristic evaluation using Nielsen’s 1990 [1] principles and cognitive walkthrough.

The evaluation covered three important tasks, to determine the usability problems and difficulties that might face a user, to provide some solutions, and ultimately to improve the user’s experience.

Task 1: Request Uber
This feature allows the user to choose the car size, get the estimated fare and order a car.

Success scenario:
  1.  Enter pickup location
  2. Choose UberX or UberXL
  3. Check car capacity
  4. Enter destination
  5. Tap GET FARE ESTIMATE
  6. Request Uber
  7. Choose payment method
  8. Enter promo code (if any)
  9. Confirm the request
Failure scenario and recommendations:

Step 3, 4 & 5
Problem 1: the choices are hidden in the bottom of the page, one has to scroll down to find it, however, there is no sign or clue to scroll down. See Figure 1.
Figure 1 Request Uber: Hidden options

Issues of hidden options in Step 3, 4 & 5 could be solved by making clear to the user that there are more useful options in the bottom of the page. It would be better if the maximum car capacity of people is shown graphically. And if more expressive display of a currency sign is shown beside the text GET FARE ESTIMATE.

Step 6
Problem 2: The term SET PICKUP LOCATION is ambiguous and confuses the users. Should they enter the the pickup location again which means the first entering was not successful. But the address is in the PICKUP LOCATION field!! Or Is the entered location not correct? Or it might be for confirming the entered location.

Problem 3: In some times and places there are no available Uber cars. However, the user can request a car and keep waiting for a request that would never be confirmed. check Figure 2.
                                           
  Figure 2 Request Uber: No available car

Problem 4: In rush hours and when there is a lack of the available cars, a message would show that there will be a surge pricing. User could choose NOTIFY ME IF SURGE ENDS. However, user will not receive any kind of notifications even when the surge ends, see Figure 3.

Figure 3 Request Uber: Surge pricing


A clearer and meaningful term should be used such as “REQUEST Uber” or “REQUEST CAR”. Moreover, restrict the car requisitions to be used and activated only when cars are available. And provide feedback or message to the user explain the situation. Enhance the notification system as well.

Step 8
Problem 5: The option seems to be inactive because it is gray and users might think it is restricted and can not be used, see Figure 4.
 
           Figure 4 Request Uber: Promo code


Better to colour the outline of the text to show that it is active. And fill the text with a colour when a promo code is being used.

Problem 6: The cars’ slider may confuse users; they might use to enter the addresses because its like a path form a place to a place. They would first enter the Pickup location, move the car to the next point and enter the destination.

This could be solved by having radio button to chose the preferable car instead of the slider. Check Figure 5.
   
                       Figure 5 Request  Uber: Redesign


Problem 7: Beside all the analyzed issues, the application only supports portrait orientation. It does not allow page rotation, which is helpful when following the car’s movement. 

Task 2: Cancel a request
A car request can be canceled before and after the completion of the request. Scenario 1 illustrates the process of the cancelation before the request is being completed. Whereas scenario 2 states the situation of cancelation when the request has been completed.
Success scenario 1:
  1. Hold X button to cancel 
Failure scenario 1 and recommendations:

Step 1
Problem 8: The progress of the cancelation request is shown to the user, but it is not confirmed when completed. After cancelation the confirmation of car request page appears, which confuses the user as to whether or not the cancelation has been done.

To avoid this confusion, provide  descriptive feedback that states that the request has been successfully canceled. 

Success scenario 2:
  1.  Tap on CANCEL
  2. Confirm cancelation

Failure scenario 2 and recommendations:

Step 1
Problem 9: The CANCEL option is hidden. User has to scroll down to find it. However, there is no clue that there are some available options further down the page. See Figure 6.

Figure 6 Request Uber: Hidden CANCEL

Step 2
Problem 10: No feedback is provided when the request is canceled. Therefore, user has to go to the History page to make sure that the request has been canceled.

To allow users to use this feature correctly, make the CANCEL button visible and accessible by giving signal in the page that there are options when scrolling down. Moreover, make sure to provide useful descriptive feedback when the cancelation process is completed successfully.  



Task 3: Add an address to Places
This feature allows user to add their common to visit places to a list. Hence, they just type the shortcut in the destination field when want going there, instated of entering the full address.

Success scenario:
  1. Main menu
  2. Tap Settings
  3. Tap Add HOME or Add WORK
  4. Enter destination

Failure scenario and recommendations:

Step 3
Problem 11: The list is very limited, only two addresses could be added to it. Moreover, names of the places can not be changed. This is not expressive when adding, for instance, the address of the university under the name HOME and will require the user to remember each name is for what address. Check Figure 7.

          Figure 7 Add Places

Step 4
Problem 12: When the address is correctly added to the list, no feedback is shown to the user.
To make this feature more useful, allow the user to enter as many address as they need and name them based on their preferences. Furthermore, provide feedback when the entered address has been added to the list. Figure 8 states a recommended redesign of the PLACES.


Figure 8 Add Places: Redesign

Form the analysis we can conclude that the issues of the application are because of the invisible functions, limited options and the structural mistakes. 

References
  1. Nielsen, J. & Molich, R. (1990). Heuristic evaluation of user interfaces. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI '90), Jane Carrasco Chew and John Whiteside (Eds.). ACM, New York, NY, USA, 249-256.
  2. Uber (company). Wikipedia. Retrieved 20 March, 2016, from https://en.wikipedia.org/wiki/Uber_(company)