DEV Community

Cover image for Notion AI Didn’t Work for Me, So I Built My Own
MrSuperCraft
MrSuperCraft

Posted on

Notion AI Didn’t Work for Me, So I Built My Own

Arc AI is a full-stack Notion-connected AI assistant I built in just 8 days. It was created to solve a simple but painful problem: Notion AI doesn't actually serve developers and power users who want flexible, private, and useful interactions with their workspace.

I’m a full-stack developer with a strong preference for building my own tools, and I’ve used Notion extensively in my productivity workflows. But after months of pushing back against Notion AI's constant marketing and lackluster functionality, I realized it was time to build something I actually wanted to use.

This wasn’t a slow, well-funded build. It was launched in the middle of a chaotic week — I worked on Arc AI between rocket alarms and emergency alerts. Despite the interruptions, I wrote the core logic, built a fully responsive UI, integrated AI providers, and deployed a complete assistant system.

In this post, I’ll walk through how Arc AI was conceived, architected, and shipped — and share the technical insights, hard lessons, and creative problem-solving that brought it to life.


The Problem with Existing AI Tools

For me, the problems started with how Notion AI is positioned — especially for free-tier users.

Even if you never opted into it, it’s everywhere: the bottom-right button, the constant upsells, and the nagging sense that you’re missing out unless you upgrade. That friction wasn’t just visual — it made the workspace feel less like mine and more like someone else’s sales funnel.

When I did try it, the experience was underwhelming. Despite using top-tier models under the hood, Notion AI’s results were generic, disconnected from context, and impossible to shape or personalize.

Beyond Notion AI, I looked into other "Notion AI integrations." Many were wrappers with limited capabilities.

Almost none were:

  • Privacy-respecting
  • Dynamically connected to the actual structure of my workspace
  • Designed with user workflows (not just chat) in mind

And as someone who wanted to eventually control my workspace via scripting or CLI-level precision, all of these tools fell short.

So I decided to build my own.


Vision for Arc AI

Arc AI wasn’t about competing with Notion AI’s marketing or mimicking ChatGPT. It was about building a system that:

  • Respects privacy: No data retention. No analytics. Only BYOK (Bring Your Own Key) support.
  • Connects directly to Notion: No wrappers or middleware. Just real-time sync with your content via an internal integration which can be set up in just 3 minutes.
  • Works like a system, not a chatbot: With actual tools, actions, and workflows.
  • Feels natural across devices: Fully responsive with a clean, minimal interface that doesn’t get in your way.

The goal was to build something that feels like an extension of your own workspace — not an AI intruder.

Everything Arc AI does flows from the assumption that the user should be in control: of their data, their assistant’s behavior, and their models. And that’s what shaped the architecture that followed.


Architecture Overview

Arc AI is built as a modern full-stack application using technologies that enable rapid iteration without compromising on type safety or performance.

Frontend

  • Framework: Next.js with App Router
  • Styling & UI: TailwindCSS + shadcn/ui
  • Component logic: Built with server/client boundaries in mind, using React Server Components where possible

The decision to use the App Router over the legacy Pages Router was intentional. It allowed for more structured layouts, loading states, and a scalable route-driven design that matched the modular nature of Arc AI’s tools.

Backend

  • Database & Auth: Supabase (PostgreSQL + Row Level Security)
  • AI Integration: Vercel AI SDK for model routing, streaming, and tool calling
  • Model support: OpenAI, Groq, and OpenRouter — all accessed via a unified abstraction layer

Each AI request includes customizable settings (temperature, provider, model) and prompt memory pulled directly from the user’s workspace context.


Feature Breakdown

Arc AI isn't just a chatbox on top of Notion — it's a structured tool-based AI assistant with deep integrations.

Core Features

  • Chat interface with real-time streaming: Built with Vercel AI SDK and edge-friendly request handling
  • Notion tool suite:
    • Search pages and filter results
    • Edit content blocks inline
    • Append new structured blocks
    • Summarize page content via prompt chaining
    • And more!

System Tools

  • YouTube transcription tool:
    • Uses a Python-based youtube-transcript-api CLI in development
    • In production, calls a Flask serverless endpoint deployed alongside Arc AI
    • Text output is cached and cleaned before being inserted into Notion pages

Settings + Personalization

  • Model selection and BYOK:
    • OpenAI, Groq, or OpenRouter
    • Users bring their own API keys — no stored sessions, no shared tokens
    • Per-request customization via client-side setting store

Design Decisions

From day one, I aimed to make Arc AI usable on any device — without ever sacrificing clarity or speed.

Layout

  • Mobile-first approach with full responsiveness
  • Tool-first UI: You don’t start with a blank chat — you begin with clear tool choices that map directly to common Notion workflows.
  • Consistent experience across resolutions using grid layouts and dynamic rendering

Visual System

  • Custom color palette: oklch gradient-based system for vibrant but accessible visuals
  • Minimal UI chrome: Low opacity, soft edges, and modular component usage from shadcn/ui

UX Enhancements

  • Voice input support: Used react-speech-recognition and the Web Speech API for full compatibility (browser support may vary).
  • Optimized streaming error recovery: Implemented a robust fallback for failed AI streams, including reset logic and UI feedback.
  • Conditional hydration and SSR-aware layout rendering: Ensured component rendering syncs properly between server and client to avoid layout shifts or hydration mismatches.
  • Minimalist interaction model: Instead of command-heavy prompts, Arc AI offers simple controls and settings to guide the experience.

Many components were repurposed and evolved from my previous open-source project, Luminary — a chatbot starter kit I built during exam week. Arc AI builds on that foundation with more opinionated workflows and real-time feedback loops.


Unique Problems & Creative Solutions

Shipping fast meant constantly solving edge cases on the fly. Here are some of the challenges I tackled head-on:

  • Stream errors from AI providers: Instead of crashing the chat or resetting the user’s progress, Arc AI parses stream errors and surfaces recovery suggestions in-line.
  • Dynamic model fetching: Groq and OpenRouter don’t offer simple model lists — I built logic that queries, validates, and caches available models securely.
  • Handling tokens: Rather than storing vulnerable tokens in a database, I used a military-grade cryptographic hash to check tokens against APIs without compromising privacy, security, or safety.
  • Security-first data strategy: All keys are hashed and stored client-side. No data is stored server-side — even BYOK tokens never touch the backend.
  • Tool-first workflow: Instead of dumping users into a blank chat, Arc AI starts from tool intent — guiding interactions based on actions, not just prompts.

What I Learned

The sprint behind Arc AI pushed me to reevaluate a lot of assumptions about shipping products fast.

  • You can ship a full-stack, real-world product in under 10 days — if your scope is clear and your execution is swift.
  • Privacy isn’t a feature. It’s a foundation. Building with zero data retention (outside essentials) changed how I thought about every UI decision.
  • Voice input is still a premature API on web browsers — unless you have a polyfill such as Whisper, MS Azure Cognitive Services or AWS Transcribe to support speech recognition (all of which are quite expensive). Regardless, there is still an option to support that feature.
  • Open-ended chat isn’t always the best interface. Starting with intent-driven tools made every feature more useful. There are many copy - paste like AI chatbots which feel dull and repetitive, as if you see a new one pop every other day. When you give your product meaning and attention, it will grow.
  • You don’t need a team to make something valuable. You need clarity, constraints, and a real reason to build.

What’s Next

Arc AI is in its alpha stage — and I’m keeping things minimal and focused for now. That said, here’s what’s on the horizon:

  • 🔄 User feedback-driven iteration: I’m actively improving workflows based on usage and feedback.
  • 📦 Prompt packs & public templates: Pre-built prompt sets and use-case guides for Notion creators
  • 🔐 More integrations: Expand support for Claude, Perplexity, and others.
  • 💡 Workflow templates: Possibly exploring a marketplace for Arc-powered Notion templates, or custom workflows made by users.

If you’re a developer or productivity power user who wants an assistant that actually fits your workflow — Arc AI might be for you.


Try it yourself!

🌐 Try Arc.AI: https://arcai-chat.vercel.app

📝 Case Study: Read more

💬 Feedback is always welcome — drop a comment, issue, or DM. I'd love to hear what you'd build in your workspace using Arc.AI.

Top comments (0)