Juxtapose JS tutorial

Juxtapose JS is a relatively new Knightlab tool designed by Alex Duner that allows users to juxtapose two photos in a single responsive display, highlighting both differences and similarities. It’s ideal for those before-and-after photos, such as development or aerial shots of tornado damage.

Simply go to the web app, plug in both of your full photo URLs (you will need them hosted somewhere) and photo data. Then grab the embed code and style code and paste both into an HTML story content item. You can easily stack embed codes with a little margin between them, but you just need the style code once. The web app also allows you to turn off labels, credits and animation, although those features are fairly desirable.

There’s a few limitations, mostly in display. There’s no way to resize or nudge photos to make them line up better. So your original crops are critical. Be picky.

Here’s a few early tests of the tool:

Example 1: John Malkovich vs. historic photos
Example 2: Wrigley Field signs

Posted on: No Comments

Leave a Reply