Discover how Artefact built a purpose-built documentation workspace with AI-assisted editing, realtime approvals, and powerful collaboration, tailored for modern product and engineering teams.
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.
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.
Using presence avatars, team members can see who is currently viewing and editing a document in realtime, providing instant visibility into team activities.
Live avatar stack created with Liveblocks Presence
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.
Powered by Liveblocks Text Editor and Tiptap
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.
Our Node.js package enables inserting content into editors
Within the text editor, you can select text and use the toolbar to style your text, use blockquotes, add comments, and more.
This is our pre-built FloatingToolbar component
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.
AI powered by Liveblocks AI Copilots and our pre-built AiToolbar component
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.
Uses Liveblocks Comments and our pre-built AnchoredThreads component
In an alternate display mode, they’re also rendered as floating comments under the highlighted piece of text.
Uses our pre-built FloatingThreads component
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.
Reviewers and approvals are stored in our realtime sync engine
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.
We have a similar share menu in our Next.js Starter Kit
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.
Created with our pre-built Liveblocks Notifications components
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.
Built with our email package, webhooks and email templates
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.
