I’ve worked on many websites that have pretty standard “Meet the Team” pages. But I think it’s a huge missed opportunity for your brand if you don’t try to get a little creative or, at the very least, make sure the page is engaging and up to date.
One client I worked with had spent the time to customize everyone’s image with animated branding elements, for example. Whether it’s investors or customers, people visit the Meet the Team page to get a sense of who you are as a business. It’s an opportunity to put faces to names and give your brand a more human element.
With HubSpot’s drag-and-drop website builder, creating this page is easy, straightforward, and highly customizable. You can showcase your team members with a personal touch, making it easier for visitors to connect with your business.
But what should the page look like? Here are a few of the best examples I’ve seen to give you some inspiration.
1. Humaan
Humaan has done a great job on the individual “Meet the Team” section on their “About” page. The photos are professional and consistent in style, with names and roles clearly labeled.
But they’ve really taken it to the next level with various group shots throughout the rest of the page, showing the team having some fun with the concept.
Why I think this works: It pairs perfectly with the “Digital Products. Human Experiences.” tagline and the motion scroll effects on the page are the cherry on top. It also stays true to the branding and positioning on the rest of the website, giving users a consistent experience and reinforcing the overall brand values.
2. Fishfinger
Fishfinger is a creative agency, and their Meet the Team page reinforces that fact and is an excellent showcase of the team’s talents.
When I scrolled on their “About” page, each scroll gives a full-screen dedication to a specific team member, complete with an animated cartoon representing them and a personalized description and “favorite” section.
Why I think this works: As a creative agency, Fishfinger is using every opportunity to showcase its abilities. But it’s also an opportunity to give the brand a very human element, especially with the personalization of each description.
One person might have a “Claim to Fame” paragraph while another has a “Favorite Tom Hanks Movie” section. I also really like the level of interactivity and on-page animations to boost engagement.
3. Buffer
As a larger company, Buffer doesn’t focus on individual headshots and profiles. But they do find a unique and clever way to highlight the remote nature of their workforce and their global presence.
The Meet the Team section shows how many team members they have and the number of countries, while a spinning globe dotted with headshots emphasizes the point nicely.
Why I think this works: If I were applying for a job at Buffer and visited this page, I would instantly get a sense of how they work and their values as an employer. For other visitors, the copy highlights how remote working is baked into the company’s values and operations.
4. GitLab
Despite the large size of the team, GitLab lists all its employees on the Meet the Team page. But, they get around any user experience issues by providing a filtering option at the top of the page.
Each team member’s profile contains an optional headshot, list of skills, and a link to their LinkedIn page.
Why I think this works: This is a great way to highlight the wide expertise and technical abilities within the entire team, an important factor for a tech-focused company. But I like that they still use visuals to add a human touch to the bios, too.
5. Major Tom
Major Tom is a brand and marketing agency and they keep it nice and simple with their “Meet the Team” section.
Headshots are consistently styled and captions are minimal with just a name and title for a really clean look.
Why I think this works: For me, the value of this Meet the Team page is how they have built the rest of the page around it. They have employee-led videos throughout the page highlighting the company’s values and commitment to service levels, including what makes them unique to work with.
Video is a great way to boost engagement on a page that can sometimes fall a little flat without some extra creativity.
6. IDEO
IDEO gets a lot of things right with its Meet the Team page. Everything is consistently styled, and they’ve even added microinteractions that highlights the team member and flips the image to a slightly different version, so it almost looks like the team member has just smiled at you as you hover over them.
Plus, like GitLab, they’ve provided a filter so you can browse the expertise each lead brings to the table – an important element for a business that relies on its human capital to differentiate.
Why I think this works: The page is a perfect blend of good information and microinteractions to boost engagement. It engages without overwhelming and helps each team member shine to drive user trust.
7. Crowd
At first glance, Crowd’s Meet the Team page looks pretty basic. They’ve used a classic black-and-white treatment for the team headshots and provided their titles.
But when I scrolled, I noticed they’ve added tiles to showcase extra information like how many languages are spoken across the team – perfect if your company is trying to attract international clients.
Once I scrolled a bit more, I realized that when I hover over a team member, the images flip through a series of personal shots from home life and pets to vacations and hobbies. It finishes with some quick bullet points of personal information.
Why I think this works: It was a really nice surprise to come across these microinteractions as I scrolled through what I first thought was a fairly basic design. I think it’s a perfect example of how you can build the “delight the user” concept into your web design.
8. Lush
As a large retail organization, Lush focuses only on executive leadership and board members on the Meet the Team page. The page has a nice split-screen layout with only the right section containing the team bios moving on scroll.
The bios contain a lot of detail, including anecdotes from working at Lush, quotes from the team members, and a history of their time at the company. Some of the executive leadership team members started in entry-level positions at the company and worked their way up, so their bio focuses on that journey.
Why I think this works: Rather than shying away from detailed bios and lots of copy, Lush chooses to present their Meet the Team page almost as an extended editorial about the executive leadership team members. For investors, prospective employees, and customers alike, it’s an excellent way to learn about the values of the decision-makers at the company and the overall positioning and vision for the brand.
9. Monzo Bank
I’ve got a lot of highly creative, sometimes quirky examples on this list. But that isn’t the right approach for every brand. Monzo Bank keeps it extremely simple on their Meet the Team page with a headshot, name, and role for each member of their leadership team.
They still keep the styling of each photo consistent in terms of framing and the use of a blurred background.
Why I think this works: In this instance, the goal is more about building brand trust and showcasing the people in charge. As a financial services company, this is more important for the Monzo Bank website than opting for flashy animations.
10. Adchitects
When I loaded the About page on the Adchitects website, it first loaded a full screen showing a customer testimonial before transitioning to the rest of the page showcasing the team. As someone who is always trying to find creative ways to put social proof front and center on websites, I thought this was a really clever play.
The executive team is highlighted with a nice, clean set of tiles featuring consistent images, names, and roles.
It’s not anything fancy, but I really liked that a further scroll took me to an extended list of the other team members.
This list includes pop-up animated cartoon graphics personalized for each team member and a link to their LinkedIn profiles. I think it’s a great way to use images for a human touch and still showcase the rest of the team without an endless scroll through a grid of tiled headshots.
Why I think this works: Between the customer testimonial transition, leadership images, and clever animation on the profiles of other team members, I really liked how Adchitects has made this an interactive and engaging area of their website.
11. Series Eight
There was a lot going on when I loaded the About page of Series Eight, a web design agency.
Microinteractions and animations appear on every scroll, from a full-screen logo on initial page load to bouncing smiley face emojis.
But the most impressive animation is in the Meet the Team section which, even though I had to scroll quite a bit to get to it, did not disappoint.
As you load each row of team members, it looks like the graphic versions of their headshots are being drawn in front of you in real time. The yellow accent on each is also a lovely use of branding.
Why I think this works: The About page highlights a lot. It includes award wins, customer testimonials, and a brief founders story. The use of animation on the Meet the Team section is really unique and they don’t overwhelm by adding bio text or gridlines which keeps the design really clean.
12. Pitch
Pitch is a SaaS entry in a list that has a lot of creative agencies in the mix. Rather than sticking with a grid style, their images are stacked irregularly but all have the same interesting color treatment.
When I hovered over an image, I could see the person’s name, role, and a link to their LinkedIn page. Further down the page are images of the team at work, at social events, and pictures of personal elements like pets.
Why I think this works: Pitch has chosen to keep their headshot section very simple, but still found a way to showcase the team and company culture with a gallery further down the page. I’ve worked with a lot of SaaS companies, and few can strike this balance between professional and personal so well.
13. Dapper Agency
Dapper is another example of how to use animations and microinteractions well. The About page loaded with a video of the team in the hero. As I scrolled, the video expanded to fill the screen before I scrolled further down to the Meet the Team section.
The Meet the Team section starts with a heading that clearly re-states who the company is and what they do. It also uses a staggered layout rather than a standard grid, which is interesting.
When I hovered over a team member, the site highlighted them with a side tilt and grayed out the other profiles. I also got a little pop-up LinkedIn icon to click through to their profile.
Why I think this works: There is a nice blend of video content, images, and text on Dapper’s About page. It keeps the user moving to view the Meet the Team section but makes great use of the page’s real estate to showcase their values and reinforce their overall brand positioning.
14. Zoocha
Zoocha shows that you don’t need to go all out with unique animations to make a Meet the Team page engaging.
I loaded the page and found a relatively standard headshot grid, albeit with consistent and on-brand images. After one scroll, I noticed they had included a few “Office Doggo” profiles in the section.
Why I think this works: I like this because it’s a great example of how even the small things can make a big difference. Something as simple as showing off the team’s pets made the page feel more human to me and made me want to keep scrolling.
15. Snyk
I’m sometimes undecided about having links to people’s LinkedIn pages on a Meet the Team page. On the one hand, it’s an easy way for people to connect with team members. But it does take people off your website. I also like that people can click to learn more about them without cluttering the page with bio copy.
Snyk marries both of these concepts with a simple microinteraction.
Alongside an image grid that contains links to LinkedIn bios, I could click the “Bio” icon and the image would flip to reveal a concise section on the team member’s background.
Why I think this works: When I have to make a website design decision that needs to balance having the optimal content on a page, designs like Snyk’s Meet the Team page give me inspiration for how to achieve this with very simple techniques. No matter how a user wants to interact with an individual team member, all the options are there without sacrificing the look of the tidy grid design.
“Meet the Team” Page Best Practices
There was a lot to like about the examples I’ve gathered up, so I’ve translated the best parts into some best practices you can use on your own Meet the Team page.
Use high-quality images.
I’ve seen Meet the Team pages where images have different contrasts, some are more zoomed in than others, and there’s even a random black-and-white shot in a sea of color.
In my opinion, it’s worth the expense to use a professional headshot vendor or graphic designer to keep the images high-quality and consistent. When you simply lift people’s LinkedIn profile photos, I find the design can start to look quite messy and distracting.
So make sure to keep consistency across image quality, treatment, and dimensions. If this is difficult to achieve, you can go the illustration route like some of my examples above.
Be consistent.
Consistency applies to all elements of the page and team member bios, not just images. From a user perspective, inconsistency looks confusing and can diminish the trust you’re trying to build in your brand.
I had a client a while back who had bios for each team member that were completely inconsistent. Some were much longer than others, some shared personal information and some didn’t. It wasn’t a good look, so we spent the time homogenizing the style of each bio for better consistency.
And it doesn’t just make your page look better. Consistency is also becoming an increasingly important component of brand equity scores. One 10-year study found that its importance rose from 25% in 2014 to 36% by 2024.
Write compelling employee descriptions.
At the very least, I recommend that each member’s profile include a photo, name, and job title. But a bio adds a whole other layer of human connection and social proof for users. I’m particularly keen on including bios for executive team members, even if not for the rest of the team.
Highlighting a person’s background, skills, and experience builds trust. It’s especially important for companies in high-trust industries, large multinationals that focus on investor relations, and businesses where human capital is part of their unique selling point.
If it fits with your overall brand, I would recommend having a bit of fun with the bios and adding some personal details or fun Q&A style tidbits.
Include social links.
If you’re going to use social links in people’s bios, I recommend sticking only with LinkedIn. As a professional network, you can worry less about personal information or opinions than with X or Instagram. But social links are useful to include, especially for bolstering client relationships in a B2B setting.
A long-term client might want to connect with their account director, for example, and it’s a great way to foster continued relationship building and brand loyalty. In fact, 66% of professionals say they’d be more likely to recommend a brand if they followed one of its executives on social media.
Showcase personality.
As you can see from the example list, there are lots of ways to do this. Even if your brand isn’t “funny” or “quirky,” there’s room to share the human side of your business.
My personal favorite from the examples was the teams that shared photos of pets or videos of team outings as part of the overall page.
Even design effects can be enough to add a little bit more personality to the overall page or individual profiles. It helps to make your page, team, and values more memorable for prospective customers.
Show off your team in style.
“Meet the Team” pages resonate because people like to buy from real people.
But the style you select should also come from your core mission and values, so the page helps to elevate them, rather than clash with them. That could mean super creative animations or a simple but consistent grid display.
Either way, visitors will appreciate being able to put a face to your brand.
Editor’s note: This post was originally published in December 2016 and has been updated for comprehensiveness.
from Marketing https://ift.tt/H8xQg2I
via IFTTT