Jeff Mesnil
Weblog · Dev · Photos · Books

Cemetary Tree

March 26, 2013

We spent the week-end near Roanne and visited Saint-Haon-le-Châtel, one of the smallest medieval town of France.

This town is located on the top of a hill. The church is at the very top of the town and offers a nice panorama view of the plain of Roanne. The cemetary near the church was deserted, most graves were moved to a more recent cemetary and only remain a few tombstones and ruins around a tree.

Cemetary Tree
 Cemetary Tree © Jeff Mesnil

Moody place...

Spring is Coming

March 18, 2013

Last Saturday, near home, the city of Gières organized a spectacle to celebrate the end of winter and the beginning of spring.

A local artist created a huge leprechaun representing the winter.

Printemps de Gières
Leprechaun — Printemps de Gières © Jeff Mesnil

A local troop of jugglers, "les Lutins Farceurs", gave a representation after sunset. Their make-up was very well made, they looked half-elves half-daemons.

Printemps de Gières
Les Lutins Farceurs — Printemps de Gières © Jeff Mesnil

Kids were both frightened and in amazement looking at them, especially when they were jumping using stilts and going incredibly high with them.

Printemps de Gières
Les Lutins Farceurs — Printemps de Gières © Jeff Mesnil

Printemps de Gières
Les Lutins Farceurs — Printemps de Gières © Jeff Mesnil

Printemps de Gières
Les Lutins Farceurs — Printemps de Gières © Jeff Mesnil

Once the Lutins Farceurs ended their representation, the Leprechaun was burnt to celebrate the end of winter.

Printemps de Gières
Burnt Leprechaun — Printemps de Gières © Jeff Mesnil

The spectacle was great but it was untimely to celebrate the end of winter: it was snowing again this morning.

Spring will have to wait a bit more to come... :)

Emincé de Brocoli, Vinaigrette au Curry

March 2, 2013

Emincé de Brocoli, Vinaigrette de Curry
Emincé de Brocoli, Vinaigrette de Curry © Jeff Mesnil

Food photography is fun.

I feel a bit limited using a Nikon 35mm ƒ/1.8 DX for it but my other lenses are not bright enough or focus close enough to obtain a shallow depth of field. If I were not thinking about changing my photo gear to something else than Nikon DX system, I would definitively buy the 85mm macro lens.

I also need to work on lighting the food. The light is not soft enough when it hits the broccoli at the foreground. It's time to invest in a good flash...

Changing Photo Gear

February 19, 2013

My girlfriend and I went to Paris for the week-end and I carried my photo gear for 2 days for a grand total of 20 pictures.

Effeil Tower
Effeil Tower © Jeff Mesnil

I took my Nikon D7000 with the 16-85mm DX (and the 35mm ƒ/1.8 DX for low light). The camera bag weighed 2.7kg all included. We walked a lot during the 2 days and I felt the camera and the bag getting heavier with each kilometer.

I am looking for a camera that would match (or exceed) the IQ of my DSLR while being more compact and weighing less.

I really like the Fuji X series and particularly the X-E1 but I am not sold on it yet. My main issues are the autofocus issues, the lack of lens (60mm is the maximum it can reach) and the lack of support from Adobe Lightroom for its RAW files.

The autofocus issues looks to be improved with each firmware updates (and the X100s show promises for the 2nd generation). I like the lens roadmap (especially the 23mm ƒ/2) if they can pull it off.

The main issue is the lack of support from Adobe. I don't want to buy into a system based on the X-Trans sensor to be able to generate only JPEG files out of the camera... I enjoy the latitude provided by post-processing RAW files too much to give it up.
This also means that I will not get a X100s even with all the improvements from the X100 (phase detection, focus peaking, etc.). It is an ideal combo with a 23mm lens in a small package but again it is based on the X-Trans sensor.

Yesterday, I read Duncan's review of the Sony DSC RX1. This camera looks fun to use and provides gorgeous pictures (you have to read it on a Hi-DPI display to really enjoy the images quality) but it is way too expensive for me. I would not say that it is overpriced. For the same budget, I would take a RX1 over a Nikon D600 + Zeiss 35mm ƒ/2 lens any day but both are above my budget at the moment.

Eiffel Tower
Eiffel Tower © Jeff Mesnil

I am considering waiting for the 2nd generation of Fuji X cameras, provided their RAW files are supported by Adobe. In the meantime, I could carry out a Sony DSC RX100. It looks to be a competent compact camera with a fast lens at the wide end. That would be a temporary solution but I don't take my DSLR as much as I could because it is too heavy. Having a compact camera with good IQ would make it fun again to shoot every time I am out.

How to Host a Static Website on Amazon AWS

February 11, 2013

A few months ago, I updated my web site to use static content generated by Awestruct instead of a hosted WordPress instance. It is much simpler to maintain and tweak (something I am constantly doing), less expensive to host since it does not need any runtime or database and static content is fast, cacheable, etc.

At the same time, I moved the hosting from OVH to Amazon S3 which provides static web site hosting at a very competitive price.

More recently, I acquired a Retina MacBook Pro and updated my web site to display Retina-ready responsive images. This requires to server several JPEG files of the same image at various sizes. Retina images may be quite big and using a content delivery service improves the latency to serve these images. I decided to use Amazon CloudFront for content delivery of all my media assets.

This post is a quick reference of the different services and settings I have used to achieve this goal.

Web Site Generation

The source code of my web site is hosted at Github and uses Awestruct to generate its content. I write the posts (including this one) using Markdown syntax and Awestruct generates the whole web site for me (including an Atom feed, archive page, sitemap, etc.)


The content is hosted in a S3 bucket named and is deployed to S3 using Awestruct directly:

$ cat _config/site.yml
      type: s3
      bucket: s3://
$ awestruct -P production --deploy
Syncing XXX/ to bucket s3://

I contributed the S3 deployment to Awestruct recently and there is no release with that feature yet. Alternatively, you can use s3cmd.

Static Website Hosting

I use Amazon S3 to host the static content in a bucket (without the www) and enable the Static Website Hosting in its properties.

I prefer to use the domain name to serve my content but I also want to work and redirect to the naked domain name.

To achieve this, I need a second S3 bucket named However, instead of enabling website hosting, its Static Website Hosting property is set to Redirect all requests to another host name (using the value

This 2nd bucket will remain empty (nothing is deployed to it) but is required to redirect content from

Domain Names

Amazon Route 53 is a domain name service that I use to provide the domain names of my web site.

I created a hosted name for with the following record sets:

  • is a A type record that is an ALIAS to the S3 bucket (the dropdown list will propose all the S3 buckets you own)
  • is CNAME type record corresponding to the S3 bucket public domain name (i.e. in my case it is

Using Amazon S3 and Route 53, it is very simple and cost-effective to host a static web site1. Using Awestruct makes it simple and fun to write content for it :)

Amazon provides good documentation for its Web services including a full tutorial to set up a static website using a custom domain.

Content Delivery Service

For ech retina-ready responsive image I want to display, I need to export eight JPEG files from Lightroom.

My media assets (including these images) are deployed in a S3 bucket named using s3cmd and I enabled the Static Website Hosting for it.

To use Amazon CloudFront as my content delivery service for the media assets, I created a Download distribution from the S3 bucket

Content delivered by CloudFront is served from a domain name. Since I want to keep all my content under my own domain name, I use Route 53 again to serve the CloudFront content from

In Route 53's hosted zone for, I added a new record set for which is a CNAME type set to the CloudFront domain name (i.e. Then in Cloudfront distribution, I added as an Alternate Domain Name.

To sum up:

  • is served by the S3 bucket
  • is redirected to the naked URL
  • is using CloudFront to deliver the media assets and is backed by the S3 bucket

All my content is served by URLs under my domain name With this configuration, I will not be depending on any third-party URLs for my own content If I decide one day to move to another hosted service or platform2.

  1. I leave as an exercise to the reader how to setup Awestruct, S3 and Route 53 to provide a staging web site at to check before going live on the "production" URL at :) 
  2. And I certainly will: since I started my weblog in 2004, I moved from Movable Type to Blogger to Wordpress to Jekyll and finally to Awestruct for the software and from jroller to OVH to S3 for the hosting. 

⇨ The Apple iWatch

February 10, 2013

Bruce Tognazzini:

The watch can and should, for most of us, eliminate passcodes altogether on iPhones, and Macs and, if Apple’s smart, PCs: As long as my watch is in range, let me in! That, to me, would be the single-most compelling feature a smartwatch could offer: If the watch did nothing but release me from having to enter my passcode/password 10 to 20 times a day, I would buy it.

Using 1Password means that I only need to remember my master password but I still need to type it too many times a day (and it is long to type it with a virtual keyboard).

Such a watch would be a good idea. I have stopped wearing a watch a few years ago since I always have near me a mobile phone that provides the same functionalities. I would not buy a watch just for this feature but I would definitely buy a small gadget that I could attach to my keyring (like the RSA security token I used to have to connect to my company VPN).

La Vie En Rose

February 9, 2013

Yesterday evening, my girlfriend and I went to a cooking session at Cook & Go. We cooked there a dinner about the pink theme and brought it home to bake it and eat it.

The entrée was some samossas de saumon à l'huile de sésame, vinaigrette à la framboise and was really good, the samossas being stuffed with salmon and broccoli.

Samossas de Saumon à l'Huile de Sésame, Vinaigrette à la Framboise
Samossas de Saumon à l'Huile de Sésame, Vinaigrette à la Framboise © Jeff Mesnil

The plat du jour was a ballotine de poisson rose et blanc, papillote de légume et yaourt à la betterave (a cod accompanied by lots of vegetables - turnip, beet, carrot - fennel and a yoghurt with beet). Delicious...

Ballotine de Poisson Rose et Blanc, Papillote de Légume et Yaourt à la Betterave
Ballotine de Poisson Rose et Blanc, Papillote de Légume et Yaourt à la Betterave © Jeff Mesnil

The dessert should have been good, a verrine litchi rose, crumble de cacao but unfortunately, it was a failure, the tiramisu cream was too liquid and the crumble of cocoa sinked into it...

Verrine Litchi Rose, Crumble de Cacao
Verrine Litchi Rose, Crumble de Cacao © Jeff Mesnil

It was fun cooking with other people and bringing back home our meals to bake them and eat them.

Vive la vie en rose.

⇨ Flickr Is Back

February 9, 2013

I like Flickr and used it extensively a few years ago, paying for its unlimited storage and full resolution uploads. However, it stagnated and I left it (like many).

But something funny happened. Our photography needs are growing ever more complex — what do we do with all these high-resolution photos we’ve snapped?

These days, I store my images in a Amazon S3 bucket. To display retina-ready responsive images on my website, I need 8 JPEG files of the same image at various resolutions. This is something that Flickr had from day one: for every uploaded photo, it provides many files at different resolution (and cropping).

This is a great service that Flick could provide: you upload one photo and Flickr provides all the wizardry (JPEG files, JavaScript + CSS, CDN to reduce the latency) to embed a retina-ready responsive image that adapts from the tiniest of the mobile phone to the largest display monitor.

I am sure many enthusiast photographers would pay for such a service (and full resolution upload, unlimited storage, analytics, etc. that they already provide).

It's great that Yahoo! is investing on Flickr and I will be happy to see it rise again at the top of the photo websites.

TextMate Snippets for Footnotes and Responsive Images

February 9, 2013

I use TextMate to write posts on my website and I have some handy snippets to write footnotes and retina-ready responsive images


To include a footnote link1, I have created a snippet triggered by fn:

<a id="fnr${1:1}-`date +"%Y-%m-%d"`" href="#fn${1}-`date +"%Y-%m-%d"`"><sup>${1}</sup></a>

The current date is automatically inserted and the footnote number starts at 1 and can be edited if there are multiple footnotes in the same post.

Then, to write the footnote (at the end of the post below a horizontal rule), I use a second snippet tiggered by fnr (for footnote return):

1. <a id="fn${1:1}-`date +"%Y-%m-%d"`"></a> $0 <a href="#fnr${1:1}-`date +"%Y-%m-%d"`">&#8617;</a>

This automatically creates an ordered list item (the footnote starts with 1. using the Markdown syntax) with a backlink to the location of the footnote reference. The footnote number can also be edited and starts at 1. The cursor is then placed to write the footnote text.

Retina-ready Responsive Images

To display a retina-ready responsive images, I use 8 JPEG files of the same images at different resolutions and picturefill to display the appropriate one.

To simplify the typing, I have a snippet triggered by rrf (for retina responsive figure):

<figure><div class="img" data-picture data-alt="${2:title}">
<div data-src="#{ site.img_base_url }images/${1:filename}-320w.jpg"></div>
<div data-src="#{ site.img_base_url }images/${1:filename}-480w.jpg" data-media="(min-width: 320px)"></div>
<div data-src="#{ site.img_base_url }images/${1:filename}-768w.jpg" data-media="(min-width: 480px)"></div>
<div data-src="#{ site.img_base_url }images/${1:filename}-900w.jpg" data-media="(min-width: 768px)"></div>
<div data-src="#{ site.img_base_url }images/${1:filename}-640w.jpg" data-media="(-webkit-min-device-pixel-ratio: 1.5),(-moz-min-device-pixel-ratio: 1.5),(-o-min-device-pixel-ratio: 3/2)"></div>
<div data-src="#{ site.img_base_url }images/${1:filename}-960w.jpg" data-media="(min-width: 320px) and (-webkit-min-device-pixel-ratio: 1.5),(min-width: 320px) and (-moz-min-device-pixel-ratio: 1.5),(min-width: 320px) and (-o-min-device-pixel-ratio: 3/2)"></div>
<div data-src="#{ site.img_base_url }images/${1:filename}-1536w.jpg" data-media="(min-width: 480px) and (-webkit-min-device-pixel-ratio: 1.5),(min-width: 480px) and (-moz-min-device-pixel-ratio: 1.5),(min-width: 480px) and (-o-min-device-pixel-ratio: 3/2)"></div>
<div data-src="#{ site.img_base_url }images/${1:filename}.jpg" data-media="(min-width: 768px) and (-webkit-min-device-pixel-ratio: 1.5),(min-width: 768px) and (-moz-min-device-pixel-ratio: 1.5),(min-width: 768px) and (-o-min-device-pixel-ratio: 3/2)"></div>
<!-- Fallback content for non-JS browsers. Same img src as the initial, unqualified source element. -->
<img src="#{ site.img_base_url }images/${1:filename}-900w.jpg" alt="${2:title}">
<figcaption>${2:title} &copy; #{ }</figcaption>

The cursor is first placed to edit the filename variable which updates the 8 file names (I use consistent suffixes for each resolution) and then for the image title variable (the #{ site.img_base_url } and #{ } variables are used by Awestruct when it renders the HTML).

These simple snippets makes it handy to include footnotes or images without writing tedious HTML elements.

  1. Such as this one... 

Corfu Island, Greece

February 1, 2013

Now that I have upgraded my laptop from a 5 year-old MacBook that could not run Lightroom to a 15" Retina MacBook Pro, I am plodding through my library to find the images that require some post-processing.

Pontikonisi and Vlacheraina monastery seen from the hilltops of Kanoni, Corfu
Pontikonisi and Vlacheraina monastery seen from the hilltops of Kanoni, Corfu © Jeff Mesnil

This summer, we went to Corfu island for the holidays. The landscape was beautiful but there was so much sun during the day that all photos I took have a very hard light.

Agios Georgios Bay, Corfu
Agios Georgios Bay, Corfu © Jeff Mesnil

I played a bit with Lightroom 4 but there is not much post-processing that can improve such a hard day light. The photos are not great but it does not matter: they are good enough to make us remember the great time we had there!

⇨ Paperman — Full Animated Short Film

February 1, 2013

Lovely animated short film from Walt Disney Animations:

Paperman‘s seemingly seamless way of blending the personality of hand-drawn animation with CGI in the physical space of the story is the result of new in-house software called Meander, a vector-based drawing program that allows for manipulation of the line after the fact — something that Kahrs described as “just like painting on the surface of the CG.”

(via kottke)

Serving Retina-Ready Images

January 27, 2013

I have recently bought a refurbished 15" Retina MacBook Pro. The display is stunning and it is a pleasure to edit and view photos on it.

I took the opportunity to redesign my Web site to display images at the most favorable resolution using picturefill and make it more responsive so that it displays at an appropriate size on phones and tablets.

Wedding Photos at Le Louvre, Paris
Wedding Photos at Le Louvre, Paris © Jeff Mesnil

I did not update older photos but starting from now, I'll provide responsive images. Using multiple export settings in Lightroom and a TextMate snippet to generate the corresponding HTML code does not weighten my workflow too much.

The Hobbit: An Unexpected Disappointement

December 19, 2012

I watched "The Hobbit: An Unexpected Journey" yesterday in 3D HFR and was disappointed by the experience. The 3D HFR is technically impressive but it prevented to immerse in the story.

Vincent Laforet provides a good explanation on why 3D HFR was disengaging me from the movie. I could not better explain my disappointment. Like him, I could watch it again in 2D to have a better visual experience but I did not enjoy the story enough. This is not the Lord Of the Ring's "Phantom Menace" (no Jar Jar Binks in sight) but the script could have been tighter and the characters more developped.

I did not think there was enough material in The Hobbit book for three movies. Watching the first one confirmed my opinion.

⇨ Go is PHP for the Backend

November 18, 2012

Brian McCallister writes about his introduction to Go:

I know of folks having great success with Go, and it offers a lot that I want (native code, UNIX friendly, higher level then C, lower level then Python or Ruby, garbage collected, strongly typed, good performance, good concurrency support, etc), so I tried to stop programming my way, and start programming Go’s way.

I have read both good and bad things about Go. I need to use it to make my own opinion about it.

I am pondering which new programming language to learn in 2013 and it will either be Go or Ceylon.

⇨ Learnable Programming

October 23, 2012

Thought-provoking reading about learning to program. The essay is gorgeous with fantastic visuals to understand its arguments:

Being a server-side programmer during the day, I think the essay makes the wrong assumption that programs inherently have a visual representation that helps learn the language.
What is the visual representation of an algorithm code other than a single number for each step? Not all algorithms have a visual interpretation like the Fibonnacci sequence... Maybe I am not thinking outside of the box and such a representation do exist but I have not found it yet.

This essay makes a compelling argument that through the use of a graphic library (where the visual representation is the output of the program), we can learn the underlying programming language features (for loop, variable assignments) and abstractions (decomposition, abstraction).

(via daring fireball)

⇨ An Intimate Portrait Of Innovation, Risk, And Failure Through Hipstamatic's Lens

October 19, 2012

Fascinatic story about the demise of Hipstamatic.

There are many reasons why Instagram succeeded1 and Hipstamatic did not. The article insists on the social aspect but that's not the only one.

"The biggest problem with Hipstamatic is that [Lucas] didn’t focus on Hipstamatic. What did Instagram do when lightning struck? They did nothing but focus on Instagram. What happened when Hipstamatic got successful? They made [separate products such as] Swankolab, Incredibooth, D Series, Family Album, Snap Magazine, and splintered off in so many different directions."
Stuart Norrie, former Hipstamatic designer

Focus. Focus. Focus.

(via James Duncan Davidson)

  1. At least in term of user base and engagement. Financially, how would have Instagram make any money other than being acquired by some bigger company?