DAY 1
1. Introduction to Vibe Coding
- What is Vibe Coding?
- Differences from traditional software development
- Advantages and limitations of AI-powered development
- Which projects are suitable for Vibe Coding?
- Division of responsibilities between human control and artificial intelligence
2. Vibe Coding Use Cases for Product Teams
- Idea validation
- Rapid prototyping
- Internal tool development
- Demo and PoC preparation
- Digitalizing repetitive business processes
- Testing solution alternatives before product development
3. Building the Vibe Coding Production Flow
- The process from idea to working product
- Defining the problem and user need
- Determining the basic scope of the application
- Selecting MVP features
- Breaking large requests into smaller development steps
4. Preparing an Application Brief with Claude and ChatGPT
- Communicating the application idea correctly to artificial intelligence
- Defining the user, problem, and solution
- Preparing page and feature lists
- Determining user flows
- Structuring non-technical requirements
- Creating the initial prompt
5. Creating the First Prototype
- Transferring the prepared brief to a prototyping tool
- Creating the first web application structure with Lovable
- Reviewing pages and basic user flows
- Evaluating the initial design output
- Identifying missing and incorrect areas
6. Working on the Project with Cursor
- Understanding the project folder and file structure
- Creating project context in Cursor
- Requesting changes without coding knowledge
- Making the correct change in the correct file
- Using controlled development steps instead of large changes
- Reviewing changes made by artificial intelligence
7. Practical Exercise
Participants prepare a brief for their own application idea and create the first working web application prototype by the end of the day.
DAY 2
1. Strategy for Improving the First Prototype
- Evaluating the prototype created on the first day
- Identifying missing functions
- Creating development priorities
- Developing the prototype step by step without breaking it
- Dividing changes into small and manageable tasks
2. Functional Improvements
- Developing form and button behaviors
- Organizing transitions between pages
- Processing user inputs
- Data creation, listing, editing, and deletion flows
- Preparing feedback states for users
- Creating empty, loading, successful, and error states
3. UI/UX Improvement Prompts
- Describing design problems correctly
- Improving hierarchy, spacing, and alignment
- Improving button, form, and card components
- Using consistent colors, typography, and components
- Reducing friction points in the user flow
- Adapting web screens to different screen widths
4. Debugging and Error Resolution with Artificial Intelligence
- Reading error messages correctly
- Communicating the problem to artificial intelligence with proper context
- Analyzing errors using console outputs and screenshots
- Preparing prompts to identify the source of the error
- Performing regression checks after fixes
- Preventing the same error from occurring again
5. Testing, Edge Cases, and Quality Control
- Creating test scenarios from acceptance criteria
- Checking core functions
- Positive and negative test scenarios
- Empty field, invalid data, and boundary value checks
- End-to-end testing of user flows
- Preparing a test checklist with artificial intelligence
- Checking whether changes have affected other areas
6. Making the Application Shareable
- Performing final project checks
- Preparing demo data
- Completing pre-launch error and content checks
- Publishing the application
- Creating a shareable demo link
- Presenting the project clearly and concisely
7. Final Exercise
Participants develop, test, and improve the prototype they created on the first day and turn it into a shareable web application demo.
Learning Outcomes
By the end of the training, participants will:
- Understand the fundamental logic of the Vibe Coding approach.
- Turn an application idea into a clear and actionable brief.
- Prepare effective prompts for artificial intelligence tools.
- Create the first working web application prototype.
- Understand the code and project structure generated by artificial intelligence.
- Add new functions to an existing application.
- Improve the interface and user experience.
- Analyze and fix errors with AI support.
- Test the application by creating test scenarios and edge cases.
- Turn the project into a shareable demo.
Who Is This Training For?
- Product managers and product teams
- Business analysts
- Software testing professionals
- UX/UI designers
- Entrepreneurs and project owners
- Professionals who want to benefit from artificial intelligence in software development processes
- Participants who want to turn an idea into a working web application
Coding experience is not mandatory. Basic knowledge of digital products and web applications will make the training process easier.
Training Duration: 2 Days
Format: The training is delivered through presentations, live demonstrations, instructor guidance, and practical exercises carried out by participants on their own projects.
Vibe Coding is a next-generation production approach in which artificial intelligence tools are actively used throughout the software development process. In this training, participants learn not only how to generate code with AI, but also how to define a product idea correctly, manage the development process, review generated code, and turn it into a working application.
Throughout this two-day practical training, participants create the first prototype of their own web application, develop the required functions, improve the user experience, fix errors, and turn the project into a shareable demo.
By the end of the training, participants gain hands-on experience in taking a product idea from scratch and developing a working web application using AI-powered tools.