InnovaGroup
Back to InnovaWorks
SharePoint · SPFx · ReactDesign Showcase

Same component system, a completely different house style.

Intranet homepage for a precision engineering group — sidebar navigation, operational KPIs, announcements, a document table, safety alerts, live site presence and a slide-over assistant. Editorial typography, warm palette, light and dark themes, responsive to phone.

SPFxReact + TypeScriptDesign tokensSidebar IAData tablesLight / dark themingResponsive
Desktop— open it and the build responds
Responsive— the same page on a phone
Alerts and KPIs
Announcements
Documents
Dark theme
Theming— one component set, two themes
light
dark
Behind it— how the page is put together
01

Built from the same component set as the Halbeck hub — the difference is entirely in the token layer, the typography and the information architecture, not the code underneath.

02

A persistent sidebar replaces the top-nav model, because the audience here lives in the intranet all day rather than dropping in for a form.

03

Operational KPIs, a safety alert banner and a live on-site register sit above the fold, reflecting what a shop floor actually needs first.

04

The document table is a real sortable data table rather than a SharePoint list view, so it can be styled to match the rest of the page.

Calderwaite Precision is a fictional company. All branding, imagery and content were created for demonstration purposes — client intranets aren't ours to publish, so we built our own to show the work.

Want something like this for your business?

Every piece here started from how the work actually happens, then got built around it — an intranet homepage where that fits, a standalone application where it doesn't. That's the same way we'd approach yours.