• DocsDocs
  • PricingPricing
Book a demo
Sign in
Sign in
Book a demo
    • Ready-made features
      • AI Copilots
        AI Copilots

        In-app AI agents that feel human

      • Comments
        Comments

        Contextual commenting

      • Multiplayer Editing
        Multiplayer Editing

        Realtime collaboration

      • Notifications
        Notifications

        Smart alerts for your app

      • Presence
        Presence

        Realtime presence indicators

    • Platform
      • Monitoring Dashboard
        Monitoring Dashboard

        Monitor your product

      • Realtime Infrastructure
        Realtime Infrastructure

        Hosted WebSocket infrastructure

    • Tools
      • Examples

        Gallery of open source examples

      • Next.js Starter Kit

        Kickstart your Next.js collaborative app

      • DevTools

        Browser extension for debugging

      • Tutorial

        Step-by-step interactive tutorial

      • Guides

        How-to guides and tutorial

    • Company
      • Blog

        The latest from Liveblocks

      • Customers

        The teams Liveblocks empowers

      • Changelog

        Weekly product updates

      • Security

        Our approach to security

      • About

        The story and team behind Liveblocks

  • Docs
  • Pricing
  • Ready-made features
    • AI Copilots
    • Comments
    • Multiplayer Editing
    • Notifications
    • Presence
    Platform
    • Monitoring Dashboard
    • Realtime Infrastructure
    Solutions
    • People platforms
    • Sales tools
    • Startups
    Use cases
    • Multiplayer forms
    • Multiplayer text editor
    • Multiplayer creative tools
    • Multiplayer whiteboard
    • Comments
    • Sharing and permissions
    • Document browsing
  • Resources
    • Documentation
    • Examples
    • React components
    • DevTools
    • Next.js Starter Kit
    • Tutorial
    • Guides
    • Release notes
    Technologies
    • Next.js
    • React
    • JavaScript
    • Redux
    • Zustand
    • Yjs
    • Tiptap
    • BlockNote
    • Slate
    • Lexical
    • Quill
    • Monaco
    • CodeMirror
  • Company
    • Pricing
    • Blog
    • Customers
    • Changelog
    • About
    • Contact us
    • Careers
    • Terms of service
    • Privacy policy
    • DPA
    • Security
    • Trust center
    • Subprocessors
  • HomepageSystem status
    • Github
    • Discord
    • X
    • LinkedIn
    • YouTube
    © 2025 Liveblocks Inc.
Blog/Customers

How Rayon replaced their own WebSocket infrastructure with Liveblocks to power realtime collaboration

By providing a cloud-based software solution, Liveblocks removed the burden of maintaining and scaling a realtime collaboration infrastructure for Rayon, allowing them to enhance their core offering and provide a better user experience for their customers.

on April 20th, 2023
How Rayon replaced their own WebSocket infrastructure with Liveblocks to power realtime collaboration
April 20th, 2023·4 min read
Share article
Dialogue
11-20Founded 2021With Liveblocks since October 2022rayon.design

Challenge

Rayon is a collaborative space design platform that allows designers to draw, share, and collaborate directly in their browsers.

The majority of our cities are made up of architecture that is neglected by current design software due to technology’s focus on exceptional constructions, which is why Rayon’s manifesto stresses that “ordinary buildings matter.” They advocate for new space design tools to cater to this overlooked segment and democratize space design for the 90% of buildings in our cities.

Draw and lay out your ideas on an infinite canvas.
Draw and lay out your ideas on an infinite canvas.
Share your work & collaborate with friends & colleagues at the same time.
Share your work & collaborate with friends & colleagues at the same time.

We recently had a fireside chat with Bastien, co-founder of Rayon, where we discussed the company’s mission.

Rayon aims to be more than just a collaborative tool; they want to become the best platform for designing floor plans as a team. This is a significant challenge, especially for complex projects like floor design, which requires collaboration from many different professionals, including interior architects, facility managers, event planners, and retail managers.

To succeed when facing such a challenge, it is crucial to be deliberate about what to build internally and what to outsource. Initially, their team created a prototype for a WebSocket infrastructure but soon realized that building and maintaining it was painful and was taking them away from their core offering focus.

Solution

Bastien came across Liveblocks on Twitter and was intrigued. He delved deeper into the website, documentation, and examples, and ultimately decided to give it a try.

Since Rayon uses React, they installed the @liveblocks/react package to implement realtime collaboration without adding too many dependencies to their codebase.

Within a few hours, they replaced the collaborative layer they had built themselves with Liveblocks. Without the burden of maintaining and scaling their homegrown realtime WebSocket solution, they can focus on their core product.

They implemented a canvas that allowed multiple people to create and view shapes simultaneously. Using Liveblocks’ presence and broadcast APIs, they quickly added presence avatars, live cursors, the ability to view all actions done by others, and the ability to follow someone else.

“I discovered Liveblocks on Twitter. I ripped out what I’d done previously, and actually, the experience was awesome. It took me less than an hour to switch to Liveblocks, and that’s just less stuff to worry about. So it’s all beneficial!”
Image of Rayon
Image of Bastien Dolla
Bastien DollaCo-Founder at Rayon

Results

Bastien, the co-founder of Rayon, believes that the future of design tools lies in cloud-based software supported by generative AI. This approach will enable you to provide your users with a single source of truth and centralize data to train your AI models. By doing so, you will be able to offer features that make your users more efficient and creative.

Rayon’s team has the necessary domain knowledge, designer empathy, and technical expertise to provide the best floor plan design experience in the market, especially with recent advances in AI technology.

This focus on floor plan design is what Rayon has chosen to pursue, and therefore they outsource everything that is not part of their core offering to experts, such as Liveblocks, to support their collaborative infrastructure.

“Liveblocks just works, and that’s nice. That’s one less thing to think about and that’s pretty much what I expect when I outsource a solution like this. The main goal for me is just to have less maintenance, to have less overhead for the team. And that’s exactly what happens. Liveblocks just works. We don’t have to worry about it.”
Image of Rayon
Image of Bastien Dolla
Bastien DollaCo-Founder at Rayon

If this has inspired you to build a new collaborative app, you can use our Starter Kit to kickstart it. If you already have a product, here are a few references that will help you accelerate development:

  • To show who is currently in the same document as you, check out our example: Live Avatar Stack.
  • To show people's cursors in real time, check out Live Cursors.
  • To broadcast events to multiple people instantly, such as when a shape is created or moved around, check out Live Cursors Chat.
  • To offer a collaborative and conflict-free whiteboarding experience, check out our tutorial: Creating a Collaborative Online Whiteboard with Liveblocks.
  • To implement a share dialog, check out our guide: Managing Rooms, Users, and Permissions.
Fireside chat

Ready to get started?

Join thousands of companies using Liveblocks ready‑made collaborative features to drive growth in their products.

Book a demo

Related blog posts

  • How Artefact reinvented collaborative workspaces for technical teams

    How Artefact reinvented collaborative workspaces for technical teams

    Picture of Chris Nicholas
    Picture of Marc Milberg
    April 17th
    Customers
  • How Agility CMS leveraged collaboration to grow their customer base

    How Agility CMS leveraged collaboration to grow their customer base

    Picture of Chris Nicholas
    August 2nd, 2024
    Customers
  • How Hashnode added collaboration to their text editor to sell to larger organizations

    How Hashnode added collaboration to their text editor to sell to larger organizations

    Picture of Steven Fabre
    July 2nd, 2024
    Customers