In week 1 the mechanical project of the vending machine structure and motion system was completed. The mechanical project details can be seen in the section Mechanical Design .
The base project for the server was created and can be accessed through the project’s GitHub repository in the “server” folder.
The server was set up using Docker Compose, enabling efficient containerization. It combines Node.js for runtime, PostgreSQL for data storage, Express for web serving, and Sequelize for simplified database interactions. This configuration ensures portability and consistency in deploying a maintainable server environment.
The base project for the application that will be showcased in the vending machine’s screen was created and can be accessed through the project’s GitHub repository in the “web-app” folder.
In week 1 the vending machine UI was designed using a software called Figma. The kickstart of the design development was establishing a design system to be followed by both the web app and the mobile app. The design system holds information such as hexadecimal codes of all colors, font types, font weights and font sizes to be used.
To ensure good user interaction, the application’s navigation flow was decided as follows.
Each screen of the application was designed keeping in mind the navigation flow created. The screens were also tailored to fit the 7-inch limitations of vending machine LCD screen.
NFC auth screen
Image auth screen
Failed auth screen
