How Artefact reinvented collaborative workspaces for technical teams

Challenge

Artefact provides a shared workspace for teams to create, review, and approve technical documents effortlessly. Its powerful tools help clarify collaboration, automate approvals, and keep technical teams aligned, so they can focus on shipping, not guessing.

Technical documentation is essential–but creating it in enterprise environments is notoriously difficult. Product and engineering teams spend countless hours shaping requirements and specifications, only to hit familiar bottlenecks—securing clear and timely approvals from cross-functional stakeholders.

Artefact recognized that traditional approval methods, like dropdown menus and cluttered version histories, simply weren’t cutting it. They left teams unsure about who approved what, and when, resulting in delays and confusion. For this reason, they built something better, a dedicated, collaborative workspace tailored specifically to the way technical teams create, review, and approve docs.

Solution

Artefact partnered with Liveblocks to build a dynamic documentation workspace that reimagines how product and engineering teams collaborate. The team implemented a number of key collaborative features, powered by Liveblocks.

Presence indicators

Using presence avatars, team members can see who is currently viewing and editing a document in realtime, providing instant visibility into team activities.

Collaborative editing

Artefact’s collaborative document editing allows teams to work together in realtime, creating rich-text documents together. You can add use mentions, headings, comments, tables, and more, using an interactive toolbar. Live cursors are displayed for each user as they select text and write.

Templates

Artefact provides a set of templates to start from, you can click the Create Document button to insert a ready-made template into the editor.

Floating toolbar

Within the text editor, you can select text and use the toolbar to style your text, use blockquotes, add comments, and more.

AI toolbar

If you click the ArtefactAI button in the toolbar, you can apply AI suggestions for the current selection, and make changes. For example, you can ask the AI to improve the quality of your writing, or translate text into a different language.

Comments

Within the text editor, you can add comment threads to a document. These threads are displayed in a sidebar, anchored to the right of the text editor, and you can tag others, upload attachments, add emoji reactions, and more.

In an alternate display mode, they’re also rendered as floating comments under the highlighted piece of text.

Approvals

Each document can be assigned certain reviewers, who have permission to read and approve the document. Reviewers are listed in the sidebar with their current approval status, and documents also have different statuses: Drafting, In Review, and Approved.

Share menu

The in-app share menu allows editors to invite new users to the document. Users can be assigned full edit access, or just read-only access.

Inbox notifications

When a user is mentioned in a document, or if a new comment is added to as thread they’re participating in, they receive a notification in their inbox. Inbox notifications can be marked as read or deleted.

Email notifications

If a user misses an inbox notification, Artefact sends an email notification to the user, letting them know. Users can configure which types of notifications they’d like to receive, for example mentions in the text editor, tags in comments, etc.

Results

With these features working seamlessly together, Artefact has truly reinvented what a collaborative workspace can be for technical teams. Instead of stitching together fragmented tools, they built a unified environment where realtime editing, AI assistance, and contextual feedback come together—making documentation not just easier to produce, but genuinely collaborative from start to finish.

If you’d like to build similar features into your product, make sure to check out our examples gallery where highlight how to implement every part of this. Additionally our Next.js Starter Kit contains the features listed above in a single project, and you can even try out a live demo.