Addictive UX: Why Pinterest Is So Dang Amazing

by on 25th January 2012 with 31 Comments

screenshot

Today we’re going to examine a very specific example of good design and discuss what makes it so successful. Along the way we’ll discover the importance of good design and how to structure experiences that turn users into addicts.

We’ll hone our sights in on Pinterest and perform a seriously in-depth analysis to see why this seemingly generic idea seems to stand so far out from the competition. The ultimate conclusions will equip you to design experiences that your users will absolute love.

A Lame Idea

screenshot

Imagine that I came to you in 2010 with what I thought was a brilliant idea. I was confident that I could make it work and needed only some investors to help get things off the ground.

Being the cautious spender that you are, you ask about my idea. What is it? How does it work? My answer: a social bookmarking site. I’m going to create a website where people can sign up and save links. Cue patronizing letdown. You would no doubt inform me that this idea is anything but unique and is sure to flop. How could I possibly take on Delicious and the other bookmarking giants?

I’ve got a big idea though: I’m going to use images. Users will be able to grab any image from any webpage, save it to their account and share it with others.

Once again, in your best slightly derogatory tone you would inform me to do a Google search for “image bookmarking” and take note of the countless sites such as FFFFOUND! and Ember that already populate this market. You might even direct my attention to a list of 10 popular image bookmarking services, published in 2010, as further proof that my idea was completely unoriginal.

screenshot

The Not So Lame Success Story

At its core, Pinterest is nearly identical to the concept of the sites in the list above: a simple visual bookmarking service with a strong emphasis on sharing. I can’t help but look at the climate of competition under which Pinterest was born and marvel at how it came to stand out as a clear leader in the category.

screenshot

So why has Pinterest caught fire lately? If it’s one of countless image bookmarking services, how in the world did it draw over 1.5 million users during a “private” beta? How could it possibly be snagging tens of millions of page views per week and have an estimated company worth of around $200 million?

Why Did It Work?

The secret to Pinterest’s success is incredibly important. In a time where social media is a multibillion dollar industry, a truly successful formula is the holy grail.

There are no doubt several pieces to the Pinterest success puzzle but the one we’re going to focus on today is design. How did Pinterest not only set itself apart with design, but actually surpass what everyone else was doing and create something that engaged users on an entirely new level?

Solving Layout With Diverse Image Sizes

screenshot

One of the primary aspects that set Pinterest apart from other social image bookmarking services is that they completely rethought how the images should be presented to the user.

The goal is a simple one, you ideally want your users to be able to browse through hundreds or even thousands of images with relative ease. If this action requires too much effort on the user’s part, you lose their interest. If it’s effortless, you keep their attention focused on the content.

One important step in this battle was “masonry” style layout, a fairly recent trend in web development named after the jQuery Masonry plugin. Pinterest uses its own scripts for this, but the concept is the same.

screenshot

Basically, masonry style layout creates the most efficient utilization of space possible given varying image heights. It overcomes past layout hurdles and takes vertical height into account when laying out the images, thereby creating a super tight, puzzle piece flow of images on the page.

Pinterest wasn’t the only image bookmarking service to try this layout though. Competitors such as Image Spark had also integrated masonry layouts. Obviously, there has to be more to this puzzle.

screenshot

The Pagination Conundrum

In addition to maximizing layout efficiency without sacrificing image quality from uniform cropping, the Pinterest team was able to identify another underlying problem with existing image gallery formats: pagination is a pain.

Websites love pagination because it increases their page views (more views = more money), but as a user it sucks: scroll down, click the “next” button, wait for new page to load, scroll down and click the button again… then at some point you realize you want to go back and find a specific image or page and you’re left hitting that back button a million times until you find it.

screenshot

To solve this problem, the Pinterest team looked to infinite scrolling, a neat little trick that automatically loads more content as the user hits this bottom of the page, thus allowing for a fairly uninterrupted browsing process.

Way back in 2008, Paul Irish was creating and distributing infinite scroll plugins. The advice on that site says to use infinite scrolling when:

  • Retaining the user is important and clicking “Next Page” is a usability barrier.
  • The full content available is too large to show on initial load.
  • The content is available in paged chunks: search results, blog posts, product listings and portfolio features.

This perfectly describes the circumstances of a social image bookmarking service, making Pinterest prime territory to implement this technique.

Masonry + Infinite Scrolling = Magic

Masonry style layout and infinite scrolling have melded into a single idea in our head, but they started as two separate technologies. Putting them together, it turns out, creates a truly addicting experience.

If you doubt this for a second, stop by Pinterest and start scrolling. What follows is some strange form of time travel where you stop by the site for a quick peek and out of no where a solid hour has gone by. In this time you forget about user interfaces and controls, you simply absorb the content as thousands of beautiful pictures slide by, controlled by a single flick of your finger.

It’s a truly engaging experience that simply blows away many past user interaction models. It’s interesting to note that the Facebook News Feed, the epitome of website addiction, uses infinite scrolling. Further, the new Timeline pages now combine this technique with a two column masonry style layout. It’s catching on folks, expect to see a lot more of these two techniques in the next year.

screenshot

Unbeatable Content

screenshot

Fancy interaction models don’t mean a thing unless you have the content to back them up. In order for Pinterest to really take off, two conditions had to be met: the content had to be great, and there had to be a ton of it.

These two goals are actually conflicting. The best way to get lots of content is to open your site to the public, which is also the best way to ensure that your site is full of crap.

Pinterest chose to stay in private beta for quite an extended period of time, carefully controlling invites. I honestly have no idea how they pulled it off, but the core group of early adopter pinners really set the stage for Pinterest’s identity and quality expectations.

In the early days especially, you couldn’t deny the strong, unique personality that the Pinterest community seemed to have. It seemed that every image on the site was oozing with style. Instead of sifting through piles of garbage to find the gems, you were presented with wave after wave of gorgeous interior design ideas, DIY projects and the like. Which brings me to my next point: a targeted user base.

A Woman’s Touch

screenshot

Social bookmarking services, for whatever reason, have traditionally been quite nerdy. The visual nature of the service attracts two kinds of people: designers and guys who want to save images of girls that tend to be of a particular variety. Consequently, these services are typically filled with an odd mix of beautiful examples of design and erotic photography. Don’t believe me? Spend twenty minutes on FFFFOUND! and you’ll be a believer.

Pinterest on the other hand, has actually found an audience largely with females. As the user base expands at a rapid pace, people of all types are flocking to Pinterest and “pinning” all manner of content, but the initial base of content was largely Etsy-style material that exuded a feminine style simply not found in other similar services.

Women found Pinterest and used it to save recipes, collect outfits ideas and create lists of home decor products. Pinterest targeted and leveraged this vast potential user base and used it as a foundation for its personality. I talked to a non-techy friend yesterday who is admittedly still “creeped out” when a male user follows her on Pinterest because she sees it as a largely female network.

In the end, this proved to be a very powerful strategy that has paid off with content that no one else can come close to matching. Again though, the folks at Pinterest will have to keep a close watch on their audience and evolve with their user base. Their growth is already taking them from a very specific offering to one that is more general and broad reaching.

A Solid Metaphor That Encourages Sharing

The final thing I want to discuss regarding Pinterest’s success is a little deeper into the interaction model than the surface layout and scrolling techniques. The way that they’ve structured the service’s collection process and social layer is yet another stroke of genius that helps make the service strong.

screenshot

The metaphor behind Pinterest is instantly understandable and quite catchy to discuss. The idea is that Pinterest is your “virtual pinboard.” You create various “boards” and assign them categories, then use a bookmarklet or the main feed to “pin” items to your boards. Other users can then follow boards from users they like and receive a custom stream of content tailored to their specific tastes.

What people pin has become a hot discussion topic that promises new insight even into the minds of those you already know well. For example, I used my wife’s Pinterest account for gift ideas at Christmas time. It also helps with those you’d like to know better. When inviting another couple over for dinner, my wife checks the other girl’s Pinterest account to see what types of food the couple enjoys.

Making It Easy

We already discussed how Pinterest has created an awesome source for finding inspiration, but in order to get people to actually use your digital content collection service, you have to make the act of collecting and sharing content a nearly effortless task.

One of the ways that they’ve done this (in addition to the bookmarklet) is to pick up the “Retweet” idea from Twitter. Every item in a given stream of pins can be liked, commented on, and most importantly, repinned.

screenshot

This creates a system where collection is super easy and encourages lots and lots of pinning. There’s even a page describing Pin Etiquette so everyone can learn to play nicely together.

Conclusion

Looking around the web, we encounter countless examples of fantastic ideas that are ruined by poor execution. Pinterest turns this on its head by presenting a fairly generic idea that works extremely well because of its amazing execution.

Pinterest succeeds on several layers of interaction. First, they maximize their content presentation with a masonry like layout and keep you interested for hours on end with infinite scrolling. Next, they carefully targeted and crafted a very specific user base that was both a huge potential source of users and a fairly untapped market in this space. This led to a solid foundation of daily content that defined Pinterest’s very identity. Finally, underneath it all is an instantly understandable metaphor and sharing platform that is wickedly viral and incredibly easy to pick up and use.

All of these factors together create a winning formula for an undeniably addictive user experience. Whether you personally love it or hate it is irrelevant, the truth is that Pinterest is turning heads and dramatically increasing in corporate value. It therefore serves as an important lesson that you as a designer simply shouldn’t ignore.

Comments & Discussion

31 Comments

Comments & Discussion

31 Comments

  1. Robin Cannon says:

    I think this is one of the best overviews of a website I’ve read in a long time, and a real demonstration of how vital UX can be in making something stand out from the crowd. As you correctly identify, it’s not necessarily the *idea* of Pinterest that’s original, but the way in which it’s presented and made into a genuinely enjoyable experience means that it’s immediately shareable, comfortable and attractive.

    Great piece.

  2. With masonry style layout and infinite scrolling, even the blandest of images can become part of a more engaging presentation. That’s what sets Pinterest apart from the other social bookmarking sites; users have their tastes gratified. The beautiful layout of their images encourages users to continually engage with their pinboard, confident in their choices. It’s fascinating, and not by fluke.

    Cheers
    Sarah Bauer
    Navigator Multimedia

  3. Tim Myers says:

    We have been exploring the exact same concept of content layout in relation to images, text, etc.

    Pinterest really nailed it for sure and it’s not just format but how comfortable it makes you feel.

  4. Tom Howlett says:

    Great post, I’m really liking Pinterest at the moment and am not surprised by its success.

    I definitely agree that its ease of use is a key to its success. The images should be the focus and they are due to the clean and unobtrusive visuals and colours used.

    A good example of an alternative for the sharing experience is Tumblr. You have many Blogs where people post images for inspiration. Some themes make it easy to browse and share the images, some don’t and I am much more likely to revisit if it is easy.

  5. Laurel G says:

    I’ve been a huge fan of Pinterest since it first came out. I’ve read a number of different blog posts about it that focus on different aspects of it but this has been the only one focused on the design. Great read!

  6. Logo Blog says:

    Great Posting, very nice to read this article, here are some very interesting n interactive information. thank for this Great share :)

  7. Sam Jones says:

    I haven’t used Pinterest myself but this was a nice insight into what all the fuss is about. The combination of masonry style layout and infinite scrolling is particularly interesting because I use a similar site called Gimme Bar and my only issue with it is that I have to click from page to page to view my collections. I suppose it just goes to show what a difference that sort out thing makes.

  8. Jenni says:

    Pinterest is effectively the lovechild of Tumblr and Delicious. The third elemtn, as you say, is the UX. Great article :)

  9. Pinterest is an UX marvel and that’s no doubt the core of their success. As a user though, I stay away. It’s just such a time vacuum.

  10. Kevin Flores says:

    Very thoughtful article. Thanks for comparing Pinterest to past ‘social bookmarking’ services (why the timing was right, this time) and explaining how the UX contributes to the ‘addictiveness’. I myself had been monitoring Pinterest for a bit, but had held off signing up because I saw myself getting hooked. I am on now, doing lots of browsing and figuring out how I’d like to use it, personally.

  11. Jaune Sarmiento says:

    Great post! I checked it out and found some bugs though. The background-image on the Like and Comment buttons displays the ‘pin’ icon. A little problem with background-position perhaps. Also, I was supposed to report this bug using the Contact form, but I’m getting an HTTP Error 403 when clicking Send.

    Nonetheless, it’s a great website. I’ll try to incorporate the Masonry style layout in my future designs. Cheers! :)

  12. Nicole says:

    Great post and a good example of how the success to success is often in the execution and details rather than just a brilliant idea. Really interesting understanding a bit about the background of Pinterest and how they’re differentiating themselves. Hope Pinterest keeps taking cues from Twitter – removing multiple repinned images like Twitter does for retweets would be a good improvement.

  13. Lola LB says:

    This is a really great overview! where can I read up on masonry layout?

  14. Great article and great example how through UX given service or product can achieve exceptional status in it’s field, although there are other similar to it.

    The kind of users you attract and the things you encourage them to do is in great importance for a site where the content is user generated, Pinterest have done very good job in tunneling the people doing certain actions on the content they make.

    Also, there is a lot of psychology in their approaches :)

  15. I am very disgusted with Pinterest. Don’t get me wrong, love the concept, the layout & ideas. However, I’ve been emailing them for 2 weeks for tech support & I have gotten NO response! I want to change my profile picture, which seems like a simple thing to do, follow the directions & get it done, WRONG! First of all, when it gets to the part where it says “change image”, that is no where to be found! I’ve tried everything & to no avail, it just doesnt work & they will NOT answer any of my numerous emails? Something that should be so simple, they’ve turned into a very frustrating, maddening procedure & they seem to care less!!! What does that say about their company, to me it says, basically, who gives a flip?!!! As far as I’m concerned their tech support/or whoever sucks & gives their company a really bad reputation!

  16. Tom Howlett says:

    I think the more Pinterest evolves the more interesting it will become.

    At the moment I can see the interest but I am struggling to see its value beyond just a site I may have the odd look around.

  17. duncan says:

    How is it that you can mention “pinterest” 50 times in this article and not a single one seems to be a link to the actual site.

    Maybe I just missed it.

  18. humphrey says:

    Thanks for a brilliant overview. I am going to put this blog up on Quora. :)

  19. Sophie says:

    Does anybody know how Pinterest (& also Etsy) achieve the look they have for all the images? They all have a uniformed filter on it and i’m wondering if it’s something they do on their backend and unifies all the images into a look?

  20. Kai says:

    I asked the question of why Pinterest was so successful where others have failed and was directed to your article by Robert Fein (@GoodSenator).

    Very insightful, and design & UX is surely a key part of its success- however I think it’s only half of the story. There are also countless examples of beautiful products that have failed and ugly products that have caught on (albeit those with enduring success quickly got their act together design-wise).

    I think it’s also important to consider the wider context of online behaviours, attitudes and new audiences who are becoming more savvy to social media.

    As FJ (@fj) has pointed out– Pinterest was able to take advantage of Facebook and Twitter integration – making it easier than ever before to find and add friends. Previous services hoped that you would email your friends for them to gain word-of-mouth traction.

    Also, it seems that new audiences are becoming social media savvy – particularly older women and fashion audiences, who are driving the usage of Pinterest.

    So let’s continue to champion great design– but also let’s not forget that design doesn’t exist in a vacuum– it’s one of many important factors to the success of a product.

  21. Fantastic breakdown of the site. I think we can all learn and use some of these concepts in our own apps.

  22. Beryn Hammil says:

    I just stated on Pinterest, and as an Interior Designer I find that it’s a wonderful way to put idea books together to show to clients. However, I would love it if there could be a way to select some of my boards and keep them private. I did a quick survey with other designers, and without exception they all agreed that this would be an excellent feature. I’ve shared it in a comment post to Pinterest, and hope they take this suggestion under serious consideration. It’s the only thing holding me back from pinning lots of pictures and replacing my printed notebooks in the process.

  23. Beryn Hammil says:

    I just started on Pinterest, and as an Interior Designer I find that it’s a wonderful way to put idea books together to show to clients. However, I would love it if there could be a way to select some of my boards and keep them private. I did a quick survey with other designers, and without exception they all agreed that this would be an excellent feature. I’ve shared it in a comment post to Pinterest, and hope they take this suggestion under serious consideration. It’s the only thing holding me back from pinning lots of pictures and replacing my printed notebooks in the process.

  24. Sheena Rajan says:

    Good insight into Pinterest’s success! UX really is the key to getting engagement. It also helps that its an IMAGE sharing site, key factors to the success of Tumblr and other image sharing sites. I think that has something to do with how we interact with images on the web. I wrote a little about that here: http://sheenadangers.com/2012/01/whats-with-all-the-internet-eye-candy/

    Nevertheless, presenting those images in a beautiful and thought-out way has really made Pinterest take off in comparison to it’s predecessors Tumblr and Fab.com

  25. nicole says:

    As a non-techie & Pinterest fan, I enjoyed reading this article about the tech aspects of Pinterest…you’re so right about the infinite scrolling and I would love to learn more techie stuff to incorporate masonry style layout into a portfolio page.

    I did want to comment on the early adopters and setting the stage for Pinterest w/ amazing images. I first heard of Pinterest in May/June 2010 from a well known design blogger (SFGirlByBay). She and Pinterest had teamed up to create a “Pin It Forward” event whereby 300 bloggers signed up to create boards about “What Home Means to Me” and then divided the bloggers into 10 teams to write posts sharing their boards, pointing readers to their Pinterest page,and introducing another blogger who would be posting a Pinterest board the following day. So everyday for a month they had 30 bloggers writing about Pinterest, sharing their picks & directing readers to Pinterest. And because we all originated from a design blogger we knew & followed, the likelihood that quality, well styled images mattered to us was high and would therefore make it onto Pinterest.

    Pinterst created their own viral campaign just by hooking up w/ one well known blogger. One more reason they’re geniuses in my book. ;-)

  26. Ken says:

    A solid run through Pinterest’s design. Really enjoyed the article considering how it also educates us of some useful things like Masonry :)

  27. I love Pinterest for my own virtual pinboard of inspiration but have benefitted significantly from it… users “pin” my photos daily sending me a great deal of traffic. In fact, the photo of the V-neck in your pinterest collage above under “A Woman’s Touch”, is mine ;)

    See it here: http://www.lovemaegan.com/2012/01/pearl-encrusted-deep-v-t-shirt-diy.html

  28. Shannon says:

    I would love to see a series of this kind of analysis. It’s so helpful to have guidance in developing the skill to analyze why something works. Rather than blindly copying someone else’s design, I want to be able to understand the rationale behind their design choices, then see if it’s a design pattern that solves a problem worth solving.

  29. Litlit says:

    Thanks for a great article!!!
    As a non designer I really enjoyed every bit of it.

  30. TN Pas Cher says:

    ntly from it… users “pin” my photos daily sending me a great deal of traffic. I

  31. Fernando says:

    Wow, thanks for this comprehensive analysis of pinterest from a ux point of view. I would like to that another contributing factor to its success is the fact that all pinterest users get self validation without the need of friending or expanding their social network. This is something that facebook has been trying to do with their Subscribe feature.

Leave a Comment

Subscribe
Membership
About the Author