<img height="1" width="1" style="display:none" src="[https://www.facebook.com/tr?id=338168267432629&amp;ev=PageView&amp;noscript=1](https://www.facebook.com/tr?id=338168267432629&amp;ev=PageView&amp;noscript=1)">
CUSTOM KIOSK SOFTWARE

Payment Kiosk

About The Project

For this project we leveraged our decade's worth of experience in the kiosk industry to develop this application to run on our client's kiosks. Our client chose to replace a legacy third-party SaaS program to both eliminate the recurring subscription fee and improve upon it for their needs.

During our discovery phase, we analyzed existing software and reviewed the client needs to fully define the scope of the work. The overall purpose of our software was to allow users to deposit funds in their own account or in the account of other defined users. As with all our software projects, what seems simple at first glance often has many considerations to work through, not least of which were different hardware considerations from our typical web and mobile projects.

615b63554fd007d23940366f_kiosk-threescreens-lg-p-1600

Architecture & Administration

This particular project was a good example of a very successful fixed-bid project. Whether you end up going fixed-bid or not, we highly recommend taking time for project roadmapping. By briefly taking this additional step up front to review all the screens you will need for your workflow before writing one line of code will save you a lot of headaches. There are often divergent paths that a user may take and we can help you outline all of those from assigning funds to various accounts to working through the different payment types and how those would be handled, to the different ways of receiving a receipt.

During project roadmapping, we created wireframes to help the client visualize the user workflow and quickly iterate through changes saving time and money. Our UI designer provided a clean and intuitive interface that's a pleasure to use. We also implemented the latest Google Material Design guidelines for a modern looking interface. To put the final touches on the design, we analyzed their website to ensure the kiosk application would be consistent with their current brand identity. In addition, we wanted any search or information input to work as seamlessly as possible, while also protecting private information where necessary.

On the administration side, we defined with the client what needed to be available for their team to efficiently and accurately run their service. In particular, the client needed to be able to manage the configuration details of these kiosks and have these kiosks update remotely to any changes.

615b457e4e0b90467a5f56ad_kiosk-threescreens

Technology

As with many of the mobile apps we work on, we built this in ionic. Ionic was capable of handling all the features we needed to build, while also keeping the budget lean. With Ionic we can use a single codebase to deliver the app both to Androids and iPhones.

A main aspect of the app is rendering the maps for each season. We chose GoLang for the map tile server because it is fast, especially as a webservice. In combination with that we used the library Mapbox GL, a JavaScript library that uses WebGL to render interactive maps from tiles. We convert a single image of a map into a tileset composed of smaller images called raster tiles. The images get rendered as you zoom and out, providing the user a smoother experience as they interact with the maps. We built an admin side to the app where each map can be uploaded and activated for each new season. Perhaps one of the coolest pieces of technology we leveraged was an open-source software called GDAL which converts a standard image of a map into the raster geospatial data we need for WebGL.

We used Node to handle the thousands of concurrent users. Node is able to handle requests asynchronously, not waiting for each request to complete before moving onto the next. Instead it processes all requests as they come in. Our database is MongoDB with Redis for cache to help with the number of requests made.

Software & Hardware

Project planning was key. During project roadmapping, we were able to fully outline the scope of the project. With over a decade of experience in the kiosk industry, we brought a considered eye to the feature list of the project, both shoring up gaps and eliminating user stories that did not need to be a part of the MVP. These choices saved the client time and money overall. It was also important for us to fully understand all the hardware they would use from the beginning. The combination of hardware and feature set allowed us to determine the optimal tech stack on the software side. In this case, we needed to integrate the credit card reader, bill acceptor, and thermal printer with our software for a seamless experience.

With all of these considerations in mind, we used Python Django for our backend. We are able to build fast and robust applications with this tech stack. What's more the Django framework has a no-frills admin which we customized and made accessible for our client to manage certain aspects of their data and configuration. While some applications might require a fully developed dashboard with fancy graphs and charts (like our Lead Sherpa dashboard), others, like this one, only require a bare bones interface.

We used JavaScript and React on the frontend with PostgreSQL as our database. We also integrated with Kioware, a third-party software that protects and locks down kiosks, in this case the Windows mini PCs integrated into our clients' kiosks. Kioware is specically designed with kiosk use cases in mind. Thirdly we integrated with Twilio and Sendgrid additional third-party services that facilitate all types of communication from text to email to whatsapp and beyond. For our use case, Twillio sends the user their receipt via SMS and Sendgrid sends the receipt via email. Finally we implemented a third-party service called Sentry to handle all error reporting. This gives transparency to both parties when any Kiosks are down and what the errors are. If they are on the software side, then we can address them right away. Most importantly, we integrated with the clients API to pull the proles for loading funds and pushing deposits to their accounting system.

Python

A great balance between programmatic ideals and practicality.

Django

The most respected framework for creating quality web software.

React

This JS framework continues to grow in popularity

Javascript

Used since day one for front and backend development.

Kick Off Your Project

Whether you need additional team members or want to build from the ground up, we are your trusted tech partner.