Google just released its new tool called Stitch which has hit Figma hard , its stock prices have gone gone 14.58% in the last 5 days. Now this really caught my attention and i decided to give it a try.
You are free to access Stitch, here we get a dark themed Gemini style interface. You are required to give a short prompt like make me a website for my Chocolate shop or a prompt detailing each and every aspect of the website from the number of pages , their names , each and every requirement and that's it.
It takes a few minutes to process everything and gives you a design within a very Figma like interface but with a lot fewer tools, all you have is an AI chat window to make changes and that's all you need here!
A first look at Stitch
Make sure you have a working google account to use stitch.
A Gemini like interface.
- Let's give it a simple prompt:
"Build a website with desktop view and mobile view. Please keep the following things in mind.
Home Page will have generic information and some testimonials in the form of a marquee.
About Page will be about the doctor and his education and what he believes in.
Services page will list the various services offered by the dentist.
Book page will have the location of the clinic and a phone number , to call and book."
I am using a free tier account (Gemini Flash 3), so it takes a few mins to process the request, once it is done it gives a canvas with your desired screens on it.
A few issues i faced :
- Sometimes the generated page doesn't have anything on it , reloading does not fix it as well. So you have to select the screen and regenerate, Sometimes it just generates an entirely different styled screen from the rest of the app.
From designs to the website:
Now this is the big part, creating the actual website from the designs. How to do that?
A non coder would not even attempt building this by themselves , setting up a new project , adding dependencies, setting up the scripts and code it all?!
But don't worry , you would not have to do any of that. All you need is a single button and voila your website with be created.
- Select all you screens in Stitch.
- Click on Export.
- Click on AI Studio.
- Click on Build with AI Studio.
It does take some time to build it , but you get your fully functional website in just a few clicks.
The website is based on react uses Vite along with some popular packages which are necessary.
You get a chat , Website preview and code preview in the google ai studio ui.
You can edit the code there itself by your self or ask the agent to make the required changes.
You have the option to sync all of your changes to Github or you can even deploy the website to the web using google cloud services in yet another click.
A few things i noticed
Agent is not as advanced as Kiro or Cursor, it makes mistakes implementing basic tasks. For example, I asked to change a picture and it just created a picture generating service in the website using Gemini service. But this service has just launched and i believe its just getting started.
I asked it to enhance the booking service by integrating it with google calendar API's and it did that instantly and asked to enter the required google keys to make it work.
I feel like its a great platform for people wanting to build simple apps and designs with potential to be a platform used for making simple apps with business logic.
Furthermore, it makes design making and website building very accessible to people who are not familiar with the whole process.
Top comments (0)