Project 2
Company: Autonomic
Teams: UI team
Duration: 6 months for initial launch, with continuous updates
Target devices: desktop and tablet
Role: UX and Visual Design
What is the developer portal?
The Developer Portal is a collection of references, tutorials, and examples. It is built to help first-time developers understand TMC services and get up to speed on the platform, and for more experienced developers to use as a reference and troubleshooting resource. It is the place developers return to when they have questions and need answers about syntax or functionality.
Project description
As a startup company and a pioneer in the transportation industry, Autonomic’s services were initially challenging for new users to understand. In the early stages, users required hands-on support when using TMC APIs, which led Autonomic developers to spend most of their time supporting customers instead of building new products and services.
To help Autonomic developers move out of support roles — and to provide customers with a self-learning and self-troubleshooting resource — I was assigned to design a Developer Portal similar to AWS documentation.
The main objectives of the project were:
-
To help developers learn TMC services and get started quickly
-
To make it easy for developers to find answers to their questions independently
Challenges and solutions
There were several challenges during the design and development of the portal:
1. Service-oriented documentation structure:
Initially, we modeled the Developer Portal after AWS documentation, grouping references by services. However, this structure was confusing for new users.
After conducting user research and interviews, we learned about users' pain points and reorganized the documentation to be use case-oriented. This helped new developers walk through the processes step-by-step, making it easier for them to understand and use TMC services.
2. Lack of consistency in terminology and documentation structure:
Each team was responsible for creating their own Markdown documentation, leading to inconsistencies.
We addressed this by creating style guides and templates, and by educating developers to follow a standardized documentation structure.
3. Large-scale services and difficulty finding APIs:
Due to the vast number of services, it was difficult for new developers to locate API endpoints and examples.
To solve this, we designed an intuitive navigation system combining breadcrumbs and a table of contents (TOC). Each header in the TOC included proper links for easy sharing and quick access.
4. Difficulty finding information across multiple documents:
To help users quickly find API-related information mentioned in several documents, I designed an advanced global search feature placed in the navigation bar. This search allows developers to locate specific syntax and information quickly.
Steps:
1. User Interviews and Persona Creation
2. Design Process
Created user flows
-
Developed mockups (from low to high fidelity)
