WebSim

May 2025 - January 2026 · Design, Development, Prompt Engineering

May 2025 - January 2026 · Design, Development, Prompt Engineering

WebSim generates interactive websites from natural language. Users describe what they want, the AI builds it and they can edit, remix, and share the result. The platform handles hundreds of thousands of generations per day across eight models.

My work touched everything between the models and the people using them. The system prompts that shape what gets generated, the mobile experience, the creative tools that let users make generated content their own, and the platform design holding it together.

WebSim generates interactive websites from natural language. Users describe what they want, the AI builds it across Claude, GPT, Gemini, and Kimi, and they can edit, remix, and share the result. The platform handles tens of thousands of generations per day across eight models.My work touched everything between the models and the people using them. The system prompts that shape what gets generated, the mobile experience, the creative tools that let users make generated content their own, and the platform design holding it together. 594 commits, 82 pull requests, eight months.

My contributions

Design

Development

Prompt Engineering

The team

~8 person team

System Prompt Engineering

Every word in the system prompt affects tens of thousands of daily generations across eight models. The cost of a bad change is high, and you can't intuit what a prompt tweak does to Claude versus GPT versus Gemini. I built a comparison pipeline to make it visible. Run a test prompt against all models simultaneously, get side-by-side output at desktop and mobile viewports, see exactly what that change did.

Testing revealed that models respond very differently to identical instructions. Claude benefits from explicit design principles. GPT responds better to example-driven guidance. I separated the prompt into model-specific paths.

For mobile, the instinct is to add more layout rules. I went the other direction. Fewer constraints, more spatial awareness. The result was better mobile output across every model.

Every word in the system prompt affects tens of thousands of daily generations across eight models. The cost of a bad change is high, and you can't intuit what a prompt tweak does to Claude versus GPT versus Gemini. I built a comparison pipeline to make it visible. Run a test prompt against all models simultaneously, get side-by-side output at desktop and mobile viewports, see exactly what that change did.Testing revealed that models respond very differently to identical instructions. Claude benefits from explicit design principles. GPT responds better to example-driven guidance. I separated the prompt into model-specific paths.For mobile, the instinct is to add more layout rules. I went the other direction. Fewer constraints, more spatial awareness. The result was better mobile output across every model.

Place holder for now

Place holder for now

Place holder for now

Place holder for now

Mobile Experience

WebSim was desktop-first. Mobile wasn't about making things fit on smaller screens. The generated content itself needed to be composed differently.

The core position: content should be designed for the screen it appears on. Not desktop layouts compressed into a phone. Four rounds of prompt experiments got there. I built a TikTok-style feed with inline editing, app-like navigation, and mobile creation flows that put the prompt input front and center.

Cross-browser behavior is where mobile gets hard. Viewport handling, keyboard detection, safe areas. I prototyped in standalone HTML files to validate before bringing anything into the codebase.

WebSim was desktop-first. Mobile wasn't about making things fit on smaller screens. The generated content itself needed to be composed differently.The core position: content should be designed for the screen it appears on. Not desktop layouts compressed into a phone. Four rounds of prompt experiments got there. I built a TikTok-style feed with inline editing, app-like navigation, and mobile creation flows that put the prompt input front and center.Cross-browser behavior is where mobile gets hard. Viewport handling, keyboard detection, safe areas. I prototyped in standalone HTML files to validate before bringing anything into the codebase.

Place holder for now

Place holder for now

Asset Panel & Creative Tools

On a generative platform, assets are how projects get their personality. The default output is what the model gives you. Uploading images, audio, and code is how it becomes yours. The existing UX made this harder than it needed to be.

I designed, prototyped, and shipped the full redesign over two weeks. Wireframes in Figma, bugs tracked on tl:draw, preview branches for testing, shipped live. The panel went from a compact overlay to a full-height sidebar. Upload always visible as the first item. Token counts for code files so you can see context window usage. AI image editing and background removal built in.

Richer user content created demand for better ways to discover what others were making. That led directly into the feed and social work.

On a generative platform, assets are how projects get their personality. The default output is what the model gives you. Uploading images, audio, and code is how it becomes yours. The existing UX made this harder than it needed to be.I designed, prototyped, and shipped the full redesign over two weeks. Wireframes in Figma, bugs tracked on tl:draw, preview branches for testing, shipped live. The panel went from a compact overlay to a full-height sidebar. Upload always visible as the first item. Token counts for code files so you can see context window usage. AI image editing and background removal built in.Richer user content created demand for better ways to discover what others were making. That led directly into the feed and social work.

Place holder for now

Place holder for now

Place holder for now

Place holder for now

Creation & Discovery

On a platform where AI generates the content, the social layer is how it circulates. Not a bolted-on feature. It's how generated work finds an audience.

The interface had accumulated complexity from features layered on without cleanup. I redesigned the homepage with trending topics and category navigation, built a feed with threaded comments and emoji, notifications with a cap of two per day to prevent spam, proper profile empty states, and project creation with previews. Seasonal work like the Christmas event ran alongside.

All of it pointed at the same thing: making the platform feel like one product, not features stacked on each other.

On a platform where AI generates the content, the social layer is how it circulates. Not a bolted-on feature. It's how generated work finds an audience.The interface had accumulated complexity from features layered on without cleanup. I redesigned the homepage with trending topics and category navigation, built a feed with threaded comments and emoji, notifications with a cap of two per day to prevent spam, proper profile empty states, and project creation with previews. Seasonal work like the Christmas event ran alongside.All of it pointed at the same thing: making the platform feel like one product, not features stacked on each other.

Place holder for now

Place holder for now

You can email me. I’m active on Twitter, occasionally on LinkedIn, and surfing the internet on Are.na.

©2019-2026 SURYA NARREDDI.

You can email me. I’m active on Twitter, occasionally on LinkedIn, and surfing the internet on Are.na.

©2019-2026 SURYA NARREDDI.