You are writing a blog post using Windows Live Writer. You want to include a picture you took with your phone. The options you have are many but none of them is simple. You can use USB cable, WiFi synchronization, Bluetooth, DropBox, SkyDrive, or Picasa. Or, if you are like me, you can e-mail the pictures to yourself, save to disk, and then include in your blog.

All this hassle is time consuming and makes you think twice before using pictures from your phone in your blog.

Enter Picture from phone plug-in to Windows Live Writer. The plug-in allows you to “paste” pictures from your phone directly into Windows Live Writer. The process takes only a few seconds and does not require any cables, configuration, third party services, or e-mail. Some call it witchcraft, so brace yourself.

Witchcraft 101

Your experience starts with a new Windows Live Writer blog post about, say, your last vacation. You get to the point where you want to include a picture from your phone:

You go to the “Insert” menu and choose “Picture from phone” (assuming you have installed the Picture from phone plug-in):

A window shows up with a QR code to scan. Scanning instructions are also provided for those new to QR codes:

Your phone must have internet connectivity. It is recommended you enable WiFi to speed up the transfer if you can (after all, you will be sending several MB worth of JPEG content; besides speed you also don’t want this to eat into your data plan). As soon as you scan the QR code with your phone, Windows Live Writer detects that (yes, I know, it is magic):

Meanwhile on your phone your QR scanning software redirects you to your mobile browser and opens a web site that allows you to select and upload your picture:

And voila! Your picture is now embedded in your blog post:

Witchcraft explained

To get started, you will need a lizard’s tail, four rotten eggs of the greenback turtle collected on the first full moon in April, and a Windows Azure subscription. The last one is easiest to procure for free here. You also need to understand the basics of QR codes, node.js, Windows Azure Blob Storage, and Windows Azure Web Sites.

Here is how you mix it all up. First, when you open the “Picture from phone” plug-in window, a temporary, one-time relay address is registered with a node.js web site hosted in Windows Azure Web Sites. The relay allows messages to be exchanged between devices that know its unique address. The QR code the plug-in displays encodes this one-time relay address. When you scan the QR code with your phone and open the address in the mobile browser, it immediately posts a “hello” message to the relay, which allows the Windows Live Writer on your PC to switch its view and encourage you to choose a picture on the phone. Once you select the picture and upload it to the relay, it is temporarily saved in Windows Azure Blob Storage, and can be referenced there with a unique URL. The URL of the picture is then posted to the relay. When Windows Live Writer receives the message, it fetches the picture from Windows Azure Blob Storage, closes the plug-in window, and includes the picture in the blog post you are editing. The temporary relay address is deleted along with any associated content in the Windows Azure Blob Storage.

So where does the lizard’s tail come in? I just like to keep it handy in case I need it, so save it for some of the future experiments.