Wireframe: Licenses Overview (Phase 3)

Page Layout:

  • Top Navigation Bar: Same as Dashboard — logo on left, user profile & notifications on right.
  • Left Sidebar Navigation: Same as before, with “Licenses” highlighted.

Main Content Area:

1. Header Row (Page Title + Action Buttons)

  • Page Title: “Licenses Overview”
  • Action Buttons (right-aligned):
    • + Create New License (primary color, prominent)
    • Import from Template (secondary button)
    • Bulk Upload (icon button for CSV/JSON uploads)

2. Filter & Search Row

  • Search Bar: “Search by License ID, Name, or Owner”
  • Dropdown Filters:
    • License Type (Commercial, Non-Commercial, Override, Experimental)
    • Status (Active, Expired, Pending Review, Revoked)
    • Date Range (Issued, Expiration)
  • Tag Filter Chips: Applied filters appear as removable chips below search.

3. License List Table

  • Column Headers:
    • Checkbox (for bulk actions)
    • License ID (clickable to detail page)
    • License Name
    • License Type
    • Owner / Organization
    • Issue Date
    • Expiration Date
    • Status (color-coded badge: Green = Active, Yellow = Pending, Red = Expired)
    • Actions (view, edit, revoke)
  • Table Rows: Paginated (default 10 per page), with hover states for quick access.

4. Bulk Action Toolbar (Visible When Rows Selected)

  • Options: Revoke Selected, Export, Extend Expiration, Assign Override.

5. Sidebar Preview Panel (Optional Toggle)

  • When a license is clicked, a right-hand slide-out panel shows:
    • License Details Summary
    • Fingerprint IDs count & quick view
    • Associated Overrides count (click to view)
    • Last activity log

Interaction Notes:

  • Creating a new license launches a multi-step modal wizard:
  • License table is exportable to CSV/JSON with selected filters.

Was this article helpful?

Wireframe: CHLOM Dashboard (Landing Page)
Wireframe: License Detail View (Phase 3)