How We Designed and Built the Buffer.com Homepage Hero

How We Designed and Built the Buffer.com Homepage Hero

Briefly

"Our old homepage hero technically showed all the platforms we support - but it felt overly corporate, like a feature list wearing a trench coat. The previous hero featured an animated headline that rotated through Buffer's supported social media platforms. While it did the job, it didn't feel very "Buffer-y." We wanted to make a stronger first impression - something with more liveliness and delight."

"The primary design goal with the new hero section was to still demonstrate how many social media platforms Buffer supports, but with some added fun and interest. Kate Baldrey, our incredibly talented marketing UX designer, came up with the idea of floating tiles arranged on a grid (a subtle nod to social grids) at various depths. These tiles would feature various social media platform icons, as well as emojis to evoke the experience of social media engagement."

"We heavily rely on designer-engineering pairing for all buffer.com projects. This means that instead of formally creating high-fidelity designs in Figma, then handing them off to engineering to be built, we spend our time together on calls talking through design ideas, exploring approaches, working through challenges, and making refinements. This practice reduces temporary design artifacts and handoff, which saves a lot of time and results in higher-quality work."