Case · WorkPoint 365
Design System 2.0.
One language, every product.
WorkPoint 365 brings structure to projects, cases, contracts and documents in Microsoft 365. Our collaboration with WorkPoint has run for more than two years and across several projects. Working inside the product teams, we designed features in Core, Automate and Express 365, the progress flow for processes and, as the thread through it all, Design System 2.0: a shared foundation, so every product looks, reads and behaves the same way.
Start your project2.0
the next version of the design system
3
products: Core, Automate, Express 365
M365
SharePoint, Teams and Outlook
2+
years of collaboration across several projects
The screens on this page are our own proposal for a new version of WorkPoint. They are not in the product today.
The challenge
Three products that had grown up separately.
Core, Automate and Express 365 were built by different teams at different times. Each had its own buttons, its own forms and its own way of showing status. For users moving between SharePoint, Teams and Outlook, the platform felt like three tools instead of one.
Embedded in the team
For more than two years we have worked in WorkPoint’s sprints, next to product managers, architects and developers, so decisions were made where the code was written.
One foundation
Colours, type, spacing and states defined once as tokens, and used by every product.
At home in Microsoft 365
WorkPoint lives inside SharePoint, Teams and Outlook. The system had to feel native there, not bolted on.
Ready to build
Every component specified with all its states, so developers could build straight from it.
Design System 2.0
One shared foundation, so the platform feels like one.
Design System 2.0 is the next step for WorkPoint’s design language. Instead of each product solving the same problems in its own way, the system gives the teams one set of building blocks: the same colours, the same type, the same components and the same patterns for navigation, metadata, status and processes.
For users, it means that a project in Core, an approval in Automate and an email in Express 365 are read the same way. For WorkPoint, it means new features are designed and built faster, with fewer decisions to make again and fewer details to fix later.
Consistent across products
A button, a field or a status looks and works the same in SharePoint, Teams and Outlook.
Built on tokens
Colour, type and spacing are named once and shared by design and code, so a change reaches every product.
States with one meaning
Completed, awaiting input, running, pending and failed mean the same thing everywhere.
Room to grow
New products and features start from the system instead of from a blank page.
Moods
A look inside Design System 2.0.
Not the full documentation, but the ideas behind it: the brand colours extended into full ramps, a clear type scale, one set of states, and components that carry across the products.
Progress flow
A process you can follow step by step.
We designed the progress flow that guides users through processes in WorkPoint 365, like creating a new project. The steps are listed on the right, so you always know where you are, what is done, what WorkPoint is doing for you, and what comes next. Here it is shown in Design System 2.0.
Always know where you are
Every step shows its state, and the progress bar shows how far you are.
Manual and automatic steps
Steps the user fills in and steps WorkPoint runs itself sit in the same flow, with a clear difference between them.
Rules built in
If the budget is above the limit, the process adds a step for justification and a signee.
Our own proposal for WorkPoint 2.0, running on its own.
The products
One system, three products.
Each product has its own users and its own job. Design System 2.0 is what they share.
What WorkPoint says
Bringing Ceptiv’s designer into our teams was one of the best decisions we made for the product. Core, Automate and Express 365 serve very different users, and Ceptiv gave them one clear design language that still feels at home in Microsoft 365. They understood our architecture quickly, challenged us on the details that matter to users, and gave our developers specifications they could build straight from. The result is a platform that is easier to use, easier to demo and faster to extend. I can warmly recommend Ceptiv to any software company that needs senior design capacity inside the team.
What we delivered
Two years, several projects, one platform.
- 01Design System 2.0: tokens, components and patterns
- 02The progress flow for processes in WorkPoint 365
- 03Shared patterns for metadata, status and access
- 04Concept screens for a new version of WorkPoint
- 05Specifications with every state, ready for developers
- 06Design sparring on site with product and development, project after project
Need a design system for your product?
We build design systems and place experienced UI and UX designers in software teams, on site or remote, for as long as you need them.