UX Power Tools
Published in

UX Power Tools

Tiny Trend #6: Blockframe Heroes

Ditching the stock photo hero images for blockframes

The original title of this trend was going to be “Sites that look like stripe.com.” But that didn’t seem that useful 🤔

Instead, as we were working on a recent article about the concept of blockframing, we happened across a particular usage of it on product sites; a technique we call blockframe heroes.

These hero images used for products that either don’t have much UI to show, or for platforms that integrate with other applications.

Blockframes give you a visually compelling way to indicate UI without actually having to show it. This obviously helps when you don’t really have a UI (like Stripe), but also when you integrate with other products and don’t want to give the wrong impression. More importantly, blockframe heroes keep the attention away from UI details and on the copy and concepts behind a product.

Let’s take a look at some product sites that are doing an amazing job blocking out the competition! LOL.

(At the end there is a link for a freebie of 35 blockframes of every designer’s favorite products). If you already grabbed the blockframes in our other article, this is actually a new freebie! There are a lot of the same apps (and more!!), but we’ve included mobile versions as well! BOOYAH.

When I’m not writing, I’m working on Sketch design tools at UX Power Tools to make you a better, more efficient designer.

Follow UX Power Tools on Twitter
Follow me on Twitter



A publication for designers, written by designers.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Jon Moore

Jon Moore

Principal Design Partner Innovatemap in Indianapolis. Creator of The Design Encyclopedia (https://www.designencyclopedia.io). Email: 1jonmoore@gmail.com