How?

Let's vibe.

Building Web apps in days and hours.

Ian H Smith

Thanks to Vibe Coding I can now deliver your next generation CRM app. This means no more expensive per user software licence fees, no more paying for billable hours bloated IT services, just a CRM app that works for you. Less is more.

This Journal post follows on from the first step in digital innovation: Simplify. In this lengthy article I am talking about how the combination of Google Gemini 35, Google Firebase Studio2, Google Antigravity6 and Google Cloud Platform provides a solid foundation for digital innovation and a reduction in IT costs.

The Value Proposition here applies to many use cases: internal use Web apps, including: next generation Collaborative CRM, ERP, PSA, etc.; and, for digital agencies and other industries, a partnership in co-creating Web apps, faster than via business-as-usual software development.

The term Vibe Coding was popularized by Andrej Karpathy1 to describe a conversational, high-level way of programming with AI models, where you specify the intent, style, or 'vibe' of what you want and let the model draft most of the implementation details of a Web app.

Section image

A powerful cost advantage.

As described further below, our Vibe Coded Web apps are built on a combination of world-class Google technologies and expert human know-how in the journey from Prototype to Production output that is scalable and secure.

This eliminates expensive seat licensing and instead offers a significant cost advantage, where users can scale to 0,000s without onerous AI or hosting costs. A next generation Collaborative CRM app, as described below would cost less than £0.80 per user per month for 1,000 users, where users can be more than just employees and include prospects, customers and partners. .

Section image


Introducing the Vibe Stack.

Collaborative CRM and other Web apps are created with Google Firebase Studio2 Vibe Coding technology, where the primary way to start tailoring to your needs is by talking to Gemini6, the AI Agent integrated into the build environment.

Collaborating.
Generically, these Web apps are designed to allow multiple Collaborators to engage beyond the boundaries of a single organization. This could be buyers and sellers invited into a workspace (Digital Sales Room) or it could be patients, nurses, careers and administrators connecting to speed up hospital discharge and reduce bed-blocking.

Prototyping.
When we open a new Firebase Studio instance, we are greeted by an AI chat interface. Here we type, in natural language, what we want as a customised Collaborative CRM, unique to your needs. This builds on our reusable tables and related assets.

Iterating.
You can preview the app in the side panel. If something looks wrong, you don't have to edit the code manually; you can tell the chat, "Make the 'Add' button blue and round," and it will modify the CSS/code for you.

Firebase Studio is built on a modern, robust, and scalable stack, leveraging the power of Google Cloud Platform and the latest Web development technologies. This includes:

Google Cloud Platform (GCP).
Provides the foundational cloud infrastructure for this entire Web app.

Firebase App Hosting.
Your Next.js application is deployed and served globally through Firebase purpose-built hosting service, which is optimized for performance and security.

Firebase Studio.
This is the AI-powered, collaborative development environment you're currently using. It runs on a secure Google Cloud Workstation, allowing us to code and make changes in real-time.

Firebase Firestore.
A NoSQL document-based database used for storing and syncing Web app data in real-time.

Firebase Authentication.
Manages user sign-up, sign-in, and security, with built-in support for various providers.

Language.
TypeScript is used for its strong typing, which helps catch errors early and improves code quality.

Framework.
Next.js (using the App Router) serves as the React framework, enabling powerful features like Server Components and Server Actions for optimal performance.

UI Library.
We use React to build the user interface.

Component Library.
ShadCN UI provides a set of reusable, accessible, and themeable components that form the building blocks of the application's design.

Styling.
Tailwind CSS is used for all styling, allowing for rapid and consistent UI development..

Genkit.
A Google-built framework for developing AI-powered features. It integrates with powerful models like Gemini to handle tasks such as summarization, data analysis, and more.

Making it happen.

To execute, four things appy: Design; Value; Reflect; and, Experiment.

Design.
Stanford d.school Design Thinking serves as the foundational methodology, adapted from this six-stage iterative process (Empathize, Define, Ideate, Prototype, Test, Implement). As a human-centered approach maximizes stakeholder engagement by generating sufficient empathy and collaboration throughout the innovation cycle. This ensures that solutions address real user needs rather than assumed requirements. The emphasis on the Empathize stage as the most critical component underscores the importance of building receptivity, rapport, and trust among all stakeholders before proposing solutions.

Value.
You strengthen the Design Thinking approach by providing robust financial justification through sophisticated ROI models. The method goes beyond traditional cost-benefit analysis by asking the fundamental question: "What is the cost of NOT investing in the proposed innovation?" This approach quantifies the cost of delay and inaction, creating compelling business cases that defend value over price and enables informed investment decisions.

Reflect.
As a critical practice, Reflection enables stakeholders to generate genuine Receptivity, Rapport, Trust and Truth throughout the innovation process. This approach emphasises that those closest to business processes often possess the most valuable insight stakeholder relationships through structured practices, collaborative dialogue, and iterative refinement.

Experiment.
As an operational framework for testing and validating innovations, Experimentation takes you through a five-step process: Framing the Testable Idea; Defining Evidence; Selecting The Test; Building the Prototype; and Executing, Analysing, Testing. This systematic approach translates Design Thinking insights and Value Engineering models into your Vibe Coded Web app solution, with clearly defined components that includes Models, Projects, Tasks, Resources, Storyboards, Decisions, Solutions, Checklists, Objections, Calculations, and Guidance.

Summary.

Moving apps from a System of Record to a System of Engagement is a good way to describe the difference with Vibe Coded Google Firebase Studio Web apps. Let's talk about how together, we can improve your market-facing environment by Vibe Coding a solution unique to your needs. This also significantly reduce your IT costs by eliminating per user licence costs.

Vibe Coding with Google Firecase Studio means we are building Web apps that are running on a world-class infrastructure at a fraction of the cost of first generation Web apps. It's enabling you to counter the commoditization of AI by embracing it - converting your brainware into software - and then monetizing it.

Next ...

Schedule a Discovery Meet in the link below.

References.

  1. Karpathy, A. [@karpathy]. (2025, February 2). There’s a new kind of coding I call “vibe coding”, where you fully give in to vibes, embrace exponentials, and forget that code even exists. X. https://x.com/karpathy/status/1753472166197080428
  2. Google. (2025). *Get started with Firebase Studio*. Firebase. https://firebase.google.com/docs/studio/get-started
  3. Gartner. (2023). The New B2B Buying Journey & its Implications for Sales. Gartner Research.
    https://www.gartner.com/en/sales/insights/b2b-buying-journey
  4. Toman, N., Adamson, B., & Gomez, C. (2017). The New Sales Imperative. Harvard Business Review.
    https://hbr.org/2017/03/the-new-sales-imperative
  5. Pichai, S. (2025, November 18). A new era of intelligence with Gemini 3. Google The Keyword. https://blog.google/products/gemini/gemini-3/
  6. Irani, R. (2025, November 19). Tutorial: Getting Started with Google Antigravity. Medium. Retrieved December 10, 2025.
    https://medium.com/google-cloud/tutorial-getting-started-with-google-antigravity-b5cc74c103c2