Model or dataset
Tiledesk/design-studio avatar
Tiledesk/design-studio

Tiledesk Design Studio: a graph editor that will not boot without a Tiledesk token

Tiledesk's open-source visual, no-code designer where LLM/GPT AI meets a flexible 'graph' approach. Create conversations and automations effortlessly – a Voiceflow and Botpress alternative.

465 stars97 forksTypeScriptMIT

At a glance

What is it?
Design Studio is the MIT-licensed Angular front end for Tiledesk's drag-and-drop chatbot builder. It is a visual editor for conversation graphs, not a self-contained bot platform, and the README says so in a section most readers skip.
Who is it for?
Adopt Design Studio if you already run a Tiledesk instance and want the MIT-licensed editor source in your own build, or if you are reading it to learn how a node graph for conversations is modelled in Angular. Do not adopt it as a standalone bot builder: the README states it cannot run standalone, and the documented startup path is a tiledesk_token in browser local storage plus a URL of the form /#/project/<project_id>/chatbot/<chatbot-id>/blocks.
Can I use it commercially?
Yes. MIT is a permissive licence: you can use, modify and sell software built on it, as long as you keep its copyright and licence notices.
Is it still maintained?
Yes. The repository received new commits within the last day.
What is it written in?
Mainly TypeScript, according to GitHub's language statistics.

Answers come from the project's GitHub data, last synced on September 15, 2026, and from our analysis. They are not legal advice.

DEEP OPEN-SOURCE ANALYSIS

The problem is conversation graphs, not chat widgets

A support bot that only answers questions is a text box with a model behind it. A support bot that hands a billing dispute to a human, writes the contact to a CRM, and sends a follow-up email is a state machine, and state machines are painful to edit as prose. Design Studio exists to make that state machine visible. The README describes a drag-and-drop interface with pre-ready actions and integrations, and lists the node types by name: Conditions, Random Reply, Web Request, Send Email, WhatsApp Integration, ChatGPT Integration. Those are graph nodes, not settings. Each one is a step the conversation passes through.

The audience is narrow and worth stating plainly. This is for people who already run Tiledesk and want to author flows inside it, and for developers who want to read or fork an Angular implementation of a conversational graph editor. It is not for someone who wants a hosted bot builder they can sign into today, and it is not for someone who wants to embed a chat widget, since the widget is a different part of the Tiledesk stack. The repository is the editor, and the editor is one panel of a larger product.

What the graph actually executes

The README does not document a runtime, and that absence is the most important architectural fact here. Design Studio is generated with Angular CLI 14.2.6, so the repository is a single-page application. The nodes you drag onto the canvas are data. The README attributes execution to the wider Tiledesk solution: the ChatGPT node finds answers in a knowledge base, the Web Request node connects the bot to other tools and gives HubSpot CRM as the example, the Send Email node fires on triggers. The editor's job is to produce and edit the graph; something else walks it.

That split explains the node list. Conditions and Random Reply are branching and selection primitives that belong in a graph. Web Request and Send Email are side effects that belong in a runtime with credentials. ChatGPT Integration sits between them: the editor configures it, the platform calls the model. If you are evaluating Design Studio as an AI orchestration layer, you are evaluating the wrong repository. If you are evaluating it as a graph authoring surface, the node set is coherent and the separation is sensible.

The README also lists Light Integration, described as enhancing an existing setup without disruption. The description is marketing prose and the mechanism is not explained in the material available, so treat that item as unverified until you read the source.

Running it means joining an existing Tiledesk deployment

The build commands are standard Angular and are stated directly in the README. `ng serve` starts a dev server on `http://localhost:4200/` with reload on file change. `ng build` writes artifacts to `dist/`. `ng test` runs unit tests through Karma. `ng generate component component-name` scaffolds a component, and the README lists the other schematics: directive, pipe, service, class, guard, interface, enum, module. `ng e2e` is mentioned but the README says you must first add a package that implements end-to-end testing, so there is no e2e suite in the box.

The startup path is where this project differs from almost every other open source bot builder. The README has a section titled Important Note: Running Design Studio, and it states that the application cannot run standalone because it is tightly integrated with the Tiledesk solution. The documented steps are: have an authenticated Tiledesk environment, add a key `tiledesk_token` to browser local storage containing your Tiledesk authentication token, then open a URL matching `http://loalhost/#/project/<project_id>/chatbot/<chatbot-id>/blocks`. The host in that pattern is misspelled in the README as `loalhost`; read it as localhost. Note the hash routing and the three identifiers in the path: project, chatbot, blocks. The editor is scoped to one chatbot's block graph at a time.

If you fork this to run against your own backend, the token key name and the route shape are the two contracts you have to satisfy or replace.

The token handoff is the adoption cost

Putting an authentication token into browser local storage is a deliberate choice, and it is the reason the README calls the dependency tight rather than optional. The editor has no login screen of its own, no session refresh described in the material, and no documented way to point it at a different identity provider. You authenticate somewhere in Tiledesk, copy the token, and paste it into storage. For local development against a Tiledesk instance you control, that is fine. For anything resembling a shared or production deployment, it means the security boundary lives entirely in the surrounding Tiledesk platform, not in this repository.

There is a second constraint in the same section. The editor needs a project and a chatbot to exist before it opens. You cannot launch it, create a project from scratch, and start drawing. The graph is addressed by ID, which implies the chatbot record is created elsewhere in Tiledesk and Design Studio edits its blocks. Teams expecting a greenfield builder will find the first ten minutes are spent provisioning objects in another system.

The README does not state which Tiledesk versions are compatible, whether the token format has changed over time, or what happens when the token expires mid-session. Those are the questions to answer before you put this in front of anyone who is not a developer.

Version 1.0.6 and the Angular 14 pin

The most recent release in the material is 1.0.6, dated 2023-11-25. The repository's last push is later, 2026-09-10, so commits continue between tagged releases. That gap is a maintenance signal, not a verdict: it means the tagged artifact you might pin to is old, and the moving edge is the master branch.

The Angular CLI version is 14.2.6, stated in the README as the generator version. Angular 14 is several major versions behind current Angular, and upgrading an application of this shape touches the router, forms, and the component library the graph canvas is built on. Nothing in the material describes an upgrade path or a migration plan. If you fork Design Studio, budget for either staying on Angular 14 or owning that migration yourself, because the README offers no guidance on it.

The licence is MIT, which permits commercial use, modification, and redistribution provided the copyright notice and permission notice are preserved. That is a permissive arrangement and it is the main reason the tight coupling to Tiledesk is tolerable: you can take the editor and repoint it. This is a description of the licence terms, not legal advice; read the LICENSE file in the repository and consult counsel if the deployment matters commercially.

Where a different approach wins

Botpress is the comparison the repository itself invites through its topic tags, and the difference is structural rather than a feature checklist. Botpress ships a studio and a runtime together, so the graph you draw and the engine that executes it are versioned as one system. Design Studio deliberately does not: the README's standalone warning is the product decision. The upside is that the editor is small, MIT-licensed, and separable. The downside is that you cannot evaluate whether a flow will behave correctly by reading this repository alone, because the behaviour lives in Tiledesk.

Voiceflow, the other name in the tags, is a hosted product, so the trade is control against operational burden. With Design Studio you run the front end and you depend on a Tiledesk backend you also have to run or subscribe to. If your team has no interest in operating that backend, a hosted designer is the honest choice, and no amount of MIT licensing changes the arithmetic.

A third option worth naming: if your automation is mostly API calls and scheduled jobs with a thin conversational surface, a general workflow engine plus a chat front end may fit better than a conversation-specific graph editor. Design Studio's node vocabulary is tuned for dialogue, with Conditions, Random Reply, and human handoff as first-class steps. Outside that shape, the editor's structure becomes overhead.

Who should take this and what to check first

Take it if you run Tiledesk and want the editor source under your own control, or if you are studying how a no-code conversation graph is represented in an Angular application. The MIT licence makes both of those reasonable. Take it cautiously if you are choosing a bot platform from scratch, because you would be adopting two things at once: this editor and the Tiledesk deployment it requires.

Skip it if you need a standalone tool, if you need a documented upgrade path from Angular 14, or if you cannot accept a local-storage token as the authentication mechanism. The README does not describe a supported alternative to any of those three.

Before you commit, verify against your own checkout: that your Tiledesk environment issues a token the editor accepts under the `tiledesk_token` key, that you can construct a working `/#/project/<project_id>/chatbot/<chatbot-id>/blocks` route against your deployment, and that the pinned Angular 14.2.6 toolchain builds on your Node version. The README's own forum and feedback board are the documented support channels, and the public roadmap is where planned work is listed. None of that substitutes for reading the source, which is the only place the API contract between this editor and Tiledesk is written down.

Editorial conclusion

Adopt Design Studio if you already run a Tiledesk instance and want the MIT-licensed editor source in your own build, or if you are reading it to learn how a node graph for conversations is modelled in Angular. Do not adopt it as a standalone bot builder: the README states it cannot run standalone, and the documented startup path is a tiledesk_token in browser local storage plus a URL of the form /#/project/<project_id>/chatbot/<chatbot-id>/blocks. Before committing, verify three things against your own checkout: that your Tiledesk version still issues tokens the editor accepts, that the pinned Angular 14.2.6 toolchain builds on your Node version, and that the API endpoints the editor calls match your deployment, since none of that wiring is documented in this repository.

Official sources

  1. License: MIT
  2. Project website
  3. README
  4. Releases
  5. Tiledesk/design-studio on GitHub
Community notes

Community notes