UI controls during full screen reading

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?

Tags: