Admins often overlook the focal point, let's make it choose a smart/intellegent default

Created on 29 February 2024, 11 months ago

Problem/Motivation

Here's a common scenario: A content editor uploads a new image, but they don't set the focal point. Either because they didn't understand it, or they forgot. Heads are still cut off in crops of this image.

Proposed resolution

What if we used image analysis to intelligently/automatically/smartly set a default?

Take a look at this promising JS library:
https://github.com/jwagner/smartcrop.js
https://29a.ch/sandbox/2014/smartcrop/examples/testbed.html

Here's a proposed workflow

As an site builder...

If I configure the form view-mode for an entity that has an image field
And choose the "Image (Focal Point)" widget
And configure the widget
Then I see a new setting for "Automatically choose a default focal point"
* checkbox
* default: checked
* help text: When an image is first uploaded it will be analyzed and the focal point will be set to the most important part of the image. The content editor can then make further adjustments. The analysis happens by JavaScript in the user's browser, the image is not sent to a third party.

If "Automatically choose a default focal point" is checked
Then "Default focal point value" is hidden

As a content editor...

If I upload a new image to an image field that uses the Focal Point widget, and and is configured for "Automatically choose a default focal point"
Then immediately after the file is uploaded it is analyzed with the smartcrop.js library in the user's browser
And the focal point is set to the centre of the what smartcrop.js determined
And I can then drag the crosshairs to set a different focal point
And this analysis only happens when an image file is first uploaded

Remaining tasks

Build it.

User interface changes

For site builders: A new widget setting.
For content edtiors: none.

API changes

None?

Future enhancements

* Add some of the smartcrop.js config options to the widget settings form
* Add support for the facial recognition libraries that smartcrop.js supports

Data model changes

Feature request
Status

Active

Version

2.0

Component

Other Code

Created by

🇲🇽Mexico dalin 🇨🇦, 🇲🇽, 🌍

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

  • Issue created by @dalin
  • 🇲🇽Mexico dalin 🇨🇦, 🇲🇽, 🌍
  • 🇲🇽Mexico dalin 🇨🇦, 🇲🇽, 🌍
  • 🇲🇽Mexico dalin 🇨🇦, 🇲🇽, 🌍
  • First commit to issue fork.
  • 🇦🇺Australia geoffreyr

    We needed to do this for our use case, so we patched Focal Point to allow us to hook into the focal point values before they get saved. This might allow for some variety of solutions, whether they be backend, remote, or frontend.

  • Pipeline finished with Success
    20 days ago
    Total: 219s
    #398491
  • 🇲🇽Mexico dalin 🇨🇦, 🇲🇽, 🌍

    @geoffreyr
    Interesting.

    While your approach is fundamentally different than the original thrust of this issue, I can see how a back-end hook could be useful (though probably as a different issue on d.o). Some thoughts:
    * It should probably only re-save the crop if the values have changed.
    * To create a whole system of plugins on top of Focal Point (that can interact with its hooks and add additional settings) might be overkill if Focal Point was just awesome out-of-the-box. Typically you shouldn't create the abstraction layer until you have 2–3 use cases with valuable divergence.

  • 🇦🇺Australia geoffreyr

    @dalin Thanks for the feedback! I appreciate that adding a whole plugin system does run the risk of overcomplicating things. Perhaps this sort of functionality might be more useful attached to Crop module itself -- that way, it could work with other methods of cropping, such as cloud solutions that provide smart crop bounding boxes instead of focal points. This might also help get around the issues with Image Widget Crop pre-emptively removing the Focal Point crop.

    In our hook implementation we check $crop->isNew() before updating the coordinates, so perhaps I should update the patch with either the same behaviour or explicitly check whether the crop coordinates have changed, as you suggested.

    Lot to think about here. I'll see what I can do to make this more useful.

Production build 0.71.5 2024