Building OCIF Tools with Cursor Agent and LLM

April 5, 2025

Since march 2024 I have been part of the Open Canvas Working Group where we are building a new specification for Infinite Canvas applications so that they can use each other’s data much more easily: Open Canvas Interchange Format (OCIF). Of course we need a lot of tools for this, and I have been experimenting with Cursor to build some of these tools. These are the tools that I am building:

• OCIF Validator and export tool :
  • This tool will validate OCIF files and export them to other formats (like SVG and tldraw JSON).
• OCIF Generator :
  • This tool will generate OCIF files using an LLM and a set of rules. The LLM will generate the OCIF file based on an input prompt and it’s response format is the OCIF JSON Schema (using Zod)
• Extending Code flow canvas :
  • Code flow canvas is my own infinite canvas application for visual programming that I am building. I have been extending it so that it can import and export OCIF files.

This takes a lot of time, and Cursor is a great help in this. I have been using Cursor to generate the code for these tools and it has been a great experience so far.

This are my take aways for now:

• Starting from scratch (in an empty directory) is possible.. however since my prefert stack for small tools and PoCs is Vite with tailwind and react, and when I started tailwind v4 and vite 6 where just released.. you can imagine what happens : Cursor installs the latest version but has no knowledge of it. So I had to manually adjust the code to make it work. In the future I will just use a template repo for this.

• Even generating an OCIF file with an LLM (using the OpenAI API) is possible, Cursor even generates the basic prompt for this (which is actually a very big prompt). I’ve included a JSON schema for the OpenAI response as well, that is a Zod schema. This prevents the LLM from generating invalid OCIF files and adding unneccesary comments as it’s response.

• To keep the generated code clean and maintainable, I have added some cursor rules files which instruct cursor to use clean code principles, small functions, atomic design, etc. This improves the code quality a lot.

• For bigger custom applications like Code Flow Canvas, I prefer to use github co-pilot when coding manually in a much more “Code completion” mode using the tab-key. Saves me a lot of time as well. I can imagine that in the future applications will be build from scratch taking LLM development in mind. Applications that have a much more custom approach (Code Flow Canvas was build from scratch without libraries or framework) and dont use any libraries or frameworks, are much harder to build with LLMs and maintain. This is probably true for regular human developers as well. Currently there’s a lot of critics on LLM generated code, but I think this will improve greatly in the very near future when we learn how to deal with this using cursor rules and/or github co-pilot instructions.

• Cursor (and LLMs in general) have really advanced the last couple of months: From running tools for managing files/dependencies to automatically checking and fixing linting and typescript errors… if you keep your steps small and incremental, you can build a lot of things with it. I think we are just at the beginning of this revolution and I am really excited to see where this will go.

This is the link to the OCIF Validator and the Github repo for the validator. You can read more about the OCIF specification on the OCIF website.

If you have any questions or feedback, feel free to reach out to me here: maikel@devhelpr.com