Friend list design pattern

Join the early bird Black Friday list

Black Friday is just around the corner, and we’re excited to offer early access to our best deals of the year at shop.learningloop.io. If you’re looking to elevate your brainstorming sessions and streamline your team’s workflow, our printed card decks are here to help.

Want to get in before everyone else?
Join our Black Friday Early Bird list to be the first to know when discounts go live! We’re launching the sale early this year, so you can grab your deck and start putting it to use before 2025 even begins.

Join the list

67% of 65 votes liked this

Alternate titles: Contacts.

Mini pattern

Problem summary

The user wants to keep track of and engage a subset of their friends on the site in a meaningful way.

Example

▲ Friend list at goodread.com

Usage

Use when you want to provide a way of exploring users of your system, often in combination with their user profile page
Use when you want to give users an opportunity to find frequent contacts
Use when you want to provide a way for users to find each other
Use when you want to provide a way for users to interact with each other
Use when you want to let users control who they share information with.

More examples

See all 2 example screenshots

Solution

Show a user’s connections or friends in a manageable list. This pattern is often combined with the Follow pattern.

Rationale

Friend lists can be used to help users engage with your web application in a better way by keeping up with how other people they know are using the application.

Friend lists also come in handy when the users want to control who they share with. Whether it’s one-on-one communication or keeping track of someone’s tastes and preferences, the way users explore their blossoming friend groups will become increasingly contextual, requiring friends to become a more integral part of the content-consumption experience.