Supahands DataMiner

UI/UX



Data miner is a web application which was developed to assist Project Managers to manage and distribute thousands of data mining tasks to remote workers. On the other hand, our remote workers (SupaAgents) will visit this page daily to execute microtasks and earn side income.
















Background

Supahands' Data Miner is an application used by two users, internal Project Managers and remote workers (SupaAgents). The team moves very quickly to solve problems related to operations scalability and efficiency.

General Problem: Our operations are getting bigger and the number of micro-tasks are increasing rapidly. Project managers simply do not have the time to QC every tasks completed by SupaAgents anymore. As the number of tasks increases, datelines are becoming harder to meet. What can we do to assist both Project Managers and SupaAgents to work faster and more efficiently thus increasing company's project capacity and revenue?

Current Team:

  • Me (UI/UX + Minor Dev)
  • Isaac (Product Manager)
  • Yeong (Dev)
  • Chinmay (Dev)
  • Tools: Sketch App, Marvel App, Adobe Illustrator

    UX Scope:The first version was just an experiment to move away from Google Sheets, it was not built for best user experience as there were not enough resources. However, it does not take long for us to realize that this product have a massive impact to the business. My mission was to revisit the product to make sure that it provides the best user experience for Project Managers and SupaAgents to work efficiently at scale.






    Process

    1. Analysis
    Since I was not a part of the initial team who work on this product, my knowledge regarding the full functionality of the system was quite limited. I've only worked on ad-hoc features which does not necessarily require me to know every functionality.

    So the first thing I did was to map out all current user actions on Data Miner. This will also help me to evaluate the structure of the product. Do we currently have the best user flow structure? Did all the user actions grouped properly since most them were built on an ad-hoc basis?

    Figure 1: Example of user actions on Data Miner








    Figure 2: Current Project Manager's main user flow








    As you would imagine, the list goes on and on and on...

    The next thing that I did was to conduct user testings with both users. I've prepared a set of questions for both users before conducting the interview. By preparing these questions, I can gather a more structured feedback, answers within the same context and it'll also work as meeting agenda for a more productive user interview sessions.

    User testing questions for Project Managers:

    1. What were your goals when you started using Data Miner? Did Data Miner meet your expectations related to these goals?
    2. What are the most frequent tasks you do using Data Miner? Explain how you do these tasks (step by step).
    3. When you are using Data Miner, do you find anything frustrating that you wish was easier/different?
    4. Is there anything that you wish Data Miner allowed you to do that it doesn’t allow now?
    5. What comes to mind when you think about Data Miner (how would you describe it to a friend)?
    6. What do you like the most/least about Data Miner?



    User testing questions for SupaAgents:

    1. How well does Data Miner meet your expectations in terms of helping you get the required task done? (Rate from 1 to 5)
      • - Does not meet my expectations at all
      • - Totally meets all my expectations
    2. What do you find frustrating when using Data Miner? (Please select all that apply.)
      • - Fonts are too small.
      • - Input boxes take too much space.
      • - Hard to read the labels of the input boxes.
      • - Action buttons are not clear enough (e.g. Save, Exit etc.).
      • - Opening/Closing the "instructions" window.
      • - Hard to view embedded image or website (if applicable).
      • - Insufficient error messages (Nothing happens when an error occurs, it would be better if an error message pops up).
      • - Input boxes are too small.
      • - Others, please specify...
    3. What additional features would you like to see on Data Miner? (Please select all that apply.) *
      • - Enable working on mobile.
      • - Enable keyboard shortcuts (e.g. for viewing the instructions, next task, etc.).
      • - Show number of tasks completed in real-time.
      • - Display time spent.
      • - Others, please specify...
    4. Have you used a similar product outside of Supahands?
      • - Yes (if yes, How would you rank Data Miner compared to the other product you used? State why...)
      • - No
    5. How would you describe Data Miner to a friend?



    It is important to note that I have always been working closely with the SupaAgents support team so I'm already aware about the common UX complaints by SupaAgents.

    There is also a process gap here, since we didn't have enough resources, I opted out to send questionnaires through email to SupaAgents. This is not the best way to gather user feedback. I would prefer doing 1-to-1 user interview sessions.

    2. Design
    I ran through all the user testing results and summarized it. Here are the some of the highlights;

    Feedbacks from Project Managers

    1. Yes data miner meets their goals and expectations.
    2. Need to make it easy to understand/use.
    3. Main actions are QC-ing Agents Work, Export Data, Import Data, Create/edit fields.
    4. Label fonts are too small and not readable.
    5. Show instruction is blocking user activity.
    6. Need to show agent name while QC-ing.
    7. Add bulk edit feature.
    8. Creating field is frustrating.
    9. Add Live view when creating fields.
    10. Show summary of QC results.
    11. Stop SA access when they are removed from projects.



    Feedbacks from SupaAgents

    1. Data miner meets their goals and expectations, it is way better than using Google Sheets.
    2. It has a very simple user interface.
    3. Label fonts are too small and not readable.
    4. Opening and closing instructions are frustrating.
    5. 32.3% said that it is hard to view embedded image or website.
    6. 35% said there are insufficient error messages.
    7. Input boxes takes too much space.
    8. Need to show how many tasks have been completed in real-time.
    9. 80% of users have never used similar product.
    10. 60% ranked Data miner higher than other products.



    Based on these feedbacks, I mocked-up a lo-fi wireframe of Data Miner. I prefer lo-fi wireframe because I don't want the users to be distracted by the colors or aesthetics of the design. I would like them to focus on adressing the core UX problem first.



    Figure 3: Lo-fi Wireframe screens on Sketch App








    As you can see, I came up with various versions for each pages. This is a very time-consuming process because Data Miner is a very complex system. However, it is extremely important since I have a lot of theories and I would like it to be validated through user testings. Most of the time, the first idea that came to my mind isn't necessarily the optimum solution.

    Since I am using User-centered Design (UCD) approach, I broke down my design tasks by pages and every time I finished designing for each pages, I will conduct 1-to-1 user testings. I will iterate my design if necessary and I will come back to the users to see if their problems were solved. Only then will I polish the design and create a Hi-fi mockup.



    Figure 4: Hi-fi wireframe screens on Sketch App








    3. Evaluation
    As mentioned previously, I'm using User-centered Design (UCD) workflow to design this product. Meaning, the Evaluation stage and the Design stage goes hand in hand. It's not a Waterfall workflow, so I will conduct user interview sessions everytime I come up with a design solution. By involving the users at every step of the process, the probability of solving the right solution is higher.

    I'll break the design into smaller bits and evaluate it qualitatively with the users. Once all the granular design decisions have been evaluated, I will do another round of testing with all the pieces combined together.

    I'm using Think-aloud methodology where I will ask participants to verbalize their thoughts while performing a task. Such methods provide a basis for investigating the mental processes underlying complex task performance and can provide rich data on such cognitive processes.

    Unfortunately, I have not conducted a Qualitative evaluation on this project yet. Usually I will use event tracking softwares like Amplitude, Hotjar and Google Analytics to capture these valuable user behaviours.

    4. Implementation
    Wooho! Finally. I'm currently using Marvel App as the hand over tool. I prefer this over InVision because it is simple and it gets the job done for me. I'm using their new amazing feature called Handoff for developers.

    Figure 5: Demo of Marvel's Handoff feature.



    “Never hand over source files without a conversation. It might seem unnecessary, but assuming everyone understands without explanation isn’t worth the risk when explaining a design is such a simple thing to do”

    Next thing I did was to include design tasks in Tech's development to-do list. Other than helping the team plan for resources allocation, it'll give me visibility so that I know I'm not blocking anyone from building the product. Most importantly, I'll make sure that all assets are accessible by developers. Before development starts, I will do a product walkthrough with the development team, making sure I'm explaining all the user flows.

    The End.















    CONCLUSION

    Currently, we are still building this design by stages. Supahands Data Miner have a massive impact on Supahands' business, it helped us process thousands of data daily with a breeze. Every quarter new features are pushed out to satisfy client's needs. We have successfully delivered to big companies like Uber, Ibotta and Rakuten to name a few.

    It is my duty to also make sure that this product satisfy our user needs, especially our main workforce (SupaAgents) that are scattered across Southeast Asia.