Vibe Coding

Vibe Coding

Vibe Coding

DeepMeet

DeepMeet

DeepMeet

Context

I’ve been exploring the concept of a new app designed to strengthen human connections in an increasingly digital world. With the rapid development of AI and drawing on my background in front-end development from university, I saw this as the right moment to begin building the idea. This project is still a work in progress, and I plan to continue evolving it over time.

This page shares a snapshot of what I’ve learned so far while developing the concept using AI-powered tools such as Figma Make, Cursor, and Claude Code. Throughout the process, I’ve been experimenting with ways to reduce “AI slop” by grounding the work in foundational UX and product methodologies, focusing on usability principles and strong value propositions.

The visual design is subject to change, as my current focus is on improving functionality and learning how to better prompt and guide AI tools to achieve the desired usability and product experience.

The Problem

The Problem

We live in an increasingly digital world where people scroll instead of speak. In public spaces, strangers stand side by side but rarely interact. Modern dating and social apps prioritize appearance, endless options, and rapid swiping, which often leads to shallow engagement and difficulty forming lasting relationships.

The Hypothesis

The Hypothesis

DeepMeet is an app designed to help people build deeper, more meaningful connections, not exclusively for dating, but for human connection more broadly.


The core principles:

  • Match based on shared interests and location (music, hobbies, values)

  • Limit users to only 2 active matches at a time. DeepMeet intentionally reduces cognitive overload to increase conversational quality.

  • Start conversations anonymously

  • Gradually unlock identity as trust builds

  • Encourage real conversation and in-person connections over endless browsing

Process

Process

Step 1: Full PRD Creation

I started by writing a complete Product Requirements Document including:

  • User personas

  • Core user flows

  • Matching logic

  • Anonymity unlock mechanics

  • Trust-building milestones

  • Edge cases and moderation considerations

This helped clarify the logic before touching UI.

Step 2: Fed the PRD into Figma Make

  • Generated initial interface explorations

  • Experimented with layouts and flows

  • Rapidly tested interaction ideas

AI accelerates exploration, but it does not replace intentional system design.

Step 3: Feedback & Iteration

I gathered feedback from:

  • Engineers

  • Friends

  • Potential users

Step 4: Code Prototyping (Cursor)

  • Attached the PRD and Figma UI screenshots to Cursor

  • Attempted functional implementation

  • Began debugging

  • Observed translation gaps between design and code

AI Workflow Observations

Quality Gaps Exist (AI Slop)


In Figma Make:

  • A small change can unintentionally affect other elements

  • Generated layouts sometimes break hierarchy

  • Design system rules aren’t consistently enforced

In Code:

  • AI may not fully interpret design systems

  • State logic can diverge from UX intent

  • Edge cases require heavy human review

Design Systems Must Be Explicit


If a design system is not clearly structured:

  • AI improvises

  • Communication breaks down

  • Translation errors increase

Markdown files and structured documentation help, but interpretation gaps still occur.

Human Oversight is Non-Negotiable


AI accelerates:

  • Drafting

  • Layout generation

  • Code scaffolding

But it does not replace:

  • Judgment

  • System alignment

  • UX consistency

  • Ethical design decisions

Learnings

  • Token optimization isn't just about cost, it's about getting better, more consistent output.

  • AI speeds up iteration but increases the need for quality governance.

  • Translation between design and code remains fragile.

  • Documentation clarity directly impacts AI output quality.

  • Intentional constraints produce better human experiences.

AI works best when paired with structured thinking and strong human review.

Next Steps

  • Continuing to debug and tighten the prototype, using what I've learned about prompt structure to reduce iteration cycles.

  • Building a more explicit design token system (spacing, color, type scales as structured data) to give AI tools less room to improvise.

  • Taking Anthropic's recent AI + product design courses to deepen technical fluency.

  • Exploring whether the PRD-as-AI-input workflow can be systematized into a repeatable framework for future projects.

UX experience across various industries—Healthcare, Vision AI, Education, Finance, Construction, etc. and different stages of the product life cycle.

UX experience across various industries—Healthcare, Vision AI, Education, Finance, Construction, etc. and different stages of the product life cycle.

UX experience across various industries—Healthcare, Vision AI, Education, Finance, Construction, etc. and different stages of the product life cycle.