SaaS Platform: Landing Pages Made Easy
EZ-Estimate is a SaaS platform for the construction industry that allows each customer to create their custom landing site with a quote generation feature and a personal dashboard to manage their product and site.
Who Can Use EZ-Estimate
Real estate and landscape companies need to build landing sites quickly.
What did the client come to us with?
A client from the USA came to us through Upwork with only an idea and rough sketches of his system. He wanted to create a user-friendly online platform that allowed construction companies to create user-friendly sites to attract their audience.
Project’s First Preparations and Assessment
After the client described his requirements, we analyzed and supplemented them with other necessary things that should be present in this project. When we received a list of requirements from the client, we transformed it into a technical specification.
Given the multi-phase nature of the project, our estimate was approximately $20,000. According to his rate, it was 740 hours.
Our development team consisted of a team leader, a designer, a QA tester, two middle-level developers and one junior developer. And the whole team participated in the preparation of the evaluation of this project. The development team was chosen based on their experience with similar projects.
Technologies We Chose
Our team selected the most modern technologies, which can be easily adapted to the project’s expansion without any technical limitations. The technologies we chose were Laravel 8, MySQL 8, Vue.js with Nuxt.js framework, Google Maps API, and Stripe. The whole project is hosted on AWS.
Collaborating with a Client
We communicated with the client on an ongoing basis. There were reports every Friday and calls every Wednesday and Friday. In addition to the general report, where the project manager showed what was done with screenshots and indicated specific stages of development. We also made phone calls, and a presentation of completed works was held. We discussed his next demands.
Reports to the client were formed based on their requirements.
Description of the Development
The project was managed with Kanban and Agile method, and we constantly listened to every client’s requests. The development team divided responsibilities by features and modules. Someone was involved in the layout, someone was involved in the backend, payment modules, the module for drawing elements on the map, etc.
Writing technical documentation
Since the client only had an idea and sketches, our team had to write the project’s technical documentation. During the documentation writing, we took into account such basic parameters as the scope of work, planning, development phases, preliminary work assessment, etc.
Considering the fact our client had only a rough idea of the project, we used Discovery Phase. We studied similar projects that competitors have, the main workflow and functions that are suitable for the project. Next, a list of important requirements for the project is compiled, which are considered and approved with the client’s consent.
The next step is to create the descriptive part of the document. Our client had design sketches for this project, and based on these sketches we began to think through the first functionality of the web project. The client’s wishes may change throughout the development process, and this is a normal part of the work.
Next, we started prototyping the project interface in Figma and Balsamic. We think over the design of each page, each module and button. And the final stage is writing a summary, where we summarize the overall assessment of the work and describe everything related to the EZ-Estimate project.
Project and database architecture
The EZ-Estimate project is hosted on AWS, one of the largest cloud platforms in the world. We chose Amazon Web Services because this database is scalable and can be adapted to meet your business needs. AWS is also a reliable and affordable service with a convenient pay-as-you-go payment system and strong security features that meet ISO, GDPR, and HIPAA standards. In addition, site owners on Amazon Web Services make their project available to users from anywhere in the world, as AWS has a global structure.
Frontend and Backend development
Throughout the development process, the project was structured into two distinct parts—front-end and back-end—each maintained in its own repository, with communication handled through an API. For every new feature, implementation began on the back-end before moving to the front-end. All development followed the standard three-environment workflow: local for initial coding, staging for testing, and production for the live deployment.
Connecting third-party APIs (Google Maps, Stripe)
For the EZ-Estimate project, we have used third-party services such as Google Maps and Stripe. Google Maps plays a key role for the site, where a user highlights the desired land plot directly on the map, and then the user performs the necessary calculations and sets the cost for the land or building.
Stripe is a universal solution that is installed on the site, so a user can pay for the selected subscription rate. All these third-party resources were connected to the site using the Google Maps API and Stripe API.
Stage and live environment deployment
Web development on servers is carried out according to three servers principle. First, the developer writes the code on the local server, and then after first check the code is uploaded to the staging server. Next, the QA tester conducts testing on a staging server. After checking, there are several possible options: if task is performed well, it goes into the QA ok section, and the task is uploaded to production. In the production server, it is tested again by a QA tester.
However, if an error appears in production, the tester returns the code to the developer and they fix the problem. And if an error is found in the staging server, then the developer send the code back to the local staging. After fixing the error on the locale, the code is then uploaded and checked for staging, and the same procedure is carried out on the production server until the project is fully functional and free of any bugs.
Project testing (QA & Unit testing)
After the project segment was uploaded to the staging server, a QA tester starts checking. If the part of web solution has no serious technical issues, the tester transfers it to the next status: QA OK (it passed the test) or QA Fail (indicates a problem). If it’s a QA fail, then the programmer corrects the errors and uploads it to the staging again. And then, the QA tester reviews the task again. If the task had been completed and no issues were found, then it was poured into production. As soon as it was uploaded to the live server, our QA tester re-tests it and changes the tasks status in case of any glitches or bugs appearing on the server. Once the issue was fixed, it is already transferred to the “done/executed” status.
How Web Visuals Were Created
The design was customized, and we engaged our partners who drew a custom design for the project. A client gave their requirements, the designer drew a first mock-up of approximately how they see the site. They also made a palette of colors and fonts. The client approved the mockup, the palette, and the layouts, and then they already approved the full design of the home page and the rest of the web pages. The finished pages were ready to be shown to the client. The client gave his feedback, and we continued to make changes if we didn’t like it. If the client approved the final design, then everything was validated, and before that, we began to edit the design of the project.
The designer drew a custom design in Figma. We received an update from the designer, respectively, through a board in Jira and Trello. And when they finished the design, the designer informed us about it and marked it in the Trello column. Project-manager was opening this column and looked at the work done in Figma. Trackers were used in Upwork – this is our internal tracker, when a person is conventionally working, it takes screenshots of the screen and accordingly, everyone knows that the person is working
What is the Final Solution
We have created a SaaS platform for construction companies and land owners who must create landing sites to attract new audiences. The main project’s concept is directly related to online maps. At the beginning, the user registers an account on the platform and links to the user’s official website. And then, the main process begins: they fill in their contacts, selects the service they need from the list, measures the project using the aerial view of their home, and calculate the price. After going through these several steps, a user marks on the map where they want to place, for example, a garden for the home, showing it on Google Maps. Its length and size are calculated and the total cost of the work is determined. After that, the company contacts the customers, or vice versa, and the purchase of a product happens.
The customization level for this product is extremely high, because there’s a possibility for a user to set the price, add different products and options, and upgrade chosen products.
Project’s Current Status
EZ-Estimate is currently launched on a production server and working now.
The link: https://www.ezestimate.io/