PROJECT TYPE

B2B Web Platform

SCOPE

End-to-End Experience
Content Architecture
CMS Design

ROLE

Product & Experience Designer

RESPONSIBILITIES

Experience Strategy
Information Architecture
CMS & Workflow Design
UI System

BACKGROUND

As a B2B enterprise, our marketing assets were dispersed across teams, forcing partners to rely on sales representatives for access. This caused inefficiency, inconsistent branding, and poor visibility into resource use.

Challenge

Clarifying Goals and Aligning with Business Needs

Hour-long interviews revealed key challenges:

  • Partners spent excessive time searching for the latest marketing assets on our website or social media.
  • Sales teams handled repetitive requests for resources, reducing overall productivity.
  • There was no login-based tracking system, making it difficult to monitor how and when materials were used.

research

Defining the Strategic Foundation for the Platform

To translate insights into actionable direction, I established a clear strategic framework

Used a Business Model Canvas to clarify how the platform supports sales strategy and revenue flow

Built Persona representing different sales roles and behaviors toward marketing materials‍

Created User Journey Maps to visualize pain points in asset discovery and download processes‍

Defining Insights That Shaped a More Intuitive Platform

Translated findings into data-driven design insights

Centralized access to all marketing assets across multiple channels

Clear, structured categorization that enables users to locate resources with minimal cognitive effort​

Permission-based access and usage tracking to ensure controlled distribution of materials

Information Architecture

Structuring the Information Architecture

I designed a three-tier hierarchy to create a clear and intuitive navigation model from the ground up:

  • Establishes a predictable and scalable structure
  • Aligns categories with real organizational needs (Corporate Identity, Product Resources, Emailing Materials, Event Assets)
  • Provides a foundation for permissions, automation, and future expansion
image of predictive analytics charts
  • Reduces search friction with logical grouping and clearer naming
[interface] image of software interface (for a edtech)

Flow / Roles

Defining Cross-Role Service Flows

Because the platform distributes sensitive brand materials, access must be controlled and approval-based.
‍
I outlined the full lifecycle of account creation and asset access from three angles:

  • User flow: Registration, verification, and onboarding
  • Admin flow: Reviewing accounts and approving/rejecting requests
  • System flow: Automated emails, status changes, and gated access
image of predictive analytics charts

Interaction Rules and UI Behavior

  • State-Driven Visibility
  • UI elements dynamically adjust based on the role
  • ‍Before login: All users see universal access Login point
  • ‍After login: Actions such as Logout and Account become available, while administrators gain access to the Member Directory
    ‍
  • Role-Aware Navigation
  • The platform adapts post-login routing based on the role
  • ‍Normal users: Re-enter the flow where they left off, minimizing friction
  • ‍Administrators: Directed to the member directory to prioritize review tasks
    [interface] image of software interface (for a edtech)

    Interface Design

    Translating Strategy into a Cohesive Visual System

    • Applied brand visual identity to build a clean, professional interface.
    • Designed reusable UI components and layout patterns to ensure consistency across multiple pages.
    • Enhanced usability by minimizing cognitive load and emphasizing visual hierarchy.
    image of predictive analytics charts

    Data-Driven Outcomes

    Within the First Month:
    It Generated 1,600+ Downloads and 40+ User Registrations

    These results validated strong demand from existing partners and showed how the new resource platform improved asset accessibility, increased partner self-sufficiency, and reduced internal workload

    Vies Live Page
    image of a computer showcasing educational software (for edtech)