Introducing Treesaver, my latest project (mentioned in today's NYTimes)
fortes.com
fortes.com
I'm very passionate about improving the state of reading online. It's amazing how many sites are actively user-hostile, it's like they are daring you to try and read the entire article by splitting it up across pages or throwing tons of annoying, flashing ads on the page.
This is my attempt to make things better :)
The NYT article is about our first publicly announced publication, Nomad Editions: http://www.nytimes.com/2010/08/11/business/media/11nomad.htm...
Quick video demo of resizing: http://www.youtube.com/watch?v=Pt2iJZGqMpw
I'm happy to answer any questions.
On the technical side: are things like hyphenation and justification also on your todo/feature list? I've been thinking about putting my work on justification and hyphenation [1, 2] to good use, as the "rendering engine" of a HTML/JS based eBook reader. I haven't given much thought to page layout and scrolling, but I like the direction you are taking it for mobile and iPad users. I would personally prefer a different layout for reading on my desktop machine though (granted I prefer reading on my Kindle.)
[1] http://www.bramstein.com/projects/typeset/flatland/ [2] http://www.bramstein.com/projects/typeset/
Ah, that explains it then. Seriously, what is it?
I wrote a JS library that lays out text and images in pages and columns. Wrapped that into some decent UI for reading easily, and we're helping clients use that in order to create better digital publications.
Is that any better?
However, is a column/page based layout really the best we can do with modern UIs? Pages between different sites/articles makes sense, but within a single article, I always found it to be a sacred cow. Same with columns. I know columns are faster to skim, but isn't there something better?
Maybe this is just a way to get a foot in the door with publishers so you are giving them something familiar, but I think a new standard will be introduced into the publishing world to better fit the technology now that we are no longer bound by the limitations of paper.
This is a great question, with no clear answer yet (requires more experimentation in my opinion).
One issue I've run into when designing for this is that, without columns, it's hard to use the full width on wide screens. You're left with a ton of blank space on either side of your content.
Once you flow text into columns, you end up needing to page, because scrolling and columns don't mix (you'd have to scroll down to the end of the first column, then scroll back up to the beginning of the next -- it's terrible).
I think this is an important point. If you can get your foot in the door by making them comfortable, you can drive a new UI with their help: private beta, asking for feedback, etc.
This variety is exactly what is amazing about books, magazines and all media: imagine if wired looked like the new yorker. The whole point of 'new media' is not abandoning design, otherwise we'd just read our blogs and websites in w3m.
The point of treesaver (from what i glean) is not to abandon design, but merely to provide a basis for creating a more sensible ui for engaging with rich media that adapts to the viewport.
The revelation that this design offers is adapting multiple variations of the design based on the current viewport size. (as a dynamic version of http://www.alistapart.com/articles/responsive-web-design/)
I wrote about this but without a generic demo a while back here: http://nsfmc.tumblr.com/post/647010330/pages-the-fold-and-me... and also here http://nsfmc.tumblr.com/post/468243524/revisiting-newspaper-...
good work, and if people run with this sort of usability and create multiple, good looking apps, all the better.
So, basically using a developed version of media="screen, mobile"?
If so that's pretty brilliant marketing.
CSS column support is fairly primitive: You can't do columns with different heights, or have images that span columns. Also, there's no native way of doing pagination, so which cripples columns in most cases (you'd have to scroll down to the end of one column, then scroll back up to the start of the other).
nice product! Does the content producer have to determine in advance what counts as important content, i.e. what content stays on screen when space is limited?
Currently, there's a way to specify that content is optional, or has alternate representations that can be used at other sizes (e.g. multiple image crops)