diff --git a/app/web/src/helpers/cadPackages/cadQueryController.ts b/app/web/src/helpers/cadPackages/cadQueryController.ts
index e63820b..b2c4a81 100644
--- a/app/web/src/helpers/cadPackages/cadQueryController.ts
+++ b/app/web/src/helpers/cadPackages/cadQueryController.ts
@@ -5,9 +5,10 @@ import {
   createUnhealthyResponse,
   timeoutErrorMessage,
   RenderArgs,
+  DefaultKernelExport,
 } from './common'
 
-export const render = async ({
+export const render: DefaultKernelExport['render'] = async ({
   code,
   settings: { quality = 'low' },
 }: RenderArgs) => {
@@ -52,7 +53,7 @@ export const render = async ({
   }
 }
 
-const openscad = {
+const openscad: DefaultKernelExport = {
   render,
   // more functions to come
 }
diff --git a/app/web/src/helpers/cadPackages/common.ts b/app/web/src/helpers/cadPackages/common.ts
index 68ffaee..a55b902 100644
--- a/app/web/src/helpers/cadPackages/common.ts
+++ b/app/web/src/helpers/cadPackages/common.ts
@@ -19,7 +19,20 @@ export interface RenderArgs {
   }
 }
 
-export function createHealthyResponse({ date, data, consoleMessage, type }) {
+export interface HealthyResponse {
+  status: 'healthy'
+  message: {
+    type: 'message'
+    message: string
+    time: Date
+  }
+  objectData: {
+    data: any
+    type: 'stl' | 'png' | 'geometry'
+  }
+}
+
+export function createHealthyResponse({ date, data, consoleMessage, type }: {date: Date; data: any; consoleMessage: string, type: HealthyResponse['objectData']['type'] }): HealthyResponse {
   return {
     status: 'healthy',
     objectData: {
@@ -34,7 +47,16 @@ export function createHealthyResponse({ date, data, consoleMessage, type }) {
   }
 }
 
-export function createUnhealthyResponse(date, message = 'network issue') {
+export interface ErrorResponse {
+  status: 'error'
+  message: {
+    type: 'error'
+    message: string
+    time: Date
+  }
+}
+
+export function createUnhealthyResponse(date: Date, message = 'network issue'): ErrorResponse {
   // TODO handle errors better
   // I think we should display something overlayed on the viewer window something like "network issue try again"
   // and in future I think we need timeouts differently as they maybe from a user trying to render something too complex
@@ -49,4 +71,8 @@ export function createUnhealthyResponse(date, message = 'network issue') {
   }
 }
 
-export const timeoutErrorMessage = `timeout: We're currently limited a 30s execution time. You can try again, sometimes it works the second time`
+export const timeoutErrorMessage = `timeout: We're currently limited to a 30s execution time. You can try again, sometimes it works the second time`
+
+export interface DefaultKernelExport {
+  render: (arg: RenderArgs) => Promise<HealthyResponse | ErrorResponse>
+}
diff --git a/app/web/src/helpers/cadPackages/demoController.ts b/app/web/src/helpers/cadPackages/demoController.ts
new file mode 100644
index 0000000..b42c724
--- /dev/null
+++ b/app/web/src/helpers/cadPackages/demoController.ts
@@ -0,0 +1,32 @@
+// not an actual and there fore not imported into index.ts in this folder,
+// this is boiler plate code for adding new integrations.
+
+import {
+  RenderArgs,
+  DefaultKernelExport,
+} from './common'
+
+export const render: DefaultKernelExport['render'] = async ({
+  code,
+  settings,
+}: RenderArgs) => {
+  // do your magic
+  return {
+    status: 'healthy',
+    message: {
+      type: 'message',
+      message: 'demo',
+      time: new Date()
+    },
+    objectData: {
+      data: 'any',
+      type: 'geometry'
+    }
+  }
+}
+
+const demoController: DefaultKernelExport = {
+  render,
+}
+
+export default demoController