Company: Enigma | Timeline: 2019-2022 | Role: Lead Product Designer | Information architecture, user flow, visual design, and interaction design and developer hand-off

Enigma API Console is a powerful web-based self-serve dashboard that enables Enigma’s data evaluators/API developer users to easily explore Enigma's extensive data offerings via APIs without the need for coding. As the lead product designer for Console, I worked on the design of all of Console features from the ground up.

Since its initial launch in 2019, we have continuously evolved and refined the platform in collaboration with a highly talented team of front-end and back-end developers and PMs, employing two-week sprint cycles to ensure that Console remains at the cutting edge of API dashboard design. Over a period of two years, I have led the design of Console and designed a range of developer experience features. Enigma Console was built over time by amazing collaboration of many talented colleagues including myself. On each phase of Enigma console, I worked with different teams to level up console user experiences as a lead designer.

Enigma API Console Features

The UX features of Console include Sign In/Sign Up, Home Overview, Navigation menu, Product icons, Onboarding, User Profile, Org Setting and Permissions, User Invitation, Billing and Usage, Quick Start, CSV Upload Business Lookup, and Business Profile.

This wide range of features caters to the needs of diverse users, with data evaluators and business risk analysts being the primary users who can evaluate our data and API before making data purchase decisions or usage-based contracts. Developers who integrate Enigma's businesses API with their data workflow or applications are secondary users, while our internal GTM and sales team use Console features as a demo for prospects and customers.

Console's account management level features enable users to view their organization's dashboard, grab the API public/secret key, monitor API usage, check monthly billing, and configure their settings and team members.

The API/data evaluation features like Quick Start, CSV Upload, and Business Lookup allow users to conduct a thorough test of Enigma's data quality and data types. They can also explore Enigma's small business economy data in customized reports and profiles of each business they search on Console.

Onboarding Prompt

When users first sign in to the enigma dashboard, they are taken through our onboarding prompt which explains and demonstrates the core functionality and value proposition of the API dashboard experience. Users can have a first-look tour via an onboarding modal showcasing each features (home, quick start, batch upload, billing and usage) along with tooltip guides that point to the location of each feature.

API usage monitoring

I designed the end-to-end UX/UI of this billing feature by working closely with the product manager to figure out our pricing strategy and feature prioritization, as well as with back-end and front-end engineers to ensure that it worked well between our back-end payment processing technology and the front-end user experience.

API Quick Start

Quick Start is a streamlined and interactive API call sandbox designed for developer users to easily test and familiarize themselves with our API and available data attributes. Through the Quick Start feature, users can effortlessly make test API requests by entering a company's name, address, or associated people.

Additionally, users have the option to view premium attributes that offer more in-depth information about the companies they're searching for. Results are displayed in a user-friendly JSON format that can be easily viewed in the code terminal UI.

User Story 1: As a new Console developer user, I want to be able to try different API endpoints and make a test API call. I expect the Console to guide me on how to structure an API request and how to request specific datasets so that I can preview the data attributes I'm interested in.

I want to have access to step-by-step instructions while trying out the interactive API call, including guidance on how to structure an API request for integration and each endpoint, such as the ID and Match endpoints.

User Story 3: I get the data attributes about the business that I looked up and also JSON response of the data.

With the Enigma ID of each business, I can look up the same information with a short cut.

Data Batch Upload

Data Batch Upload is a feature that allows users to submit a CSV file containing a list of businesses they wish to enrich with Enigma's data. Working closely with the design team, we designed a streamlined workflow that guides customers through the process of uploading their CSV file, setting parameters, and selecting premium data attributes they require. Once uploaded, users can easily monitor the status of the batch processing and ultimately download the enriched datasets. This feature has proved to be a valuable tool for our customers, simplifying the data enrichment process and helping to improve their data-driven decision making. I especially contributed to enhance the visual design of the feature by custom design icons and UI components to make the process more intuitive and delightful.

User Permission and Organization Account Management

Users of the console are able to handle their organizational accounts and user permissions.

• Administrators and higher-level users are permitted to invite additional users to join their organization.

• Members of the organization can view their team members through the user interface and identify which members are authorized to execute certain actions.

• Admin+ users have the authority to modify the permissions or access levels of members in the organization, such as converting View Only users.

• The owner is capable of modifying the organization's name, settings, or removing the organization altogether, and can also transfer ownership.

Enigma Docs

As a data product company that provides APIs to integrate datasets into customer’s workflow, providing a well-guided 'Developer Documentation' experience is essential for our developer users who use our APIs. In addition, we aimed to update the visual design styles to match Enigma's new website design. To update documentation seamlessly, we used ReadMe CMS.

For the initial and re-launch of the Enigma developer hub, I oversaw the development of the site from the ground up. This included creating the sitemap, information architecture, UI/UX design, user testing, and final implementation using our ReadMe CMS. To define the initial IA and content, I collaborated with our PM, VP of Product Design, and other engineers. We also conducted user tests with engineers throughout the design process to ensure the overall experience and test if they could easily make their first API call.

The new docs site received a lot of positive feedback for its increased usability and readability. In fact, 100% of the engineers we interviewed were able to find what they were looking for and make a first API call. I enhanced the user experience of the doc site over time using HTML/CSS/markup language for content stylings and using ReadMe CMS platform whenever we get user feedback.

Designing Info Architecture

Designing UI Components for Docs

UI Visual Design

Interactive API Features

Attribute Dictionary