Kaizen Teams

Dropdown

Table of Contents

Time to read

·

12

Published on

·

April 11, 2018

Last updated on

·

April 10, 2026

Eduardo Mereles, Full-Stack Developer at Kaizen Softworks

Eduardo Mereles

Responsibility police

Full-Stack Developer

Technology

Technology

How to Setup Firebase Push Notifications with a .NET Backend

Published on

·

April 10, 2026

Last updated on

·

April 10, 2026

Time to read

·

12

Eduardo Mereles, Full-Stack Developer at Kaizen Softworks

Eduardo Mereles

Full-Stack Developer

At Kaizen Softworks, we are currently working on a site that uses Angular 2, .NET and Azure as main technologies.

In addition to this project, one of our partners was needing a mobile application that was going to use the same database as the web app. To facilitate communication between the backend and all of their applications, we needed a robust solution for sending notifications with concealed information to the mobile app.

After a thorough proof of concept, we decided to harness the capabilities of Firebase to bridge the gap between our backend and various applications.

What is Firebase?

Firebase serves as a Backend as a Service (BaaS) that simplifies the creation of a backend with minimal coding expertise. It offers seamless integration with various platforms, including iOS, Android, Unity, and C++.

Firebase's extensive range of services spans authentication, storage, real-time database, crash reports, and Firebase Cloud Messaging (FCM), which is instrumental for push notifications.

Advantages of Firebase Cloud Messaging (FCM)

FCM gives us many advantages, here is the list of the most important:

  1. Cost-Effective: FCM offers unlimited use for free, making it a budget-friendly choice.
  2. Multi-Platform Integration: It seamlessly integrates with multiple platforms, simplifying the development process.
  3. Well-Documented: Firebase provides comprehensive documentation, making it user-friendly.
  4. Swift Delivery: FCM ensures that 95% of all notifications experience a minimal delay of just 250ms from the time of dispatch to reception on the recipient's platform (courtesy of Google).
  5. Audience Targeting: You can tailor messages to specific devices, platforms, or user groups.
  6. Versatile Messaging: Messages can be dispatched via the Firebase Console or the Firebase API.

Here's the FCM flow:

Graphic of Firebase Cloud Messaging Flow

Setting up the Client-Side

Now that the Firebase introduction is finished, it’s coding and configuring time.

To begin, create a Firebase Console project using your Google account. Once in the Firebase dashboard, select 'Add project'. Specify your project's name and region, and then click on 'Create project'.

Ok, you’re done! You have your project created, so now you are able to use all Firebase functionalities!

You must register each platform you intend to configure Firebase for. In this tutorial, we'll focus on configuring an Android project.

During app registration, you'll need to fill in the package name according to your app's specifications. Firebase's initial project already contains the package name, typically set as 'com.google.firebase.quickstart.fcm'. You can find these projects in the documentation samples section.

Following app registration, you'll need to download and add the 'google-services.json' file to your project. If you haven't already received it from Firebase, they will provide it.

Additionally, don't forget to add FCM dependencies, as they are essential for Firebase to function seamlessly within your app.

Screenshot of Firebase Cloud Messaging Menu

Well done, your client side is ready, if you want more information about client side configuration you can get it on the documentation guide for Android or for iOS or other platforms you will find on the side panel of the Cloud Messaging documentation page.

Obtaining Device Tokens

For each app-installation, Firebase is going to create a token that identifies it, so in case of sending a notification to that specific app-installation, you will need that token.

To learn about getting this token, please read 'Access the device registration token' part on the setting up section of the platform you want to configure Firebase to.

Well done, your client side is ready, if you want more information about client side configuration you can get it on the documentation guide for Android or for iOS or other platforms you will find on the side panel of the Cloud Messaging documentation page.

Sending Our First Notification

We can send push notifications without a fully configured backend, using the Firebase console.

To do this, navigate to your Firebase project, select 'Notifications' in the side panel, and click 'Send your first message'. This will take you to this configuration panel:

Screenshot of Firebase Cloud Messaging

Here you'll need to provide the following details:

  • Message text: The main content of your notification.
  • Target: Define the devices you want to reach, selecting from options like "User segment," "Topic," or "Single device." Each target allows you to tailor your message effectively.

Once you've filled in these fields, click 'SEND MESSAGE'.

A pop-up will display, summarizing the key details of your notification. Click 'SEND', and your push notification is on its way!

Screenshot of Firebase-Cloud Messaging Notification

Configuring Your .NET Backend

For this example, we'll use a .NET backend – a console project designed specifically for a .NET Meetup in Uruguay.

To access the Firebase API, you'll need critical information from Firebase, including the API URL (https://fcm.googleapis.com/fcm/send) and a unique server key that authenticates your Firebase project for security purposes.

To obtain the server key:

  1. Access 'Project settings' as depicted in the image.
  2. Select the 'Cloud Messaging' tab.
  3. Find the server key in the 'Project credentials' section.
Screenshot of Firebase Cloud Messaging Project Settings

Time to Code the Backend

In addition to the API URL and server key, you'll require a method with specific parameters to communicate with the Firebase API. For this purpose, create a static class named "PushNotificationLogic.cs" containing the following method:

Push Notifications Logic Code Method

These parameters are:

  • deviceTokens: An array of strings, each string represents a FCM token provided by Firebase on each app-installation. This is going to be the list of app-installations that the notification is going to send.
  • title: It’s the bold section of a notification.
  • body: It represents 'Message text' field of the Firebase SDK, this is the message you want to send to the users.
  • data: These is a dynamic object, it can be whatever you want because this object is going to be used as additional information you want to send to the app, it’s like hidden information. For example an action you want to execute when the user presses on the notification or an id of some product.

For the method, I am going to suppose that all parameters are correct without bad values (you can add all the validations you want). The first thing we have to do is to create an object with all the data we need to send to the API, I created two classes for that:

public class Message
{
public string[] registration_ids { get; set; }
public Notification notification { get; set; }
public object data { get; set; }
}
public class Notification
{
public string title { get; set; }
public string text { get; set; }
}

Then, just create a new object of type 'Message' and serialize it as I did it here:

var messageInformation = new Message()
{
notification = new Notification()
{
title = title,
text = body
},
data = data,
registration_ids = deviceTokens
};
//Object to JSON STRUCTURE => using Newtonsoft.Json;
string jsonMessage = JsonConvert.SerializeObject(messageInformation);

Now we just need a request to Firebase API and we’re done.

The request has to be as a "Post" Method to the Firebase API-Url, we have to add a Header which is "Authorization" and use a value like: “key={YourServerKey}”.

Then we add the content (jsonMessage) and you are ready to hit the api.

Here it is the code you need to do the last part:

// Create request to Firebase API
var request = new HttpRequestMessage(HttpMethod.Post, FireBasePushNotificationsURL);
request.Headers.TryAddWithoutValidation(“Authorization”, “key=” + ServerKey);
request.Content = new StringContent(jsonMessage, Encoding.UTF8, “application/json”);
HttpResponseMessage result;
using (var client = new HttpClient())
{
result = await client.SendAsync(request);
}

Thank You For Reading!

At Kaizen Softworks, we are currently working on a site that uses Angular 2, .NET and Azure as main technologies.

In addition to this project, one of our partners was needing a mobile application that was going to use the same database as the web app. To facilitate communication between the backend and all of their applications, we needed a robust solution for sending notifications with concealed information to the mobile app.

After a thorough proof of concept, we decided to harness the capabilities of Firebase to bridge the gap between our backend and various applications.

What is Firebase?

Firebase serves as a Backend as a Service (BaaS) that simplifies the creation of a backend with minimal coding expertise. It offers seamless integration with various platforms, including iOS, Android, Unity, and C++.

Firebase's extensive range of services spans authentication, storage, real-time database, crash reports, and Firebase Cloud Messaging (FCM), which is instrumental for push notifications.

Advantages of Firebase Cloud Messaging (FCM)

FCM gives us many advantages, here is the list of the most important:

  1. Cost-Effective: FCM offers unlimited use for free, making it a budget-friendly choice.
  2. Multi-Platform Integration: It seamlessly integrates with multiple platforms, simplifying the development process.
  3. Well-Documented: Firebase provides comprehensive documentation, making it user-friendly.
  4. Swift Delivery: FCM ensures that 95% of all notifications experience a minimal delay of just 250ms from the time of dispatch to reception on the recipient's platform (courtesy of Google).
  5. Audience Targeting: You can tailor messages to specific devices, platforms, or user groups.
  6. Versatile Messaging: Messages can be dispatched via the Firebase Console or the Firebase API.

Here's the FCM flow:

Graphic of Firebase Cloud Messaging Flow

Setting up the Client-Side

Now that the Firebase introduction is finished, it’s coding and configuring time.

To begin, create a Firebase Console project using your Google account. Once in the Firebase dashboard, select 'Add project'. Specify your project's name and region, and then click on 'Create project'.

Ok, you’re done! You have your project created, so now you are able to use all Firebase functionalities!

You must register each platform you intend to configure Firebase for. In this tutorial, we'll focus on configuring an Android project.

During app registration, you'll need to fill in the package name according to your app's specifications. Firebase's initial project already contains the package name, typically set as 'com.google.firebase.quickstart.fcm'. You can find these projects in the documentation samples section.

Following app registration, you'll need to download and add the 'google-services.json' file to your project. If you haven't already received it from Firebase, they will provide it.

Additionally, don't forget to add FCM dependencies, as they are essential for Firebase to function seamlessly within your app.

Screenshot of Firebase Cloud Messaging Menu

Well done, your client side is ready, if you want more information about client side configuration you can get it on the documentation guide for Android or for iOS or other platforms you will find on the side panel of the Cloud Messaging documentation page.

Obtaining Device Tokens

For each app-installation, Firebase is going to create a token that identifies it, so in case of sending a notification to that specific app-installation, you will need that token.

To learn about getting this token, please read 'Access the device registration token' part on the setting up section of the platform you want to configure Firebase to.

Well done, your client side is ready, if you want more information about client side configuration you can get it on the documentation guide for Android or for iOS or other platforms you will find on the side panel of the Cloud Messaging documentation page.

Sending Our First Notification

We can send push notifications without a fully configured backend, using the Firebase console.

To do this, navigate to your Firebase project, select 'Notifications' in the side panel, and click 'Send your first message'. This will take you to this configuration panel:

Screenshot of Firebase Cloud Messaging

Here you'll need to provide the following details:

  • Message text: The main content of your notification.
  • Target: Define the devices you want to reach, selecting from options like "User segment," "Topic," or "Single device." Each target allows you to tailor your message effectively.

Once you've filled in these fields, click 'SEND MESSAGE'.

A pop-up will display, summarizing the key details of your notification. Click 'SEND', and your push notification is on its way!

Screenshot of Firebase-Cloud Messaging Notification

Configuring Your .NET Backend

For this example, we'll use a .NET backend – a console project designed specifically for a .NET Meetup in Uruguay.

To access the Firebase API, you'll need critical information from Firebase, including the API URL (https://fcm.googleapis.com/fcm/send) and a unique server key that authenticates your Firebase project for security purposes.

To obtain the server key:

  1. Access 'Project settings' as depicted in the image.
  2. Select the 'Cloud Messaging' tab.
  3. Find the server key in the 'Project credentials' section.
Screenshot of Firebase Cloud Messaging Project Settings

Time to Code the Backend

In addition to the API URL and server key, you'll require a method with specific parameters to communicate with the Firebase API. For this purpose, create a static class named "PushNotificationLogic.cs" containing the following method:

Push Notifications Logic Code Method

These parameters are:

  • deviceTokens: An array of strings, each string represents a FCM token provided by Firebase on each app-installation. This is going to be the list of app-installations that the notification is going to send.
  • title: It’s the bold section of a notification.
  • body: It represents 'Message text' field of the Firebase SDK, this is the message you want to send to the users.
  • data: These is a dynamic object, it can be whatever you want because this object is going to be used as additional information you want to send to the app, it’s like hidden information. For example an action you want to execute when the user presses on the notification or an id of some product.

For the method, I am going to suppose that all parameters are correct without bad values (you can add all the validations you want). The first thing we have to do is to create an object with all the data we need to send to the API, I created two classes for that:

public class Message
{
public string[] registration_ids { get; set; }
public Notification notification { get; set; }
public object data { get; set; }
}
public class Notification
{
public string title { get; set; }
public string text { get; set; }
}

Then, just create a new object of type 'Message' and serialize it as I did it here:

var messageInformation = new Message()
{
notification = new Notification()
{
title = title,
text = body
},
data = data,
registration_ids = deviceTokens
};
//Object to JSON STRUCTURE => using Newtonsoft.Json;
string jsonMessage = JsonConvert.SerializeObject(messageInformation);

Now we just need a request to Firebase API and we’re done.

The request has to be as a "Post" Method to the Firebase API-Url, we have to add a Header which is "Authorization" and use a value like: “key={YourServerKey}”.

Then we add the content (jsonMessage) and you are ready to hit the api.

Here it is the code you need to do the last part:

// Create request to Firebase API
var request = new HttpRequestMessage(HttpMethod.Post, FireBasePushNotificationsURL);
request.Headers.TryAddWithoutValidation(“Authorization”, “key=” + ServerKey);
request.Content = new StringContent(jsonMessage, Encoding.UTF8, “application/json”);
HttpResponseMessage result;
using (var client = new HttpClient())
{
result = await client.SendAsync(request);
}

Thank You For Reading!

Related Articles

View all articles

·

Aug 14, 2026

Running Synthetic Users Into Claude Code

A synthetic user research framework, turned into a Claude Code plugin that runs automated UX tests with AI agents, step by step.

12 read time

Read more

A synthetic user is a constrained AI decision agent defined by twelve fields, from functional role and context to assumptions and abandonment rules.

In the previous post I built an early, working implementation, and the next question was whether the same rules could hold up in a repeatable, automated test.

This post is that next step: how I turned the framework into a Claude Code plugin, and the technical decisions behind adapting methods designed for people into something an AI can execute without cheating.

Why “find the usability issues” is not enough

Give a model a URL and ask it to “find the usability issues.” It works halfway. And the “halfway” is the interesting part, It gives you a generic list, correct in the abstract, useless in practice.

A usability issue matters because of who encounters it and under what conditions.

Using an app from bed is not the same as using it on a factory floor. Urgency changes, lighting changes, attention changes, previous knowledge changes. The same confusing button can be irrelevant to a power user and an abandonment point for an operator wearing gloves.

The whole design comes from that observation: the AI does not evaluate the interface. It acts as a specific person in front of the interface.

The person brings the context with them. And the context turns a list of defects into a list of priorities.

Anatomy of a simulation

An orchestrator controls the browser through Playwright MCP. It reads each screen as an accessibility snapshot: text, roles, states, no guessing pixels. Then it acts on specific elements.

The decision on each screen is made by an isolated subagent, which returns a JSON for each step:

{

  "action": "...",

  "clarityLevel": "High|Medium|Low",

  "doubtDetected": true,

  "reason": "...",

  "abandoned": false,

  "estimatedTimeSeconds": 40,

  "emotionalState": "...",

  "memory": "..."

}

Two rules make this look more like a person and less like an oracle.

1. The evaluator never sees the end.

The evaluator receives one screen at a time, without knowing how many are left or what comes next in the flow.

If the interface leaves room for a mistake, the synthetic user makes the mistake. It clicks where a person would click, not where it is convenient to click in order to complete the test. This is where the framework’s forbidden assumptions live. The agent cannot assume backend logic or mentally complete what the screen does not show.

2. Emotion is memory, not decoration.

The memory field travels from one step to the next. The emotional state is inherited and accumulates. A frustration +1 persists. This detects something that is structurally invisible to any test that evaluates screens separately.

Screen five does not necessarily fail because of screen five. It fails because the user gets there with accumulated frustration.

Evaluated alone, that screen passes. Evaluated by someone carrying three doubts and one broken promise, it triggers abandonment. In the first post, I wrote that doubt is not failure. It is the signal that reveals structural friction.

Emotional memory is that idea turned into architecture.

Eight subagents, one job each

Each subagent gets a clean context. It knows the minimum required to do its job.

That ignorance is deliberate.

The agent acting as the user does not know what the orchestrator knows. It cannot compensate for bad design with knowledge a real person would not have.

Subagent

What it does

Subagent What it does
synthetic-screen-evaluator Acts as the user on one screen and returns the JSON for that step
synthetic-flow-synthesizer Reads the complete run and writes the report. It never simulates again
synthetic-profile-generator Generates a complete profile from an approved spec, choosing from a controlled vocabulary
synthetic-autopilot-synthesizer Consolidates N runs and classifies findings by convergence across users
heuristic-persona-generator Creates the 3 persona raters based on the business being evaluated
heuristic-expert-evaluator Detects violations of the 10 heuristics using forced enumeration
heuristic-persona-rater Scores each finding from the experience of ONE persona. It runs ×3
heuristic-report-synthesizer Builds the final report using the already computed numbers

Adapting a human test: the heuristic evaluation

A textbook heuristic evaluation uses three to five human evaluators because each human finds different problems.

My first experiment was literal, and it went meh.

I iterated until I reached two synthetic detection runs with different agents, coverage was extremely high, but it exposed another problem: an unmanageable list. Dozens of valid issues, very few important ones.

The final design separates those two jobs.

1. An expert finds violations.

Based on Nielsen’s literature, an expert goes through each screen and is forced to produce a verdict for every heuristic: 

  • Violation
  • Clean
  • Not observable

Each verdict includes textual evidence from the snapshot, forced enumeration breaks the habit of reporting only the things that stand out.

2. Three synthetic personas decide what matters based on what they bring with them: context, emotions, urgency, and constraints.

Three synthetic personas are generated according to the business being evaluated: 

  • power user
  • average user
  • low digital literacy

They score the findings without seeing the expert’s conclusions. The same issue can matter very differently depending on what each persona brings to it.

The formula is business impact × usability impact, with agreement between personas as the tiebreaker.

This keeps issue detection and user impact as separate jobs: the expert identifies the violations, and the personas help determine which ones deserve attention first.

Three modes, and a tool for building users

The plugin currently has three modes.

simulation-run (custom)

You build a profile field by field in the Synthetic User Builder, the tool I built to materialize the framework.

First come the attributes: 

  • Role in relation to the product
  • Boundaries
  • Initial emotional state
  • Context
  • Forbidden assumption

Only after that, and separately, comes the task.

The profile describes how someone decides, never what they have to do. That is why the same profile can be reused across tests.

simulation-auto (inferred)

You only give it the URL.

It researches the business, infers the typical roles, proposes users with tasks, and you adjust that proposal in natural language before anything runs.

heuristic-test (inspection)

The heuristic test described above, for one screen, one flow, or the entire site.

Everything run becomes a file

Every run leaves Markdown artifacts inside the project:

user-simulation-tests/

├── simulation/

│   ├── profiles/    ← users: the .md used for simulation + a .builder.json

│   │                   that can be imported back into the Builder and edited manually

│   └── results/     ← one report per run + the consolidated report from auto mode

└── heuristic/

    ├── personas/    ← the 3 raters + business research, reused across runs

    └── results/     ← reports with the prioritized findings table

Simulation reports include the full step by step flow, the emotional arc, risks, and a single “Fix this first.”

The consolidated report classifies findings by convergence: did one user suffer from this, or did all of them?

The decision to keep everything as accumulating .md files is strategic.

These are different runs, using different lenses, that can be analyzed together later, crossing heuristic violations with simulated emotions answers something no individual test gives us:

Of everything that is wrong, what actually matters?

Models and costs

What worked for me for the synthesis subagents:

  • For reports, consolidation, and the heuristic expert, the best available model makes sense. That is where the judgment lives.
  • For the screen evaluator, a medium and fast model is enough. There are many short, constrained calls, and the profile already restricts the decision.
  • The raters are the lightest case.

A complete run consumes between 100k and 400k tokens, depending on the model and mode, in around 20 minutes.

That is the cost of a test that previously required coordinating the schedules of three professionals, and that can now run against every iteration of the product.

See it in action

Here's a complete run against our site, kzsoftworks.com: a skeptical "Business Leader" profile, five live browser steps, and a full Markdown audit in under three minutes that names the exact moment the executive persona lost trust.

It is still early, but it already runs

Every rule in the framework became an architectural constraint: clean context, one screen at a time, emotional memory, forbidden assumptions.

The plugin is open source: github.com/PabloManzoni/user-simulation.

Three commands, and the inferred mode only needs your URL.

If you try it and your synthetic user abandons on screen three, you already know what it means:

It is not failure. It is the signal.

·

Aug 14, 2026

Generative UI: How to keep the experience under control

Generative UI can adapt interfaces to each user, but it adds risks around reliability, latency, cost, security, and accessibility. Learn the architecture that keeps those risks under control.

12 read time

Read more

Generative UI assembles the interface around what each user is trying to do, instead of showing everyone the same fixed screen. That flexibility comes with real considerations: keeping the experience consistent, secure, and easy to support once it's live. This post covers what generative UI is worth building for, what it costs, and how teams keep it under control.

Generative UI works best when the experience is dynamic, but the system behind it stays tightly controlled.

Start by defining which parts of the interface can change, which cannot, and what must be validated before anything reaches the user.

TL;DR

  • Interfaces can adapt to user context, support more variations without designing every screen by hand, and reduce unnecessary steps in a workflow.
  • The trade-offs include inconsistent experiences, unreliable or unsafe output, added latency and infrastructure cost, and harder analytics and debugging.
  • Better prompting can reduce unwanted behavior, but it cannot guarantee reliability, security, or consistency. Those controls need to exist around the model: a stable interface shell, a closed component catalog, validation of model output, session-level logging, and model routing with fallback options.
  • Every control introduces a trade-off. No architecture maximizes flexibility, reliability, privacy, performance, and cost at the same time.

What does generative UI make possible?

Interfaces that adapt to context

The interface can adapt to what a person is trying to do instead of relying only on a persona defined at design time. Steps can reorder or disappear based on intent. It can change how much information it shows and what it emphasizes. Copy can adapt to the user's locale and context instead of relying on literal translation.

More interface variations with less custom development

A small set of components can support many variations without designing each screen separately. The system can also support workflows the team did not design as individual screens, as long as the required components and actions already exist.

Fewer steps between intent and action

The interface can hide controls a task does not need, reducing the number of steps required to complete it. Generative UI can also help teams test different ways of presenting the same task. Whether that improves completion or conversion depends on the workflow.

What can go wrong with generative UI?

Experience consistency risks

When layouts change between users or sessions, they can break muscle memory and make support harder. They can also drift from the design system or disrupt accessibility patterns that depend on consistent structure.

Reliability and security risks

The system should not trust model output by default. A model can render a button that does nothing, display fabricated data in a component, or produce a state the team never tested. Prompt injection can push it toward components, content, or actions the system should not allow. Weak controls can expose sensitive data or allow actions and interface states the product should block.

Performance and infrastructure risks

A generative interface also inherits the model layer's latency, cost, and availability risks. Waiting on an LLM to generate a layout adds delay before a page renders. Each generation uses processing resources, and hosted models usually add usage-based cost. Relying on one provider also exposes your product to outages, API changes, price increases, and deprecations.

Analytics and debugging risks

Standard analytics often assume a fixed set of screens. Heatmaps and funnels become harder to compare when users see different layouts. Reproducing a bug also gets harder when you cannot reopen the exact screen the user saw.

How do you control these risks?

Prompts can reduce unwanted behavior, but they cannot enforce which components the system may render or which actions it may allow. Those limits need to be enforced in the architecture around the model.

What parts of a generative interface should remain fixed?

Keep global navigation, account and security controls, primary actions, critical transaction controls, and accessibility-critical structure fixed. Let the model modify only the content and controls that benefit from adaptation.

Fixed navigation preserves familiar interaction patterns. A stable structure also makes accessibility testing, branding, and support more predictable.

How do you stop generative UI from creating broken interfaces?

Do not let the model generate arbitrary UI code. Have it return structured configuration instead. The schema should specify the component, its data, and its position. Validate that output against a closed catalog before rendering it.

The model should not write HTML, CSS, or JavaScript or choose anything outside that catalog. This reduces invalid layouts and unsupported combinations. This is the declarative approach we covered in Part 1.

How should teams test and secure generative UI?

Treat model output as untrusted input. Validate it against the schema and component allowlist, sanitize content, and keep authorization outside the model.

Add content security policies and prompt-injection defenses based on what the model can access and what actions it can trigger. Pay particular attention to user-provided content, privileged actions, sensitive data, and external tools.

Limit valid component combinations, then use visual regression and property-based tests to exercise unexpected inputs and edge cases.

Minimize sensitive data sent to the model. Mask or anonymize it before generation when the task does not require the original values.

How do you monitor a UI that looks different for every user?

Record enough context to reconstruct each generated interface. That includes detected intent, model version, generated configuration, rendered components, task completion, and errors, all tied to the session.

That record lets teams segment analytics by generated experience and reconstruct what a user saw during a specific session.

How do you control latency, cost, and outages?

Cache reusable results where freshness and privacy allow. Show a skeleton layout immediately and stream the rest in. Route simpler requests to smaller or local models, and reserve larger ones for complex requests. Put providers behind the same integration layer so you can switch models or fall back to a static experience during an outage.

What it controls Risks it mitigates
Stable interface shell Keeps navigation, account controls, and primary actions fixed Muscle memory loss, brand drift, accessibility gaps, support friction
Component-based UI Model outputs configuration, not code UI hallucinations, broken layouts, brand inconsistency, testing complexity
Untrusted-input handling Schema validation, allowlists, sanitization, sensitive-data controls Prompt injection, unsafe states, fabricated actions, privacy exposure
Session-level logging Records intent, generated configuration, rendered components, and outcome Fragmented analytics, hard-to-reproduce bugs, support friction
Model routing and fallback Caching, streaming, model routing, provider switching Latency, model cost, provider downtime, difficulty switching providers

What do these controls cost you?

Keeping more of the interface fixed protects consistency but limits personalization. Limiting combinations makes the system easier to test but reduces how much it can vary. Caching lowers cost, but cached output can go stale.

Running models locally can reduce how much sensitive data leaves your infrastructure, but it adds systems your team has to operate and maintain. Detailed session logs can make support easier, but they also create storage, retention, and privacy requirements.

No architecture maximizes flexibility, reliability, privacy, performance, and cost at once. You need to decide which trade-offs matter most for each workflow and design around them.

llms.txt