Sebastian Maulbec (Product Owner)
Andreu Sallés (UI / UX)
This project consists in a product for a company that does Crowd-Based Market Research via Smartphone. The idea is to have a web platform that creates and manages forms to be sent to a crowd.
The crowd receives these orders on their mobile phone. By filling these forms/surveys they earn money.
Once the user survey or the form is completed, the data is sent back to the backoffice where it gets validated by QA operators. This system provides high-quality insights almost in real time, reducing drastically the traditional tempos in market research.
The backoffice was already functional when I started working on the project. The goals were to rethink the UX by making it more intuitive while including new features and to improve the existing UI.
Note: This is a real project for a real company, but the brand has been removed for the Case Study.
I started with user interviews. There are different roles in the company and each role uses the platform in a completely different way.
I carried out interviews with several people from each department to understand their needs and to spot problems in the workflow. In these interviews, we realized most of the concerns were related to productivity.
To decide the order of the Backoffice menu, we combined two UX methods: user interviews and a card sorting game.
As a QA (Quality Assurance) operator, I want to quickly review the user submissions, so I can finish my tasks faster.
As a CIM operator, I want to use an intuitive menu, so I can access the important sections from everywhere.
As an operator, I want to load templates, so I can create forms faster.
Mockup and Prototype
I created the mock-ups using Sketch and several plugins to simplify the workflow (Library, Rename Layers and Symbol Organizer).
I prepared the prototype directly in Sketch using the plugin Sync + Prototype from InVision (Craft). This was very helpful when we needed design changes in future iterations.
Usability Tests (+ iterate)
We carried out several tests with different kinds of users. The tests helped notice flaws in the design. After each test, we reviewed the results and rethought the user flows. Then I prepared a new prototype to test it again, to assure a smooth UX.
The company works in Agile methodology combined with Google Design Sprints.
The icons were exported in svg and png following the developer’s instructions. The screens were uploaded in Zeplin and also in Invision, so that the developer can have a better understanding of the user flows. Finally, I recreated the different animations in Principle.