I’ve labored on many web sites which have fairly commonplace “Meet the Staff” pages. However I believe it’s an enormous missed alternative to your model when you don’t attempt to get just a little artistic or, on the very least, make certain the web page is participating and updated.
One consumer I labored with had spent the time to customise everybody’s picture with animated branding components, for instance. Whether or not it’s traders or clients, individuals go to the Meet the Staff web page to get a way of who you might be as a enterprise. It’s a possibility to place faces to names and provides your model a extra human aspect.
With HubSpot’s drag-and-drop website builder, creating this web page is simple, simple, and extremely customizable. You’ll be able to showcase your staff members with a private contact, making it simpler for guests to attach with your small business.
However what ought to the web page appear like? Listed here are just a few of one of the best examples I’ve seen to provide you some inspiration.
Artistic ‘Meet the Staff’ Pages
- Humaan
- Fishfinger
- Buffer
- GitLab
- Main Tom
- IDEO
- Crowd
- Lush
- Monzo Financial institution
- Adchitects
- Collection Eight
- Pitch
- Dapper Company
- Zoocha
- Snyk
1. Humaan
Humaan has carried out an amazing job on the person “Meet the Staff” part on their “About” web page. The pictures are skilled and constant in type, with names and roles clearly labeled.
However they’ve actually taken it to the subsequent degree with varied group photographs all through the remainder of the web page, displaying the staff having some enjoyable with the idea.
Why I believe this works: It pairs completely with the “Digital Merchandise. Human Experiences.” tagline and the movement scroll results on the web page are the cherry on prime. It additionally stays true to the branding and positioning on the remainder of the web site, giving customers a constant expertise and reinforcing the general model values.
2. Fishfinger
Fishfinger is a artistic company, and their Meet the Staff web page reinforces that reality and is a superb showcase of the staff’s abilities.
Once I scrolled on their “About” web page, every scroll offers a full-screen dedication to a particular staff member, full with an animated cartoon representing them and a customized description and “favourite” part.
Why I believe this works: As a artistic company, Fishfinger is utilizing each alternative to showcase its skills. However it’s additionally a possibility to provide the model a really human aspect, particularly with the personalization of every description.
One individual may need a “Declare to Fame” paragraph whereas one other has a “Favourite Tom Hanks Film” part. I additionally actually like the extent of interactivity and on-page animations to spice up engagement.
3. Buffer
As a bigger firm, Buffer would not concentrate on particular person headshots and profiles. However they do discover a distinctive and intelligent technique to spotlight the distant nature of their workforce and their international presence.
The Meet the Staff part exhibits what number of staff members they’ve and the variety of international locations, whereas a spinning globe dotted with headshots emphasizes the purpose properly.
Why I believe this works: If I had been making use of for a job at Buffer and visited this web page, I’d immediately get a way of how they work and their values as an employer. For different guests, the copy highlights how distant working is baked into the corporate’s values and operations.
4. GitLab
Regardless of the massive measurement of the staff, GitLab lists all its staff on the Meet the Staff web page. However, they get round any person expertise points by offering a filtering possibility on the prime of the web page.
Every staff member’s profile accommodates an non-obligatory headshot, checklist of abilities, and a hyperlink to their LinkedIn web page.
Why I believe this works: This can be a nice technique to spotlight the broad experience and technical skills throughout the whole staff, an essential issue for a tech-focused firm. However I like that they nonetheless use visuals so as to add a human contact to the bios, too.
5. Major Tom
Main Tom is a model and advertising company they usually hold it good and easy with their “Meet the Staff” part.
Headshots are constantly styled and captions are minimal with only a identify and title for a extremely clear look.
Why I believe this works: For me, the worth of this Meet the Staff web page is how they’ve constructed the remainder of the web page round it. They’ve employee-led movies all through the web page highlighting the corporate’s values and dedication to service ranges, together with what makes them distinctive to work with.
Video is a good way to spice up engagement on a web page that may typically fall just a little flat with out some further creativity.
6. IDEO
IDEO will get quite a lot of issues proper with its Meet the Staff web page. Every little thing is constantly styled, they usually’ve even added microinteractions that highlights the staff member and flips the picture to a barely completely different model, so it nearly appears to be like just like the staff member has simply smiled at you as you hover over them.
Plus, like GitLab, they’ve offered a filter so you possibly can browse the experience every lead brings to the desk – an essential aspect for a enterprise that depends on its human capital to distinguish.
Why I believe this works: The web page is an ideal mix of fine data and microinteractions to spice up engagement. It engages with out overwhelming and helps every staff member shine to drive person belief.
7. Crowd
At first look, Crowd’s Meet the Staff web page appears to be like fairly fundamental. They’ve used a traditional black-and-white therapy for the staff headshots and offered their titles.
However once I scrolled, I seen they’ve added tiles to showcase further data like what number of languages are spoken throughout the staff – good if your organization is attempting to draw worldwide shoppers.
As soon as I scrolled a bit extra, I spotted that once I hover over a staff member, the photographs flip via a collection of private photographs from house life and pets to holidays and hobbies. It finishes with some fast bullet factors of private data.
Why I believe this works: It was a very nice shock to return throughout these microinteractions as I scrolled via what I first thought was a reasonably fundamental design. I believe it is an ideal instance of how one can construct the “delight the person” idea into your internet design.
8. Lush
As a big retail group, Lush focuses solely on government management and board members on the Meet the Staff web page. The web page has a pleasant split-screen structure with solely the precise part containing the staff bios transferring on scroll.
The bios include quite a lot of element, together with anecdotes from working at Lush, quotes from the staff members, and a historical past of their time on the firm. A number of the government management staff members began in entry-level positions on the firm and labored their means up, so their bio focuses on that journey.
Why I believe this works: Moderately than shying away from detailed bios and many copy, Lush chooses to current their Meet the Staff web page nearly as an prolonged editorial concerning the government management staff members. For traders, potential staff, and clients alike, it’s a wonderful technique to be taught concerning the values of the decision-makers on the firm and the general positioning and imaginative and prescient for the model.
9. Monzo Bank
I’ve acquired quite a lot of extremely artistic, typically quirky examples on this checklist. However that isn’t the precise strategy for each model. Monzo Financial institution retains it very simple on their Meet the Staff web page with a headshot, identify, and function for every member of their management staff.
They nonetheless hold the styling of every picture constant by way of framing and the usage of a blurred background.
Why I believe this works: On this occasion, the aim is extra about constructing model belief and showcasing the individuals in cost. As a monetary companies firm, that is extra essential for the Monzo Financial institution web site than choosing flashy animations.
10. Adchitects
Once I loaded the About web page on the Adchitects web site, it first loaded a full display screen displaying a buyer testimonial earlier than transitioning to the remainder of the web page showcasing the staff. As somebody who’s all the time looking for artistic methods to place social proof entrance and middle on web sites, I assumed this was a extremely intelligent play.
The manager staff is highlighted with a pleasant, clear set of tiles that includes constant photos, names, and roles.
It’s not something fancy, however I actually preferred {that a} additional scroll took me to an prolonged checklist of the opposite staff members.
This checklist contains pop-up animated cartoon graphics customized for every staff member and a hyperlink to their LinkedIn profiles. I believe it’s a good way to make use of photos for a human contact and nonetheless showcase the remainder of the staff with out an infinite scroll via a grid of tiled headshots.
Why I believe this works: Between the client testimonial transition, management photos, and intelligent animation on the profiles of different staff members, I actually preferred how Adchitects has made this an interactive and fascinating space of their web site.
11. Series Eight
There was loads occurring once I loaded the About web page of Collection Eight, an online design company.
Microinteractions and animations seem on each scroll, from a full-screen brand on preliminary web page load to bouncing smiley face emojis.
However probably the most spectacular animation is within the Meet the Staff part which, regardless that I needed to scroll fairly a bit to get to it, didn’t disappoint.
As you load every row of staff members, it appears to be like just like the graphic variations of their headshots are being drawn in entrance of you in actual time. The yellow accent on every can be a stunning use of branding.
Why I believe this works: The About web page highlights loads. It contains award wins, buyer testimonials, and a short founders story. Using animation on the Meet the Staff part is actually distinctive they usually don’t overwhelm by including bio textual content or gridlines which retains the design actually clear.
12. Pitch
Pitch is a SaaS entry in a listing that has quite a lot of artistic businesses within the combine. Moderately than sticking with a grid type, their photos are stacked irregularly however all have the identical fascinating coloration therapy.
Once I hovered over a picture, I may see the individual’s identify, function, and a hyperlink to their LinkedIn web page. Additional down the web page are photos of the staff at work, at social occasions, and photos of private components like pets.
Why I believe this works: Pitch has chosen to maintain their headshot part quite simple, however nonetheless discovered a technique to showcase the staff and firm tradition with a gallery additional down the web page. I’ve labored with quite a lot of SaaS corporations, and few can strike this stability between skilled and private so properly.
13. Dapper Agency
Dapper is one other instance of how you can use animations and microinteractions properly. The About web page loaded with a video of the staff within the hero. As I scrolled, the video expanded to fill the display screen earlier than I scrolled additional right down to the Meet the Staff part.
The Meet the Staff part begins with a heading that clearly re-states who the corporate is and what they do. It additionally makes use of a staggered structure reasonably than a normal grid, which is fascinating.
Once I hovered over a staff member, the location highlighted them with a aspect tilt and grayed out the opposite profiles. I additionally acquired just a little pop-up LinkedIn icon to click on via to their profile.
Why I believe this works: There’s a good mix of video content material, photos, and textual content on Dapper’s About web page. It retains the person transferring to view the Meet the Staff part however makes nice use of the web page’s actual property to showcase their values and reinforce their general model 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 typically undecided about having hyperlinks to individuals’s LinkedIn pages on a Meet the Staff web page. On the one hand, it’s a straightforward means for individuals to attach with staff members. However it does take individuals off your web site. I additionally like that folks can click on to be taught extra about them with out cluttering the web page with bio copy.
Snyk marries each of those ideas with a easy microinteraction.
Alongside a picture grid that accommodates hyperlinks to LinkedIn bios, I may click on the “Bio” icon and the picture would flip to disclose a concise part on the staff member’s background.
Why I believe this works: When I’ve to make an internet site design choice that should stability having the optimum content material on a web page, designs like Snyk’s Meet the Staff web page give me inspiration for how you can obtain this with quite simple strategies. Irrespective of how a person needs to work together with a person staff member, all of the choices are there with out sacrificing the look of the tidy grid design.
“Meet the Staff” Web page Finest Practices
There was loads to love concerning the examples I’ve gathered up, so I’ve translated one of the best components into some finest practices you should utilize by yourself Meet the Staff web page.
Use high-quality photos.
I’ve seen Meet the Staff pages the place photos have completely different contrasts, some are extra zoomed in than others, and there’s even a random black-and-white shot in a sea of coloration.
For my part, it’s well worth the expense to make use of an expert headshot vendor or graphic designer to maintain the photographs high-quality and constant. Once you merely elevate individuals’s LinkedIn profile pictures, I discover the design can begin to look fairly messy and distracting.
So make certain to maintain consistency throughout picture high quality, therapy, and dimensions. If that is tough to attain, you possibly can go the illustration route like a few of my examples above.
Be constant.
Consistency applies to all components of the web page and staff member bios, not simply photos. From a person perspective, inconsistency appears to be like complicated and may diminish the belief you’re attempting to construct in your model.
I had a consumer some time again who had bios for every staff member that had been fully inconsistent. Some had been for much longer than others, some shared private data and a few didn’t. It wasn’t an excellent look, so we spent the time homogenizing the type of every bio for higher consistency.
And it doesn’t simply make your web page look higher. Consistency can be changing into an more and more essential part of brand name fairness scores. One 10-year study discovered that its significance rose from 25% in 2014 to 36% by 2024.
Write compelling worker descriptions.
On the very least, I like to recommend that every member’s profile embody a photograph, identify, and job title. However a bio provides an entire different layer of human connection and social proof for customers. I’m significantly eager on together with bios for government staff members, even when not for the remainder of the staff.
Highlighting an individual’s background, abilities, and expertise builds belief. It’s particularly essential for corporations in high-trust industries, massive multinationals that concentrate on investor relations, and companies the place human capital is a part of their distinctive promoting level.
If it suits along with your general model, I’d suggest having a little bit of enjoyable with the bios and including some private particulars or enjoyable Q&A mode tidbits.
Embody social hyperlinks.
In case you’re going to make use of social hyperlinks in individuals’s bios, I like to recommend sticking solely with LinkedIn. As an expert community, you possibly can fear much less about private data or opinions than with X or Instagram. However social hyperlinks are helpful to incorporate, particularly for bolstering consumer relationships in a B2B setting.
An extended-term consumer would possibly need to join with their account director, for instance, and it’s a good way to foster continued relationship constructing and model loyalty. In truth, 66% of execs say they’d be extra more likely to recommend a brand in the event that they adopted one in every of its executives on social media.
Showcase character.
As you possibly can see from the instance checklist, there are many methods to do that. Even when your model isn’t “humorous” or “quirky,” there’s room to share the human aspect of your small business.
My private favourite from the examples was the groups that shared pictures of pets or movies of staff outings as a part of the general web page.
Even design results could be sufficient so as to add just a little bit extra character to the general web page or particular person profiles. It helps to make your web page, staff, and values extra memorable for potential clients.
Showcase your staff in type.
“Meet the Staff” pages resonate as a result of individuals like to purchase from actual individuals.
However the type you choose also needs to come out of your core mission and values, so the web page helps to raise them, reasonably than conflict with them. That would imply tremendous artistic animations or a easy however constant grid show.
Both means, guests will respect having the ability to put a face to your model.
Editor’s notice: This submit was initially revealed in December 2016 and has been up to date for comprehensiveness.
