Monday, December 01, 2025

🚀 Transforming UI with design.json and LLMs

 

✨ Introduction

Large Language Models (LLMs) are not just about text—they’re reshaping how we build Full Stack applications. Imagine seeing a website you love and instantly replicating its look and feel in your own project. That’s exactly what we explored in this Proof of Concept (POC).


🛠️ Step 1: Capture the Design

We started by taking a snapshot of the target site:

📷 Image

This image served as the foundation for generating a design.json.


⚙️ Step 2: Generate design.json

Using CTRL+L, we uploaded the captured image. The tool automatically created a design.json file that represents the UI structure and styling.

💡 Think of design.json as a blueprint for your frontend—it tells your project how to look.


📂 Step 3: Integrate into Frontend Project

Once the design.json was ready, we placed it inside our frontend project.

Then, we invoked the following prompt in CTRL+L:

1
@frontend change the ui as per the @design.json

🤖 Step 4: Let the Agent Work

As soon as the prompt was executed, our agent began transforming the UI.

⚡ Within moments, the project’s interface was updated to match the design we had captured.

📷 Image


🎯 Conclusion

This experiment demonstrates how LLMs + design.json can revolutionize frontend development:

  • 🔄 Rapid UI transformation without manual coding
  • 🎨 Consistent look and feel across projects
  • ⚡ Accelerated prototyping for Full Stack developers

By combining AI-driven design extraction with prompt-based UI updates, developers can move from idea to implementation faster than ever.


Source Code :-https://github.com/shdhumale/antigravity-workspace-ui-design-json.git

🛠️ Creating and Debugging Backend JUnit Tests: A Case Study with Google’s Antigravity Tool

 This blog post chronicles a troubleshooting journey while setting up JUnit tests for a Spring Boot backend application, highlighting common obstacles and their solutions.


The Initial Attempt and Quota Limits

We attempted to use an AI tool, often referred to internally as “Google Antigravity,” to help generate backend JUnit test cases for our spring-boot folder.

Unfortunately, during this initial phase, the free account limit for the AI tool was reached. This required a quick shift to an alternative account to continue the test generation process.

It’s a common hurdle in development: tools are essential, but resource constraints (like API limits or quotas) must be managed.


Encountering a Test Failure

After generating and incorporating the necessary test files (for example, for an Authentication Controller), the next step was to execute them using the Maven build tool.

We ran the specific test class using the command:

mvn test -Dtest=AuthControllerTest

This execution resulted in a test failure, as shown in the console output.

The error was likely related to the project’s dependencies, configuration, or, as we discovered, an incompatibility with the current Java Development Kit (JDK) environment path.


The JDK Compatibility Solution

To resolve the test failure, we consulted the error details and determined that the issue was related to JDK version compatibility. The project was built to run optimally on JDK 11, but the environment path was pointing to a different version or an incorrect location.

The critical fix involved updating the system or project configuration to explicitly use the correct JDK 11 installation path. The path we configured was:

C:\Program Files\Java\jdk-11.0.10\bin

By correctly configuring the environment to use the JDK 11 binaries, we ensured that all dependencies and compilation steps aligned with the required version.


Successful Test Execution

With the JDK path corrected, we executed the full suite of backend tests using the standard Maven command:

mvn test

The test run completed successfully, confirming that the JUnit test cases were correctly implemented and executed against the Spring Boot application.

This journey highlights the importance of checking JDK and environment compatibility when troubleshooting backend test failures. A simple path change was the final step to a successful test suite!

Source :- https://github.com/shdhumale/antigravity-workspace-junit.git