Prompt Builder Project Report
1. The Concept
Prompt Builder is a lightweight, browser-based web app that helps users create better AI prompts by answering guided questions instead of writing prompts from scratch. I chose Prompt Builder for this one-day sprint because it is simple enough to build quickly, but still useful enough to test a full AI-assisted product workflow from planning, UX refinement, implementation, and polish.
2. The Stack
The Stack: HTML5, Vanilla CSS, and JavaScript.
The AI Assist: ChatGPT helped shape the initial product idea, target user, feature list, and app requirements. OpenAI Codex was then used for the coding phase, turning the product plan into a working single-file web application with dynamic forms, prompt templates, copy actions, responsive layout, and UI polish.
3. The 1 Day Sprint:
Morning (Hours 1–3): We started by defining the product goal: help beginners create professional AI prompts in under one minute. We planned the target users, core categories, form fields, user flow, and success criteria. The main focus was keeping the app simple, fast, and useful for students, office workers, designers, developers, content creators, and AI beginners.
Afternoon (Hours 4–6): The coding phase began. Codex built the first working version using only HTML, CSS, and JavaScript. The app included category selection, dynamic forms, prompt generation, copy-to-clipboard, responsive layout, and dark mode. After that, we refined the interface to feel more like a polished SaaS dashboard, improving spacing, buttons, form labels, category cards, prompt output, and mobile layout.
The Finish Line (Hour 7-8): The final phase focused on UX improvements. We added progressive disclosure so only the most important fields appear first, moved secondary fields into Advanced Options, improved prompt generation quality, added quick launch buttons for AI platforms, and upgraded the Image Generation camera field into a beginner-friendly searchable dropdown. The final app became much more polished and useful than the first version.
4. The Roadblocks
Roadblocks: The biggest roadblock was visual consistency. Small spacing issues appeared across different sections, especially on mobile. Some components looked like they came from different design systems, so we had to repeatedly refine padding, alignment, button width, section headers, and responsive gutters.
Another challenge was prompt quality. The first generator output was too basic because it simply listed user selections with labels. We had to upgrade the engine so prompts read like natural, professional instructions instead of form data.
5. Key Takeaways
What worked best? The rapid iteration process. Codex was very effective at making focused changes quickly, especially when the task was specific, such as adjusting spacing, replacing a field, improving a button, or adding a new UI section.
What worked worst? UI precision required many small follow-up prompts. Even though the app worked early, getting the layout, spacing, hierarchy, and mobile alignment to feel professional took several refinement passes.
My final thought: If I had one more day, I would add saved prompt history, favorite templates, and local storage. I would also test the app with real beginners to see which fields confuse them and which prompt categories are most useful. Overall, this sprint showed that AI can move very fast from idea to working product, but strong human direction is still important for UX quality and product focus.