Work samples / Calorio
As a distinctly portfolio-focused piece, I'm working on a small app for tracking calories, steps, and water. I'm calling the project Calorio.
This project is my first public foray into using AI to help build an App. Don't worry... I'm still doing the design and UX engineering work myself. But for backend work and more complex configuration work I'm leaning on AI for assistance. The result is an app built much faster than I could have built it on my own, while still having the care for detail that is my specialty.
Design
I usually start design work by creating a simple style tile for a general visual direction.
Then I begin sketching overall layout mockups and build components along the way. Here is a contact sheet for all my components so far.
Part of the idea is to show progress each day along the three core metrics. But specifically with calories (food) we also have a rating system that flags foods based on their calory density. In our system we encourage foods that are heavy but low in calories, as these tend to be more natural and more filling. So our food meter shows a red, yellow or green color depending on the average rating for the foods logged, while each food items is colored accordingly.
The app has a dashboard that shows the currently selected day's metrics.
Users can add new entries in each of the three categories.
Users can toggle the list of entries to review what they've added so far.
Users can toggle this history portion to see more of their past entries.
Development
The work-in-progress repo can be found here.