Updates to image optimization settings #19581

SiobhyB · 2023-11-09T11:48:28Z

Note
Although this PR is large, the vast majority of file changes are the result of a change to a string name, as can be viewed in 452ed67

Description

This PR changes the default setting for Optimize Images (found via Me → App Settings) from off → on. We will also inform users of this new default via a popup that will display when uploading media.

The default Maximum Image Size has also been updated from 3000px to 2000px and the Image Quality's Medium value has been changed from 85% to 80%.

You can find the iOS equivalent at wordpress-mobile/WordPress-iOS#21981.

Included PRs

The following three PRs were merged into this one, with all of them having been separately reviewed and approved:

To test

Verify default setting displays as expected ⤵️

Default setting should be changed if it has never been set before

Perform a fresh installation of the app.
Navigate to Me → App Settings.
Observe that Optimize Images setting is enabled by default.
Observe that Maximum Image Size and Image Quality settings have the default values as shared in the PR's description.

Default setting should not be changed if it has been set previously

Set original as maximum image size

Install an older version.
Navigate to Me → App Settings.
Move the Maximum Image Size setting to a different value than the default.
Move the Maximum Image Size setting back to the original value.
Install the installable build from this PR.
Navigate to Me → App Settings.
Observe that the Optimize Images setting is enabled and that Maximum Image Size setting remains in the previously set original value.

Set maximum image size

Install an older version.
Navigate to Me → App Settings.
Move the Maximum Image Size setting to a different value than the original.
Install the installable build from this PR.
Navigate to Me → App Settings.
Observe that the Optimize Images setting is enabled and that Maximum Image Size setting remains in the previously set value.

Resize settings should function as expected ⤵️

Add an image to the device with dimensions above 2000px.
Remove and install the app.
Navigate to the Posts/Pages screen.
Open/create a post/page.
Add an Image block.
Tap on the Choose from device option.
Select the image previously added with large dimensions.
When the Optimize Images pop-up is displayed, select the option to keep image optimization.
Wait for the image upload to finish.
Go to the browser and navigate to the Media screen of the site.
Select the uploaded image and click on the Edit button.
Observe that dimensions displayed under the DIMENSIONS section are lower than the original ones. The dimensions shouldn’t exceed the value set in Max Image Upload Size setting.
Observe that the file size under the FILE SIZE section is smaller than the original file size.

Compression settings should function as expected ⤵️

Add an image to the device with a large file size.
Remove and install the app.
Navigate to the Posts/Pages screen.
Open/create a post/page.
Add an Image block.
Tap on the Choose from device option.
Select the image previously added with a large file size.
When the Optimize Images pop-up is displayed, select the option to keep image optimization.
Wait for the image upload to finish.
Go to the browser and navigate to the Media screen of the site.
Select the uploaded image and click on the Edit button.
Observe that the file size under the FILE SIZE section is smaller than the original file size.

Pop-up should be displayed in specific sources ⤵️

Media Screen

Remove and install the app.
Navigate to My Site → Media.
Tap on ➕ button and select Choose from My Device option.
Select one or multiple items.
Tap on the Add button.
Observe that the Optimize Images pop-up is displayed.

Gutenberg Editor

Preparation:

Remove and install the app.
Navigate to My Site → Posts (or Pages).
Create a post.

Media Blocks - From Device

Add any of the following blocks:
- Image block
- Gallery block
- Cover block
- Media & Text block
- Story block.
Tap on the Choose from device option.
Select one item (or multiple items when using Gallery block).
Observe that the Optimize Images pop-up is displayed.

Media Blocks - Take Photo

Note
The pop up doesn't currently display when taking a photo from the Story block. This will be worked on in a future PR.

Add any of the following blocks:
- Image block
- Gallery block
- Cover block
- Media & Text block
Tap on the Take a Photo option.
Take a photo and use it.
Observe that the Optimize Images pop-up is displayed.

Featured Image - From Device

Tap on the ... button located on the top bar.
Tap on the Post Settings options.
Navigate to the Featured Image section and tap on Set Featured Image.
Tap on the Choose from Device option.
Select one time.
Observe that the Optimize Images pop-up is displayed.

Featured Image - Take Photo

Tap on the ... button located on the top bar.
Tap on the Post Settings options.
Navigate to the Featured Image section and tap on Set Featured Image.
Tap on the Take a Photo option.
Select one time.
Observe that the Optimize Images pop-up is displayed.

Check events ⤵️

Verify that the new APP_SETTINGS_OPTIMIZE_IMAGES_POPUP_TAPPED event is sent when tapping either of the options in the new popup. on will be sent if you leave optimization on and off if it's turned off via the popup.

Regression Notes

Potential unintended areas of impact

As we're changing default settings, there's a risk of unintentionally changing settings users have chosen. We're also changing code around the App Settings screen and media upload flows, so there could be unintended impact there.

What I did to test those areas of impact (or what existing automated tests I relied on)

Manually tested each flow we identified and relied on existing tests around media uploads.

What automated tests I added (or what prevented me from doing so)

I plan to further analyse existing tests and potentially add new ones in a future PR.

PR submission checklist:

I have completed the Regression Notes.
I have considered adding accessibility improvements for my changes.
I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

The strings have been updated to reflect the popup's change in functionality. It will now be informing users about the fact optimization is enabled by default, rather than the fact it used to be off by default.

The advertiseImageOptimization() function will now be called when a user uploads a photo from their device.

…etting

Following the last merge from `trunk`, the `STOCK_MEDIA_PICKER_SINGLE_SELECT` case was accidentally duplicated. This PR reverts that mistake.

This was accidentally removed when updating from `trunk` in a previous commit.

This commit fixes the bug pinpointed here, in which media wasn't uploading if the popup wasn't displayed: https://github.com/wordpress-mobile/WordPress-Android/pull/19556/files#r1386846666

As noted here, the default yields the same result, whether it's 0 or 1. So, a change is not necessary: https://github.com/wordpress-mobile/WordPress-Android/pull/19556/files#r1386712864

Following the review here, the logic surrounding the popup's button has been refactored to make it more clear and readable: #19556 (comment)

The wording has been changed following feedback from the editorial team here: wordpress-mobile/WordPress-iOS#21981 (comment)

…t-image-optimization-setting Enable image optimization setting by default

wpmobilebot · 2023-11-09T12:06:20Z

📲 You can test the changes from this Pull Request in Jetpack by scanning the QR code below to install the corresponding build.

	App Name	Jetpack
	Flavor	Jalapeno
	Build Type	Debug
	Version	pr19581-51ca8af
	Commit	`51ca8af`
	Direct Download	`jetpack-prototype-build-pr19581-51ca8af.apk`

Note: Google Login is not supported on these builds.

wpmobilebot · 2023-11-09T12:06:28Z

📲 You can test the changes from this Pull Request in WordPress by scanning the QR code below to install the corresponding build.

	App Name	WordPress
	Flavor	Jalapeno
	Build Type	Debug
	Version	pr19581-51ca8af
	Commit	`51ca8af`
	Direct Download	`wordpress-prototype-build-pr19581-51ca8af.apk`

Note: Google Login is not supported on these builds.

To match the default values for image quality for iOS (see: wordpress-mobile/WordPress-iOS#21981), this commit changes the defaults for quality to the following: - Low = 70% - Medium = 80%

Following the last commit, the numbers in the string names no longer reflect reality. As such, they're updated in this commit to reflect the level of quality they represent.

…fault-resolution Update default max size to 2000 for optimized images

…update-optimization-values

Addresses bug reported here: https://github.com/wordpress-mobile/WordPress-Android/pull/19644/files#r1402179477 As we've made changes to the values in the quality array, there may be times when users have previously chosen values that no longer exist. Those cases were not being properly handled in the code. With this commit, we now check if a quality value exists in the array. If it doesn't, we return the default quality value.

In cases when a quality value is invalid, we should explicitly detect that and then return the default quality value. Otherwise, the invalid value will continue to be returned. Response to the following feedback: #19644 (comment)

…zation-values Update values associated with "Low" and "Medium" image quality settings

"app_settings_optimize_images_popup_changed" has been renamed to "app_settings_optimize_images_popup_tapped" to clarify the action the user's taken. Tapping the popup may not necessarily change the optimization value. This also brings the event in alignment with the naming used on iOS. The list position of the tracks event has also been changed, so that it's grouped closer to other settings related to image optimization.

peril-wordpress-mobile · 2023-11-23T14:00:39Z

	Warnings
⚠️	This PR is assigned to a milestone which is closing in less than 4 days Please, make sure to get it merged by then or assign it to a later expiring milestone
⚠️	PR has more than 300 lines of code changing. Consider splitting into smaller PRs if possible.

Generated by 🚫 dangerJS

fluiddot

LGTM 🎊 ! Awesome work @SiobhyB 🏅 !

I've tested the different scenarios described in the PR's description and confirmed the changes behave as expected ✅ . I added some comments, this one in specific would be great to address it before merging the PR.

fluiddot · 2023-11-23T12:45:59Z

WordPress/src/main/res/values-ar/strings.xml

+    <string name="media_encoder_quality_maximum">الحد الأقصى</string>
+    <string name="media_encoder_quality_very_high">مرتفع للغاية</string>
+    <string name="media_encoder_quality_high">مرتفع</string>
+    <string name="media_encoder_quality_medium">متوسط</string>
+    <string name="media_encoder_quality_low">منخفض</string>


I wonder if we had to update all localizations. Based on the file history (example), seems these localization files are updated automatically as part of the release process.

Ah, good to know for the future!

WordPress/src/main/res/values/strings.xml

WordPress/src/main/java/org/wordpress/android/util/WPMediaUtils.java

fluiddot · 2023-11-23T15:54:02Z

@SiobhyB As a side note and regarding the test section Default setting should not be changed if it has been set previously:

Since we've changed the quality values, if the Low value was previously set, the quality displayed after upgrading the app will be Medium. Not sure if users might be confused with this change, I presume that not many users use the lowest quality, hence probably it would be a minor percentage.

Co-authored-by: Carlos Garcia <fluiddot@gmail.com>

Refactors two if statements into a single statement, as it was possible to group the two conditions. Addresses the following feedback: #19581 (comment)

SiobhyB · 2023-11-23T17:28:57Z

Thanks @fluiddot! 🙌

Since we've changed the quality values, if the Low value was previously set, the quality displayed after upgrading the app will be Medium. Not sure if users might be confused with this change, I presume that not many users use the lowest quality, hence probably it would be a minor percentage.

I agree it may confuse a small percentage of people but, as they'll keep the 80% compression rate, hopefully most won't notice. 🤞 I'll go ahead to merge this PR once the tests pass.

wpmobilebot · 2023-11-23T17:32:26Z

	2 Warnings
⚠️	This PR is larger than 300 lines of changes. Please consider splitting it into smaller PRs for easier and faster reviews.
⚠️	This PR is assigned to the milestone 23.8. This milestone is due in less than 4 days. Please make sure to get it merged by then or assign it to a milestone with a later deadline.

Generated by 🚫 Danger

Siobhan added 15 commits November 7, 2023 23:25

Update strings associated with optimization popup

648b1ac

The strings have been updated to reflect the popup's change in functionality. It will now be informing users about the fact optimization is enabled by default, rather than the fact it used to be off by default.

Update RELEASE-NOTES

8f63328

Set "optimize image" setting to "on" by default

4aec270

Update popup functionality to reflect new default

9d087f7

Show new promo in editor when adding local images

6f2190b

The advertiseImageOptimization() function will now be called when a user uploads a photo from their device.

Introduce tracks event to monitor clicks

d7718a6

Display new popup after upload via media screen

4a3985d

Merge branch 'trunk' into feature/change-default-image-optimization-s…

4a41feb

…etting

Remove duplicate case in switch statement

af4406c

Following the last merge from `trunk`, the `STOCK_MEDIA_PICKER_SINGLE_SELECT` case was accidentally duplicated. This PR reverts that mistake.

Add missing null check

0134cc1

This was accidentally removed when updating from `trunk` in a previous commit.

Ensure media is uploaded if popup's not displayed

29404be

This commit fixes the bug pinpointed here, in which media wasn't uploading if the popup wasn't displayed: https://github.com/wordpress-mobile/WordPress-Android/pull/19556/files#r1386846666

Revert unnecessary change to quality default

39fbd53

As noted here, the default yields the same result, whether it's 0 or 1. So, a change is not necessary: https://github.com/wordpress-mobile/WordPress-Android/pull/19556/files#r1386712864

Refactor popup logic for clarity

ff4fda6

Following the review here, the logic surrounding the popup's button has been refactored to make it more clear and readable: #19556 (comment)

Update wording in popup

379da90

The wording has been changed following feedback from the editorial team here: wordpress-mobile/WordPress-iOS#21981 (comment)

Merge pull request #19556 from wordpress-mobile/feature/change-defaul…

4f2b3fa

…t-image-optimization-setting Enable image optimization setting by default

SiobhyB added Media App Settings labels Nov 9, 2023

SiobhyB added this to the 23.8 milestone Nov 9, 2023

SiobhyB added the Gutenberg Editing and display of Gutenberg blocks. label Nov 9, 2023

Siobhan added 6 commits November 10, 2023 13:37

Merge branch 'trunk' into feature/updates-to-optimization-settings

35f5adb

Merge branch 'trunk' into feature/updates-to-optimization-settings

ee30691

Fix positioning of RELEASE-NOTES entry

eb71010

Update values for low and medium image quality

ab5d42c

To match the default values for image quality for iOS (see: wordpress-mobile/WordPress-iOS#21981), this commit changes the defaults for quality to the following: - Low = 70% - Medium = 80%

Update string names for accuracy

452ed67

Following the last commit, the numbers in the string names no longer reflect reality. As such, they're updated in this commit to reflect the level of quality they represent.

Update default max size to 2000 for optimized images

87d7db3

SiobhyB mentioned this pull request Nov 22, 2023

Update values associated with "Low" and "Medium" image quality settings #19644

Merged

3 tasks

Reduce comment length for to pass linter rule

2a81cad

SiobhyB mentioned this pull request Nov 22, 2023

Update default max size to 2000 for optimized images #19648

Merged

3 tasks

Siobhan Bamber added 7 commits November 22, 2023 15:38

Merge pull request #19648 from wordpress-mobile/feature/changes-to-de…

3df4817

…fault-resolution Update default max size to 2000 for optimized images

Merge branch 'feature/updates-to-optimization-settings' into feature/…

b649153

…update-optimization-values

Import Context for use in class

af19103

Ensure we return default quality int if necessary

acb9197

In cases when a quality value is invalid, we should explicitly detect that and then return the default quality value. Otherwise, the invalid value will continue to be returned. Response to the following feedback: #19644 (comment)

Add extra detail to RELEASE-NOTES

bf8a7d7

Merge pull request #19644 from wordpress-mobile/feature/update-optimi…

b28e0dd

…zation-values Update values associated with "Low" and "Medium" image quality settings

SiobhyB marked this pull request as ready for review November 23, 2023 11:41

SiobhyB requested a review from fluiddot November 23, 2023 11:41

fluiddot approved these changes Nov 23, 2023

View reviewed changes

Siobhan Bamber and others added 2 commits November 23, 2023 17:17

Add additional line break to release notes

40241df

Co-authored-by: Carlos Garcia <fluiddot@gmail.com>

Refactor if statement

51ca8af

Refactors two if statements into a single statement, as it was possible to group the two conditions. Addresses the following feedback: #19581 (comment)

SiobhyB merged commit 6325387 into trunk Nov 23, 2023
20 checks passed

SiobhyB deleted the feature/updates-to-optimization-settings branch November 23, 2023 18:13

This was referenced Nov 28, 2023

Update strings in image optimization popup to avoid misleading translations #19681

Closed

New strings for popup for clear translations #19682

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Updates to image optimization settings #19581

Updates to image optimization settings #19581

SiobhyB commented Nov 9, 2023 •

edited

Loading

wpmobilebot commented Nov 9, 2023 •

edited

Loading

wpmobilebot commented Nov 9, 2023 •

edited

Loading

peril-wordpress-mobile bot commented Nov 23, 2023

fluiddot left a comment •

edited

Loading

fluiddot Nov 23, 2023

SiobhyB Nov 23, 2023

fluiddot commented Nov 23, 2023 •

edited

Loading

SiobhyB commented Nov 23, 2023

wpmobilebot commented Nov 23, 2023

Updates to image optimization settings #19581

Updates to image optimization settings #19581

Conversation

SiobhyB commented Nov 9, 2023 • edited Loading

Description

Included PRs

To test

Default setting should be changed if it has never been set before

Default setting should not be changed if it has been set previously

Set original as maximum image size

Set maximum image size

Media Screen

Gutenberg Editor

Media Blocks - From Device

Media Blocks - Take Photo

Featured Image - From Device

Featured Image - Take Photo

Regression Notes

wpmobilebot commented Nov 9, 2023 • edited Loading

wpmobilebot commented Nov 9, 2023 • edited Loading

peril-wordpress-mobile bot commented Nov 23, 2023

fluiddot left a comment • edited Loading

Choose a reason for hiding this comment

fluiddot Nov 23, 2023

Choose a reason for hiding this comment

SiobhyB Nov 23, 2023

Choose a reason for hiding this comment

fluiddot commented Nov 23, 2023 • edited Loading

SiobhyB commented Nov 23, 2023

wpmobilebot commented Nov 23, 2023

SiobhyB commented Nov 9, 2023 •

edited

Loading

wpmobilebot commented Nov 9, 2023 •

edited

Loading

wpmobilebot commented Nov 9, 2023 •

edited

Loading

fluiddot left a comment •

edited

Loading

fluiddot commented Nov 23, 2023 •

edited

Loading