The $0 Notion alternative They Don't Want You to Know

In this video, I walk through my full vibe coding process, from mindset to a finished, working quote app.

We dive into creating engaging web and mobile UI, showing the real steps from concept to a functional interface. This is practical, not theory. Real decisions, real coding, real results.

We start with how I think about building things, then move into planning, concepts, design inspiration, and finally coding the whole thing using AI tools. No fluff. Just the steps I actually use.

You’ll see how I go from an idea to a working web app, including UI choices, simple API thinking, and small interactive details like silly quotes that make the app feel alive.

Tools used:
ChatGPT Custom GPT (SnapPrompt): https://chatgpt.com/g/g-674c835b12b48...

Lovable: https://lovable.dev/

Dribbble: https://dribbble.com/

Excalidraw: https://excalidraw.com/

Timestamps:

00:00 – What vibe coding actually means
00:55 – The mindset behind building fast
02:10 – Planning phase (what matters, what doesn’t)
03:40 – Turning loose ideas into clear concepts
05:10 – Finding design inspiration (Dribbble)
06:45 – Rough layouts and flows in Excalidraw
08:10 – Playing with ChatGPT to think through the app
09:40 – Explaining the API in simple terms
11:00 – Using Lovable to build the quote app
12:20 – Adding silly quotes + final result

If you’re into web design, mobile UI, or using AI in real projects, this’ll make sense.
We go from an empty project to a fully functional app, demonstrating the principles of good web design along the way. This video provides a step-by-step approach to creating effective UI design and highlights key aspects of UX design for mobile design. Learn how to implement these concepts for superior user experience.