New LinkedIn UI: an HCI analysis

Finally, LinkedIn overhauls their desktop UI — awesome! Huzzah! Shiny new look! The buttons ripple on-click! Also, the Facebook familiarity is a nice touch for millennials like myself, but..

I don’t feel like I’m in control. Let me explain.

During my Human-Computer Interaction course, I learned to critically analyze design choices. Specifically, my professor tasked our class with sharing “good” or “bad” designs we found out in the wild: everyday objects, digital interfaces, etc. As a result, I have trained myself to recognize good or bad decisions. Unfortunately, the bad design choices are more common than you would imagine!

Now that I am graduating soon, I find myself spending more time on LinkedIn than any other social media platform. Naturally, when I spend more time using a product or website, I gradually learn how to use it more effectively. However, I noticed a poor design decision on my profile page…

Within the profile page, users can modify their Accomplishments section. Courses is an optional sub-section beneath Accomplishments. Since I am currently an undergraduate, I have filled out my Courses list accordingly. Understandably, professionals with years of work experience may not find value in the Courses sub-section, but it is still important to students!

What’s the problem?

TL;DR: Jakob Nielsen would not be impressed.

My Courses section has 20 major (CPSC) courses listed. Note that I have omitted half of the courses in my degree — the missing 20 courses are electives. In the previous LinkedIn UI, the Courses section showed your entire course list in an exhaustive table. Yes, the new UI is compact and reclaims screen real estate, but it is now cumbersome to read Courses in its entirety.

To view my 20 courses, I must click “See 5 More” four times, which is preceded by clicking “See more courses” once. If you’re keeping up, that is five mouse clicks — simple math, right?! Further, if I want to include my 20 other electives (because The History of Video Games is a real course and I want to proudly wave my nerd flag), I must also click “See 5 More” four more times — a total of nine mouse clicks. Preposterous! Visitors visiting my profile page cannot simply CTRL-F to find a course entry — they must now click multiple times to find information they need.

But wait, there’s more!

Since I prefer my course numbers to be ordered, I inserted the courses in ascending order (CPSC 231, CPSC 233, etc.). Each new course that is inserted into Courses is appended to the bottom of the list. However, here is the catch: the individual courses cannot be reordered! If I mistakenly forgot to include the second course entry (CPSC 233), I would have to delete every single course entry that was submitted after CPSC 233. If you’re algorithmically inclined then you’ve already figured out the worst-case runtime is for this insertion — ouch!

Sadly, the prior UI also had this dumb^H^H^H^H silly issue (Unix joke: [✓]). Alas, the new UI inherited the same problem…

Why are these problems?

According to Nielsen’s heuristics:

7. Flexibility and efficiency of use

LinkedIn made an aesthetically charming web interface with less clutter and a familiar layout that users are accustomed to. However, they have curbed the efficiency for how users navigate profile content. Is the Courses section flexible? No, because I cannot reorder the list without tedious micromanagement. Does the Courses section allow for efficient usage? No, because users must click multiple times to view the entire list.

I have an interest in HCI and I appreciate succinct, effective design. If I want information, I want it fast. I should not have click “See 5 More” repeatedly. Why is there no “See all courses” drop-down? Is efficiency sacrificed in favour of screen real estate and a minimalist profile page? I want to feel comfortable, efficient, and in control when navigating a web page. Users appreciate websites that are functional and concise. For the most part, the new UI has accomplished this. Yet, I still feel that the UX designers dropped the ball (albeit, a very small ball).

What’s the solution?

Personally, I demand efficiency, and the solution is simple. In fact, LinkedIn already has a solution!

The Skills & Endorsements section includes a “Reorder” column! Why is “Reorder” column absent in Courses? (Please, someone ping Ms. Parnell!) If the functionality exists, why is it exclusive to the Skills & Endorsements section? Side note: should the Skills & Endorsements section also include a “Sort Endorsements by Least-Most/Most-Least” filter?! sigh…

Will this problem run its course? (Pun: [✓])

Let’s hope not. I dream that LinkedIn will remedy these issues before the next UI update. I do not want to see future UI updates inheriting current problems.

Undoubtedly, taking Human Computer Interaction (HCI) into consideration is vital during the design process. Did LinkedIn ever put a human in front of a computer and ask them to interact with the new UI? I’m sure they did. If so, then how am I still bothered? Is this a non-issue that only bothers me? What do you think about LinkedIn’s new UI patch? Other users have weighed in. Is the conversation meaningful or meaningless? Do you support #IMissOldLinkedIn? Let me know!

P.S. Let’s be honest, I am writing about this because I really want to showcase how awesome my History of Video Game Music course was.