Fennec/NativeUI/UserExperience/ReaderMode: Difference between revisions

no edit summary
No edit summary
No edit summary
Line 1: Line 1:
<b>Firefox Mobile 11 or Beyond</b><br>
<b>Firefox Mobile 11 or Beyond</b><br>
Below are some concepts for the a potential reader mode for the Firefox Mobile browser. All the mockups can found in this [http://www.flickr.com/photos/patrykdesign/sets/72157628389027877/ flickr folder].<br><br>
Below are some concepts for the a potential reader mode for the Firefox Mobile browser. All the mockups can found in this [http://www.flickr.com/photos/patrykdesign/sets/72157628389027877/ flickr folder].<br><br>
<b>1. Optimized text size for reading</b><br>
<b>1. Proposed Interactions</b><br>
<b>1. Optimized text size for reading</b><br>
<b>Problem:</b> Add functionality to the reader mode while still maintaining a chromeless, reading focused layout.<br>
<b>Problem:</b> Text heavy (non mobile versions of) websites such as nytimes.com have content which appears far too small at page load since the page is originally optimized for desktop monitors 5x+ the mobile screen’s size.
<b>Solution:</b> Introduce off screen menus rendered visible with swiping gestures. Examples:<br>
[http://www.flickr.com/photos/patrykdesign/6517216455/in/set-72157628389027877 Sample Interaction Flow]<br>
[http://www.flickr.com/photos/patrykdesign/6560945787/in/set-72157628389027877 Proposed Visual Design Mock Up]
<br><br>


<b>Solution:</b> Inflate the text programmatically at page load, so when the user pinches to zoom or double taps the content to isolate the article for reading, the content font is set to a size optimized for reading, we are proposing that size to be 8pt. This inflation would also enable the text to be more readable at page load when the entire website is zoomed out as it should translate to ~4pt vs the ~1-2pt it currently renders at.


We would want to inflate the following elements.<br>
We would want to inflate the following elements.<br>
294

edits