Redesigning Smart Marketing: SCRM Insights and UX Wins for B2B SaaS

Smart Marketing is a B2B SaaS product that provides lead data acquisition, CRM customer management, and value‑added services. To gain a foothold in the competitive B2B market, the team conducted deep design thinking and experience optimization, with all data anonymized for privacy.

1. New Term: SCRM

SCRM (Social CRM) extends traditional CRM by integrating social tools and networks. While both aim to improve work efficiency and sales management, SCRM adds social connectivity, making the platform more collaborative.

2. Core Process

The main workflow includes market acquisition → lead distribution → customer follow‑up → opportunity management → business process → after‑sales management. Understanding this flow guided the redesign goals: improve lead distribution interaction, visualize follow‑up fields, and enrich opportunity details.

3. Problem Analysis

Current issues were identified and visual‑style plus efficiency upgrades were set as the two main directions for key pages.

Design Value

The design follows the “Vision” brand language of the middle‑platform design system, combining UI component libraries, illustration libraries, and data‑visualization components. This maintains brand consistency while boosting development efficiency.

Improving Design Quality

Large visual elements are used sparingly in B2B systems, focusing on home promotion, login branding, icons, empty states, help guides, and announcement systems.

Deep Thinking on Defaults

Beyond default images, consider permission‑error guidance with combined illustration, copy, and buttons to solve urgent user problems and guide new users.

3. Social Foundations – Avatar Details

Avatars (user or company) occupy larger visual space and use richer colors, enhancing emotional design. When real images are unavailable, using initials with random background colors shifts focus to key information.

1. Workbench – Task Collection

Core functions: statistics, pending tasks, quick entry, notifications. Modules are limited to 5‑9 items, with role‑based differentiated views.

2. Efficient Filter List Page

Filtering is crucial for SaaS systems to help users quickly locate data. The page is divided into global operation area, filter area, list operation area, and table area.

Clear information structure: global‑operation → filter → list‑operation → table.

Filter type analysis: position (sidebar, horizontal, inline), state (expanded/collapsed, tiled/popup), execution time (real‑time, manual), result display (progress, highlight, count, empty, clear).

When many filters (5‑15) are present, collapsing less‑used filters prevents excessive scrolling while keeping common filters upfront.

Design practice favors a tiled layout for immediate visibility, with optional collapse to save space. Real‑time updates replace the previous “search” button, improving efficiency.

Linked interactions, such as auto‑suggested date ranges after selecting a date field, maintain visual consistency and speed up workflows.

Customizable table headers let users choose displayed columns, supporting diverse data analysis needs.

3. Phone Bar Redesign

The new design removes excessive button options, reducing visual clutter and emphasizing the primary call action.

Overall, this case shares simple design experiences for Smart Marketing. Future work will continue exploring SCRM vs. traditional systems and expand middle‑platform design empowerment across more product scenarios.