Delete picture from thumbnail

Question

I have a little camera icon on the side of a view, for a mobile app.

Right now, tapping the camera allows me to load a picture. After the picture is chosen, it replaces the camera icon as a little rounded corner square.

This is because we can only have one attachment, and of image type only.

If the user taps again, he can chose another image which replaces the first one.

But now, I'm struggling to find the right design to remove the image from the message. What do you suggest?

We're talking about an iOS app.

Right now I've implemented an animation that looks like the one on the springboard (home screen) of an iphone. A long press put's the image in "deletion mode" which makes it wobble, and displays a cross on the top right corner. Pressing that cross removes the image.

I've been told it's a bad idea because the user can't know he is supposed to long press. I believe this is wrong, as iOS users know that typically, a square icon with rounded corners that you can tap really looks like the one they're used to, which they can remove by longpressing.

My questions are : - Is my design bad? - Is there something better ? What do you suggest?

Answer 1

I have been an iOS user for many years, and I understand that long-pressing an icon on the home screen will allow me to delete it, but I can't think of a single example of performing a long-press within an app. There may be a couple apps that do it, but without a tutorial (as many gesture-heavy apps have these days), I don't believe it is obvious.

Since your app only has zero or one pictures, I would provide the shortcut "X" that you recommended with a confirmation pop-up. Since this is an iOS app, I would lean towards mimicking how the iOS Photos app works by allowing deletes from the full-screen preview as well.

The option to select a new picture could be in a menu that provides all other options that a user has to interact with their image (e.g. View, Download, Select new photo, etc..)

See example below:

Answer 2

Iconography can sometimes be challenging due to the difficulties involved in associating them with domain specific meaning. If you want the user to upload an image it will be more explicit if you used a text-based trigger, e.g an "Upload Image" button.

You do not want to utilize the iOS App Delete interaction metaphor because this would be totally inappropriate, so put a specific Remove trigger (note: you are not deleting it, you are removing it) when you are displaying the image.