The UX of my coffee grinder sucks so I built a web app

check it out here

WTFellow (v 1.0)

I got the Fellow Opus because it seemed like a good mid-tier grinder that worked for both espresso and pour overs. Sadly none of the rave Youtube reviews warned me about how you can’t tell what grind setting you are actually act.

This is a pain because:

1. I adjust grind size at least 2–6 times a week to find the perfect setting to extract a shot of espresso for every new bag of coffee beans (if you don’t know anything about coffee watch James Hoffman’s video about dialing in espresso)
2. I have to do math to figure it out (e.g. I was at 1 on the outer ring and I moved the inner ring to be -1/6, so actually my grind size is 1–1/6 = 5/6)

I just want my coffee.

For the MVP I settled on a few things.

To make it happen I touched Javascript for the first time.

You can play around with the app yourself. Here’s a walk through of the user flow and some key decisions I made.

The home page. I took inspiration from the font and brand colors from Fellow. Used bootstrap to make sure it is mobile optimised. Set the Inner Ring at -6/6 as the default to be consistent with my machine.

For the outer ring I left it as a free text field since the options were from 1 to 11 at increments of 0.25, but I made sure to validate the user’s inputs. For the inner ring it was just a drop down menu of the fractions.

I wanted the result to be a number rounded to two decimal places because that’s what I would key in to Notion.

What I learnt

• Javascript. The basics.
• Dealing with mixed data types. Like specialised fraction data and decimals.
• Git and VS Code. The basics. Prior to this I had only ever used Code Pen.
• Separation of concerns. I had everything in one html file at first. It worked locally but I had some issues deploying so watched some videos like this one by Mosh.
• Deployment on Vercel. I wanted to deploy on Amplify at first to see what the developer’s experience was like but Vercel was faster. Will use Amplify and other AWS services in later apps.
• How to use ChatGPT to write some parts or troubleshoot.

No more math, just coffee :)