# AI use cases for Open Intelligent UI (thesysdev/open-intelligent-ui) Repo: [thesysdev/open-intelligent-ui](https://github.com/thesysdev/open-intelligent-ui) | Use cases: 4 | Page: https://dedupedai.com/use-cases/thesysdev-open-intelligent-ui/ A TypeScript chat app that streams answers as interactive UI, such as maps, photos, charts and working tools, built on the OpenUI library. This file holds every use case of this repo. Each one starts with a "## " heading and ends with its URL. - Run a chat app that answers trip questions with maps and itineraries: https://dedupedai.com/use-cases/thesysdev-open-intelligent-ui/build-interactive-trip-planner-chat/ - Prototype data dashboards that answer questions with charts and tables: https://dedupedai.com/use-cases/thesysdev-open-intelligent-ui/prototype-dashboard-answers-with-charts/ - Build interactive money tools, such as a loan or bill-split calculator: https://dedupedai.com/use-cases/thesysdev-open-intelligent-ui/run-interactive-calculator-tools-locally/ - Run the chat app on a local model with Ollama and no API key: https://dedupedai.com/use-cases/thesysdev-open-intelligent-ui/run-chat-app-on-local-ollama-model/ ## How to run a chat app that answers trip questions with maps and itineraries with Open Intelligent UI Repo: [thesysdev/open-intelligent-ui](https://github.com/thesysdev/open-intelligent-ui) | Difficulty: Intermediate | Time: 30 minutes | Basis: From the README Run the demo locally and get a map, photos and an editable plan back for a travel request. **Who it is for:** A developer building a travel or city-guide feature who needs answers to look like an interactive page, not plain text. **The problem:** Plain chat replies cannot show a route, photos and an itinerary the user can change. **The outcome:** A local chat at localhost:3000 that answers a travel request with an interactive map, photographs and an editable plan. ### Steps 1. Run `cp .env.example .env` 2. Run `npm install` 3. Run `npm run generate:apiKey` to write THESYS_API_KEY to .env 4. Run `npm run dev`, open http://localhost:3000 and send: I'm in San Francisco for a day, plan a sightseeing route for me ### Prompt to paste into your agent ```text Clone thesysdev/open-intelligent-ui, follow its Setup section, and start the dev server. Send the prompt "I'm in San Francisco for a day, plan a sightseeing route for me" to http://localhost:3000 and report whether the answer includes a Map component. Then list the component names used in src/lib/library.ts that the answer relies on. ``` ### Caveat The street route is a road overview from the public OSRM demo server, not walking or transit directions, and the README does not promise this for production traffic. Disclaimer: Third-party repos we don't own or vouch for. AI-generated use cases can be wrong: review everything and run at your own risk. Full text: https://dedupedai.com/disclaimer/ URL: https://dedupedai.com/use-cases/thesysdev-open-intelligent-ui/build-interactive-trip-planner-chat/ ## How to prototype data dashboards that answer questions with charts and tables with Open Intelligent UI Repo: [thesysdev/open-intelligent-ui](https://github.com/thesysdev/open-intelligent-ui) | Difficulty: Intermediate | Time: 45 minutes | Basis: From the README Open the dev-only gallery to see two dashboards over demo data, then adapt them to your own data. **Who it is for:** An analyst or developer who wants a chat answer that shows a chart and table over business data instead of a text summary. **The problem:** Stakeholders ask data questions and get text, when a live chart and sortable table would answer faster. **The outcome:** A working set of dashboard programs in the gallery, plus a clear path to swap the demo data tools for your own source. ### Steps 1. Run `npm install` and `npm run dev` after copying .env.example to .env and setting THESYS_API_KEY 2. Open http://localhost:3000/gallery to view the two dashboards over demo data 3. Read src/lib/demo-data.ts for the get_orders, get_tickets and get_traffic tools and their specs 4. Replace one demo tool with a function that returns your own rows in the same shape, then rerun the dashboard (inferred, check the README) ### Prompt to paste into your agent ```text In the thesysdev/open-intelligent-ui repo, read src/lib/demo-data.ts and src/app/gallery/tool-programs.ts. Summarize how get_orders feeds a dashboard, and name the Chart types and @functions (such as @GroupBy or @Pivot) the dashboard uses. Verify by opening /gallery after npm run dev. ``` ### Caveat The gallery dashboards run on demo data only, so connecting real business data needs your own tool code that the README does not describe. Disclaimer: Third-party repos we don't own or vouch for. AI-generated use cases can be wrong: review everything and run at your own risk. Full text: https://dedupedai.com/disclaimer/ URL: https://dedupedai.com/use-cases/thesysdev-open-intelligent-ui/prototype-dashboard-answers-with-charts/ ## How to build interactive money tools, such as a loan or bill-split calculator with Open Intelligent UI Repo: [thesysdev/open-intelligent-ui](https://github.com/thesysdev/open-intelligent-ui) | Difficulty: Intermediate | Time: 30 minutes | Basis: From the README Use the working-tool pattern with sliders, @Payment and @Allocate to build a calculator answer. **Who it is for:** A personal finance or product developer who wants a chat answer that is a calculator the user can adjust, not a static table. **The problem:** A loan or split answer in text cannot be adjusted, so users ask again for each change. **The outcome:** A chat answer with sliders that recalculate a payment schedule or a split that adds up to the cent, plus a copy button. ### Steps 1. Run `npm run dev` after setup and open http://localhost:3000 2. Ask for a loan calculator with a slider for the amount and rate 3. Check that the answer binds the sliders to $variables and uses @Payment for the monthly amount 4. Ask for a bill split and check that @Allocate is used so the parts add up to the total ### Prompt to paste into your agent ```text In thesysdev/open-intelligent-ui, read the function list in src/lib/functions/ and confirm @Payment and @Allocate exist. Then send the request "Make a loan calculator with sliders for amount and rate" to the running chat and report which functions and Slider components the generated OpenUI Lang uses. ``` ### Caveat The README says the model writes the UI, so the result depends on the model and is not a verified financial product; check the math before relying on it. Disclaimer: Third-party repos we don't own or vouch for. AI-generated use cases can be wrong: review everything and run at your own risk. Full text: https://dedupedai.com/disclaimer/ URL: https://dedupedai.com/use-cases/thesysdev-open-intelligent-ui/run-interactive-calculator-tools-locally/ ## How to run the chat app on a local model with Ollama and no API key with Open Intelligent UI Repo: [thesysdev/open-intelligent-ui](https://github.com/thesysdev/open-intelligent-ui) | Difficulty: Advanced | Time: 1 hour | Basis: From the README Point the app at a local Ollama model so answers run on your own machine. **Who it is for:** A developer who wants to try or build the interactive chat without sending prompts to a hosted service. **The problem:** The default setup needs an OpenUI Cloud key, which is a barrier for private or offline testing. **The outcome:** A chat at localhost:3000 that answers using a local Ollama model, with the context window set large enough for the prompt. ### Steps 1. Install Ollama, then run `ollama pull qwen3.8:27b` 2. Run `OLLAMA_CONTEXT_LENGTH=32768 ollama serve` so the prompt is not cut 3. In .env, set MODEL_PROVIDER=ollama, then run `npm run dev` 4. Open http://localhost:3000 and send a prompt such as: I'm in San Francisco for a day, plan a sightseeing route for me ### Prompt to paste into your agent ```text In the thesysdev/open-intelligent-ui repo, follow the Run with a local model (Ollama) section: pull qwen3.8:27b, set OLLAMA_CONTEXT_LENGTH to 32768, set MODEL_PROVIDER=ollama in .env and start npm run dev. Send one travel prompt and report whether the answer renders as UI or as broken output. Verify the context window is at least 32768 before testing. ``` ### Caveat The README says local output is rendered as written with no Gateway correction, so smaller models may produce broken UI, and the default model is about 18 GB. Disclaimer: Third-party repos we don't own or vouch for. AI-generated use cases can be wrong: review everything and run at your own risk. Full text: https://dedupedai.com/disclaimer/ URL: https://dedupedai.com/use-cases/thesysdev-open-intelligent-ui/run-chat-app-on-local-ollama-model/