Blog
/
Case Study

Formify: The drag and drop Shopify checkout customization tool built in less than a week

Published
July 6, 2023
Last updated
October 16, 2024
How the Nextools team built and launched an app in less than a week, and eliminated their 45-day onboarding process.

The big idea

Formify is a checkout UI extension that helps Shopify Plus merchants customize their checkout by adding fields without writing a single line of code. The simple drag and drop interface allows merchants to decide exactly where their custom fields will appear, and then automatically maps all of the data gathered back to metafields so it can be used as needed.

The Problem

Andrea Morone, CTO of Nextools, has been building Shopify apps for 5 years, and entered the Shopify App Challenge in 2020, not knowing it would lead him to starting his own business and creating some award-winning apps. He entered the competition for fun, with no plans of doing anything more with the app he built. But when his submission received an honorable mention, his installations skyrocketed, leading him to sell the app a year later. With the money from the sale, he started Nextools, and over the next three years, he and his team launched eight Shopify apps.

During that time, Andrea kept an eye on merchant needs and trends that came to the app store, always aware of the new tools and opportunities that arose. So when he heard that Gadget was hosting a hackathon, he thought it would be a good opportunity to try the app development platform.

The Nextools team had a few ideas they wanted to try, and they landed on Formify as the best option. Andrea had been flooded with requests for custom checkout fields from his clients, and since Shopify was in the process of deprecating checkout.liquid in favor of checkout extensibility, it seemed like the best possible choice.

They didn’t want to waste the week developing an MVP or a prototype. They wanted to develop a fully-functional app that was ready to be submitted to the app store by the end of the hackathon. So the plan was to build an app that would allow merchants to customize their checkouts without having to hire a developer. A simple drag and drop interface that would automatically map all of the data back to metafields so merchants could use the information throughout their Shopify store. 

The team wasn’t new to the Shopify ecosystem. Andrea had created his own framework, consisting of boilerplate code made up of Node.js, MongoDB, Prisma, and Supabase. When Beniamino Biagiarelli joined Nextools as a Software Developer, it took 45 days for him to be onboarded. Not unexpected, but with the hackathon, they would have to both learn how to use Gadget, and build their entire app in under a week.

The Formify listing on the Shopify App Store

The Solution

Andrea and Beniamino started by diving into the Gadget documentation, hoping that reading through everything would help to avoid any roadblocks during the build process. Once they were confident they understood the platform, they split their time between two apps: one focused on checkout UI extensions, and another on AI.

With Gadget, you build with confidence and with trust.
- Andrea Morone, CTO @ Nextools

With the Gadget Action framework, building the logic was easy. “With Gadget you have this fantastic thing called actions on success. So I created a model with all the configurations. And then said, on success, please update these metafields to keep the sync between the forms and metafields.”

Because Gadget handled all of the infrastructure and so much of the backend logic for them, Nextools was able to prioritize the merchant experience and put the work into making the drag and drop portion of the form builder. They know merchants today are used to working with drag and drop interfaces, and they wanted to offer that familiar experience.

“The app world is becoming very crowded and very, very competitive, but with Gadget, you are so fast that you know you are using the right product to develop. With Gadget, you build with confidence and with trust.” Andrea shared.

When it came time to push to production, the Nextools team couldn’t believe how easy it was to deploy. They were used to the complex deployment process of AWS, but with Gadget there were no users, permissions, serverless functions, or other details to worry about. They simply had to click deploy.

“I saw the arrow in the bottom right of the platform deploy, I turned to Benji and said, that’s it? I just have to push deploy? So we changed the URL in the production app on the Shopify partner dashboard and that's it. We were in production.”

At the end of the week, the team submitted two apps for consideration: Formify, and ReportAI, an app that uses openAI's APIs to generate text messages that explain, using natural language, the results of the reports generated by your Shopify store. 

We built two apps in practically one week. The good thing is that they are production ready, so we don't have to do any fancy modification to the deployment
- Andrea Morone, CTO @ Nextools

Despite their own framework having a 45 day onboarding time, the Nextools team was able to learn the platform and launch their apps within the week of the hackathon. Andrea says, “We built two apps in practically one week. The good thing is that they are production ready, so we don't have to do any fancy modification to the deployment.”

What’s next for Formify

The app has now gone through the review process, and is available for merchants to install on the app store. Since this is their first checkout UI extension, the Nextools team is hoping to get feedback from their users to iterate and improve, and add any features as they’re requested.

Nextools plans to build at least two more apps with Gadget, and is considering migrating some of their existing Shopify apps to the platform to take advantage of the performant infrastructure and scalability without having to worry about managing it themselves.

Emma Hyde
Author
Reviewer
Try Gadget
See the difference a full-stack development platform can make.
Create app
No items found.
Case studies
/
Andrea Morone

Formify: The drag and drop Shopify checkout customization tool built in less than a week

How the Nextools team built and launched an app in less than a week, and eliminated their 45-day onboarding process.
5
days to build
With Gadget, you build so fast that you know you are using the right product to develop. With Gadget, you build with confidence and with trust.
Andrea Morone
CTO
Problem
Onboarding to new frameworks can often take more than a month, and the team at Nextools needed to build an app in a week.
Solution
Gadget’s zero-setup infrastructure and Action framework took care of the backend code, so Nextools could focus on crafting the perfect merchant experience.
Result
They built two production-ready Shopify apps in less than a week, and have published one to the app store, with the other in review and plans to build even more.

The big idea

Formify is a checkout UI extension that helps Shopify Plus merchants customize their checkout by adding fields without writing a single line of code. The simple drag and drop interface allows merchants to decide exactly where their custom fields will appear, and then automatically maps all of the data gathered back to metafields so it can be used as needed.

The Problem

Andrea Morone, CTO of Nextools, has been building Shopify apps for 5 years, and entered the Shopify App Challenge in 2020, not knowing it would lead him to starting his own business and creating some award-winning apps. He entered the competition for fun, with no plans of doing anything more with the app he built. But when his submission received an honorable mention, his installations skyrocketed, leading him to sell the app a year later. With the money from the sale, he started Nextools, and over the next three years, he and his team launched eight Shopify apps.

During that time, Andrea kept an eye on merchant needs and trends that came to the app store, always aware of the new tools and opportunities that arose. So when he heard that Gadget was hosting a hackathon, he thought it would be a good opportunity to try the app development platform.

The Nextools team had a few ideas they wanted to try, and they landed on Formify as the best option. Andrea had been flooded with requests for custom checkout fields from his clients, and since Shopify was in the process of deprecating checkout.liquid in favor of checkout extensibility, it seemed like the best possible choice.

They didn’t want to waste the week developing an MVP or a prototype. They wanted to develop a fully-functional app that was ready to be submitted to the app store by the end of the hackathon. So the plan was to build an app that would allow merchants to customize their checkouts without having to hire a developer. A simple drag and drop interface that would automatically map all of the data back to metafields so merchants could use the information throughout their Shopify store. 

The team wasn’t new to the Shopify ecosystem. Andrea had created his own framework, consisting of boilerplate code made up of Node.js, MongoDB, Prisma, and Supabase. When Beniamino Biagiarelli joined Nextools as a Software Developer, it took 45 days for him to be onboarded. Not unexpected, but with the hackathon, they would have to both learn how to use Gadget, and build their entire app in under a week.

The Formify listing on the Shopify App Store

The Solution

Andrea and Beniamino started by diving into the Gadget documentation, hoping that reading through everything would help to avoid any roadblocks during the build process. Once they were confident they understood the platform, they split their time between two apps: one focused on checkout UI extensions, and another on AI.

With Gadget, you build with confidence and with trust.
- Andrea Morone, CTO @ Nextools

With the Gadget Action framework, building the logic was easy. “With Gadget you have this fantastic thing called actions on success. So I created a model with all the configurations. And then said, on success, please update these metafields to keep the sync between the forms and metafields.”

Because Gadget handled all of the infrastructure and so much of the backend logic for them, Nextools was able to prioritize the merchant experience and put the work into making the drag and drop portion of the form builder. They know merchants today are used to working with drag and drop interfaces, and they wanted to offer that familiar experience.

“The app world is becoming very crowded and very, very competitive, but with Gadget, you are so fast that you know you are using the right product to develop. With Gadget, you build with confidence and with trust.” Andrea shared.

When it came time to push to production, the Nextools team couldn’t believe how easy it was to deploy. They were used to the complex deployment process of AWS, but with Gadget there were no users, permissions, serverless functions, or other details to worry about. They simply had to click deploy.

“I saw the arrow in the bottom right of the platform deploy, I turned to Benji and said, that’s it? I just have to push deploy? So we changed the URL in the production app on the Shopify partner dashboard and that's it. We were in production.”

At the end of the week, the team submitted two apps for consideration: Formify, and ReportAI, an app that uses openAI's APIs to generate text messages that explain, using natural language, the results of the reports generated by your Shopify store. 

We built two apps in practically one week. The good thing is that they are production ready, so we don't have to do any fancy modification to the deployment
- Andrea Morone, CTO @ Nextools

Despite their own framework having a 45 day onboarding time, the Nextools team was able to learn the platform and launch their apps within the week of the hackathon. Andrea says, “We built two apps in practically one week. The good thing is that they are production ready, so we don't have to do any fancy modification to the deployment.”

What’s next for Formify

The app has now gone through the review process, and is available for merchants to install on the app store. Since this is their first checkout UI extension, the Nextools team is hoping to get feedback from their users to iterate and improve, and add any features as they’re requested.

Nextools plans to build at least two more apps with Gadget, and is considering migrating some of their existing Shopify apps to the platform to take advantage of the performant infrastructure and scalability without having to worry about managing it themselves.

5
days to build

Interested in learning more about Gadget?

Join leading agencies making the switch to Gadget and experience the difference a full-stack platform can make.