Timeline
1 month
Role
UX and UI Designer
Tools
Figma
Project Overview
The Problems
The Solutions
Filter Rehaul
I've completely redesigned the LinkedIn Connections filter bar for a more intuitive and customizable experience. The new collapsible categories keep the workspace organized, while a search bar allows quick access to filters and tags. The "Add New Filter" section lets users create custom filters with specific tags, which can be easily removed by hovering. This update gives users more control, making networking and connection management seamless.
Profile Tags
I’ve built a new tagging system that seamlessly integrates with the filter sidebar, making it easier to organize and categorize connections. Clicking the "Tags" button on a profile card opens a modal showing all associated tags, with a search bar to quickly find, add, or remove them. This system allows for effortless customization, helping you filter and manage connections more efficiently.
Messaging Modal
Research
Lots of bumps in the road
Initial research faced hurdles: limited secondary data and no direct LinkedIn competitors (Xing account was quickly banned). Consequently, the project pivoted to user interviews with five diverse LinkedIn users. This user-centered approach provided valuable insights and narrowed the project scope from an A/B test of two concepts to a focused redesign of the existing page.
Iterations
Designing for Clarity Over Flash
At first, I wanted to create something grand, fresh and exciting yet true to the design system. I introduced a new component that looked the part but felt distinct. However, testing revealed that users struggled to connect it with other elements, making navigation harder. So, I scaled back, aligning more closely with the existing design language, and the results were far better. This reinforced a key lesson: style means nothing if it's not intuitive and accessible.
Take-aways
Prioritize Usability Over Flashy Features