Back to Blog
Design7 min read

Dashboards you build, orgs you brand

Cam

When we shipped Monospace's first dashboard it was a static grid: projects on the left, a big overview, the same for everyone. Useful, but opinionated. Some people open Monospace to check open tickets; others to catch up on chat; others just to jump straight into a board. Forcing every session through the same landing page was friction.

This release rips that assumption out. Your personal dashboard, every organisation's homepage, and every project's homepage all run on the same underlying system now: a customisable widget grid. You pick what you see, where you see it, and how big it is. Orgs get branded homepages on top, and owners can enforce a theme for every member when they're looking at the org.

One system, three surfaces

The same grid engine drives three different landing pages:

  • Your personal dashboard at / — what you hit when you sign in
  • An org's homepage at /{orgSlug} — a new route, shared across all members
  • A project's homepage at /{org}/{project}/homepage — replacing the old static project welcome

On each one you have a View picker top-right. Pick one of the 8 preset arrangements — Gallery, Grid, List, Compact, Table, Kanban, Magazine, Feed — and every widget on the page re-tiles to match. Pick Custom at the bottom of that dropdown and it switches to a drag-and-drop mode where you're in charge of the layout.

In Custom mode, clicking Edit Layout drops you into a familiar grid editor. Drag widgets by their header, resize from the bottom-right corner, remove with the × button, and add new ones from the picker. Save persists to the database; Cancel reverts. Your personal layout is yours alone; org and project layouts are shared with everyone on the team (only owners/admins can edit them).

The 8 presets and Custom mode don't fight each other. Switching back and forth is non-destructive — your custom layout is remembered, and the presets just rearrange whatever widgets you've added.

22 widgets

Widgets are the building blocks. This release ships 22 of them, split into three buckets:

General widgets that work anywhere: Projects (itself with 8 sub-layouts — you can have a Magazine-style Projects widget on an otherwise Kanban page), Recent Activity, Upcoming Events, Stats, Tasks, Notes, Team Members, Text / Markdown, Quick Links.

Item preview widgets that surface specific project data on org or project homepages: Boards, Chat, Tickets Summary, Subscriptions, Purchase Orders, Maintenance, Detectors, Whiteboard, GitHub, Links.

Project-only widgets: the dismissible Welcome tutorial and the Add Tools helper — the latter showing chips of every tool you haven't enabled on the project yet, one click to add them. The tutorial is now a widget too, which means you can dismiss it on a project where you don't need it, or drag it back in when a new team member joins.

Each widget has a sensible default size and min-size, so they don't collapse into unusable nubs on small windows. On a tight viewport the grid stacks to a single column — a widget that was 6×4 on desktop becomes full-width on mobile.

Org homepages

Orgs used to be pure sidebar grouping — a header with an avatar, a list of projects below. Now every org has its own homepage at the org slug root: my.monospace.page/{orgSlug}. Clicking the org's name or avatar in the sidebar takes you there.

The top of an org homepage is a 200-pixel banner hero. Upload a banner image from Org Settings → Theme & Branding and we open the same crop modal as project icons, but at a 4:1 aspect so you can pick exactly which part of your image shows. Output is 1600×400 WebP — sharp on large displays without being huge. If no banner is set, the hero falls back to a subtle accent-coloured gradient with just the org avatar + name over it.

Below the hero is the widget grid. By default we seed org homepages with Projects (Grid layout) + Team + Recent Activity + Upcoming Events. Admins tweak it in Custom mode and every member sees the new arrangement next time they load. Members without edit permission can't rearrange the org layout, but they can still switch between the 8 presets for their own view.

Org homepages are member-only. Non-members see "This organisation is private" instead. If we later add public org pages we'll make that explicit.

Org themes and enforced branding

Alongside the banner, owners and admins can set:

  • An org accent colour (12 presets or a custom hex)
  • An org background gradient (same premium backgrounds your personal Appearance panel exposes)
  • An org Look variant (the 9 visual styles — Aurora, Twilight, Glass, Winsur, etc.)
  • An org theme mode (light / dark / OLED)

By default these are suggestions — if the current member has a personal value set for that dimension, the member's choice wins. This means someone who works hard on their own personal theme doesn't get it blown away when they're browsing an org.

But flip the Enforce for all members switch on, and the org's choices take over. While any member is viewing a page under that org — homepage, projects, settings, everything — their personal theme is overridden by the org's. Leave the org (navigate away to a personal project, the dashboard root) and the personal theme returns. Turn Enforce off again and the same thing happens reactively — no refresh needed.

This solves two real use-cases: brand-consistent client-facing orgs, and teams that want a shared vibe when working together without mandating it globally. It's one switch — use it or don't.

Project homepages got an upgrade too

The old project homepage was a static page: project header, a "Welcome" tutorial card, an Overview list of items, and an Add Tools grid at the bottom. Functional, but frozen. This release replaces it with the same widget grid, with defaults that preserve what was useful:

  • The Welcome tutorial is now a Welcome widget — dismissible, but you can add it back anytime.
  • The Add Tools grid is now an Add Tools widget — drag it wherever, it filters out tools you've already enabled.
  • Recent Activity, Upcoming Events, Tasks, Notes, and Team Members fill in the rest by default.

Every project item type has a preview widget you can add — put your most important Board, Chat, or Tickets summary right at the top of the project page if that's what matters most to your workflow.

Permissions match edit access: project owners, plus owners/admins of the project's org, can edit the shared layout. Everyone else can still switch presets for their own view.

Smaller things that add up

A handful of smaller improvements shipped with this:

  • Clickable org rows everywhere. Sidebar org headers now split navigation from expand: the chevron toggles expand/collapse (like projects do), and clicking the avatar or name takes you to the org's homepage. Works in both the expanded sidebar and the collapsed 60-px rail.
  • Clickable projects in every layout. In Custom mode's Projects widget, project cards are real <Link> elements across all 8 sub-layouts — so right-click → "Open in new tab" works, keyboard navigation works, and middle-click works.
  • Better not-found page. The "Project not found" screen used to be a 40-px icon pinned to the top of a max-width block. It's now centred in the viewport with a subtitle explaining likely causes and a solid accent-coloured "Back to Dashboard" button.
  • Custom toggle folded into the View dropdown. Rather than a standalone button cluttering the toolbar, Custom is now the last entry in the View menu — a Sparkles icon after the 8 presets, divider-separated so it reads as a distinct mode.
  • Banner crop modal. Uploading a banner now opens the same crop flow you know from project icons: drag to reposition, scroll or slider to zoom, preset aspect, confirmed when you hit the checkmark.
  • StatusBanner fix. Dismissing the "degraded" banner used to hide it for the whole tab session. Now it reappears after 30 minutes if the incident is still ongoing — on any device.

What's next

A few directions we're thinking about:

  1. Multi-instance widgets. Right now you can only add one of each type per grid. Text blocks and Quick Links clearly want multi-instance (build a full landing page out of them).
  2. Per-widget table-row variant. The Table preset forces every widget to a 1-row height; their content clips today because the widget frames don't have a dedicated "table row" rendering mode yet.
  3. Per-user overlays on org/project grids. The current rule is "admins set it, everyone sees it." Notion-style per-user overlays on top of the admin's baseline would let individual members personalise without disrupting the team view.
  4. Per-project theming. Org themes are done; projects are next in the queue. Same model: accent / background / look / mode / enforce.
  5. More item widgets. Drag-in calendars you can interact with inline, ticket columns you can triage from, board cards you can move without leaving the homepage.

Thanks for using Monospace.

— Cam

#design#widgets#dashboards#organisations#branding#themes