Here’s the difference between your undergrad studies and what you are about to embark on for your PhD. Undergrad is like being in a hurdles race. It’s 4 years, you know how many hurdles you have to jump over and how high they are, and the goal is to clear them as quickly and as well as you can, while knocking down as few as possible.

Grad school is more like a one-way plane ticket to a Transylvanian castle, and when you get inside the doors shut behind you and you’re left in total darkness holding onto nothing but a single matchbook. You light the first match and discover that you are in a room full of objects covered by white sheets. Before the light from your match goes out you have time to uncover only one object. If you’re lucky, before you run out of matches you’ll uncover a sheet that has another box of matches under it. If you’re really lucky eventually you’ll find the key to the door so you can get out of the damn place.

…to which a fellow grad student responded, can’t we just set fire to all the sheets?

Most people would probably answer “no” to questions 2 and 3 after listening to that. It actually sounds stressful, even unpleasant. This, incidentally, is the general response of most people when they encounter contemporary classical music, especially the avant-garde stuff. However, if you are a modern composer, you are not most people.

Some people might ask, in response to question 1, what’s so interesting about a piece that sounds like it’s going up/down forever? It’s a cheap trick for nerds. To these people, if you are a modern composer, you should say “Uh, no!” after stammering a little. Then walk away, knowing in your heart that your tricks actually rather expensive, which is why you’re unemployed.

Part 2: Overtone Series

Now listen to this:

It’s a piece of “music” by composer Karlheinz Stockhausen, who loved useless concepts probably more than most smart people. His secret in this piece is the overtone series, a.k.a. harmonic series (or just “overtones”), combinations of pitches that fit a certain mathematical pattern. This pattern is what give natural sounds like a voice or an instrument their distinctive timbre (i.e. the “feel” or “texture” of a sound). In this piece, a chorus sings an overtone series dreamed up by the composer himself. What’s different about this, compared with, say, two country singers belting out a tune in parallel 3rds harmony, or a church choir singing a hymn, is that the pitch (and volume) of each voice is mathematically calculated to add up to something MORE than harmony. Stockhausen is basically using the choir to create a new “instrument” whose timbre comes from the precise combination of all the voices.

In this case the artificial “instrument” is a chorus that sounds weird. You can tell this is a significant achievement by imagining how long it took to convince a group of singers to sing random words from erotic poems that don’t sound like anything.

How about that Stockhausen? Interesting? Beautiful? Music?

No? A lot of other people would agree with you. They all went out to buy the Beatle’s “Sergeant Pepper’s Lonely Hearts Club Band” instead of going to hear this piece (both came out in the same year). But a small group of composers who call themselves “spectralists” (some call them “insane”) love it. In fact, if they had money they would buy computers and learn fancy math, so they can analyze the overtones of all sorts of sounds and write oodles of this kind of music.

If you think overtones are something that only nerds care about, you’re probably right, but just know that we’re talking about nerds from around the world here. There are folk music traditions based entirely on overtones. For example, check out this video of a Mongolian badass performing notes using the “throat singing” technique. Notice how, especially in the notes near the end of the video, you can hear very high pitched “buzzing” on top of the (mostly very low) bass notes he’s singing directly. These high pitches are overtones, and the Mongolian singer has developed his ability to control his vocal chords so that he can create melodies with those overtones. Note that every singer–and in fact, anything earthly that makes a sound–will create overtones. It’s just that usually overtones are very quiet and your ears focuses on the main pitch instead. Mongolian (and the related Tuvan) throat-singing flip that around, and draw your attention to the overtones by making the main pitch very very low.

Here’s a final, and much more familiar example of overtones used in music. This is a passage of a guitar prelude that is played with “harmonics”–the overtones on a stringed instrument that players create by touching a string lightly, but not pressing it down. Notice how they’re much quieter and purer sounding than the typical notes that you would hear from guitar strings.

Next time I’ll show you examples of 12-tone music, a style of composition that is actually more pleasing to look at than it is to listen to. This is why it is respected and emulated by true artists around the world.

Part 1: The Shepard Scale

First you need to understand some abstract, completely useless concepts. Imagine playing an ascending scale or a note that slowly slides upward in pitch. When you get higher and higher, you slowly fade out–get softer and softer–but you fade in with the same scale several octaves below, which goes up a while but then also fades out. Keep repeating, and you end up with a scale, actually 2 or more overlapping scales, that seems to go up forever. This is called a Shepard scale. Home exercise: try playing a Shepard scale. Home exercise: try doing that forever.

Let’s say you are a composer and instead of contributing something of tangible value to society, you want to write a piece of music using a Shepard Scale. If you have a good grad student stipend, or if that’s impossible, if you have a good faculty salary and have paid off your student loans but haven’t died of old age, you can buy an electronic “instrument” called a tone generator, and make this composition in 5 minutes–it sounds like this. It’s kind of lame, but you get the idea.

Fortunately, if you know how to click randomly on Youtube, the best kind of concept music is at your fingertips. For example, in the following video you’ll notice the hallmarks of a contemporary composition: lots of black ink, pages that don’t look like they have any notes on them and were drawn by babies, notes that require breaking appendages to play. This is known as “cryo-music,” music that needs to be frozen and revived 300 years from now when people have evolved 20 fingers on each hand:

Now listen to this–it’s written by Gyorgy Ligeti, who has two important qualities: he writes music for an anatomically plausible number of fingers, and he’s Hungarian:

The reason Gyorgy Ligeti wrote this piece is because the goal of all art is to sound like a person trying to get out of Hell by climbing a staircase, but not succeeding. Sublime.

Stay tuned for: Part 2, where I explain what an overtone series is, and why you should listen to Karlheinz Stockhausen instead of the Beatles. (Hint: it’s not to make girls like you. Actually: it’s more the opposite.)

I just discovered the joy of marinating meat. This first attempt is inspired by the motherland, although the real Chinese would never cook chicken this way. Same goes for the Thai-style stir-fry, which is Thai only in style.

Be assured, though, that both came out tasty.

Ginger-soy baked chicken

Put a few chicken thighs in a ziplock bag or tupperware, with soy sauce, rice vinegar (black or white) finely chopped ginger and garlic. Optional ingredients include spiciness (cayenne powder or chili flakes), sesame-ness (sesame oil or toasted seeds), and sweetness (sugar, honey, or maple syrup). Leave in fridge for a day/overnight. If you start with frozen chicken, leave at room temperature for a day to combine thawing and marinating.

When you get home from work, take the chicken out of the marinade and pop into a 400°F oven on a baking pan. Baste every 10 minutes or so by putting some of the marinade on top of the chicken. The chicken is done after ~30min or if your meat thermometer / eyes tell you so.

Thai-style stir-fry

You can put any vegetables you want in here. I chose kale, carrots, water chestnuts, and fresh baby corn. Chop into cookable pieces–strips for kale, thin slices for carrots and chestnuts, break corn in half. Pre-cook vegetables by blanching* (carrots, corn) or sautéing with some water or stock (kale). Water chestnuts don’t need to be pre-cooked.

What makes this Thai is the sauce. Start this by cooking some diced onions, minced garlic+ginger, and coarsely chopped lemongrass in vegetable oil. When onions are soft, add a few dashes of sherry and let reduce briefly. Then add stock+coconut milk, spiciness (chili flakes or chopped fresh chilis), and sweetness (sugar or honey). Cook until thick, then take off heat.

Now combine vegetables and sauce in a big wok and stir-fry on high heat for a few minutes.

*Blanching means quickly boiling in lightly salted water so the vegetables don’t get soggy. Bring water to boil, toss in vegetables, turn off heat, wait a minute, and pour into colander to stop cooking.

Sauce (for chicken)

When you take the chicken out of the baking pan, skim off most of the oil with a spoon, put the pan on a burner, and pour in some stock+sherry. Scrape up the gunk on the bottom, mix it up, and reduce. Spoon some of this over the chicken.

Combined

Serve chicken and stir-fry on steamed white rice. Keep a bit of the sauce on the side and add to the rice if you get bored of the plain rice flavor.

Another of my mom’s recipes. The noodles are quick to make, but the broth takes a while to simmer.

Noodles:

Mix some flour (~2 cups) and water (~0.5 cup) in a pot or mixing bowl. This isn’t exact, so start with the flour and add water in small amounts until you get a good dry dough–this is less water than you might think, so make sure to really mix and knead the dough with your hands before adding the next batch of water.

Once you have a ball of dough barely sticking together, put it on a flat, floured surface and start kneading it, maybe about 10 minutes or until it gets too tough. Leave the dough in a ball, covered with a moist paper towel, to rest for 30 minutes.

When the dough has rested and softened, roll it out into a thin (2-5mm thick) round sheet with a rolling pin. Fold this sheet onto itself 4-5 times, and cut into noodles. Either thin (2-3mm) or wide noodles (5-10mm) are good.

To store, sprinkle the noodles generously with flour and freeze in a bag. Frozen or fresh noodles can be cooked by boiling in water for 5-10 min, stirring occasionally to prevent sticking.

Broth:

Get some stewing cuts of meat. I used pork neck bone pieces, but beef bones, chuck steak, lamb leg, or any fatty pieces of robust red meat can traditionally be used for this. Quickly boil a few pieces of meat in a pot until the water gets foamy.

Strain the meat by pouring the water and meat into a colander, rinse the foam off, and return the pieces of meat to the empty pot.

Throw in a small carrot, a stalk of celery, 1/4-1/2 of an onion, 5-10 Szechuan peppercorns, a star anise seed, a bay leaf, and cover with water. Simmer for an hour or longer. At the end add salt and/or soy sauce to taste.

Combined:

Half-fill a bowl with freshly cooked noodles. Throw some chopped cilantro and scallions on, and a dash of chili oil, sesame oil, and/or sesame seeds. Ladle broth to cover noodles and herbs, throw on a piece of meat if you want. Eat.

Unlike most cropping routines out there, Opticrop uses edge-detection to find the most “interesting” part of the image to crop, so you won’t get a useless thumbnail just because the top-left corner of your image happened to be a big patch of featureless sky. This post is a big-picture discussion of my method. If you just want the script, see the post on Opticrop’s usage and implementation.

The Thumbnail-Cropping Problem

You’ve probably dealt with the thumbnail problem if you run a blog or website that publishes images with articles. When you link to that article (say, on your front page), it’s nice to have a thumbnail of that article’s “feature” image for your readers to click on.

The simplest way to make a thumbnail is to proportionally resize the original image to fit a width or height. However, if both dimensions are constrained, you usually have to crop the image before resizing.

For example, say your home page design uses square thumbnails, but your source images come in an odd assortment of width/height combinations. You’ll need to open the source image up in Photoshop/GIMP, take your crop, and save the thumbnail for your website. If you’re doing this dozens of times a day (like our photo editor does), it would be much nicer if you could somehow use a script–you open up the URL to a script, give it the path to an image, and it serves back a cropped/resized thumbnail. Unfortunately, a good script to do this is hard to come by, which is why I wrote Opticrop.

Figure 1. The usefulness of cropping. Suppose you need a 120px-wide thumbnail from a 600×400 source image. You can resize it proportionally to fit the width (left), but the height will be 80px in the thumbnail. If thumbnail height also needs to be 120px, then the original image should first be cropped to the 1:1 aspect ratio of the thumbnail (red box), and then resized (right).

Existing Solutions

A Google search will turn up simple explanations on how to resize/or crop images in PHP–see “examples” at the bottom of this page, or these tutorials. Many CMS’s also come bundled with thumbnail-generation utilities. For instance, Movable Type 5 (the CMS used by my employer) has template tags for on-the-fly generation of resized or square-cropped thumbnails.

These solutions have their limitations. MT5 can make square thumbnails, but won’t make them in arbitrary dimensions. What if you want a 200×50 thumbnail for a “related articles” widget for your sidebar? More generally, I want a script that will take an image, a width, and a height, and give me a thumbnail back that is exactly what a photo editor would have made in Photoshop.

With this goal in mind, I tracked down a few “smart” image resizer/croppers out there to find a starting point. A script by Gijs van Tulder ingeniously delegates all its work to the command-line ImageMagick utility, so you can run a bewildering array of commands through a simple URL string–he even wrote a custom command, part, to do a simple crop-and-resize. Another script by Joe Lencioni isn’t as powerful, but it does its own work using only functionality that comes with PHP–so you don’t have to have ImageMagick installed or set up additional modules.

Van Tulder’s part command and MT5′s square-thumbnail-generator crop as large of a region from the source image as possible without changing the aspect ratio, and center the crop along the dimension that needs cropping. This “largest centered crop” is generally a safe and simple strategy. However, if the source and target images have very different aspect ratios (i.e. you need to crop out more stuff), then a smarter strategy might be needed. Also, if the image contains a single small subject on an otherwise blank background, then you don’t want to take the biggest crop you can get, but rather just enough to capture the subject. Otherwise you run the risk of scaling that spot down into obscurity.

Figure 2. Pitfalls of the “largest centered crop”. It’s easiest to take the largest centered crop before scaling to the target dimensions (such as a small square thumbnail), but the strategy yields less-than-ideal results when the aspect ratio of the original or target image are severely elongated, or when there is a small single subject on an otherwise uniform background.

Content-Aware Cropping

In other words, the script needs to understand the content of an image. There are all sorts of fancy ways to do this, but I set out to write something that will be quick, simple, and require a minimum of external code. A key first step would be running the image to crop through an edge-detection filter. Like the name suggests, an edge-detection filter transforms an image based on changes in color and lightness–”interesting” areas with lots of detail get mapped to bright pixels, and uniform, boring areas like sky get mapped to dark pixels.

Figure 3. Several potential crops around the center of edginess (red dot). Images are shown after edge detection. At the bottom you can see the “best” crop in full color and after rescaling to target dimensions.

Armed with the edge-detection filter, a script can do all sorts of things to infer where to crop an image. For example, I decided to crop the image around a spot I calculate by averaging all the pixels’ locations, weighted by the intensity of each pixel in the edge-detected image. This tell you the location of the “center-of-edginess” of the image , sort of like the center-of-gravity of a physical object. Just as the COG is a good place to put your finger if you want to balance something, the COE of an image a good point to use as the center of a crop (with important exceptions, noted below).

Once you know where to crop you still need to pick a crop size, since for any set of target dimensions you can make many crops with that aspect ratio from the source image. If you choose the crop by adding up the edginess of all the pixels in each possible crop and choosing the one with highest “total edginess” you’ll end up always choosing the largest crop, which is bad for the type of “small single subject” images mentioned above. If you choose the highest average edginess (total edginess divided by area of the crop) instead, you’ll favor small, cramped crops with a lot of detail but no visual context.

My solution is to maximize an “adjusted average edginess” metric that, instead of dividing total edginess by the area, divides it by some power of the area. The parameter can be tuned by trial and error to get the right amount of “breathing room” in a crop. If , the adjusted average edginess simplifies to average edginess, and we favor small crops as we discussed above. If , adjusted average edginess simplifies to total edginess and the biggest crop is selected. I liked the results from test crops with , but for really small thumbnails (which require significant rescaling), the tighter crop given by a higher (i.e. closer to 1) might be preferable.

Figure 4. Cropping around the center-of-edginess yields “good” crops for most images. Compare to Fig. 2 above. Increasing increases the tightness of the crop.

Limitations

Opticrop was written to be smarter than easily available alternatives, but because the strategy is relatively simple, it still makes the “wrong” crop on certain images. There are caveats to both the methods of choosing where to crop and how much to crop.

As to where to crop, choosing the center-of-edginess is best suited to single-subject images, and gives poor results on two-subject or multi-subject images. If a picture has 2 areas of interest, Opticrop will crop to the region between them, because the center-of-edginess is an average over the entire image and gives no information about local “pockets” of edginess. A solution, suggested by Dave, may be to find “local maxima of edginess”, or the modes of edginess, rather than a single average. I’m open to ideas on how to implement such an approach.

Another possibility is an “iterative search” that will start at the center-of-edginess and meander around, subject to certain constraints, until it settles on a region that is comparatively more “edgy” than where it started. This kind of algorithm tends to enlist some kind of recursion in refining the answer, which generally leads to a superior result without too much added computation. But the devil is in the details of implementation.

The decision of how large an area to crop (or how much “breathing room” to give the cropped subject, assuming there is one) could also be accomplished in a completely different way. The current version simply tries a number of different sizes and picks the best one. I’ve defined “best” as “highest “, but using a different criterion may yield other desired crop properties. A refined search method might also yield better crops.

You can download the script, and see usage and implementation details, on this post.

Unlike most cropping routines out there, Opticrop uses edge-detection to find the most “interesting” part of the image to crop, so you won’t get a useless thumbnail just because the top-left corner of your image happened to be a big patch of featureless sky. This post is an overview of usage and implementation. For a more general discussion, see my post on the methods behind the script. Also check out the live demo of Opticrop, with a slick jQuery interface.

Usage

To use the Opticrop image-cropping script, download opticrop.php and save it into its own folder on your webserver. You’ll need ImageMagick and the Imagick PHP extension installed. If all goes well, calling the script by its URL with the following arguments should give you an image in response.

• src – The path to the image to be cropped. This must be on the same machine as the script, but you can provide its path in URL form, as a relative path to the directory the script is in, or as an absolute path on the webserver’s document root (i.e. preceded by a /)
• w – The width of the thumbnail you want, in pixels.
• h – The height of the thumbnail you want, in pixels.
• gamma (optional) – A number between 0 and 1, for tuning the “tightness” of the crop. Default is 0.2. See discussion.
• format (optional) – Either img (default) or json. If set to json, script will return a JSON-encoded object containing the height, width, and x and y coordinates of the top-left corner of the optimal crop region in the full-sized image.
• cache (optional) – Either yes (default), no, or refresh. Set to no to disable caching temporarily for current request, and refresh to update the cached image for the given set of parameters.
• debug (optional) – Either 0 (default) or 1. If set to 1, returns a page with debugging info rather than an image.

For example, to run my copy of the script on a test image on my server, go to:

http://jueseph.com/scripts/opticrop/opticrop.php?src=test3.jpg&w=100&h=100&debug=1&cache=no

This will display some debug output, and the result image (a 100×100 thumbnail) at the very end. Remove the debug=1 from the URL to get just the result image.

Implementation

Explanation of script to come. Until then, you can see the source here.

Get a whole fish, cleaned of guts and scales. A 1ft rainbow trout is good. Cut slits into it every inch or so along both sides, and place into a shallow bowl. Finely chop about 2 tbsp scallions and 1 tbsp ginger, and sprinkle this under, over, and inside the fish. Drizzle soy sauce over fish (about 1 tbsp). Place entire bowl with fish in it in a wok 1/3 filled with water. Cover with a lid, and place on high heat. Steam for 15 min. Remove bowl, wipe the bottom dry, and eat.

After a bout of reminiscing about the homeland tonight, I decided to make a soup I recently learned from my mom. Here’s the recipe, along with a recipe for an accoutrement, garlic cucumber salad, and an important condiment, chili oil.

This recipe, which makes roughly 2 servings, is a variation on the classic Chinese egg drop soup. Adding tomatoes, black rice vinegar, and chili oil augments the savory, light taste with a tangy spicy kick, a flavor profile typical in Northern Chinese cooking.

The key to this recipe is the combination of traditional Chinese ingredients, so it’s to your benefit to get ahold of as many of these as you can. In a pinch, though, it’s possible to do this soup with a few Western substitutions. Some ingredients are more crucial than others, and I’ll point out the essential ones below.

Chili Oil

This is an essential ingredient in a lot of Northern Chinese dishes, and is easy enough to approximate that you should never go without it. To make a batch that will last many servings, heat a 3-4 tablespoons of vegetable oil (canola, corn, or peanut) in a pan on high heat until it starts rippling and smoking a bit*. Then, pour the oil over a tablespoon of ground cayenne pepper in a heat-proof container–a ceramic bowl suffices, but a jar with a lid will store indefinitely. Let the oil cool, and you’re good to go.

The chili powder will settle to the bottom of the container, and you can serve the oil on top as a spicy condiment in stir-fries, soups, and other Asian dishes. You can also stir up the mixture before serving for an added kick and paste-like texture.

It might take more than one try to get the oil to the right temperature. You can tell when you’ve made a perfect chili oil when you smell a meaty, toasty-but-not-burned chili aroma the instant the oil hits the cayenne powder–it’s actually pretty amazing, and not at all what you expect a spicy sauce to smell like.

The flavor of the oil depends on the type and quantity of chili used–this can be made with chili flakes, which gives a slightly different texture and a little less kick than cayenne powder due to the decreased surface area. The authentic version, which boasts the most flavor, is made with coarsely ground chilies from China (see rambling account in previous post), but in most cases store-bought chilies are good enough.

Egg Drop Soup With Tomatoes

To make the actual soup, start by boiling half a medium-sized pot of lightly salted water. Drop in 2 large tomatoes when the water reaches boiling, and turn off the heat (on an electric stove, take the pot off the heat). Leave for 5 minutes, take out the tomatoes, and peel off the skin (this should be easy after the blanching). Cut into small wedges.

Over medium-high heat, add 2 tbsp of vegetable oil and 1 tsp of sesame oil to the same pot (after dumping out all the water), and drop in the tomato wedges when oil is hot. Stir and cook until tomatoes start to wither into a soupy mess, and pour in 2-3 cups water and reduce to low heat. Throw in a handful or two of 1/2-inch cubed tofu (firm or extra firm) and cook for 15-20 minutes. Salt and pepper to taste, and drizzle in some black rice vinegar to taste.

When the tofu is tender and the soup has taken on a uniform light-red color from the tomatoes, do the egg drop. This is a fun procedure where you crack an egg, slowly let the contents ooze out of the shell into the pot of hot soup with one hand, while stirring the soup with the other hand. The result should be wispy tendrils of egg in your soup and an added savory boost to the flavor. Practice a little to see what consistency of egg you can achieve–traditionally, you should drop the egg in very gradually while stirring quickly in a circular motion, but even if you just drop an entire egg in with minimal stirring, you’ll end up with a poached egg, which is delicious in its own right.

At the end, take the soup off the heat and drop in a handful of chopped scallions. Mix them in, and ladle into bowls. Drizzle on some chili oil before eating (but go easy–if you made it right, the stuff is strong!)

Note on ingredients: The variations on this recipe, as with any traditional dish, are practically endless. You can throw in some dried shrimp bits, obtainable from an Asian grocer, for added zest. Add a pinch of MSG for even more zest (Asian circulatory systems seem to handle this better than Western ones–keep this in mind if you’re entertaining). Substitute a can of tomatoes for a more robust soup, but stick with fresh tomatoes for a lighter, more summery taste. Sesame oil is an important flavoring, but you can omit it if you don’t have any. The only ingredients I don’t recommend messing with are the black rice vinegar and chili oil, but since the vinegar might be hard to come by, you can substitute with balsamic vinegar. Be prepared for a much wimpier soup, though.

Cucumber Garlic Salad

Another classic Shaanxi dish is a simple salad made of cucumber and garlic. The key here, as in all Northern Chinese food, is in the vinegar (black rice, see discussion in previous post), chili oil, and garlic. The salad is also surprisingly sensitive to how you chop the cucumber–ideally you want very thin strips, almost a julienne, to soak up the flavors in the dressing.

Start by pseudo-julienning some cucumber (as seen in the picture). Put into a bowl, and top with finely chopped garlic (2 medium cloves for each cucumber), salt, sesame seeds, black rice vinegar (or balsamic–again, only if you have to), and chili oil. Toss well, and let sit in fridge for 10-15 minutes to chill and incorporate flavors.

Serve straight, or mix in some cold, cooked Soba noodles or mung bean sprouts.