This is absolutely awesome and potentially very useful.
I know the other commenters are giving you plenty of TODOs, but what I think could make this shine: explanations (like a ? by each dial) that give some details by the property (what is smooth vs craggy?) and how extreme the spectrum goes (is extremely soft just warmed cookie dough?). Photo examples could help too!
Also, generating a deterministic name based on the inputs could help people share or differentiate recipes, more so than by unlabeled values.
What I thought you were going to say was an explanation of how each ingredient affects the characteristics of the cookie.
Eg you could have the nice deterministic name like you say, but also something like “with high flour to sugar ratio for softness” or whatever the actual truth of the matter is
It would be nice if you could create a sharable link to share your specific recipe. You could encode it in the URL like thecookie.website/?q=20&lightness=80&chewiness=80&... - or use a reversible hash type function to get thecookie.website/2fa389dc. Then add a button to show the link & copy it to the clipboard, and maybe also make the URL change when dragging the sliders.
I clicked through to your site and played with it a bit. Nice idea, and well executed! Then I hit back to come back to HN... seventeen clicks later, I’m back. Might be nice to update the URL without adding a history entry.
Ha yeah, very good point. I thought it was neat to have the entire state of the app in the URL and use the back button to demonstrate that, but yes, I should probably be replacing history instead of pushing.
Suggestion: Push once after every complete phone, but replace after an intermediate state. That way the back button goes through a list of complete combinations you tried, without forcing you to walk back individual steps.
This was a Covid-19 side project to learn Svelte and Sapper.
Customize exactly how you want your cookies to turn out and it will generate the perfect recipe for your perfect cookie. Would really like everyone's feedback!
One important thing that's missing is an indication of what scale your oven temperature is at. I'm guessing Celsius, given what numbers I'm getting out of it, but it would really be helpful to specify clearly.
I'm a little unclear about how the eggs are measured. Most recipes I've seen specify a quantity of eggs, (i.e. one large egg). Do people actually get out the scale and tune eggs down to the gram?
Thanks! I'm curious what the role of white vs brown sugar is in your model. Personally I've taken to using brown sugar in place of white because I like the molasses flavor better...
The type of sugar actually has quite an impact, other than just the color and flavor. Brown sugar results in taller and softer cookies because it's slightly acidic and so reacts with the baking soda. White sugar causes cookies to spread more and become crunchier.
It's great that mostly everything is in grams, baking should be precise. It's hard when you read a recipie that uses cups without knowing the origin, as US vs not cups are different sizes (200mL vs 250mL). It would be nice if all measurements were in grams, baking soda and water included.
I like how it's really only one kind of cookie, but you can dial up/down various facets of what it means to be a cookie, resulting in completely different treats.
One would probably learn a lot about cookie baking by dialing up variations and trying them each out.
BTW: you get really fun results when trying to make 1 cookie. I'm not sure I have a teaspoon small enough for that.
yeah... try measuring out a tiny fraction of an egg... not easy. When I was experimenting with small batches I used a syringe to measure out small amounts of beaten egg!
If you made and compiled videos of the steps you took along the way, especially clips of those measuring experiments, it would be an easy YouTube hit. And your site would get a heck of a lot of traffic. IANTFB (I am not the Fine Brothers)
It's probably easier and less messy to measure the egg by weight, that's how pastry chefs do it. Apparently eggs are pretty close to water in density so the conversion should be trivial.
One egg is about 50g plus or minus. If a recipe calls for one egg to make 12 cookies then some basic algebra can get you to a single cookie.
The real problem with testing a single cookie is creaming a tiny amount of sugar and butter. Even if your ratios are accurate the preparation will be somewhat different and texture will be affected. But small batch testing is the way to go to dial in ingredients for ideal cost and flavour.
Where do you live that there is one standard egg size? At the very small market down the street from me, I count 3~5 sizes in their various packages (depending on how picky you want to be about "same size")
A digital scale is game changing for baking and (to a lesser extent) cooking. I dragged my heels for years on the purchase and I absolutely regret not having bought one years ago.
Just think about how annoying measuring a cup of peanut butter is, scraping it out of the measuring cup, washing the cup.. vs just adding spoonfuls of peanut butter to a mixing bowl.
You can still bake just fine with measuring spoons and cups but you’ll be more consistent and better with the scale.
They are required for experiments. I like to add a small amount of baking soda into my banana bread for a nicer crust but if you add too much, think 0.X grams too much, then the banana bread could begin to have a vaguely pretzel-like taste.
I love it, I'm making cookies tonight. Some humble suggestions.
- might be best to include the C as units for temp
- somehow allow scaling recipe to whatever my eggs actually weigh, (I know I can estimate manually bumping the output up and down, but it'd be nice to do exact calculations)
I’m surprised to learn how much effort it takes to make good cookies. One of my selections on this website required a preparation time of two and a half hours. I’ve always just thrown ingredients into a mixing bowl.
The prep time doesn't make sense. 30 minutes in the refrigerator and 10-15 minutes in the oven are totally understandable, but none of the other steps would take 1.5 hours combined. Maybe the website just assigns a minute value to each task and adds them all up, which is not realistic.
Recipes written by experienced cooks often parallelize 2-3 tasks. For example, you can preheat the oven while boiling the pasta while you're making the sauce. This not only saves time but is actually essential to the recipe. If you try to execute all three tasks in serial, either the pasta or the sauce will be in a less than ideal condition.
Where does the recipe come from? The 150-160f bake temperature seems wrong, eggs have to be internal temp of about 160 themselves, does that 12 minutes fully heat saturate it?
I'm going to try baking these tomorrow, would be cool if cup-measiremrnts mattered more than how many cookies come out. That way I don't have to do all the calculation and figure out the exact number of cookies Id need to get nice rounded numbers.
All units are in standard metric units because it's more precise / easier to measure / more useful for the majority of people. I'll consider adding a toggle for American units later. 250 is indeed very hot, but sometimes that might the kind of temperature you need - it's the upper limit of most domestic ovens. Some measurements are in teaspoons just because that's what most of the recipes I was basing this on were using, and precision isn't really so important for those ingredients, but yeah, the inconsistency is annoying. Will consider changing that to grams later.
A short time at 250C will make for extra crispy cookies, but the dough will have to be thin or the outside will be charred black before the inside is cooked. It takes trial and error to find the right balance. :)
A metric teaspoon is 5ml and a metric tablespoon is 15ml. They're perfectly acceptable units, not to mention convenient. Would you rather use 1/2 teaspoon of baking soda or measure 2.5 grams on a kitchen scale? I live in a fully metric country but whenever I need to use a recipe written in grams, I immediately convert them to ts/TS/cups and never look at the gram figure again.
I go even further and use no volumetric measures. So grams for water, milk, etc. Having to read off the scale I can assure I have 500g water and not 520mL b/c I read the meniscus wrong.
I'll still convert for other recipies, water being the easiest to convert as 1mL should be 1g.
The grams for everything is a habit I've picked up from reading a lot of modernist recipes.
Which is exactly why I would advise OP against trying to convert their teaspoons into grams. Unless they're very careful, they're bound to get inaccurate results.
As it happens, baking soda has a density of 2.2g/cm^3. But the powdered form contains lots of air between the granules, so the actual density comes down to somewhere just above the density of water. Using 3g instead of 2.5g in a recipe, though, will yield very different results.
i prefer metric units always. i have spoons in all different sizes, and i can't always tell which measurements matter, and which don't. from metric units i can more easily figure out which spoon size i need.
Standard spoons for cooking are are much bigger than regular table spoons, and their volumes are clearly marked. There's no room for confusion.
Besides, it's not easy to convert from grams to spoons on the fly because different ingredients have different densities, and the density of powdered material is different from that of a solid block. The same problem arises when converting spoons to grams. The worst is when you encounter a recipe that has been converted from spoons to grams (or vice versa) using the wrong densities. It's like encoding an image in JPEG. Every conversion reduces the precision of the numbers.
Standard spoons for cooking are are much bigger than regular table spoons
that's even worse. if i need specialized equipment to get the right measurements then where is the advantage? with metric units, a scale and a jar with markers for volume is all that i ever need to do all measurements in the kitchen.
what's more, both the scale and the jar can handle imperial units as well.
The worst is when you encounter a recipe that has been converted from spoons to grams (or vice versa) using the wrong densities
if the measurement is done at a specific density, and i redo the same measurement at a different density then it's going to be wrong no matter what. but if that is a problem, then volume is the wrong measurement to begin with.
this isn't even about metric vs imperial, because the same problem applies if the spoon is converted to imperial weight.
spoons need to be converted to mililiters or fluid ounces to avoid that problem.
this is not an argument to keep using spoons as units.
There are lots of recipes out there that call for 1/4 teaspoon of some kind of spice. That's easy to measure if you have the typical 1/4tsp, 1/2tsp, 1tsp, and 1TBS set. Not so easy on a low-cost kitchen scale (that still costs more than the spoon set!) that can't measure 0.6 grams accurately. So you need to get specialized equipment anyway.
good point. i haven't seen such recipes yet, but i checked my scale and found that, while it claims to have 0.1g accuracy, it doesn't do well with amounts less than 0.5g.
(it's rather wierd. it does go up in 0.1g steps after 0.3g, but if i add something heavier and reset to 0, i have to add more than 0.3g again before it shows a change.)
Depends on what you use at your table. My tablespoons only seem to hold 10ml, and what passes for a teaspoon in my country is less than half the size of a measuring teaspoon. This kind of inconsistency is exactly why measuring spoons have been standardized.
Yeah it's a bit janky right now... it's because some properties change ingredients which impact other properties... for example if you want a lighter color then the brown/white sugar ratio might change, which also changes the the texture and thickness.
I was able to understand this, but then I found that some sliders make other sliders move farther than necessary. I even found a case where grabbing a slider to move it but putting it back to the original position before releasing the mouse button would change other sliders (surely that means either the original positions were inviable or the changes were unnecessary).
UX wise, it would be far easier to understand if the other sliders responded instantly so that I could see as I drag one slider how much it impacts the others, without having to release the mouse at each step to find this out.
Corn syrup isn't a useful ingredient anyway. It only exists in the US due to corn subsidies. I would be more concerned about the difference in flour between UK and US. That would change a "perfect" recipe significantly.
> Incidentally, if you want the absolute chewiest, most uniformly textured cookies, try replacing some of the white sugar with corn syrup, a sugar that is even more hygroscopic. Corn syrup is so darn powerful, in fact, that even a small amount of it will completely alter the texture of your cookie. In the cookies above, the batch on the left was made with 5 ounces each of white and brown sugar. The batch on the right was made with 5 ounces of brown sugar, 4 ounces of white sugar, and 1 ounce of corn syrup. A substitution of only 10%.
Yes, that's correct. Granulated sugar (sucrose) is fructose and glucose. Corn syrup is glucose syrup made from corn. HFCS is made to simulate sucrose by adding fructose to corn syrup.
In the US we like to market things based on what they don't contain (unsalted butter, unsmoked provolone, etc), so glucose syrup is sold as as "0g High Fructose Corn Syrup, aka light corn syrup with _real_ vanilla":
HFCS is actually more like invert syrup then, which consists of glucose and fructose separately, like honey. Sucrose consists of glucose and fructose chemically bonded together.
Surely this isn't purely continuous... the steps change dramatically from partial changes to one slider. There must be a number of ranges that define the steps and continuous values within thoes ranges, no? I want to know the number of unique sets of steps/ingredients.
> which are not necessary until a visitor decides to donate
While true and I agree, Stripe argues that their anti-fraud system is helped if you load the JS code as early as possible, so assuming they are doing bunch of tracking in order to identify fraud when they finally go to the payment screen.
I know the other commenters are giving you plenty of TODOs, but what I think could make this shine: explanations (like a ? by each dial) that give some details by the property (what is smooth vs craggy?) and how extreme the spectrum goes (is extremely soft just warmed cookie dough?). Photo examples could help too!
Also, generating a deterministic name based on the inputs could help people share or differentiate recipes, more so than by unlabeled values.
Fun project, good job.