Professional project · Functional prototype · 2026
ColorStockFrom measured weight to business data.
I contributed to a web application for hair salons connected to a scale through Web Bluetooth. My work mainly focused on hardware communication and the visual interface.
01 · Context
Understand the need before writing code
The project began with a real issue observed in salons: leftover colour is rarely measured and its cost is difficult to assess. Together with Thierry Adet, I worked on a prototype that turns weighings made during preparation into stored, analysable information.
My challenge: retrieve a live physical measurement, then make it understandable and useful within the stylist’s workflow.
02 · Prototype scope
Connect several uses around one measurement
Understanding my interface work requires some context. ColorStock brings recipes, clients, preparations, staff, stock and analytics together. All these screens use data produced during weighing.
I designed a journey that clearly shows each product and quantity to pour.
The interface retrieves recipes and history linked to a client.
Recorded quantities feed the available-product tracking.
Summary screens make waste readable in grams and euros.
03 · The workflow I designed
Make a sequence of weighings easy to follow
The main visual challenge was guiding stylists without requiring them to understand how the scale works technically. I organised the interface around short steps, a permanently visible weight and immediate status feedback.
SELECT
Choose the client, stylist and recipe.
PREPARE
Weigh the empty bowl, then pour each product to the requested amount.
APPLY
The mixture processes while ColorStock tracks its progress.
CHECK
Weigh the remaining bowl to calculate the service’s actual waste.
04 · My technical contribution
Make the scale and browser communicate
I developed the API layer handling Web Bluetooth communication between the scale and the website. I managed peripheral connection, continuous weight retrieval and delivery of useful status information such as connection and battery state. This work taught me how to connect physical data to a web application without intermediary desktop software.
05 · My visual contribution
Design a dense but understandable business interface
I also created the website’s visual interface. My goal was to organise many features while keeping the preparation workflow quick to read. I worked on screen hierarchy, scale states, dosage progress and responsive layouts for computers, tablets and smartphones.
SCALE API
Decode and transmit live weight through Web Bluetooth.
INTERFACE
Organise dense business software without slowing down the stylist.
RESPONSIVE
Support use on computers, tablets and smartphones.
STATUS FEEDBACK
Expose connection, tare, battery, dosage and progress clearly.
INTEGRATION
Connect the front end with PHP, JavaScript, SQL and Apache.
06 · Programming
Move data from the scale to the database
The programming work required several layers to communicate. In JavaScript, I handled the Web Bluetooth connection, incoming measurements and live interface updates. PHP manages server exchanges, while SQL stores clients, recipes, products and preparations. I had to ensure that an untimely measurement, disconnection or screen change could not create inconsistent data.
Find the scale, request permission, connect and listen for transmitted measurements.
Update weight and interface states without reloading the page.
Transmit, validate and store data used by each preparation.
Inform users when the scale disconnects or a measurement cannot be used.
07 · AI-assisted development
Use Codex to learn new technologies
I chose to use Codex as a collaboration tool during development. Web Bluetooth and some interactions between the browser, PHP and the database were new to me. Codex helped me explore documentation, compare approaches, produce initial solutions and understand unfamiliar code more quickly.
Explain the need, technical context and project constraints precisely.
Ask for an explanation of a proposal before integrating it into the application.
Test the result, read the code and identify errors or side effects.
Make architectural decisions and adapt answers to the real prototype.
This choice does not replace learning how to program. It taught me an additional skill: collaborating with an AI agent while remaining able to understand, verify and evolve the generated code.
08 · Functional logic
Use the data produced by my interface
The weight retrieved by my API does more than display a number. It is used for dosage, leftover calculations, stock updates and adjustment of client recipes. This chain taught me to design an interface around the data it produces and consumes.
Retrieve the client’s personal formula.
Guide every pour with live weight.
Subtract the empty bowl weight from the measured leftovers.
Proportionally adjust the next preparation.
09 · Challenges encountered
Make hardware, browser and data work together
I had to account for browser permissions, disconnections and compatibility differences between devices.
The display had to remain responsive and readable while weight values changed rapidly.
Connection, tare, dosage, processing time and final checks required consistent visual feedback.
One preparation changes client history, waste and stock, so every step had to remain synchronised.
10 · Technologies used
An architecture I learned to connect
I worked with server-side processing and application endpoints.
I built interactions and processed measurements received live.
I handled data related to clients, recipes, products and preparations.
I helped integrate the prototype into its hosting environment.
11 · Teamwork
Develop a prototype with ILOS informatique
I worked on this project with Thierry Adet, managing director of ILOS informatique and a developer. This collaboration exposed me to a real professional need, an already extensive application and the need to divide and integrate our development work.
- Test my interface choices across a complete business workflow
- Document communication between the scale and browser
- Handle disconnection and unexpected measurement cases
- Evolve my work without blocking other software features
Above all, ColorStock taught me how to build the link between a physical object, a web interface and a real business need.
← Back to projects