Improving LinkedIn's UX / UI

Oct.15.2018 | 2m Read | ^UX

As of Oct.14.2018 LinkedIn’s news feed looks like this:

Before shot of LinkedIn News with black background.

Feels like we are going back to early Web 2.0 here.

The problems?

  • ◆ Doesn’t match the established styling and color scheme.
  • ◆ High contrast and black on modern screens cause eye fatigue (even pain).
  • ◆ Pictures become more ominous and dingy with the black gradient.
  • ◆ White cards resemble adjustable modals.

Yes CNN and other outlets (particularly publications) have used black backgrounds for decades. However in print there is ambient light and grain. Older screens have washed-out blacks and scanline or dot matrix diffusion. You don’t get the gleaming whites on darkness that we have today. That’s part of the reason why modern sites use black alternatives like dark chocolate, smoky gray, or faded purples and blues.

If you still want to use white on solid black you need to at least have to temper the whites much more which makes everything look dull (not a great suggestion).

Cathode Ray Tube (CRT) screen.

Retro gamers love Cathode Ray Tube (CRT) grit ❤.

To remedy these concerns I created this UI mock-up:

LinkedIn News mock-up with white background.

LinkedIn looking like LinkedIn again.

This specifically addresses:

  • ☑⁡⁡ Seamless blending with LinkedIn using the same screen space.
  • ☑⁡⁡ Soothing low contrast with accents where needed.
  • ☑⁡⁡ Pictures are now more fresh and airy with the white gradient.
  • ☑⁡⁡ White cards have colorized labels to pop and look as expected.

But where is that gray-blue from those labels come from? I snagged it from our profile dashboard:

I’d actually replace that dark green nav bar at the top with a shade of this too if I could.

Now you may notice it’s a tad darker from the averaged color. That is so the ‘+ Follow’ links are more visible. To do this I drop the luminosity while upping the saturation (a trick to retain more of the perceptual feel to the color). There’s room to go darker, but this should be a good starting point.

All this makes for a much more pleasant experience, no?

Before and after of LinkedIn News (black to white background with new colors).

Wow look at those visual aid icons. That’s for the TL;DR people.

LinkedIn is an [often necessary] social media site which means its users are especially subject (read vulnerable) to eye strain and headaches from long term usage. A little care and consideration go a long way here.

Optic nerves connecting human eyes to the brain.

Happy eyes = Happy brain

Now if only LinkedIn can give their users an option to remove that recent ‘see more’ profile shortening. You know, for those who know about design and want their content unhidden and gimmick-free.

LinkedIn profiles made shorter with a forced 'show more...' link.

Some day LinkedIn. Some day…

Like this post? Read more from the ^UX topic.


       : NEWS