rethinking a mobile UX

Quibb is an indispensible news resource. Every day, Quibb members post news and articles that they’re reading to share with the rest of the community. I use Quibb every morning to get my daily dose of important news, but not through the website. I use the mobile app on my phone. All is well and good, except that the original mobile app didn't show everything that website had to offer. What follows is a small, focused redesign I did of the original Quibb app to help solve this problem of not having access to all of Quibb. Enjoy!

project goals

  1. Let Quibb members access all of Quibb in the mobile app.
  2. Keep the UI simple.
  3. Focus on content

roles and responsibilities

the process

The main problem I was attempting to address was about bringing feature parity to the app. The original app was created long ago and wasn’t kept up-to-date. Mobile app experiences are as much a part of your brand as your company site, so it was definitely time to consider an app refresh.

For the main screen, the idea was to give users access to the main tabs in Quibb. When I do use the site, I prefer seeing the “All” tab, the part of the site that shows all the content posted by Quibb members. But after talking with Sandi MacPherson, Quibb’s founder, there were many more use cases to account for beyond my own.

Quibb is known for having a very austere visual presentation. Mainly black and white with almost no use of color. Here, I stayed consistent with the minimal color palette. I changed the app header to allow for the ability to change categories. As the user swipes left, they can see the other categories on the website, “Popular”, and “All”. Also, by moving the member portraits to the right, there is a greater feeling of emphasis on the news stories themselves, as opposed to the person that shared it.

Once the user taps an article, the page pans to the left and reveals the article beneath the main screen. As with the prior page, moving the member information below the article keeps the focus on content. The main controls for this page are vastly simplified to just likes and replying with comments. To go back, the user drags to the right to pull the main screen back from the left side of the screen.

To interact with comments, the user drags the comment to the left revealing additional controls for “Like”, “Reply”, and “View Profile”. Drag the comment to the right or just tap the comment to close.

Tapping the headline of the article will slide the detail page to the left and open the article. The Quibb toolbar is still there, allowing users to either go back to the previous page, or open the article in the user’s default browser. The icons here, are simplified and adhere to Quibb’s minimalist style.

conclusions and take-aways

While these mockups weren’t directly what the app has become, they did help form the basis for the new design of the Quibb app. I met up with Sandi a few more times to discuss changes and provide feedback on the app design, and eventually a new app was released! …and I even got a couple of shoutouts!

Quibb for iOS on Product Hunt

A writeup of the new Quibb for iOS

All told, while it would have been nice to have seen my version of the design come to fruition, helping influence the direction of the new product was still a great experience!