Information Gethering
Almost all projects start here. Basically, we needed to know who the project is, who will use it, what is in it, landing pages, features, and technologies. Aquila is for the agents in Indonesia who offer banking products like credit cards and loans, At malls, condo lobby, and on the street’s sidewalk that have tents step up, a place for a potential customer to fill up and sign a form using a tablet, pre-loaded with Aquila Web App.
Flow and Technologies
Since the web app will only be used exclusively on a tablet, we needed to re-write the bootstrap core media queries, but usable still on all projects. So we’ve developed a framework base on bootstrap 4 that we can easily configure at ease depending on what the project needs, like disabling responsiveness for mobile, perfect for Aquila, disabling components, and helpers that are not being used. After that, we sketch the full flow of the project, starting from its login page for agents, eligibility page, product result page, all the way to the customer’s thank you page. We also implemented an OCR tech to read the ID that the customer submitted or captured via the tablet’s camera to easily prefill forms.
Prototype Development
We proceeded on development once we’ve collected everything we need for the project. We decided to go straight on developing it in HTML and CSS. We included the existing markup of the eligibility form and implemented a new product result that will show up only if the customer signs up or has an existing account. If the customer already has an account, all they have to do is select a product category then a product. During development, there were minor changes to the UI only, nothing major.
Test and Quality Assurance
Once the development was done, we tested it first before submitting it to QA. The UI was developed on our sandbox, making it the standard for the company and making it the “yardstick” for the QA team. Going back to our mockups and design during testing if we forgot some components and we’ve ticked all of our checklists. We finally submitted it to our QA.
Adjustments
The test and QA resulted in some adjustments some major and some minor. The major one was the result page’s UI, basically, we needed to adjust it to mirror the new result page that was implemented in the result page of Cekeja and eCompareMo website to make it look like the user didn’t leave the web app.