Responsive Image Alternatives

Have you ever had a use case when working with images or responsive media that you wanted to upload an image for Desktop and maybe an alternative image for Mobile (a portrait size for example)
Sure you want to use Responsive Image module and scale/crop the images to each breakpoint, but what if you need to crop your Mobile image differently than your Desktop (choose a different focal point).

Typically we introduce a couple more fields, like Desktop Image and Portrait Image, but then, you can't really use Drupal responsive image formatter to deliver a combination of those fields, you have to resort to using custom code and do some manual work to create an image tag.

This module's goal is to solve that problem for you! It features a new formatter "Responsive Image Alternatives" that offers just that! You can use the formatter on your main field (Desktop image) and configure alternative image fields to fill in the images from per each breakpoint, by default if a breakpoint doesn't have a field it will just fallback to your main field image.

What that offers you:
- Separate focal points for landscape and portrait images (with Focal Point module)
- Separate manual crop if you want to use manual crop (with Image Widget Crop module)
- Fallback to main image and crop by it's focal point if no alternative image provided

The configuration is extremely simple, you just need to specify alternative image fields in YAML format like this:

field_image_portrait:
  - breakpoint_name.portrait
field_image_wide_portrait:
  - breakpoint_name.wide_portrait_mobile
  - breakpoint_name.wide_portrait_tablet

Where fields are basically mapped to one or more breakpoints in your theme

More documentation and a demo coming soon...