TaskSpotting is a Dubai-based app that pays consumers for completing tasks (like surveys, mystery shopping, retail audit) created by brands.
I was the only Designer on this project. I worked with Karim Ali, the CEO, and his product team.
Make the app easier to use, the experience less cumbersome, make the app feel lighter (look-and-feel), add new features based on demand.
The existing version had numerous usability issues, plus, since we needed to update the design language as well as change the structure, we decided to redesign the whole app. Since most of their user-base is on iPhones, we took an iOS-first approach and later adapted the designs for Android L.
- Re-evaluate the information architecture and navigation, especially in light of new feature-additions.
- For each section of the app, start with rough-sketching ideas, then redraw wireframes on paper, get them reviewed.
- Start exploring in Photoshop, get a few options reviewed, finalise one and iterate.
- Polish the screens and build interactions, prototypes where needed.
The first version of the app (before the redesign) was the MVP version. It had many major issues—the navigation was very confusing, the interface looked quite dark and heavy in places, the experience of completing a task involved unnecessary steps and was far from seamless, popups were used liberally.
Some screens from the old version
This was the first step of the process. The existing app used a hamburger menu for main navigation, which resulted in significantly low visibility for the various sections. Moreover, with the addition of several new features, the hamburger menu would have become too crowded.
Initially, I divided the app into five sections—missions, mission groups, completed missions, profile, and menu.
Initial sketches for the structure of the app. Click to enlarge.
Mapping the flow
But after deliberating more on what features should form the core of the product and which would be used most frequently, we combined missions & mission groups, and profile & menu, and settled on these four sections—Missions, My Missions, Rewards and Me.
On iOS this conveniently translated into four tabs at the bottom. But for Android I decided to keep the tabs for quickly swiping between list-view and map-view. Instead, main navigation was placed on the Action Bar.
For each section of the app, I would first sketch my ideas roughly, then redraw the flow and each screen clearly, these would then be reviewed with the Product team. After this I moved on to high-fidelity mockups and incorporated the feedback from the wireframes directly at the mockup stage.
Wireframes and notes
Wireframes for review for the five sections within ‘Me’ tab
Once at the mockup stage, I tried out different ideas quickly for each screen, got it reviewed, iterated, reviewed again and so on until the screen is polished.
Some pages from various designs sent for review
Some of the final mockups
Towards the end, I made a Marvel prototype to better see how all the flows came together.
This is a live embedded prototype. Try it out, click anywhere on the mockup to see what sections are linked.
Some screens used in this prototype went through further iteration.
Made a quick gif to show the transition between the splash screen and the login/signup screens
Adapting the iOS designs to Android wasn't very difficult once the navigation was finalised. I wish I could have some more time on this and come up with some delightful interactions, but the deadlines did not permit. Here's some of the final polished screens for Android:
Challenges & Learnings
Since the whole project was finished in six weeks, I really had to push myself at times. From the beginning, I had to create and follow a strict timeline where pecific number of days were allocated for each section. While we covered almost everything we wanted to, we sometimes had to compromise.
Eg., even though we went through several iterations for the mission card, I still feel it could have a better format with lesser cognitive load.
Some iterations of the mission card
I worked from Delhi and the client was based in Dubai. We relied completely on email, chat and Skype.
Because I couldn't explain my designs in person or sit with the developer, I learned to communicate very clearly through presentations, specs etc.
I wish I could have come in earlier in the process and stayed till launch. As such, I was not involved in the user-research and development stages.
If you're in the UAE, you can check out the iOS app on the AppStore. The Android app has not been updated with the redesign yet.