Inside our work / In-house case study

Grimoire: designing an AI-enabled workspace with humans in control.

A personal card collection became a product design challenge: how do you connect what someone owns, what they want to build, and what an AI assistant can help them discover?

Product
Collection & deck intelligence
Our role
Strategy, UX, design & engineering
Built with
Next.js, PostgreSQL, REST & MCP
Grimoire — Your collection. Better decks. A violet card vault beside a mana-curve chart.

01 / The starting point

A collection is only useful if you can build with it.

Magic: The Gathering players make decisions across two worlds. There is the deck they want to play, and there are the physical cards they actually own. A card may exist in several printings, sit in a different binder, or already be committed to another deck. Testing a new idea adds another question: which changes belong to an experiment, and which belong to the deck you are taking to game night?

We built Grimoire to bring those decisions into one private workspace. It tracks exact printings, organizes collections, supports independent deck variations, and surfaces the gaps between a build and the cards available to it. Players can search the catalog, import a decklist, explore a mana curve, and keep strategy notes beside the cards.

For MrKALTech, this self-initiated project also provided a practical setting to explore AI-enabled software. The challenge was to give an assistant enough context to be useful while making its proposed changes understandable and controllable. Grimoire is an in-house demonstration application, available without subscriptions or fees.

Grimoire demo dashboard with owned cards, collection value, active decks, and AI proposals awaiting review
The overview brings inventory, deck building, and the next action into one focused workspace. All screenshots use illustrative demo data.

02 / Product & interface design

Make complexity available without making it overwhelming.

The visual language pairs a restrained violet palette and serif headings with clear, compact interface typography. It gives the product a sense of place while leaving room for card artwork and dense information. Shared spacing, color, and component rules keep collection tables, deck workspaces, and proposal reviews recognizably part of the same application.

Different tasks need different views. Text lists support fast scanning and editing; visual and stacked layouts let players recognize cards by their artwork. The commander receives a prominent position because it defines the deck’s identity. Two-sided card previews account for the way the game actually works, rather than forcing every card into a single-image model.

We also designed for repeated use. A command palette, quantity-aware quick add, deep links, and an organized deck library shorten familiar journeys. On smaller screens, navigation becomes a drawer and the workspace adapts to the available width. Light and dark themes support different environments.

Give experiments a home.

A deck family contains a primary build and independent variations. Each variation keeps its own cards, notes, and analysis, while remaining connected to the original idea. Players can compare builds card by card, promote a favorite, or detach an experiment into a new deck. This makes exploration part of the product’s structure.

Alela Commander deck in Grimoire with card artwork, deck views, and a budget variation in the library
A single deck workspace supports visual browsing and deliberate experimentation. Variations stay grouped with the primary build.

03 / AI as a product capability

Useful AI starts with useful context.

Grimoire connects to external AI assistants through a documented REST API and the Model Context Protocol, or MCP. MCP exposes named tools and resources that a compatible assistant can use to inspect collections, read decks and notes, analyze a build, and propose changes. The user chooses the assistant and grants it a revocable token.

That connection makes a request such as “explore a lower-cost version of this deck using cards I already own” actionable. An assistant can read the current build, consult ownership and analysis tools, and submit a proposed variation. The resulting suggestion refers to real application data and can appear in the same workspace the player already uses.

The innovative part is how these capabilities fit together: contextual access, domain-specific tools, persistent experiments, and a visible review process. The application supplies structured facts; the assistant interprets intent and suggests possibilities; the player controls what happens next.

  1. 01

    Read the context

    Decks, collection, notes, and analysis.

  2. 02

    Propose a change

    Concrete card operations or a new variation.

  3. 03

    Review & decide

    The player inspects the suggestion.

  4. 04

    Apply & record

    Validated changes become saved state.

Permissions are part of the experience.

Tokens receive read and propose access by default. Proposed deck, collection, and wishlist changes wait for review, expire after 24 hours, and record their outcome. Deck revisions protect against applying suggestions based on an outdated build. Database transactions keep a successful application and its audit record together.

More automation is an explicit choice. An optional apply permission supports direct actions such as deck creation and note updates. A separate approval setting can allow apply-scoped proposals to run immediately; propose-only tokens and collection imports still require review. The article’s example shows the default review workflow. These controls define what an assistant may do; they do not guarantee the quality of its advice.

Pending AI proposal to replace Rhystic Study with Curiosity, showing the changes, warning, and review controls
A proposed card swap becomes a concrete decision. This illustrative suggestion was submitted through Grimoire’s API and remains pending for human review.

04 / Engineering the foundation

Reliable collaboration needs reliable state.

Grimoire uses Next.js, React, and TypeScript for its application and API, backed by PostgreSQL. A relational model fits the product: cards have printings, collection lots refer to printings, decks contain card entries, and deck families share relationships. Those distinctions matter when the interface—or an assistant—asks what is owned and what is available.

Model the physical world accurately.

Owning three copies of a card does not necessarily mean three are available. Grimoire accounts for commitments across active primary decks. When analyzing a variation, it substitutes that build for its primary; sibling experiments do not all reserve the same cards. The result is ownership analysis that reflects how players compare alternatives.

Keep facts and suggestions distinct.

Legality checks, mana curves, card counts, and ownership gaps are calculated by application logic. Card data and imagery come from Scryfall. Commander bracket assessments and prices remain estimates. Giving an AI assistant access to these tools grounds its reasoning in inspectable results, while leaving strategic judgment open to the player.

Design for interruption and change.

Collection imports run as durable jobs with progress, unresolved rows, and a review step. Catalog lookups are rate-limited, and exact-printing resolution happens on the server. Separate build and family revisions protect edits at the right level: changing a notebook and changing family membership are different operations with different conflicts.

Performance work followed the same practical approach. Compact MCP collection responses reduce unnecessary payload, batched card caching avoids repeated connection work, and connection-pool tuning suits serverless deployment. In the interface, loading states and background proposal application make waiting visible while keeping navigation available.

Grimoire deck analytics with mana color requirements, a mana curve, card types, and card price estimates
Deterministic analysis gives players and connected assistants a shared factual foundation for discussing a deck.

05 / Trust & portability

Private work. Intentional sharing.

A collection can contain more than card names: purchase information, personal notes, and plans for future builds all belong to its owner. Grimoire keeps the workspace behind sign-in and lets users export their data.

Public deck links are a deliberate, revocable action. They expose one selected build, while leaving notebooks, budgets, collection ownership, the maybeboard, and sibling builds private. API tokens cannot publish a deck to the public web. The public deck page reuses the core decklist presentation, so sharing retains the product’s visual quality.

For an agency, these details are central to delivery. Access boundaries, understandable feedback, and data portability all shape whether a product deserves a place in someone’s daily workflow.

Grimoire on a mobile screen with the commander card, ownership indicators, and a compact creature list
The same deck, adapted for a smaller screen.

The takeaway

Build the workflow that makes AI useful.

Grimoire demonstrates how MrKALTech approaches a digital product: understand the real decisions, shape a clear interface around them, and engineer the data and permissions that make the experience dependable. AI becomes useful when it can work within that foundation.

If your team is exploring a custom application or AI integration, the same questions apply: what context does the assistant need, what actions should it be allowed to take, and how will people review the result?