search

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

Offline Support: UX Issues when trying to load a featured image. #11434

Open diegoreymendez opened 5 years ago

diegoreymendez commented 5 years ago

Post Settings > Featured Image - “Featured image did not load” message displayed in the row and the row is not tappable / doesn’t do anything

Steps to Reproduce

  1. Create a Post with a feature image. Make sure it is uploaded to the server.
  2. Delete the app from the device.
  3. Install and run the app again.
  4. Open the Post List.
  5. Go offline.
  6. Edit the Post.
  7. Go to the Post's Settings. Notice the Featured Image section.

Tasks

shiki commented 5 years ago

@yaelirub @osullivanchris I need your input on what should be done here. What do you think of the Tasks that I listed in the description? ☝️ I'm not quite sure of the Placeholder and message one.

yaelirub commented 5 years ago

@shiki , I'm all forward to allow the user to remove and add a featured image when offline. I think it aligns well with the mission to improve the experience while offline.

Allow users to remove the featured image even while offline

Will this result in a failure? a snackbar message?

Allow picking a featured image even when offline

Will this be taking care of by the new UploadManager? cc: @diegoreymendez

Add tracking

Can we specify what tracking we want to add?

Show a placeholder and a message?

Placeholder in the post? where and when will we show the message and what will the message state?

Also, thank you for taking this on 🙏

shiki commented 5 years ago

Allow users to remove the featured image even while offline Will this result in a failure? a snackbar message?

I did some quick tests and it looks like it's possible to just make this work without letting the user know and let the Editor handle the saving of the Post.

Allow picking a featured image even when offline Will this be taking care of by the new UploadManager?

I have to investigate this some more. It looks like the Media Picker dismisses itself if the app is offline. I'm not sure what the implications would be if we stop it from doing that.

Can we specify what tracking we want to add?

I was thinking of feature usage for now: Setting and Removing a Featured Image.

Placeholder in the post? where and when will we show the message and what will the message state?

Placeholder in the Settings and Featured Image popup. As for what the message should be, I don't know. 😄 I also think that what we have right now is okay and it's probably too much if we add a placeholder. We could use the development effort on something else.

yaelirub commented 5 years ago

I also think that what we have right now is okay and it's probably too much if we add a placeholder. We could use the development effort on something else.

Agree. Let's leave it out of scope for this.

I was thinking of feature usage for now: Setting and Removing a Featured Image.

Will you track the failure to upload too?

I have to investigate this some more. It looks like the Media Picker dismisses itself if the app is offline. I'm not sure what the implications would be if we stop it from doing that.

I hope we can make it not dismiss itself when offline :)

Can we update the title of this ticket to fit the functionality of the tasks you added? (seems like the scope would be more than just solving the UX problem)

osullivanchris commented 5 years ago

@yaelirub: I'm all forward to allow the user to remove and add a featured image when offline. I think it aligns well with the mission to improve the experience while offline.

Agree here! But of course, I don't know enough about the different efforts we have yet, and where it would be prioritised against other work we're doing.

@shiki : I did some quick tests and it looks like it's possible to just make this work without letting the user know and let the Editor handle the saving of the Post.

Just to clarify, are you saying that the user can remove the image, but that you don't think we need a special visual indication to let them know it has happened?

I'm trying to have a look at this journey, even online, to get an idea of how it works today. I found a few other issues. They might be out of scope of this discussion, but maybe you can tell me how it works.

@shiki: I have to investigate this some more. It looks like the Media Picker dismisses itself if the app is offline. I'm not sure what the implications would be if we stop it from doing that.

It sounds like you're solving the technical part of this issue right now. I agree with @yaelirub in the spirit of this task we would want to get that working. Let me know if a design piece comes up here once you've figured out the technical part.

shiki commented 5 years ago

@osullivanchris

Just to clarify, are you saying that the user can remove the image, but that you don't think we need a special visual indication to let them know it has happened?

Sorry, there were missing words there. I meant not letting the user know that the device is offline.

Looking more into this, my assumptions yesterday were wrong. The removal of the featured image is not saved while offline at all. Also, the experience is terrible:

The popup just shows an empty screen. Any suggestions?

But for me, when I choose 'Set Featured Image' its becoming the header image for the blog, not just this post. Is that correct?

That looks like it's because of the theme. See these different pages:

Also, when I go to 'Remove', it says "Remove this Featured Image" in the dialogue. I am not sure on the language there. It makes me think I might delete the image altogether.

Yeah, any suggestion is welcome. 🙂

Lastly, when I view the post after its published, I can't see the image when I go to 'view'. Might be something I'm doing wrong.

Uh, this looks like a bug. 😬 I'll take a look.

It sounds like you're solving the technical part of this issue right now.

Not really. I haven't committed fully to this yet. So please let me know if you have anything to suggest. 🙂

osullivanchris commented 5 years ago

@shiki thanks for clarifying a few of those!

I'd expect to see the image I'm removing in the popup. But I'm assuming I didn't see it because the image didn't load. If the image did load, I guess I would see it there? And if we improve offline it could load. And we could have a fallback if it did not. Beyond that I'd have to think about it a little bit. For the point I made about language, it feels like it should say something like "Stop using as feature image" to make it clear that you're not deleting the image.

I also wonder should the action be "change" (i.e. change the feature image for your post) and one of the options within change could be to have no image. But again, that's not specific to offline so it might not be an issue we are tackling here.

iamthomasbishop commented 5 years ago

Some good points, @osullivanchris – and I'm all for considering alternative terminology. I have a suggestion based on the issue above.

I couldn't help but wonder if we should think about aligning this error state with the error state in the editor? Meaning when an upload fails, it says (approximately) "Upload failed – tap for options". Then when the user taps, they see an ActionSheet with the relevant actions.

Something like this?

image

This would essentially just add the second line to the row, and remove the need to open the new view upon error (no ghost image as shown above).

shiki commented 5 years ago

@iamthomasbishop I like that suggestion. If the loading is successful, should we add another option in that action sheet named "View Fullscreen" or something better?

iamthomasbishop commented 5 years ago

If the loading is successful, should we add another option in that segmented control named "View Fullscreen" or something better?

If I'm understanding correctly, nothing would change from the current implementation on iOS. For clarity, what currently happens is we simply show the image in that table row. Tapping on the image opens a new image view w/ the image centered, navigation bar with actions for "done" (left) and "remove" (right).

image

Note: We might want to consider aligning the "remove" text between these two if we decide to change it as discussed earlier.

shiki commented 5 years ago

@iamthomasbishop I'm reiterating to make sure I understand. We will have 2 ways of removing a featured image.

If Online If Offline
Use Remove button in popup
Use Clear Featured Image in action sheet

Is this accurate? 🙂

iamthomasbishop commented 5 years ago

Technically, yes. But the full-screen view is only shown when the image is successfully added. Here are the cases, as I understand them:

If the featured image is shown successfully:

If the featured image has a display error:

iamthomasbishop commented 5 years ago

And to re-iterate, whatever we decide is the proper label for the Remove action, we should use the same label in both of those locations.

shiki commented 5 years ago

Thank you, @iamthomasbishop! I believe I understand. 😄

I'm removing my assignment from this issue since I will be AFK the whole week next week. Just in case someone else wants to take it. I'll pick it up again when I'm back.

diegoreymendez commented 5 years ago

While estimating this task, we marked it as "13" because we need to break it up into different subtasks.

diegoreymendez commented 5 years ago

This apparently no longer needs design and is quite clear. I'm estimating this at 2 and self-assigning to work on it.

dangermattic commented 4 months ago

Thanks for reporting! 👍