Design Review: Patreon

November 2, 2020
Designers
LinkedInTwitterFacebookEmail
This post is part of a post series called Design Series
  1. Design Review: Autozone
  2. Design Review: Low Carb USA
  3. Design Review Special Halloween Post: Spirit Halloween
  4. Design Review: Patreon

Touted as the “best way for artists and creators to get sustainable income”, Patreon is a site that caters to a variety of artists and their fan bases. They offer tiers with prices ranging from $5 – $20, where fans can become active participants or gain access to exclusive content. It’s a great way for fans to support their favorite artists.

Patreon seems to have bridged the gap between an artist and their fan base, but their design could use a little help.

See Full Site Below

Header Design

Their header design is fairly standard, but their logo is a bit on the small side; in fact, it’s so small, it’s almost unnoticeable there on the left. A slightly larger logo could help their brand recognition on the website. The links in the drop down look good, as does the spacing above and below each section.

The most unusual thing on the website is the “cookie” banner. While the cookie banner is a require part of most websites today, no one likes more popups. So instead, they added it directly into the page as a small banner. I’ll confess I didn’t notice it right away, but I did notice the impact on the header design. With both the vote and the cookie banners, you have three bars of small information before you get to the feature image. It’s a toss-up really – 1 less popup or two bars of information below your nav bar. Alternatively, if they had done a background color on both information bars, it might be easier for the user.

header of patreon website

Design for the Main Homepage Sections

The overall design is very simple for this site; lots of white, making it clean and open. While the overall layout works for the site, their call to actions aren’t very clear. “Change the Way Art is Valued” is a great idea, but I’m not sold on the Call to Action aspect of it. The CTA should give the audience the reason why they should take action; it should drive them to your website, and it should be more than a pithy expression. While the paragraph below provides great supplemental call to action, the large text is a bit of a disconnect.

Section: What’s Patreon?

In the section under “What’s Patreon” we have some spacing and padding issues. The width of the page gets smaller, and the padding is too small; just an extra 30-40 pixels between the text and the image would do wonders for the design. Scrolling down further, the ratio between each picture and text is unbalanced; it’s too little text for the image. Just a little more content would fill out the design better.

The treatment done on the images works really well. It adds a contemporary flair with the “clean” design and makes the site more interesting.

Ironically, the space between this section and the next section is a little too big. Shortening this would make sure people see the next section and continue scrolling.

Section: Who Uses Patreon?

The next “Who Uses Patreon” section covers different types of  “Creators,” that flips through some images of each. Each one is a type of creator that you can click on for more information. Unfortunately, the words and images aren’t the same size so it ends up looking lopsided. The image and text should be equal in size for a better overall design.

However, this is a very basic design for what’s arguably one of the most important sections of the site. A more interesting design like a grid of images with text overtop, could bring some much needed variety to the page. It would also help the user to stop on this section and take notice.

Patreon - Who uses section

Section: It’s Easier Than You Think

While the spacing above was too large, this section solves the issue by adding a slight color difference in the background. This section is simple but beautiful; it has a nice large image of what the profile looks like, with a small shadow behind it. It’s one of the best designed sections of the site, but it’s virtually useless to the user. It would have been nice to add a little circle to different parts of the profile image with a hover effect that shows more information.

Section: See How Other Creators Use Patreon

And finally the blog section. Like the sections above, it really doesn’t match the overall width of the site. It’s also just overall boring. For a site catering to artists and creators, I would expect a bit more from the design.

The Footer

The nice call to action before the bottom footer can help catch those final people who scroll all the way the page. The footer is pretty standard with a dark background. It is a little unusual to see a link to a site map, but it’s all nicely laid out.

Summary

The two main issues with this site is the spacing and the boring design. Balancing out the spacing can take the design itself to a more professional level, but it needs design elements that will spice it up. I would argue they already have some great treatments on the images, if they simply took that idea and integrated into the overall design, their design would be far better suited for their user demographic.


Patreon's Full Website Design 2020

Join the Discussion

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>