Forem: Alexander Adrian

Beyond the Prompt: A Framework for AI-Driven Content Systems

Alexander Adrian — Fri, 20 Feb 2026 08:52:48 +0000

My journey to automatically update a website from a Telegram chat.

In today’s AI gold rush, speed is a commodity. AI can clone sites in minutes and generate code in seconds. But in production, speed without governance is a liability. Imagine one prompt triggering an unintended deploy to prod.

To address this, I have codified a rigorous operational standard: The Adrian Method of AI-Driven CMS Governance (GitHub). The SOP and diagram are registered under my name in Indonesia (DJKI No. 001149429, Feb 2026). Anyone can reuse and adapt it under CC BY 4.0—just keep attribution.

The Governance Crisis in AI Automation
Most AI implementations focus on capability (what the AI can do) but ignore accountability (who is responsible when it fails). Traditional CMS architectures are not designed for the unpredictable nature of Large Language Models (LLMs). A hallucinated feature, a wrong price, or a broken layout can become a public incident.

My Core Aspirations for AI Governance
Before diving into the technical phases, I want to clarify the two pillars that drive this framework:

AI Safety through Accountability (HITL): I believe that AI safety is not just a theoretical concept; it is an operational requirement. By implementing a Human-in-the-Loop (HITL) protocol, we ensure that every AI-generated product is auditable and accountable. The final decision remains a human responsibility, ensuring the output aligns with ethical and professional standards.
Augmentation, Not Replacement: This framework is designed to empower engineers to do more, not to replace professional programmers. Human ingenuity—the ability to design complex architectures and navigate nuanced logic—is irreplaceable. This method is a tool to free developers from repetitive tasks, allowing them to focus on high-level innovation.

The Solution: The 4-Phase Protocol
The Adrian Method is a non-bypassable workflow designed to ensure AI remains a secure asset.

Phase I: Intent Ingestion & Normalization
Natural language is inherently ambiguous. This phase ensures that user intent is parsed and normalized into a structured technical schema. If the intent is unclear, the system is hard-coded to halt and request clarification.

Phase II: Isolated Staging (Shadow Environment)
AI-generated assets are never allowed to touch the production environment directly. They are rendered into a "Shadow Environment"—an isolated, unindexed static deployment where the AI’s output is visualized but contained.

Phase III: The Human-in-the-Loop Gate (The Firewall)
This is the mandatory pause. Through a secure Command & Control interface (implemented via Telegram Bot API), a human stakeholder must inspect the Shadow Environment. Human judgment is the final barrier against AI hallucinations.

Phase IV: Atomic Promotion
Only after explicit human authorization is the build promoted. We utilize Atomic Swaps on Static Blob Storage to ensure zero-downtime and instantaneous global consistency.

The Operational Flow

[User Prompt]
     |
     v
PHASE I: Intent Ingestion
     |
     v
PHASE II: Isolated Staging
     |
     v
PHASE III: Human Gate ---- Rejected ---> [Abort / Revise]
     |
   Approved
     v
PHASE IV: Atomic Promotion
     |
     v
[Live & Audited]

Real-World Case Study: Ksatriamitra.com
We applied this framework to Ksatriamitra.com, an IT service provider. By shifting to a Telegram-Driven CMS backed by The Adrian Method:

Operational Security: The owner manages site updates via mobile chat, but no change goes live without an "Approve" click.
Infrastructure Resilience: The site is hosted as immutable static files, making it inherently resistant to server-side attacks.
Cost Optimization: By utilizing GitHub Actions for on-demand rendering and Blob Storage, the "idle cost" is effectively zero.

Why Governance is the New Standard?
As engineering leaders, our responsibility is moving beyond code because we are now architects of autonomous systems. If you are experimenting with AI-driven automation, I suggest, don’t start with “how do we deploy faster?” but start with “how do we prevent a bad deploy?”

I Converted a WordPress Homepage to Next.js in 30 Minutes for $0.22 Using DeepSeek

Alexander Adrian — Thu, 29 Jan 2026 11:57:46 +0000

Disclaimer: This case study uses Tamatour2025 (a completed event project from my professional work) for educational purposes only. The original stakeholders are aware. This is not a template for cloning active third-party sites without permission, but a technical workflow case study.

The One Thing Everyone Wants to Know

How much does it actually cost to convert a WordPress homepage to modern JavaScript framework using cheaper AI models?

Answer: $0.22 USD.

Here's exactly how I did it—and why the process matters more than the cost.

The Challenge

Take the World Tamagotchi Tour Malaysia 2025 homepage (WordPress) and convert it to Next.js 14 + TypeScript + Tailwind CSS in under 30 minutes using DeepSeek Chat (not the expensive reasoning model).

Scope: Homepage only. No sub-pages. No database integration. Pure structural conversion.

Visual target: 90%+ fidelity to original.

Constraint: <$1 in AI costs.

The Three Prompts That Did It

Prompt #1: The Foundation

Following #CONVERSION_INSTRUCTION_LITE.md, please convert this page 
to Next.js 14 with Tailwind CSS:

Source: https://tamatour2025.jommain.my/
Target: app/page.tsx

Requirements:
- TypeScript
- Tailwind CSS for all styling  
- 90%+ visual resemblance
- Server Component (default)
- Extract reusable components

Focus: Homepage only, we'll extend per link later

Result: ~90% match in ~8 minutes.

Prompt #2: Catch the Gaps

Check https://tamatour2025.jommain.my/

You forgot 1 banner below the photos. Link videos using original URLs.

Result: ~95% match in ~3 minutes.

Prompt #3: Polish Details

See original:
1. Top right insta/fb should be icons
2. Copyright: C in circle & R in circle BANDAI

Result: I cant say 100% match but it meets my expectation. 2 minutes.

The Numbers

Metric	Value
Model	DeepSeek Chat
Input tokens	3,600,000
Output tokens	36,200
Total cost	$0.22 USD
Time to production	25 minutes
Visual fidelity	90%+

Visual Proof

Desktop

Original: https://tamatour2025.jommain.my/

Clone: https://tamatour2025b.jommain.my/

Why This Matters (The Real Story)

Most developers hear "$0.22" and think "wow, cheap." But the actual insight is different.

Three focused prompts beat one massive prompt.

Instead of:

Asking the model to do everything at once (70% accuracy)
Having to regenerate and iterate (10x the cost)
Ending up with partially broken code (weeks of debugging)

You get:

Clear, isolated objectives (90%+ accuracy first try)
Catch-and-fix refinements (3 focused iterations)
Production-ready code (deploy immediately)

This is prompt engineering as professional practice, not luck.

What Worked Perfectly

✅ Navigation

✅ Hero section

✅ Gallery grid (12 images)

✅ Video embeds

✅ Footer with social icons

✅ Mobile responsiveness

✅ TypeScript + Tailwind CSS (zero custom CSS)

What the model missed on first try (caught by Prompt #2 & #3):

Gallery banner section
Social media icons (were text, not icons)
Copyright symbols formatting

These gaps are intentional design. The model didn't hallucinate—it just needed clarification on details outside the initial scope.

The Smart Trade-off: Why We Hotlinked Assets

Images and videos still point to the original WordPress domain.

Why? Because:

Saves ~10 minutes (no download/upload cycle)
Keeps deployment size small
Proves the code conversion works (the hard part)
Phase 2 can migrate assets (the easy part)

This is intelligent MVP thinking, not "incomplete work." Get code right first, optimize infrastructure second.

Three Lessons

1. Prompt specificity >> model cost

The key isn't the model—it's the prompt strategy. Three focused, isolated prompts achieve 90%+ accuracy on first iteration. This approach works regardless of which AI service you use.

2. Iterative refinement is professional

One-shot perfect is a myth. Three targeted refinements > one massive prompt.

3. Scope narrows accuracy

"Convert entire WordPress site" = 70% accurate
"Convert just homepage" = 90% accurate

Smaller scope = deeper focus = fewer errors.

What This Enables

The real value isn't the cost—it's the speed of iteration.

Previously:

Experiment with a design idea? Weeks of work.
Test a new framework conversion? Expensive.
Prototype variations? Not feasible.

Now:

Experiment with design? 30 minutes.
Test framework conversions? Same day.
Prototype variations? As many as you want.

The bottleneck shifts from cost to creativity. You're no longer limited by "can I afford to try this?" but rather "what do I want to try next?"

How to Replicate This

For any website you want to modernize:

Clone NEKO-Template and create your project folder
I use RooCode + connect DeepSeek API, you can your favorites
Send Prompt #1 (conversion request) - review output
Send Prompt #2 (catch gaps) - refine
Send Prompt #3 (polish details) - finalize
Deploy to any hosting service

Total cost: $0.10-$1.00 in AI

Total time: 20-30 minutes

What's Next

Sub-page conversions (/info, /products, /promotions)
CMS integration for dynamic content
Asset migration (download images locally)
Multi-language support
Performance optimization

Each phase requires different prompt strategies. That's the follow-up.

The Meta-Question

If your AI development costs drop 99%, what becomes possible?

Solo developers shipping faster than 5-person teams?
Freelancers competing with agencies on speed AND cost?
Experimentation becoming the default instead of exception?

That's the actual story here. Not the $0.22. The freedom that $0.22 buys you.

I Made an AI Template That Clones Any Website to Next.js (Works with Cheaper Models Too)

Alexander Adrian — Tue, 27 Jan 2026 08:06:38 +0000

I was tired of hosting costs.

My company runs several PHP sites on traditional VM hosting. Every month, same bills. Every small traffic spike, same scaling headaches. I kept thinking: "What if these were just static Next.js on serverless?"

But manually converting pages? Boring. Hiring someone? Too many pages, not enough budget. Using AI? Obvious solution, except...

Every guide assumes you have Claude Sonnet or GPT-5. I tried the cheaper models first (DeepSeek, GPT-4o-mini) and they kept hallucinating or creating weird folder structures. The prompts weren't designed for them.

So I spent a weekend figuring out how to make AI instructions that work regardless of which model executes them.

The Template That Doesn't Care What AI You Use

I made instruction files that produce consistent conversions whether you're using:

Premium models (Claude Sonnet, GPT-4o)
Budget models (DeepSeek, Qwen, GPT-4o-mini)
Open source (Llama, GLM-4)
Whatever's in your IDE (Google Antigravity, Cursor, Windsurf, Trae)

The key was treating AI instructions like infrastructure-as-code. Clear steps, explicit rules, no ambiguity.

What It Actually Does

Takes any website's frontend (static) and converts it to Next.js:

Input: any static web link

Output: Modern Next.js component with Tailwind CSS

You get the visual appearance cloned - HTML structure, CSS styling, responsive layout. Backend logic? You implement that separately after.

Think of it as: "Make this look the same in Next.js, I'll handle the functionality myself."

How It Works

Two instruction files:

Full version - Detailed explanations, edge cases covered
Lite version - Step-by-step checklist, optimized for simpler models

Both produce the same output. Use Full with premium models, Lite with budget ones.

The workflow is dead simple:

# 1. Give AI the instruction file
# 2. Point it at your page
curl https://yoursite.com > page.html

# 3. AI converts it to Next.js
# Output: app/page.tsx with Tailwind classes

What makes it work across models? Explicit scope control.

Cheap models love to be "helpful" - they'll try to fetch linked pages, offer to set up your entire project, suggest deployment configs you didn't ask for. The instructions say:

Convert THIS page only. Don't fetch other pages. Don't offer setup help. Just give me the code and stop.

Turns out, being blunt with AI works better than being polite.

Real Example

Here's a before/after from our TCG site:

Original: PHP page with navigation, sections, footer

Converted: Next.js component, 90%+ visual match, deployed to Azure Static Web Apps

The AI (I tested with Trae built-in model - no idea what it actually uses) preserved:

Navigation structure
Black/white color scheme
Logo placement
Footer layout

It got wrong:

Made navigation mobile-first (hamburger menu instead of horizontal)
Inverted some icon colors

Total time: 10 minutes to convert, 10 minutes to fix the navigation. Still faster than writing from scratch.

What I Learned

1. Instruction design matters more than model choice

A well-structured prompt on DeepSeek beats a vague prompt on Claude Sonnet.

2. Tables > Prose for AI instructions

Putting transformation rules in tables (HTML → JSX conversion map) works way better than paragraphs explaining the same thing.

3. Cheaper models need stricter boundaries

Premium models can infer intent. Budget models need explicit "DO NOT do X, Y, Z" lists.

4. Test with unknown models

I validated this with Trae (black box - don't know the backend model).

The GitHub Repo

I open-sourced the whole thing:

Instruction files (Full + Lite versions)
Prompt templates
README with examples

Repo: github.com/ksmgen/NEKO-Template

It's MIT licensed. Use it, modify it, whatever. I built this for our internal use and figured others might find it useful.

When This Works (and When It Doesn't)

Good for:

Converting static pages (about, landing, marketing pages)
WordPress theme migrations
Legacy PHP frontends
Documentation sites

Not good for:

Complex SPAs (already modern)
Heavy JavaScript interactions
Real-time features
When you need the backend logic too

You're cloning appearance, not functionality. Backend is your job.

Cost Breakdown

For reference, here's what I spent testing different models:

Claude Sonnet: ~$0.07 per page (premium quality)
GPT-4o-mini: ~$0.003 per page (good enough)
DeepSeek-V3: ~$0.001 per page (surprisingly decent)

Even if you convert 100 pages with Claude Sonnet, that's $7. Compare that to hiring someone at $50/page = $5,000.

The template paid for itself in one project.

Why I'm Sharing This

I'm not selling anything. No course, no SaaS, no affiliate links.

I just got tired of seeing "use AI for development" content that assumes everyone has unlimited API budgets. Sometimes you need to use what you have.

If this template helps you migrate an old site without breaking the bank, that's enough.

Try it out: github.com/ksmgen/NEKO-Template

Questions? Drop them in the comments.