Revamping Monitoring Product UX: Redesign, Process Boost, Smart Alerts, Data Viz
This article examines how Suning’s monitoring product’s user experience was elevated through four key interventions—page reconstruction of call‑chain views, backend performance workflow optimization, intelligent alerting with real‑time and offline analytics, and a data‑visualization decision platform—illustrating the shift from basic usability to emotionally engaging, self‑actualizing interactions.
Preface
Monitoring products are among the most critical in Suning’s IT system, ensuring that business systems remain "stable, safe, and extremely fast," especially during major promotional events. The core task is precise information reporting and timely user perception, making the interaction between users and monitoring data the key to user experience. Applying Maslow’s hierarchy, the design progresses from basic usability to a delightful, self‑actualizing experience.
Page Reconstruction: Call Chain
Online, user data generates different chains across scenarios; the monitoring chain’s status is the core value of the call chain. A system‑service‑link model was built, simplifying relationships among systems, services, and links. By combinatorial arrangement, a large‑scale network can generate many links, allowing every user scenario to be represented as a chain within the system network.
The homepage must convey important information instantly, serving both business value and entry guidance. Two scenarios were designed: users browsing all system‑related monitoring information, and users focusing on a single system’s data. "All systems" includes system, link, and service dimensions; "single system" includes system and service dimensions.
Process Optimization: Server Performance
Server performance monitoring tracks various performance metrics. By analyzing the main task flow, three basic elements were identified: system, node, and performance. Before redesign, locating an abnormal required four steps: select a performance dimension, choose a system, select a node within that system, and view the node’s parameters for the chosen dimension. If parameters were abnormal, the issue was identified; otherwise, the loop repeated.
The original process was inefficient, so performance parameters for each system and node were pre‑positioned, assigning monitoring data to each element. The new flow highlights abnormal systems and nodes with markers, guiding users directly to the issue.
Value Assignment: Intelligent Alerts
Intelligent alerts automatically detect abnormal data across systems, generating events and alarms. Good monitoring data reflects work quality; comparing data drives users to improve. Users need both short‑term and long‑term data. Therefore the homepage is split into two parts: real‑time monitoring data and offline data analysis. Real‑time data tells users what is happening now; offline analysis shows trends over time, enabling self‑comparison.
Following Maslow’s self‑actualization, users also compare with peers. A ranking feature was introduced, showing system and team performance to motivate users to strive for better positions.
Data Visualization: Decision Analysis Platform
The decision analysis platform aggregates anomalies, offering recommendations. Data visualization helps users interpret data; clear hierarchy and efficient aggregation are essential.
Requirements: select dimensions (e.g., core URL, region, carrier, device type, access method) and time granularity (day, week, month), input a time range, and query latency data. Results are displayed as charts with metrics such as count, average, max, min, standard deviation, and percentiles.
Example: a user in Jiangsu on an Android phone via China Mobile 4G accesses the homepage on 2017‑11‑11; the system records the latency. Raw data is filtered by conditions, then statistical metrics are applied to produce valuable insights.
By linking latency data with timestamps (Y‑axis vs X‑axis), each latency point is plotted on a 2‑D graph, revealing distribution patterns. Selecting a single dimension for the X‑axis (e.g., core URL, region) and latency for the Y‑axis allows stacked bar charts to show latency level proportions clearly.
Conclusion
Designing the monitoring product’s experience requires focusing on the user’s information‑acquisition path and guiding interaction with monitoring data. Using the "MuJia" series redesign as an example, improvements went beyond UI layout to enhance information flow and user behavior, enabling natural and effective data interaction.
Signed-in readers can open the original source through BestHub's protected redirect.
This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactand we will review it promptly.
Suning Technology
Official Suning Technology account. Explains cutting-edge retail technology and shares Suning's tech practices.
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.
