NeXaCard WebMCP — Relationship Copilot

An agent-native relationship copilot that uses WebMCP to remember contacts, understand relationship context, identify follow-ups, and turn natural-language requests into actions.

Comment

The Problem

Professional relationships are easy to lose track of.

After meeting someone at a conference, networking event, or business meeting, the important context often gets scattered across notes, messages, and memory. The result is simple: people forget who they met, what they discussed, and who they should contact next.

NeXaCard WebMCP — Relationship Copilot explores a different approach: make the relationship manager itself agent-native.

What I Built

NeXaCard is a lightweight relationship copilot that lets a person manage professional connections while an AI agent can interact directly with the web application through WebMCP.

The app stores a small local relationship database containing contacts, relationship strength, interaction context, and follow-up state.

Instead of requiring a user to navigate through the UI manually, an agent can understand natural-language requests and select the appropriate WebMCP tool.

For example:

"Who do I need to follow up with this week?"

The agent discovers and invokes the identify_followup WebMCP tool, which returns the contacts needing attention.

The current prototype exposes six WebMCP tools:

  • search_contacts — search the local contact database
  • get_contact_context — retrieve full relationship context
  • get_interaction_history — retrieve past interactions
  • identify_followup — identify contacts needing attention
  • draft_followup — generate a follow-up draft
  • create_followup — create a follow-up task

This creates a simple agent workflow:

Discover → Understand → Remember → Draft → Act

Why WebMCP?

The key idea behind this project is that a web application should not only be something humans click through. It can also expose meaningful capabilities directly to agents.

With WebMCP, the application's functionality is described as structured tools that an agent can discover and invoke.

In the demo, Gemini receives the natural-language request:

"Who do I need to follow up with this week?"

It selects the identify_followup tool, invokes it with the required arguments, receives the application's structured result, and uses that result to answer the user.

The application therefore becomes an agent-accessible interface, rather than simply a visual dashboard.

How I Built It

The project intentionally uses a small, dependency-light architecture:

  • Vanilla HTML
  • CSS
  • JavaScript
  • WebMCP
  • Gemini 3.6 Flash
  • Browser-side local data
  • LocalStorage
  • Netlify for hosting

The WebMCP tools are registered using the browser's document.modelContext API.

No backend server or external database is required for the prototype.

Challenges

The biggest challenge was understanding the difference between a normal web page integration and a genuinely agent-accessible WebMCP application.

I initially experimented with a custom JavaScript interface for exposing tools, but that was not the actual WebMCP API. I replaced that approach with the browser's WebMCP implementation using document.modelContext.registerTool().

I then verified the production deployment by inspecting the registered tools and executing them directly.

The final test demonstrated the complete flow:

Natural-language request → Gemini → WebMCP tool selection → tool execution → structured relationship data → agent response

What I Learned

This project changed how I think about web applications.

Instead of designing only around:

Human → UI → Application

WebMCP enables another interaction model:

Human → Agent → WebMCP Tool → Application

The most interesting part is not simply adding AI to a website. It is giving an agent well-defined capabilities so that the agent can interact with the application's real functionality.

Future Direction

The prototype focuses on professional relationship management, but the same architecture could be applied to many agent-native web applications.

Future versions could add richer relationship intelligence, calendar integration, email workflows, organization-level relationship graphs, and more sophisticated next-action recommendations.

The goal is to make relationship management something an agent can actively help with rather than another dashboard a user has to maintain manually.

Built With

Share this project:

Updates

Submission history