# I Build with AI and so can you > Learn to build better software by collaborating with AI. Discover how to use PRDs, ADRs, and the Model Context Protocol (MCP) to guide AI to build exactly what you need. - **Author**: Kartik Arora - **Live Presentation**: https://presentations.kartikarora.me/i-build-with-ai/ - **Topics**: AI, Development --- ## Slide 1: I Build with AI and so can you ### I Build with AIand so can you Kartik Arora Lead Engineer @ GDE Android kartikarora.me --- ## Slide 2: Follow Along ### Follow Along Presentation presentations.kartikarora.me/i-build-with-ai Codelab codelabs.kartikarora.me/i-build-with-ai --- ## Slide 3: Beyond the Buzzwords ### Beyond the Buzzwords Before we build, let's “demystify” some terms I'm required to include in this presentation. - LLM: Basically a spicy autocomplete that occasionally lies to you. - RAG: When the AI doesn't know the answer, so it reads a PDF really fast. - Agentic: Giving the AI a credit card and hoping for the best. - MCP: A fancy way of saying “the AI can finally see my files.” --- ## Slide 4: Slide 4 “Ask me relevant clarifying questions, one at a time” — Brett Morgan --- ## Slide 5: The End of Syntax ### The End of Syntax Engineering is evolving from writing lines of code to orchestrating complex systems through high-level intent. - The model generates the implementation. - The engineer provides the architecture and constraints. - Focus shifts from how to build it, to what to build. --- ## Slide 6: Why Structure Matters ### Why Structure Matters It's not just prompting; it's about building a solid foundation where your AI partner really gets the vision of your project. - Structure: The overarching rules, patterns and philosophy of a project. - Intent: Translating high-level goals into functional, deterministic software. - Reduces cognitive load by offloading syntax memorisation. science View this step in codelab --- ## Slide 7: What is a PRD? ### What is a PRD? The Project Requirements Document (PRD) is the absolute Source of Truth for your AI Agent. If it's not in the PRD, it doesn't exist. A good PRD should contain: - Executive Summary & Goals - Strict Technical Constraints (e.g., “No React”) - Architecture & Spatial Logic - Success Metrics --- ## Slide 8: Generating the DNA ### Generating the DNA Don't worry, you don't have to write everything from scratch! You can brainstorm and build your PRD together through a friendly chat with Gemini. Example Prompt: ``` Act as a Senior Software Architect. Create a Product Requirements Document (PRD) for a "Task Manager" web app and save it to `.gemini/prd/PRD.md`. Ask me relevant clarifying questions, one at a time ``` Once generated, save it to .gemini/prd/PRD.md and lock it. science View this step in codelab --- ## Slide 9: Agent Instructions ### Agent Instructions If the PRD is your project's heart, the agent instruction is its personality. It defines how your AI partner thinks, acts, and talks to you. - Role: “You are a hardcore vanilla JS purist.” - Action Rules: “Always update index.html via tools, never output full files in chat.” - Tone: Concise, professional, no fluff. --- ## Slide 10: Setting the Standards ### Setting the Standards The Agent file is where you enforce creative constraints. It prevents the AI from falling back on generic, "bootstrappy" designs. By defining clear aesthetic principles like Visionary, Orchestral, Professional, the agent makes implicit micro-decisions about spacing, typography and animation curves without needing a prompt for every CSS property. Example Prompt: ``` Create an agent configuration for an AI coding assistant and save it to `.gemini/agents/frontend-specialist.md`. Please ensure that the markdown file begins with the following frontmatter: ``` science View this step in codelab --- ## Slide 11: What are Skills? ### What are Skills? Skills are like handy little playbooks. They teach your AI exactly how to nail a specific task, just the way you like it! - Stop repeating yourself in prompts. - Ensure consistency across different projects. - Create an organizational standard library. --- ## Slide 12: Making a Skill ### Making a Skill A good skill document contains strict mandates, code examples, and prohibited patterns. Example Prompt: ``` ## Mandates 1. Always use semantic HTML. 2. Never use inline styles. ## Prohibited - Do NOT use React. ``` science View this step in codelab --- ## Slide 13: Remote Skills ### Remote Skills Skills don't have to live in your local repo. You can host them remotely and instruct the agent to fetch them. Example: Fetching https://distribute.kartikarora.me/ai/BRAND-SKILL.1.5.0.md allows a single source of truth for a brand identity across an entire organization's AI tooling. --- ## Slide 14: What are ADRs? ### What are ADRs? Architectural Decision Records (ADRs) are short text documents that capture a specific architectural decision, its context, and its consequences. - Context: What problem are we solving? - Decision: What is the chosen solution? - Consequences: What are the trade-offs (good and bad)? --- ## Slide 15: ADRs in agent ### ADRs in agent To ensure your AI agent respects architectural decisions, you can link ADRs directly in your agent instructions or define them as strict rules. Example Prompt: ``` ## Rules from ADRs 1. ADR-001: Use repository pattern for all data fetching. 2. ADR-004: All styling must use CSS Variables (no hardcoded hex). ``` This makes the why as important as the how for the agent. science View this step in codelab --- ## Slide 16: What is MCP? ### What is MCP? The Model Context Protocol (MCP) is how AI agents interact with the outside world securely. Instead of just generating text, an agent can use tools to: - Read local files directly. - Execute shell commands (safely). - Query external APIs dynamically. --- ## Slide 17: Real-world Data ### Real-world Data With MCP, your structured AI development isn't limited to what the model memorized in training. You can tell the agent: “Look at my open Github PR, read the feedback, and implement the requested changes in my local branch.” The context window becomes a dynamic workspace. --- ## Slide 18: Better Context with Context7 ### Better Context with Context7 Context7 is an open-source MCP server by Upstash that brings the latest documentation and code examples directly to your AI. The Challenge: - AI assistants often rely on outdated training data. - Deprecated APIs lead to hallucinations and broken code. - Documentation for new library versions is missing. --- ## Slide 19: How it Works ### How it Works By simply including “use context7” in your prompt, the agent fetches the most current documentation from source repositories. - Up-to-date Info: Ensures the AI has current API signatures and patterns. - Reduced Hallucinations: Accurate documentation means less fake or non-functional code. - Version-Specific: Retrieve documentation for the exact library version you're using. It covers thousands of popular libraries and frameworks instantly. science View this step in codelab --- ## Slide 20: Conclusion ### Conclusion AI doesn't replace engineering; it amplifies it. By focusing on structure and intent, you're not just coding—you're architecting at a higher level. - Architecture over Syntax: Define the system, let the model handle the boilerplate. - Clear Intent: High-quality prompts lead to deterministic outcomes. - MCP & Context: Give your agents the real-world data they need. --- ## Slide 21: The Future of Engineering ### The Future of Engineering ### “Build with Intent. Lead with Structure.” The real magic of engineering is shifting from memorising syntax to creative problem solving and leading your AI team with a clear vision. You've got this! --- ## Slide 22: Dig Deeper ### Dig Deeper Keep the momentum going with these great resources: - Google AI Studio: aistudio.google.com - Google Skills: github.com/google/skills - MCP Protocol: modelcontextprotocol.io - Context7: github.com/upstash/context7 Happy building! --- ## Slide 23: FIN. ### FIN. Kartik Arora Lead Engineer @ GDE Android kartikarora.me Questions? ---