AMS Table Design System

Challenge

Through thorough discussions and data analysis with product managers and developers, we identified several pain points that required optimization: inconsistent styling across tables, redundant and duplicate functionality, poor responsive behavior, overcrowded data presentation, and limited scalability as new products came online.

Approach

Benchmarking and Defining UX Principles

I ran competitive and comparative benchmarking against modern admin platforms (layout, interaction patterns, sorting, filtering, inline editing, responsiveness) and synthesized the findings into UX considerations covering content hierarchy, alignment and spacing, copywriting and tone, and interaction feedback.

A Shared Data-Type Guideline

I created a Table Type & Data Type Guideline mapping content types (strings, dates, tags/labels) to their correct UI pattern, then validated it directly with the R&D team against the real technical architecture and data structure.

Solution

• Data type standardization. Every table category got clear, defined properties, so team members could quickly find the right component for their use case instead of reinventing one.

• A modular component library. Each table element shipped as a fully-featured Figma component that could be simplified by adding or removing functions per scenario, with clear developer handover instructions built in.

• Better admin UX. Multiple filters for faster search, batch actions across selected records, document export, and customizable table display.

• Ant Design as the foundation. We built on the Ant Design library to speed development while retaining room to customize both visuals and functionality.

Outcome

The revamp resolved the original table issues and, more importantly, established a shared foundation for system-wide improvements across every NineSmart product connected to AMS.