Open Kiosk

Open Kiosk: Build Your Own Smart POS System for Retail Stores

Are you a small business owner, market vendor, or pop-up shop operator looking for an affordable, professional, and open-source point-of-sale system?

Look no further, Open Kiosk is here! This DIY project walks you through building a complete retail kiosk powered by modern web technologies and real hardware components, all without recurring fees or vendor lock-in.

With Open Kiosk, you can:

✅ Add and manage inventory

✅ Print thermal receipts

✅ Track sales and generate reports

✅ Use voice search

✅ Customize everything to suit your shop

It is powered by a free Firebase database (Limited to 50,000 reads/day, 20,000 writes/day, 1GB storage). The app is highly optimized, capable of storing over 10,000 products and 50,000+ order history entries within that 1GB limit.

Whether you're setting up a boutique, food stall, or mobile kiosk, this project helps you create a reliable and sleek POS system using components like a LattePanda MU, ESP32, and a thermal printer, all housed in a compact 3D-printed enclosure.

💡 What You will Learn

In this step-by-step guide, you will discover how to:

1. Assemble kiosk hardware with ESP32 and LattePanda
2. Connect and configure a thermal printer via UART
3. Install and run the kiosk software with Firebase integration
4. Generate sales reports and manage your business-like a pro

🧰 What You'll Need

1. Hardware: LattePanda MU, Seeed Xiao ESP32 S3, 58mm/80mm thermal printer, touchscreen display, 3D-printed case
2. Software: React + Vite + Firebase + Python
3. Skills: Basic electronics, beginner-friendly coding, and a bit of DIY enthusiasm

Ready to revolutionize your store with a DIY smart kiosk?

Sponsored by JLCMC: Your Go-To Partner for Mechanical Parts!

Introducing JLCMCthe newest addition to the trusted JLC family, delivering high-quality mechanical parts at the best prices in the market. With a legacy of excellence established by JLCPCB, JLCMC is here to provide reliable and affordable solutions for all your mechanical needs.

Why Choose JLCMC?

A Trusted Name:

1. JLCMC is built on the foundation of JLC services, a global leader in PCB manufacturing and prototyping. Their commitment to quality and customer satisfaction carries forward into their mechanical parts services.

Unbeatable Prices:

1. True to the JLC legacy, JLCMC offers mechanical parts at industry-leading prices, ensuring that your projects stay on budget without compromising on quality.

Wide Range of Products:

1. From precision-engineered components to custom solutions, JLCMC has everything you need to bring your ideas to life, whether you're a hobbyist or a professional.

Global Trust:

1. JLC services have earned the trust of millions of makers worldwide. With JLCMC, you get the same reliability, now in the realm of mechanical parts.

Check Out This Offers and Customized solutions from JLCMC:

1. Aluminum Enclosure
2. Aluminum Profile Frame
3. Screw and Nut Set
4. Linear Module JKK60 Series

Visit JLCMC.com to explore their offerings, Register & Enjoy $70 + Monthly MC Coupons. Join the growing community of makers and professionals who trust JLCMC for their mechanical needs.

👉 Let's build your very own Open Kiosk!

Here is everything you will need to build your own Open Kiosk system:

1x Latte Panda MU KIT

1x Thermal Printer

1x 10.5" Touch Screen

1x Xiao ESP32 S3

1x Push Button

1x DC Female Connector

1x DC Male Connector

1x Wi-Fi USB Dongle

2x Type-c to Type-A Cable (1 included with screen)

1x Micro HDMI to HDMI (included with screen)

4x M2.5 6mm (Included with screen)

2x M3 16mm

15x M3 6mm

4x M2 6mm

11x M3x6mm Metal Heat Insert

My 3D Printer

My Screwdriver Kit

My Soldering Station

Heat Insert Solder Tip

I designed the custom enclosure for Open Kiosk using Fusion 360 to ensure a compact, modular, and professional look.

CAD Modeling Process

1. I started by importing official CAD models for components like the LattePanda MU.
2. For parts without available models (e.g., thermal printer, connectors), I measured them manually and used datasheets to create accurate 3D models.
3. Once all components were modeled, I began designing the enclosure to precisely house each part.

Enclosure Design Overview

The enclosure includes several modular parts:

1. Housing – Main frame to hold the display, LattePanda, ESP32, and wiring
2. Printer Cover – Mounts to the housing and secures the thermal printer
3. DC Connector Holder – Allows the DC jack to be screwed firmly into the housing
4. Button Clip – Holds the push button securely in place
5. Side Vents – Provides airflow for cooling
6. Cover – Bottom cover to enclose the internal components
7. Top Cover – Hides the exposed ports on top for a clean finish

3D Printing Details

All parts were printed on my Bambu Lab P1S using PLA+.

1. The design supports metal heat inserts, so each part can be assembled using standard M2 and M3 screws.

Download Files

You can either edit the original design in Fusion 360 using the provided CAD files or directly print using the .STL files below:

1. 1x Housing.stl
2. 1x PrinterCover.stl
3. 2x SideVent.stl
4. 1x DCHolder.stl
5. 1x ButtonClip.stl
6. 1x Cover.stl
7. 1x TopCover.stl

Before assembling the parts, we need to embed metal heat inserts into the 3D-printed parts. These allow us to screw everything together securely without damaging the plastic.

What You will Need:

1. 11x M3 x 6mm heat-set inserts
2. Soldering iron (preferably with a heat insert tip)
3. Tweezers or pliers
4. Housing and PrinterCover

Embedding Process

1. Power up your soldering iron and set it to around 180–200°C (or according to your insert manufacturer’s recommendation).
2. Place an insert on top of each designated hole in the Housing and Printer Cover parts.
3. Using the tip of your iron, gently press down on the insert. Apply steady pressure until the insert slides flush into the plastic.
4. If you're using a standard soldering tip (like I did), carefully hold the insert in place with tweezers while heating and pressing it in.
5. Let it cool for a few seconds before moving on to the next insert.

Now that the heat inserts are embedded, it's time to attach the Printer Cover to the main Housing.

What You will Need:

1. Housing part
2. PrinterCover part
3. 5x M3 x 6mm screws
4. Screwdriver or L-Key

Assembly Instructions:

1. Align the PrinterCover with the Housing.
2. The screw holes on both parts should line up cleanly.
3. Insert the screws and tighten gently using a screwdriver until snug.

Time to mount the touchscreen display onto the main housing.

What You will Need:

1. Housing (main enclosure)
2. 10.5" Touchscreen Display
3. 4x M2.5 screws (included with the display)
4. Screwdriver

Assembly Instructions:

1. Align the display with the pre-designed mounting holes on the Housing.
2. Insert the M2.5 screws and tighten all four screws evenly, one at a time.

Now we will install the thermal printer into the enclosure.

What You will Need:

1. Thermal Printer (58mm or 80mm)
2. Screwdriver
3. Assembled Housing + PrinterCover unit

Assembly Instructions:

1. Use a screwdriver to carefully unscrew and detach both side mounting brackets from the printer body.
2. Insert the printer into the PrinterCover opening.
3. Screw the clips back, to secure the printer firmly to the housing.

1. Take the two side vents and locate their matching slots on either side of the main housing.
2. Snap each vent into place by gently pressing it into its slot.
3. If the vents feel loose or wobbly, apply a small amount of quick glue to the contact edges and press them in firmly until dry.

Now it's time to install the brain of your kiosk, the LattePanda MU board. This powerful mini-PC handles the entire software stack of Open Kiosk.

What You will Need:

1. LattePanda MU (assembled board)
2. 4x M3 x 6mm screws
3. Assembled Housing
4. Screwdriver

Assembly Instructions:

1. Position the LattePanda MU inside the housing.
2. Align the board so its mounting holes line up with the M3 heat inserts embedded in the housing.
3. Insert 4x M3 x 6mm screws into the mounting holes.
4. Tighten the screws evenly until the board is firmly mounted to the enclosure.

Now let's install the power input (DC connector) and the push-button power switch.

What You will Need:

1. DC Female Connector
2. 3D-printed DC Holder (DCHolder.stl)
3. Push Button
4. 3D-printed Button Clip (ButtonClip.stl)
5. 4x M2 x 6mm screws
6. Screwdriver

Assembly Instructions:

Part A: DC Connector

1. Insert the DC connector into the 3D-printed DC holder, it should snap in snugly.
2. Align the DC holder with the dedicated mounting slot on the housing.
3. Secure it with 2x M2 x 6mm screws.

Part B: Push Button

1. Insert the push button into the slot on the housing.
2. Place the 3D-printed button clip over the button from inside the housing to hold it in place.
3. Secure the clip using 2x M2 x 6mm screws into the matching holes.

The Xiao ESP32 S3 acts as the bridge between the kiosk software and the thermal printer. Let’s upload the firmware to handle UART printing.

What You will Need:

1. Seeed Xiao ESP32 S3
2. USB-C Cable
3. Arduino IDE (installed on your PC)
4. ThermalPrinter.ino sketch
5. Internet connection (for installing board and libraries)

Programming Instructions:

1. Open Arduino IDE on your computer.
2. Install the ESP32 Board Manager:
3. Go to File → Preferences
4. In the “Additional Board Manager URLs”, add:

1. Go to Tools → Board → Boards Manager
2. Search for ESP32 and install the latest version.
3. Install Required Library:
4. Go to Tools → Manage Libraries
5. Search for and install: ArduinoJson library
6. Load the Code:
7. Open ThermalPrinter.ino from the project files.
8. Open Kiosk GitHub Repo
9. Select the Right Board:
10. Go to Tools → Board → ESP32 → Select XIAO ESP32S3
11. Go to Tools → Enable "USB CDC On Boot"
12. Connect Your Xiao ESP32 via USB-C cable
13. Select the Port:
14. Go to Tools → Port and choose the COM port labeled with “ESP32 S3”
15. Upload the Code:
16. Click the Upload button
17. Wait for the code to compile and upload.

After upload, your ESP32 will be ready to receive print commands from the Open Kiosk system and drive the thermal printer via UART.

To send print data from the Xiao ESP32 S3 to the thermal printer, follow the wiring diagram and steps below.

Use the 5-pin connector that comes with your thermal printer to make the connections. Reference the wiring diagram you provided:

GND ~ GND

Pin 43 ~ TX

Pin 44 ~ RX

This step ensures power delivery to both the LattePanda MU and the thermal printer from a single 19V power supply.

Required Parts

1. Male DC Connector (connects to MU)
2. DC Female Connector (already mounted on enclosure)
3. LM2596 Buck Converter Module
4. 2-pin JST Connector (Included with printer)
5. Multimeter (to set voltage)

From the female connector, split the power wires:

1. One pair goes directly to the LattePanda MU via the male DC connector.
2. One pair goes into the IN+ / IN− of the LM2596 module.

Step-Down Conversion for Printer:

1. Adjust the LM2596 output to ~8V using a multimeter and the onboard potentiometer.

Power Connection

1. Connect OUT+ / OUT− to the 2-pin JST going to the thermal printer.
2. Plug the 2-Pin JST Connector into the thermal printer’s power input.
3. Connect the Male DC Barrel Jack to the LattePanda MU’s DC input port.

1. Connect an HDMI cable from the LattePanda MU HDMI port to the Micro HDMI port on the Touch Display. This handles the video signal.
2. Use a USB Type-A to Type-C cable to connect from the LattePanda MU USB Type-A port to the Touch Display Type-C port. This supplies power to the display.
3. Use a USB Type-A to Type-C cable to connect the ESP32 Type-C port to another USB Type-A port on the LattePanda MU. This powers ESP32 and allows the MU to communicate with and program the ESP32.

What You Need:

1. 2 wires
2. Soldering iron
3. Patience and a steady hand

Instructions:

1. Find the power button on the LattePanda MU.
2. Cut two wires to the appropriate length to reach from the enclosure button to the MU’s power button header.
3. Solder one end of each wire to the push button on your enclosure.
4. Then, carefully solder the other ends to the MU power button.

1. Take the enclosure cover and carefully align it over the housing.
2. Make sure that all holes in the cover line up with the threaded inserts on the housing.
3. Use 6x M3x6mm screws and use a screwdriver to gently but firmly tighten the screws.

1. Since the LattePanda MU doesn't have a built-in WiFi card, we are using a WiFi USB dongle.
2. Plug the USB dongle into one of the available USB ports on the MU (preferably a USB 3.0 port for better performance if available).

1. Take the Top Cove, align it with the enclosure assembly, ensuring that no cables are in the way and the screw holes are properly lined up.
2. Use 2x M3x16mm screws and an L-key (hex key/Allen wrench) to tighten them securely.

That is it, our hardware assembly is complete!

1. Plug in the 19V Power Supply that came with our LattePanda MU kit into the female DC jack on our assembled enclosure.
2. Press the external power button.
3. Wait a few seconds, the LattePanda MU should begin booting up.
4. The display should turn on, and if connected properly, your thermal printer should be powered and ready.

No power?

1. Check the DC adapter is firmly connected.
2. Make sure all power connections (especially the LM2596 module) are secure.
3. Verify the LM2596 is still outputting ~8V to the printer.

Display not turning on?

1. Confirm HDMI and Type-C power to the display are connected.
2. Double-check that the LattePanda MU is booting (look for fan or LED indicators).

Thermal printer not working?

1. Ensure the JST connector is seated properly.
2. Verify the LM2596 output again with a multimeter.

This step covers everything you need to get Open Kiosk running on your Windows 11-powered LattePanda MU device.

Initial Windows Setup

Before setting up the kiosk app, make the following adjustments to your Windows settings:

Set Screen Orientation

1. Go to Settings → System → Display
2. Scroll down to Display Orientation
3. Set it to Portrait for vertical kiosk layout

Enable On-Screen Keyboard

1. Go to Settings → Accessibility → Keyboard
2. Toggle On-Screen Keyboard to ON

This ensures users can enter data using a touch interface.

Install Chrome Browser (for Kiosk Mode)

Chrome supports true fullscreen kiosk mode, perfect for POS displays.

1. Download and install Chrome from: https://www.google.com/chrome

Download the Software

1. Visit the Open-Kiosk Releases
2. Download the file:
3. 👉 Open.Kiosk.zip

Install Python

Head to python.org and:

1. Download the latest stable version for Windows
2. Run the installer
3. Make sure to check “Add Python to PATH” during installation

Set Up the Application

After downloading:

1. Extract the Open-Kiosk.zip file to a folder of your choice (e.g., C:\OpenKiosk)
2. Edit the Launcher:
3. Open launch-kiosk.bat in a text editor (e.g., Notepad)
4. Update the path to point to your extracted folder
5. Save the file

Example line you might edit:

Replace "C:\Users\YourName\Open Kiosk" with your actual extracted folder path.

Create a Desktop Shortcut

1. Right-click launch-kiosk.bat → Create shortcut
2. Right-click the new shortcut → Properties
3. Click Change Icon → Choose icon from the extracted folder favicon.ico
4. Rename the shortcut to 👉 Open Kiosk
5. Drag or copy the shortcut to your Desktop or Home screen

✅ Done!

Once everything is powered and running:

Launch the App

1. Double-click the Open Kiosk desktop shortcut you created earlier. If You Get Warning the click on run Anyway.
2. You will be presented with the Initial Store Setup screen (as shown in the image). Here's how to complete it.

Fill Store Information

1. Store Name ~ Your business/store name
2. Currency ~ e.g., INR, USD, etc.
3. Tax Percentage (%) ~ e.g., 18
4. Tax ID / GST Number ~ Your government tax ID or GST number
5. COM Port for Printer (Optional) ~ e.g., COM3 (Check in Device Manager -> Ports) (Only if using a thermal printer)

Firebase Configuration Setup

1. Go to 👉 https://console.firebase.google.com
2. Log in with your Google account
3. Click “Add Project” → Create a new Firebase project
4. Under “Your Apps” → Add App → Web
5. Register your app (e.g., open-kiosk-app)

Copy these values from the SDK config and paste them into the setup form:

1. API Key ~ apiKey field
2. Project ID ~ projectId
3. Auth Domain ~ authDomain
4. Storage Bucket ~ storageBucket
5. Messaging Sender ID ~ messagingSenderId
6. App ID ~ appId

Once all values are entered, click “Complete Setup”

Create Firestore Database

1. Go to Build → Firestore Database in Firebase
2. Click Create Database
3. Choose Start in Test Mode
4. Select your region and click Enable

You are Done!

You will be redirected to the Home Page, where you will see:

1. Admin Card
2. Shop Card

If anything doesn’t work:

1. Go to Admin Settings Page
2. Review your Firebase and printer configurations
3. Update and save again

Once the setup is complete, the system operates through two panels:

Admin Panel

The Admin Panel provides all backend controls for managing your store.

Page 1: Dashboard

1. Total Products Count
2. In-Stock Count
3. Today’s Sales Amount
4. Today’s Order Count

Page 2: Add Product

1. Add new products with:
2. Title
3. Description
4. Image URL
5. Category
6. Tags (for better search results)
7. In Stock toggle

Page 3: Inventory

1. View & update all existing products.
2. Edit stock status, titles, or other info.

Page 4: Orders

1. See full order history.
2. Default filter: today’s orders
3. Change date to view past records.
4. Option to reprint bill in case of mishap.

Page 5: Reports

1. Generate reports based on:
2. Date
3. Timeframe
4. Report Types:
5. Sales Summary
6. Item Performance
7. Export report as CSV

Page 6: Settings

1. Modify:
2. Store Name
3. Currency
4. Tax %
5. Tax ID
6. Firebase Config:
7. API Key, Project ID, Domain, etc.
8. Printer Configuration:
9. Toggle between:
10. Thermal Printer (via COM Port)
11. Native Print (PDF output)
12. Set COM Port for the thermal printer.

If Printer Setting is OFF, the app will generate bills in PDF (native print).

Shop Panel

Used by store staff or customers for placing orders.

1. Displays all items (In Stock / Out of Stock)
2. Search products by:
3. Title
4. Tags
5. Search Input and Voice Search
6. Features:
7. Add items to cart
8. Clear cart
9. Checkout & Pay
10. Print Bill

Each order is recorded in the backend with a unique Bill/Order Number for future tracking.

Open Kiosk is a locally running, hardware-integrated Point of Sale system with Firebase-backed data persistence and a UART-connected thermal printing subsystem.

Application Architecture

1. Local Execution: The application is a local-first web app built using React, Vite, and Tailwind. It runs directly on the LattePanda MU or any compatible PC, no web hosting required.
2. State Management: App state and settings (like Firebase credentials, store details, and printer config) are stored locally in a secure config file.

Database (Firebase Integration)

The system integrates with Google Firebase for real-time, cloud-based storage and synchronization:

✅ Store Initialization - Firebase credentials & store config saved locally

🛒 Add Product - New product is pushed to Firebase DB

✏️ Edit Product - Product updates are synced to Firebase

🧾 Complete Order - Order details are saved to Firebase

📜 View Orders - Orders and reports retrieved from Firebase

📊 Reports - Data fetched via time-based queries to Firebase

Printing System (ESP32 + Thermal Printer)

1. When the user completes checkout, the selected items and totals are compiled into a JSON string.
2. This JSON is sent via UART serial communication to the Seeed Xiao ESP32 S3.
3. On the ESP32:
4. The JSON is deserialized
5. The data is formatted into a receipt layout
6. Thermal printer commands are issued to print the bill

Open Kiosk is a powerful, affordable, and open-source Point of Sale solution designed to bring modern retail features to small businesses, market vendors, and pop-up stores. With offline-first functionality, real-time Firebase integration, and optional hardware add-ons like thermal printers and touch screens, it provides the flexibility to run on virtually any PC or embedded system.

To optimize storage, product images are stored as URLs, reducing the size of the Firebase database while still allowing full visual product management.

Because the entire application is open source, anyone can download, modify, and run it on their own system, with or without specialized hardware. Even if a thermal printer isn’t available, the app supports native printing, ensuring full functionality in all environments.

Open Kiosk empowers local businesses with technology typically reserved for large-scale operations, no subscriptions, no lock-ins, just full control.