SmartIntellect
Streamline product workflows to reduce learning cost, improve feature usability
When business operator connect channels, they pay close attention to the real-time connection status, as it helps them confirm whether the connection was successfully completed. Therefore, this aspect of the design needs improvement by clearly feedback on connection status.
This lightweight, real-time feedback and guidance design allows merchants to stay informed and confident throughout the data source connection process, improving transparency and fostering a stronger sense of control.
When business operators attempt to create new customer segments, they are highly concerned about the time required to complete the task and the readability of the entire page.
Although the current process allows them to fulfill the requirement of creating new customer segments, it is widely regarded as overly cumbersome. Operators often need to repeatedly make selections, leading to a prolonged process. Additionally, the layout of the page is somewhat cluttered, which further impacts the overall user experience.
Current workflow:
In real-world scenarios, most business operators need to configure multiple Segment rules and conditions simultaneously to achieve more refined customer segmentation, influenced by factors like marketing campaigns and product volume.
While the current solution is fundamentally functional, it does not fully align with operators’ core needs. Specifically, the configuration process is overly complicated, lacks readability, and is time-consuming.
Current page display:
The content is displayed from top to bottom in the order users set the rules. However, when business operators select too many rules, the page becomes cluttered and hard to read because of the high-density text display.
As a result, business operators experience low efficiency when creating customer segments. To better support their workflow, the process needs to be optimized to reduce task completion time and improve overall usability and clarity.
Optimized workflow:
Optimized page display:
Finally, I successfully optimized the entire process, reducing the number of steps to make it simpler and more user-friendly. As a result, the overall completion time was significantly shortened.
Expand product functionality and enrich product capabilities
The current connection feature supports integrating three mainstream channels: Meta, Google, and the company's proprietary Member System. However, the majority of merchants use various third-party marketing systems, including custom CRM solutions. Currently, they are unable to integrate these data sources into SmartIntellect.
The low flexibility of the connection feature, combined with the high costs and risks of migrating third-party data, has significantly undermined merchants' confidence in adopting SmartIntellect.
01. Add Source
Implement an intuitive and consistent card-style design to ensure overall page uniformity.
02. Data Integration
Provide status indicators, pop-ups, and toast notifications with visual cues to inform users of each step in the connection process, guiding them through it. Maintain consistent styles and colors to minimize learning costs.
The source status updates in real time based on user actions and provides feedback to the user.
This solution streamlines third-party data integration through a unified, intuitive flow with clear visual guidance. It not only reduces user friction significantly, but also aligns with SmartIntellect’s strategic goal of broader adoption across diverse infrastructure environments.
Before
When a merchant selects a customer on the Customer List page, the system displays the Customer Purchase Path Timeline. However, for merchants, merely presenting this information is insufficient.
After
Allow users to view more dimensions of information about the customer, forming a more comprehensive user profile.
Prioritize actions based on user expectations and competitive analysis, displaying them from high to low frequency.
This redesign enabled merchants to access more comprehensive customer profiles with reduced cognitive load. As a result, the feature became more actionable in marketing scenarios, significantly improving the usage rate of the customer profiling.
When users are utilizing reports, they encounter the following three pain points:
01. Dispersed Data, Low Analysis Efficiency
Due to the lack of a unified data visualization tool, users must switch between multiple reports to gain a full picture, increasing integration complexity and reducing analytical efficiency.
02. Lack of Real-Time Data Feedback, Slow Decision-Making
The current system only supports historical data review, lacking real-time monitoring. Users are unable to respond promptly to market changes, which delays decision-making.
03. Lack key Features, Reduced Competitiveness
While competitors offer customizable dashboards and multi-dimensional analytics, our product falls short. This impacts user experience and market competitiveness, with existing clients voicing dissatisfaction.
Design Thinking: Place all required inputs in a drawer-style sidebar to reduce user steps
Why choose this design method?
This solution empowered users to create and manage multi-dimensional dashboards with significantly reduced operational steps and enhanced visual clarity. As a result, users were able to perform faster, more customized data analysis—improving their decision-making efficiency and strengthening SmartIntellect’s product competitiveness.
Improve the product's visual presentation, strengthen market competitiveness
SmartIntellect product users operate in markets with audiences from the UK, USA, and China, primarily serving key account (KA) clients with brand and user operations needs. For them, efficiency is the highest priority.
Product characteristics: Large data volume; Numerous configuration pages; High information density.
Product vision: Connectivity; Insights; Personalization.
Color
The primary colors are dark blue (#07012F) and purple (#664EFD).
Dark Blue (#07012F) is the main UI color for components. It’s used for titles, default button color, and selected input fields.
Purple (#664EFD) is the brand color. Its usage is limited to elements like navigation, top bars, illustrations, and key elements on certain pages (e.g., large numbers on reporting pages) to avoid a visually overwhelming look, maintaining the calm tone suited to B2B products.
In certain cases, text buttons, navigation links, and general alert and message notifications should avoid using the brand color and instead utilize blue (#356DFF). Blue serves as a standard, universally recognized color in the interface, providing clear meaning. Replacing blue with non-blue tones in these elements could introduce additional cognitive load for users.
Typography
Rounded Corners
To align with design trends and improve display on low-resolution screens, the new components and page elements feature larger rounded corners.
For single-line components like buttons, input fields, labels, and toasts, both ends use fully rounded corners.
For other elements, rounded corners follow a 4px increment, such as:
16px corners are widely used for page card elements
12px corners are used for elements nested within cards, like messages
Spacing
Most spacing follows multiples of 8px, while the spacing between titles and descriptions is set to 4px.
