.:[Double Click To][Close]:.

Engineering a healthier diet

Back in 2007, the cafes at our Mountain View campus started color-coding menu items according to healthfulness. The healthiest items are colored green ("go ahead, pile it on!"), foods you should portion-control are yellow, and foods you should eat sparingly -- in the words of my favorite recently reformed blue monster, "sometimes foods" -- are red.

While the whole point of the color-coding was to encourage healthy eating, and Google certainly makes it very easy for one to do that, I quickly realized that all of my favorite food items were colored red on the menus. Since all of the cafe menus are posted to separate pages of our intranet, it took too long to look through them to find the one or two items that would hook me into eating at a particular cafe for the day. So I decided to write a script that scans all the pages and creates a single unified menu of just the "heart-stoppingly good" food in all of the Mountain View cafes. (The nutritionist at Google at the time called them "least healthy" rather than "heart-stoppingly good.")

It took only a few minutes to write the script for the menus as they existed on the first day I ran it, but there were complications as each following day's menus started rolling in. Not all the chefs were using the same programs to create HTML menus, so the colors were all marked up differently in each. Every morning, I found I needed to add special cases to handle the various HTML variations to the original awk script that I'd started with. Every chef had a different idea of which color should be used for red items, green items and yellow items (the favored color for "yellow" text on white background is actually orange), so I ended up having to write a formula to perceptually classify the colors (by hue angle). Plus, I started to learn how hard things must be for someone who is blind or colorblind when reading web pages. To solve that problem, I had the program generate well-structured HTML with CSS classes applied to each menu item to handle things in a consistent way that was easy to filter by XPath.

After I finished the script, I sent a link to the new web page to an internal food discussion mailing list, and soon enough I was receiving fan mail. What I'd intended to be a tool for my own personal use proved so popular that, early this year, the chefs at Google asked if I could expand the tool to include support for historical statistics. They wanted to keep track of which cafes had the greenest menus over time. The result is a tool that tracks the healthiness of all menu items at Google cafes around the world. You can see every color menu item in a single menu and toggle colors on and off as desired, depending on how you want to browse the menus. So I can look only at red items if I'm in the mood for pepperoni pizza or roasted garlic mashed potatoes. And if I want leafy greens, I can limit the menu to show only the healthiest dishes. It has other uses, too: a cafe in Switzerland, for example, could use the stats page (filled with graphs generated using the Google Chart API) to compete with a cafe in Mountain View for the title of "healthiest cafe." In fact, all the Google cafes worldwide are now in a heated competition now for this very title.

If you suspect I've gone "green," and if my mom is reading this: I have. I'm eating healthier, I've had my cholesterol checked, and I walk at least three miles every day. For everyone else, don't worry -- after I produced the healthiest cafe statistics page, I also made another set of graphs that ranks by red items. If you see me eating red items at Google, please don't tell my mom.