by Joe Pendlebury (@theuxchap)

Grabble — The Power of Simplicity in an App

Joe Pendlebury
THE UX CHAP
Published in
10 min readNov 10, 2017

--

Every now and again, you discover an app that’s been designed to serve a single purpose, but which does it brilliantly. Say hello to Grabble.

Grabble is the new kid on the block when it comes to mobile fashion commerce. Dubbed, the “Tinder for Fashion”, its concept is simple. Upon being presented with a product suggestion, swipe left to “Throw It” or swipe right to “Grab It”. Items that are “Grabbed”, are added to your “My Grabs” list. When you’re ready to make a purchase, you can buy it through Grabble. All they ask for, is a size selection (if applicable), e-mail address and mobile number. You then have the options to “Pay With Card” or use PayPal. It’s that straightforward.

Sign Up and User Onboarding

There are two ways to sign up to use Grabble — you can either connect to your Facebook account or sign up with e-mail. It’s refreshing to see that they’ve not overlooked the importance of providing a facility to sign up by e-mail, rather than assuming that:

  1. Everybody has a social account, or
  2. Those that have a social account, are happy to log in / connect using it.

My only frustration is the lack of an option to “Look Around”, before asking the user to make a conscious decision to sign up, like you can with JackThreads’ iPhone app.

The inspirational video that plays in the background could also have been better adapted to portray the features and functionality of the app, as an alternative to providing a “Look Around” option.

Once signed in, the onboarding process takes the shape of a 5-step, “Getting Started”-style wizard. I’m not a big fan of user onboarding, but in Grabble’s case, I found the information provided to be quite useful. That said, had it not been there, the core functionality would have been just as easily discoverable because of the simplicity and intuitive nature of the app’s design.

“Throw It” or “Grab It”? — The ‘Daily Finds’ Screen

For me, this is where the power of Grabble really shines.

The best way to picture this core functionality is to imagine a deck of cards, face-up. Each card consists of an image of the item of clothing, its seller, brand, price and an option to “Buy”.

If you don’t like the garment, you swipe it left and off the viewport, but if you do like it, you swipe it right instead. As you begin to swipe, a visual cue comes into view, which says either, “Throw it!” or “Grab it!”, depending on your direction of swipe. Each label is supported by an appropriate icon — either a cross or a heart. Items that you throw, are disregarded, never to be seen again, whereas those that you love, are added to a “My Grabs” section for you to review later.

Tapping the “Buy” CTA on a card will present you with a “Buy with Grabble” button, which upon tapping will take you to a “Purchase” screen, where you can complete your purchase. To me, the “Buy with Grabble” button seems like an extra, unnecessary step. I’ve already tapped the “Buy” button once, so why do I then need to tap the “Buy with Grabble” button thereafter?

The subtleties in the interaction design of the “Daily Finds” screen are excellent. Try gently moving a card around the viewport and watch how the other elements in the viewport react accordingly. The varying level of bounce applied when the card resets position after being pulled out and released, is one such small, but beautifully implemented touches. The timing and easing in/out of the “Throw it!” and “Grab it!” visual cues, based on where the card is being dragged to, and the speed at which it’s being dragged, is another great example of the refined level of elegance, Grabble’s designers have strived for. They’ve really put Disney’s 12 Principles of Animation to good use here and have admirably applied some of those principles, not only to this screen but throughout other areas of the app too.

It’s also worth noting that it’s very easy to lose track of time when swiping through the suggestions on show. When you’re “in the zone” so-to-speak, it’s very hard to stop — not a bad thing from Grabble’s perspective, as that’s exactly what they want their users to do, so I applaud them for finding a way to introduce this high level of engagement — it’s addictive!

The ‘Inspiration’ Screen

All of the fashion items featured on Grabble are carefully hand-picked by their stylists. To support this, they offer an “Inspiration” section, which is their take on an editorial lookbook in many respects. It’s an opportunity for their stylists to provide advice on fashion styling tips, new trends, and even help bring to the forefront, brands you may not have previously heard of.

I’m very much into streetwear and urban clothing (The Hundreds, Stussy, Zoo ICE CREAM, Zoo York, Vans, Obey, etc.), so for me, this section of the app doesn’t add a lot of value to my overall experience, as the guides I’ve come across are very much tailored towards the more fashion-conscious among us, who have a much smarter-style of dress sense. On the whole, I’m sure the majority of Grabble’s target demographic, would find this section useful.

The integration of the fashion items into these inspirational guides means that you can “Grab” an item and add it to your “My Grabs” area, simply by tapping the heart on the embedded card. In doing so, you’re presented with a message acknowledging your action, advising to go to your “My Grabs” area to find that item again later. Another small, but nice touch.

Another beautiful implementation is that of the parallax scrolling, which initially knocks the app’s global header out of view, followed by the lead image featured at the top of the inspirational guide. It helps focus on the task of reading the article, by making maximum use of the space available in the viewport. The incorporation of a “sticky”, full-width, back to top-style CTA is also a useful usability enhancement.

The ‘My Grabs’ Screen

On arriving at this screen, you’re initially presented with all of the items you have previously “grabbed”. The cards are presented in a two-column layout, with each card comprising of the product image, its seller and price. A “Close” CTA is also incorporated into each card, which on tap, presents a prompt asking you to confirm you want to remove the item from your “grabs”.

Like with all of the screens we’ve seen so far, this one is equally as stunning in its design and layout. The level of detail on each card is minimal, but there’s just enough there for the user to make an informed purchasing decision.

The standout feature here for me is the filter design, which takes the shape of a scrollable horizontal menu that disappears off the right-hand edge of the viewport. The menu options represent product categories, like Accessories, Bags, Bottoms, Outerwear, and so on. Swiping across the menu in a right-to-left fashion will bring additional product categories into view, which by default, were hidden off-canvas. Tapping one of the menu options will refine the cards accordingly to only show products belonging to that chosen category. It’s a great initiative, which I haven’t previously seen in any other fashion, or other-such retail apps that offer wish list/favourites functionality.

Tapping one of your “grabs” will expand the card to fill the viewport — again, some excellent animation techniques to be seen here, with the card transitioning into full view from the angle and direction at which the card was previously positioned in the viewport when it was initially tapped.

The ‘Purchase’ Screen

The “Purchase” Screen is where you select the size of the clothing item you wish to purchase (if applicable), as well as supply your e-mail address and contact number. You can then select whether to “Pay With Card” (and go through additional checkout steps) or use PayPal. The option to pay via PayPal is a very convenient method of payment, as it takes the pain out of having to manually input your delivery address, payment details, etc. It also helps alleviate any concerns regarding the security of Grabble’s checkout process — not that there are any.

Just beneath these two payment option CTAs, you’ll find clear and concise messaging, advising that your order will be sent directly by the retailer/seller and that card payment will be processed by Stripe. Stripe offer a very nice checkout UI. Their form design is beautiful, so another thumbs up from me.

Interestingly, Grabble cover all delivery costs — yup, Free Delivery on everything (not sure how long that’ll last though) — often meaning you can get your fashion fix cheaper here than if you were to buy directly from the retailer. I’d be surprised if Martin Lewis (of MoneySavingExpert.com) hasn’t already cottoned onto this.

Any Areas for Improvement? Yes. The Relevance of Its Suggestions & Recommendations

Grabble succeed on so many levels with the design of their app and the functionality it offers. There’s so little to fault, with the exception of one, niggling thing, that’s preventing me from wanting to use it more than I am at present — the relevance of the suggestions/recommendations it serves.

I’m not going to be too critical, as I fully appreciate the app is still very much in its infancy (currently, iPhone v2.1.1); however, in an app like this, I expect the fashion items served to me, would be better-tailored to my personal style, based on the intelligence gained from the clothing items I have already “grabbed”, and the data collected from other users, who have grabbed similar items.

If, for example, the “My Grabs” area mainly comprises of graphic print tees, garments from a particular brand(s), or items within a specific price range, show me a higher ratio of items on the “Daily Finds” screen that match that criteria or that can be styled with those items. In doing so, I’m much more likely to “grab” them and perhaps then buy them. Personally, I’m not interested in seeing suggestions or recommendations for high-end and luxury products, if most of the products in the “My Grabs” area are primarily priced between £10 and £40.

Over time, as more individuals download and use the app, I’m sure Grabble will have the intelligence and data to cater for the above. Personalisation is the key ingredient that’s missing for this to arguably be considered a real game-changer in the way we currently go about shopping online.

That said, when you think about how long the likes of Netflix and Spotify have been around now, they still haven’t yet mastered the fine art of recommending TV shows, films and music, that may be of interest, based on your viewing and listening habits, so it’s important to put that into perspective — especially considering Grabble have a much smaller team in comparison.

Conclusion

It’s immediately clear that in the design and development of their app, Grabble have primarily focused on delivering an exceptional experience, to cater for just a couple of key tasks. In doing so, they’ve built a great foundation (and a four-star, award-winning app) to enhance that experience further still. In my opinion, they’ve also found a halfway-house solution to a common problem when shopping on a mobile device — real-world distractions. The way in which Grabble has been designed helps make it easy to pick up where you last left off in the app. Regardless of how little time you have spare, it’s a quick, convenient app to browse for inspiration and shop from.

So many apps fall foul of trying to incorporate too much into their initial releases, too soon, thereby often resulting in the poor delivery and execution of lots of features. This, in turn, can lead to a poor App Store rating, negative reviews and a high-level of uninstalls, which can often be hard to recover from. It’s that dreaded spiral of decline.

First impressions count — offering fewer features of a higher quality, often results in a better user experience and higher levels of user engagement, than delivering lots of features of a poorer quality. For startups thinking about designing a new app, look to Grabble as a success story, and consider adopting a Minimum Viable Product (MVP) approach.

Download Grabble’s iPhone app from the App Store

Originally written and published to www.uxchap.com on July 25th 2015, by Joe Pendlebury.

One Last Thing…

If you liked this article, please applaud it 👏 and share it with your friends, work colleagues and followers. Remember, you can clap up to 50 times — it makes a big difference for me in helping to focus my writing on what you guys enjoy reading the most.

You’re also welcome to follow me on Medium, on Twitter, or even connect with me on LinkedIn. Thank you for your support! 😊

--

--

Joe Pendlebury
THE UX CHAP

E-Commerce UX Maverick | 18+ Years Optimising UX | Saved UK's Largest Fashion & Homeware Retailer from £135m+ "Burger Menu" Mishap | Innovate, Don't Imitate 🔮