UX Case-Study Episode 1: A feature long craved for by hardware engineers

Van Mai
6 min readAug 28, 2020

--

How I entered the UX world by taking on one the toughest challenges in the electronics industry: giving a brand-new touch on solving the inefficiency of the traditional manual, time-consuming part comparison process involving Technical Datasheets (DS).

Introduction

To many people, the electronics industry seems like a strict, rigid, standardized industry, with little room for creativity like an app or a website. At least that was what I have been conceptualizing about many hardware engineering industries so far. However, one amazing project that I landed the chance to work on has completely changed such concept of mine.

The project I am talking about is the university project studies with Luminovo GmbH- an AI product company that has just made a strategic transition from an AI-consulting service to a product company. Due to this core transition, what we are doing with our project has a strategic significance to the company.

Goals

Our project team aims to create a simpler, seamless solution that incorporates the best practices of the electronics industry for hardware engineers to enjoy the new level of convenience in their daily work with technical DS. Since technical DS is our focus, we will only tackle the problems that are primarily associated with these documents.
In order to do this, we decided to operate as a small Scrum team, developing fast-paced prototypes throughout continuous Sprints or iterations. I play the role of both an UX Researcher/Designer and a Product Owner by leading the team.

User pain points

Learning from the failure stories of many companies as well as venture projects, during the first two weeks, we did nothing related to designing. If you have read or have heard of “The Mom Test”, I bet you would know what I’m talking about. Talking to users, listening to them carefully. Yes! We spent the full fortnight interviewing nearly 20 potential users, who were hardware engineers working in different positions in various companies. Below is the summary graph illustrating a collection of their pains that we identified after conducting a thorough analysis:

Pain points capture — Analytics Summary

Out of the above list, we handpicked the three most critical pain points which were repeated with the highest frequencies and strongly related to technical DS to tackle:

  • Inconsistent structure of technical DS issued by different manufacturers (even in the case of similar or identical components)
  • Time-consuming with reading and skimming for the correct information
  • Important relevant information not easily found in technical DS

User persona

Through the above findings, I identified a core persona whose key attributes are defined as follows:

User persona

Key suggested solutions

We derived Engina- a web application solution to address the above main frustrations. Note here the reason why we chose to go with a browser-based desktop application rather than a mobile app: all our users significantly prefer a software or a program that they can perform heavy tasks on on a big screen, furthermore most of the times they don’t have the need to touch this software while they are on the move.

Engina Web Application — Login landing page
  1. Simpler flow to extract relevant information out of technical DS to a convenient comparison table/matrix
    So far, engineers in almost all cases have to read, skim and search for relevant information in a DS file manually, using only the most basic Ctrl+F key combination, then also have to type down a comparison of the crucial parameters (for example, minimum and maximum operating voltages, etc.) over all alternative components manually. Needless to say, this process is consuming a considerable amount of working time of engineers.
    Engina is ambitious to solve this by introducing an AI-powered feature that automatically extracts, reads and produces a neat comparison table which transforms the unstructured, lengthy texts that are selected by the user into a significantly neater and more presentable format. With such a tabular format, it is also remarkably more convenient to perform comparison in terms of certain criteria across multiple technical DS. Moreover, the user can perform this feature with the most intuitive actions within only minimum clicks:
    - drag to select paragraph of desired information
    - then click on a button of desired action or right click to choose from a menu of actions.
    For example, suppose an engineer, after filtering out several preliminary filters, wishes to extract some information/parameters in the technical DS of microcontroller from Infineon Technologies AG for the purpose of comparing these information/parameters across different alternatives. Below is the landing page after the engineer has filtered out preliminary filters.
Overview of all technical DS after filtering all parameters (primary filter), which will be used for comparison in terms of parameters

He will then normally start with viewing, reading and extracting the information that he is looking for from the very first technical DS.

Step 1: Select the desired technical DS

Step 1

Assume page 7 of the above DS contains the information about On-chip memories, which our engineer is interested in.

Step 2: Select section/paragraph of desired information by mouse dragging

Step 2

Step 3: Click on the “Extract To Matrix button” or Right click in the selected area and choose “Extract To Matrix” option from a menu of actions

Step 3

Alternatively, user can click on the button “Extract To Matrix” on the top-bar menu in order to perform the same action. According to our user testing so far, although some users could quickly and correctly saw this button to click on, this alternative action has been, however, not as intuitive as the right-click action. Thus we decided to design both ways to perform this action.

Step 4: As a result, the selected information is extracted and automatically displayed in a considerably neater and more presentable tabular format as a Matrix, which allows for comparing parameters across alternatives to “microcontrollers” component in a faster, easier way

Step 4

The user has the option to choose from a set of equivalent names for the extracted parameters, which brings extreme value to the hardware engineer since currently there is hardly any standardization in technical DS from different manufacturers. Additionally, the user can also delete a parameter completely if he/she is no longer interested in it.
Moreover, there are also a number of options for the whole Comparison Matrix:
- Export to an external format, which proves to be extremely valuable to the documentation process, since currently this time-consuming process is being manually done in most cases by the engineer
- Save into the library, or the database of our application

The main process of extracting certain parameters from the very first technical DS in the search & filter landing page is illustrated in the first GIF below:

In order to move on to the next DS to continue with extracting necessary parameters for comparison, the user can conveniently click on the “>” symbol to move on to the next DS window, without having to click outside to exit the current DS window and repeat the whole procedure again. The Comparison Matrix will then be updated automatically with a new row for the new part/component. This is illustrated in the second GIF below:

The Figma link to the whole prototype can be found here: https://www.figma.com/proto/B1RHDPpGORiKsh3UhWR8CC/Engina-WebApp-Luminovo?node-id=113%3A371&scaling=scale-down

(to be continued…)

--

--

Van Mai
Van Mai

Written by Van Mai

Product Owner, Product Manager, UX Researcher, UX Designer. And a burning startup soul, with determination to move mountains & excellent ability to pivot

No responses yet