<p>Published on <a href="http://ift.tt/2s2AXDv">| Prototyping: From UX to Front End &mdash; Medium</a> CanvasFlip <img alt="" src="http://ift.tt/2sMKPhC"></p>
<h4>“Browse before search” approach in Pinterest. Is it the right way?</h4>
<p>It’s an interesting question I asked myself while I was browsing on Pinterest a few weeks back at bedtime — Why on earth am I browsing on Pinterest or scrolling through infinite long lists to find something when typing into a search box is so much more efficient? Well… Maybe because I was too lazy to type anything or maybe because I didn’t know what exactly I was looking for.</p>
<p>As a designers, I often wonder, whether you should build interfaces that support the lazy and confused approach of users or should you steer users directly to a search box? I feel, it primarily depends on the kind of application one is designing.</p>
<p>Pinterest chooses browsing before searching approach. And usability analysis data confirm that it is best for their business and user persona.</p>
<h3>Objective of the test</h3>
<p>Understand the general behaviour of users on Pinterest android app — Does browsing before searching works well for Pinterest or should they promote searching primarily within the app.</p>
<h3>Understanding Pinterest, as a company</h3>
<p>Pinterest is the world’s catalog of ideas. It helps you discover ideas you love — what to make for dinner, what to put on your walls, what to wear and more ideas for every part of your life. It also allows to search for an idea even if you don’t know what it’s called — built-in search guides help point your search in the right direction.</p>
<h3>A Typical user of Pinterest</h3>
<p>Prior to conducting usability tests, I developed a user persona to better understand the target users of Pinterest’s android app. This process helped me get into the mindset of the users, thinking in terms of their contexts, needs, and goals</p>
<p>So meet Michelle!</p>
<p><img alt="" src="http://ift.tt/2s1Of38">A user persona of Pinterest</p>
<p>In addition to this, since the prototype was made for a specific set of interests selected during on-boarding, I made sure that the users I share the prototype with had similar interests.</p>
<h3>Which approach is Pinterest following?</h3>
<p>Certainly, “browse before search.”</p>
<p><img alt="" src="http://ift.tt/2sMuauI">Increasing sizes of search box from left to right</p>
<p>Comparing the three screenshots above, we know for sure that the attention expected on “search” is quite different for all three. This is where we can compare the priorities of the app. Where Google gives a wide hero search box, Amazon shares the full length space with “Shop by Category” navigation. On the other hand, when we are talking about Pinterest, it has its search hidden behind a click.</p>
<p>Is the size of search box in each of these apps indicative of the priority allocated to search action? I believe so. Let’s see…</p>
<h3>Tools used for the test</h3>
<ol>
<li>I used Sketch app for minor editing in the screenshots and for the images.</li>
<li><a href="http://ift.tt/2o2YXTn">CanvasFlip</a> for creating the prototype and setting up the task based usability testing.</li>
<li><a href="http://ift.tt/ZDZDsZ">Typeform</a> for the survey.</li>
</ol>
<h3>Prototype</h3>
<p>You might want to experience the prototype I tested on. Open this prototype in a new tab to try it out.</p>
<p><a href="http://ift.tt/2s28765"><strong>Pinterest prototype — Existing interface</strong></a></p>
<p><a href="http://ift.tt/2s28765"><img alt="" src="http://ift.tt/2sMub1K"></a></p>
<p><a href="http://ift.tt/2s1VurD"><strong>Modified Pinterest prototype — Search bar wide open</strong></a></p>
<p><a href="http://ift.tt/2s1VurD"><img alt="" src="http://ift.tt/2sMheVF"></a></p>
<h3>Task scenario</h3>
<p><strong>Scenario</strong> : <em>It’s a lazy Sunday and you are totally in mood to explore latest fashion trends, dressing up, food recipes etc. You have an app that has amazing inspirations. What will you do on the app?</em></p>
<p><strong>Task</strong> : <em>Spend few minutes on the app and explore stuff in your interest domain.</em></p>
<h3>Usability testing</h3>
<h4>Does browsing before searching approach work for Pinterest?</h4>
<p>Yes it does work.</p>
<p>As it turns out from the user experience insights users on Pinterest app prototypes, users are mostly interested in scrolling and browsing through the options. Here is the heat map of the Pinterest prototype —</p>
<p><img alt="" src="http://ift.tt/2s29pxO">Interaction heat map of the prototype</p>
<h4>What do the users do in the first 30 secs on the prototype?</h4>
<p>Here is one of the session replay of users on the prototype. Users have opted for browsing instead of searching initially.</p>
<p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2FLwEvDz5i8mY%3Ffeature%3Doembed&amp;url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DLwEvDz5i8mY&#038;image=https%3A%2F%2Fi.ytimg.com%2Fvi%2FLwEvDz5i8mY%2Fhqdefault.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=youtube" width="640" height="480" frameborder="0"><a href="http://ift.tt/2sMAaU9">http://ift.tt/2sMAaU9</a></iframe></p>
<p><em>Problem the Pinterest app interface solves</em> — Pinterest has solved the problem of discovery on the web. And it HAS been a problem for a while. Let’s say you want to buy a gift for your mother. Nothing specific, just something nice. A search for “nice Mother’s Day gift” on Google — or even “very special, very expensive Mother’s Day gift” — isn’t going to be much help. Google depends on finely tuned queries in order to yield useful results.</p>
<h4>Why browsing before searching is successful for Pinterest-like apps?</h4>
<p>Although people weren’t used to scrolling in the mid-nineties, nowadays it’s absolutely natural to scroll.</p>
<p>When you use scrolling as your prime method of exploring the data, it makes the user stay longer on your web page, and so increase engagement. Infinite scrolling offers an efficient way to browse that ocean of information, without having to wait for pages to preload.</p>
<h3>Over to you</h3>
<p>What do you think about browsing and searching of Pinterest? I’d love to know your thoughts. Use the comments section below.</p>
<p>P.S. — If you liked the user experience data used in this experiment, give <a href="http://ift.tt/2s25l0A">CanvasFlip </a>a shot and try the same on your app!</p>
<p><a href="http://ift.tt/2gjId84"><img alt="" src="http://ift.tt/2s8Pt8O"></a><img src="http://ift.tt/2sMAbaF" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou"></p>
<hr>
<p><a href="http://ift.tt/2s23qJu">Pinterest — A usability case study</a> was originally published in <a href="http://ift.tt/2cAqCpx">prototypr</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Pinterest — A usability case study

“Browse before search” approach in Pinterest. Is it the right way?

Top Stories