0

Part of the app is to read a longer text, so users have the choice to view it in a full-screen reading mode. Mainly targeted device is smartphone, not tablet.

I have two important controls here, exiting this mode in top right and adjusting it (choosing from 3 contrast presets) in the bottom right.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

It is probably a bad idea to have them be constantly visible, so I was having these thoughts:

  • Make them disappear after ~5 seconds and reappear when user touches the screen
  • Have no (x) at all and make it closable by swipe gesture (which adds risk of accidental closing)
  • Is the contrast adjustment button on the screen a good or bad thing? It could also be in the settings as one would probably only adjust it in the beginning. But there it's harder to reach and test ('Do I like the setting I chose or not?') and users might even miss it completely (which could be countered with onboarding again)

So the question is basically how visible and accessible/reachable should these controls be?

2
  • 1
    This is a good opportunity to do some user testing. Mock these up in a tool like MarvelApp that lets you make interactive demos. Then have some people try it and see what approach has the least errors / best outcomes. – Michael Hogan Jan 26 '19 at 5:15
  • 1
    Have you looked at other reading applications like "Medium" or "Google Play Books"? – user68158 Jan 28 '19 at 7:45
1

I created a script writing app on tablet and the point was no distractions AT ALL!
I made a menu that appeared when the user held his finger down for 3 seconds with a little animation so the user knew something was going on, this opened up a little menu.

Like on a wacom when you hold down for too long. This solution would help remove the annoying menu popping up just on scroll. This solution would allow you to have more controls and take up more of the screen.

enter image description here

4
  • This approach could be elegant with a 3D Touch or long press on iOS! – Michael Hogan Jan 26 '19 at 5:13
  • I think I like your suggestion the most to not annoy the user with constant popping up on every scroll. Though I don't need the menu or more options, I'll simply let my two controls disappear until user long presses again. – Big_Chair Jan 26 '19 at 10:33
  • What about affordance? I'm sure the majority wouldn't expect this sort of functionality from a reading application. – user68158 Jan 28 '19 at 7:48
  • This functionality is simple and fairly well established. So long as there was a sufficient on-boarding description then I am very confident that users would quickly adopt this feature. I think that your point is super fair though and would need to be addressed in on-boarding. – user2520890 Jan 28 '19 at 15:01
2

To me the problem is not so much the presence of the buttons as the position, one at each end of the screen, what means:

  • two more possibilities to make mistakes clicking the wrong point.
  • If both refer to options regarding what is being visualized, why not unify them?

I don't know if it's possible in your app, but click and click & hold could give different options using the same button:

  • Click: change the contrast or exit
  • Click and hold: button toggle

enter image description here

1

Honestly, I would always leave visible the icons to the users considering the importance of ensuring them to have control of what they are doing. In this way, you can increase the trust to the app itself. I would also consider the context of use of this app and the real end user of it.

Anyway, I like the option to swipe off to close the text window that recalls a common function used in other apps.

To adjust brightness level using the click and hold probably is not the best solution on a small device like smartphones, think about the users that have big fingers, but could work on a tablet.

Probably, I would work more on the icons shown for each press, eg:

dark light = Sun without rays or Moon

medium light = Sun with shortening rays or a few rays

high light = Sun with long rays or more rays

Or change it with the light bulb following the same concept.

To close the app, I would design a the centre bottom a thin arrow that indicates the physical Home button that once pressed will reduce the window of the text (showing in the background the menu of the app or the previous screen used, in this way the user understand that s/he is not closing the app but only the text window) and let the user swipe it off.

I thought about using the physical volume up and down buttons, but I'm not pretty sure it would work. You could try to let them be activated after pressing one time the sun/bulb icon on the screen, adjust with the volume buttons and then re-press the bulb light to confirming and close the set up (keep in mind to use an icon that helps to understand the status of the features. Close button with the X or with the one suggested before.

I hope it could help or give you some idea to sort out your problem! Good luck!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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