wordpress-mobile / WordPress-iOS

WordPress for iOS - Official repository
http://ios.wordpress.org/
GNU General Public License v2.0
3.7k stars 1.12k forks source link

Feature Request: Image Editor #9645

Open Titanas0 opened 6 years ago

Titanas0 commented 6 years ago

Hey everyone 👋

I've been thinking about Image Editing in the WordPress mobile apps. I wanted to improve the workflow of content creation on mobile. Instead of jumping between photos apps for simple image manipulation like cropping, rotation, brightness etc this all can be done within the WordPress app.

During WCEU, Matt mentioned that 3.7M images are uploaded every month via the mobiles apps. That's a lot of photos.

So i created a prototype with Framer to work around this issue. You can watch the demo video here: https://www.dropbox.com/s/pdmuikkxm7f5vzu/WordPress-iOS-Image-Edit-Prototype-Idea-1.mov?dl=0

The prototype is intentionally simple. All the editing tools are based on OS level capabilities. Nothing fancy. I included only a few editing tools to keep the demo short but obviously there can be more. Like filters, editing multiple pictures at once with recipes (i call them recipes anyway) etc. There is also a simple Undo function.

elibud commented 6 years ago

Thanks for the design @Titanas0, it looks great.

@nozomimimi @kwonye what do you think about this one?

kwonye commented 6 years ago

@nozomimimi you mentioned wanting this, what do you think of @Titanas0's prototype?

@Titanas0 I really like it btw, thanks!

nozomimimi commented 6 years ago

@Titanas0 Thanks for making this! Looks fantastic! One small thing: I'd like to have "redo", along with "undo" :) I often do both the undo/redo to see before and after when I'm editing photos.

Titanas0 commented 6 years ago

@nozomimimi that's easy to add :) thinking about it right now and taking a hint from 3rd party apps, a long tap on the photo can show the original version of the photo an upon release the edited version of the photo.

nozomimimi commented 6 years ago

@Titanas0 Every editor app does it in a different way (I'm used to swiping left/right, or tap once to see before, tap again to see after) but yea, I think it's pretty good as long as it's discoverable :)

Titanas0 commented 6 years ago

Hey,

Here's another prototype idea: https://www.dropbox.com/s/bd37d4ca57xeq97/WordPressiOSPhotoEditingAutoLongPress.mov?dl=0

This prototype has 3 additions.

1) Auto correct image. This is another standard OS level function to quickly improve a photo 2) Long tap on the photo to compare the original photo to the edited version 3) Slider has now the WordPress blue color

When the user taps for the first time on the Auto icon function or any other editing tool, a short message appears to explain the non obvious functionality of the long tap on the photo. The tap disappears right after.

It's a hybrid approach for communicating the not so obvious functionality of the long tap. A help message presented in such a way so that the person has to complete the desired action while getting value from the "educational" process of using the long tap.

@nozomimimi is this something you were thinking of?

nozomimimi commented 6 years ago

Hi @Titanas0! Apologies for the delayed response. I was on a break for some time.

The new prototype looks awesome! One question: What's the reasoning behind having the Auto correct option on the photo, instead of the photo editing menu below?

Again, thank you for making this! Can't wait to have this feature :)

Titanas0 commented 6 years ago

@nozomimimi welcome back :)

Not particular reason. I was thinking about this and decided to go with the familiar location that matches what is currently available in the Photos app on iOS instead of the editing menu. What works best in this particular case I don’t know. I would choose either and A/B test 🙈

I can’t wait to see this being part of app!

nozomimimi commented 6 years ago

Cool! I see :)

Titanas0 commented 6 years ago

@nozomimimi here's another prototype with two main additions:

https://www.dropbox.com/s/8x6mpdezjcr2rjg/WordPressiOSPhotoEditingAutoLongPressMagicFix.mov?dl=0

1) The Auto Fix button is located in the menu area 2) Introducing an idea of Magic Fix

Magic Fix is.. well a dream.. but essentially it builds on the idea of all the capabilities of modern smartphones with dual front cameras and built-in silicon for A.I. It goes beyond Auto Image Color Correction. What it does is a quick analysis of the photo with "magic" suggestions based on context and meta info. Some examples:

a) An image with high contrast areas could ideally be converted to black and white with a small tweak on curves to make it more dramatic b) An image with portrait/depth information from the dual camera can automatically be converted to portrait mode c) A computational analysis of a photo (the not to great example i'm showing in this prototype/video) to create a bokeh effect in a non portrait/regular photo

nozomimimi commented 6 years ago

@Titanas0 Thanks for updating the prototype. Looks super!

Feels nice to have the auto correct inside the menu below :)

Magic fix sounds indeed like magic. Hopefully, at some point, we will have a technology that will allow us to do it :)

Titanas0 commented 6 years ago

@nozomimimi nice to hear :) anything else you would like to try or see?

nozomimimi commented 6 years ago

@Titanas0 No, I think your current design is solid. We might iterate on it a bit more after feedback from developers (regarding Magic Fix for example) and some testing :)

rachelmcr commented 6 years ago

Just noting for reference that there's another open issue related to image editing here: https://github.com/wordpress-mobile/WordPress-iOS/issues/6796

stale[bot] commented 5 years ago

This issue has been marked as stale because:

Please comment with an update if you believe this issue is still valid or if it can be closed. This issue will also be reviewed for validity and priority (cc @designsimply).