17

I've got a mobile app where the user takes a photo of an object. This photo is to go through some heavy-duty image processing server-side, so to prevent large wastage of time, a simple pre-check is done on the device. This makes sure the image is in focus, the object is clearly within the frame, and meets a few other parameters so that we know the big heavy processing will work. This is much better than sending off a large image to the server, and waiting a long time (relatively) for a rejection from there.

The problem is, in testing, a lot of users find it hard to take good photos, resulting in multiple rejections before finally taking a photo that's accepted.

This is a UX disaster, anyone using our app for the first time and getting more than one rejection is very likely to give up and never use it again. Is there something we can do from a UX perspective that goes some way to deal with this problem?

9
  • What information does a user receive when a photo is rejected? Are they told why it was rejected or given any help in improving their photos?
    – Matt Obee
    Jan 3, 2013 at 10:06
  • @MattObee Yes, usually it's a focus problem.
    – fredley
    Jan 3, 2013 at 10:10
  • Is the pre-check done automatically by the app or is it a preview for the users to use to decide whether the image looks the way they intended or not? If it's an automatic procedure maybe your algorithm making the check is a bit too strict..? Jan 3, 2013 at 10:14
  • @AndroidHustle It's automatic. It takes a couple of seconds, so can't happen in real time. I can't elaborate as to what we're doing I'm afraid, but if the pre-check fails, the server-side processing will fail.
    – fredley
    Jan 3, 2013 at 10:17
  • So the control of "focus" is on the app and not in the user's hands, as far as I can understand. And if that is so, is there a sure shot way which you can suggest to users for using that aspect of your app, so that they don't fail much? And if there is one, then accommodate a description to that way in the most user friendly way in help section!
    – Mohit
    Jan 3, 2013 at 10:31

4 Answers 4

16

If you take two premisses:

  • users, if given the choice and helpful advice, would rather get the best result
  • you would want to process only images that are up to standard

you could go another way than flat out denying sub-standard pictures. Give users a choice, if they want to try proceed with a low quality picture. If it is indeed too low in quality to even be possible to process, display a message in return, not a denial.

Let users take photos and run them through your preprocessing. If the verdict on the current photo is one of low quality, display a modal message to the user:

Proceed with "low quality" picture or try take a new picture?

  • Proceed anyway >
  • Retake picture >

There is ways to refine this.

  1. If you can detect what exactly is out of place with the attempted picture, replace "low quality" with the reason, i.e. Proceed with blurry picture...
  2. If you can detect how bad the result is going to be, reflect this in the message, i.e. Proceed with very low quality picture or try a new picture?
  3. Don't flat out deny, but let users try even with a surely failing image and just immideately feed back Sorry, could not process low quality image, try again with new picture without actually doing any calculations server side.

Obviously, the term "low quality" I used is examplary and you might use a more positive wording.

4
  • +1 for "proceed anyway". I also would suggest to add some quick help at the beginning with short text explaining how to take photos to get best results. Jan 3, 2013 at 13:40
  • this is actually spot on! +1
    – David K.
    Jan 3, 2013 at 17:10
  • 2
    I think the danger here is that the option "proceed anyway" does create expectations that are not met afterwards. Users who choose that option will be rejected during the final check. But the "pre-judging" should be as accurate as possible and give reliable feedback whether an image is usable or not. It should NOT pretend there is a chance the image will go through when there is none. This would take away transparency for the user. Additionally, offering options creates stress of choice, so the better way here would be just to tell what went wrong and to give the chance to retake the picture. Jan 4, 2013 at 11:37
  • Good points you mention, especially the stress of choice. One might argue though that after a couple of failed tries of "proceed anyway" the user will have learned that trying images that received this warning is futile, but they will have learned it in a softer way than flat out denying them. I particularly like your idea of showing hints to take better pictures that you suggested in your answer.
    – kontur
    Jan 4, 2013 at 13:04
6

I see two key opportunities to improve the experience here; prevent poor-quality images from being submitted in the first place by educating your users and provide useful feedback if and when an image is rejected.

Firstly, you need to be very open and transparent in explaining the requirements for successful submission, and make it clear that their photo will be evaluated for quality. Much like other kinds of input (entering data into a form, for example) you need to explain these requirements before the user goes to the effort of submitting an image. The best way to provide this information in this context is probably to provide examples of good and bad photos.

Failure to provide this information up-front is bound to be frustrating.

Secondly, if a photo is rejected, you need to provide actionable feedback that explains why the photo was rejected and how the user can improve their photos to avoid being rejected in the future.

3

The user doesn't really know any difference between the phone not validating a chosen photo or the server, they just see that it is erroring for some reason.

This may not be technically possible, but the solution I would look to put in place would be to help guide the user to only be able to take a valid picture.

I would include a guide area on-screen (with eye placement, face size location etc) for the user to 'line their face up with'.

In addition to this I would include a message on-screen that is present until a valid photo is ready to be taken. Something along the lines of 'awaiting sharp focus'. As soon as this criteria is met then take the photo (perhaps automatically) and you're much more likely to have a valid picture when you submit it to the server.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

1
  • Unfortunately, our pre-processing takes too long to do in real-time. Adopting this approach would drop the preview frame-rate to about 0.5 fps, arguably worse UX.
    – fredley
    Jan 3, 2013 at 10:27
2

Restrictions are always a problem, be it passwords, number formats etc. I take it you already cut down your restrictions to a minimum and there is no way to drop some more.

I think the best thing to do is to explain why their photo got rejected and to provide hints how to meet the requirements next time. Maybe you can offer a "training session" or force the user to work himself through a tutorial before posting his own photos. Another idea would be a questionnaire which has to be answered before the user can access all features.

I know this will raise the bar to get involved with the product, but it confronts the user with the restrictions while he might still be motivated to use your product. And it will probably decrease the frustration rate afterwards.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.