A modern reading list for the avid reader
I am a voracious reader, and I have always kept a list of books that I want to read. In recent years, however, I found that my list had scattered throughout my phone: a note with a list of recommendations, photos of covers taken at the bookstore or library, screenshots of listings on Amazon, overstuffed shelves in iBooks. I grew tired of trying to keep track of all of this, but I knew that the smartphone was the best place for my list to live. It just needed a dedicated space, one that was easy to manage and easy to use.
At the time, I really liked the email app Mailbox, a different take on the traditional email client. Rather than laboriously dealing with message after message, Mailbox allowed the user to quickly swipe emails wherever they needed to go, be it the archive or the trash. While using it one day, it occurred to me that this approach could work for books as well. Your books could be separated into three lists – those you want to read, those you are reading, and those you have finished – and swiped from one to the next as you read. Swiping a book into your Finished list seemed like it could be just as satisfying as swiping an email into your archive.
I loved the idea I had, but I decided to see if there was already an app out there that would handle what I wanted well enough. While looking around, I discovered Goodreads, a great service for readers that combines digital bookshelves with a social networking component, offering users the ability to rate and review books, share recommendations with friends, and meet like-minded bibliophiles. I thought this was pretty cool, so I signed up for the service and tried using its app as my reading list. However, because Goodreads offers much more than lists of books, I found it too complex to use as a reading list in the way I intended. Not really seeing any other interesting alternatives, I concluded that there was a place in the market for a lightweight, focused reading list app.
Inspired by Mailbox, I had the foundation for the app's layout: three sections the user could navigate between at the top, and moving books between them by swiping.
(photos of top bar)
In the first version of the app, I laid books out in a grid, rather than a standard table view, for two reasons. First, I liked the look of a collection of large covers – it felt more like a bunch of real books. Second, I was trying to differentiate from Mailbox somewhat, and presenting books like this seemed like a good way to do it. This also meant that rather than swiping across a table view cell, users would instead tap and drag a book to the edge of the screen to move it to a new section.
(photos of grid first version)
However, I quickly abandoned this for the traditional table view layout in the next version of the app.
(photos of table view layout in 2nd version)
Dragging books to the screen's edge proved less intuitive for users than I had hoped. The biggest problem, however, was that sometimes a book's cover didn't tell you what the book was. When that was all the user had to go on, that was a problem. The app was designed to handle books that didn't have cover image data (sourced from Goodreads), but occasionally there were books that had blank, incorrect, or nontraditional cover images. For some users, they had enough of these in their lists that it was hard to tell what most of their books were, which made the app less useful and enjoyable.
For the screen for an individual book, the layout of its information was pretty straightforward.
(sketches of book screen - sketches, mockup in Sketch?)
The harder question was how the user would navigate to it. My first thought was to manage this with a navigation controller, as is standard in many iOS apps. I was dissatisfied with this, though, because it contributed to my growing sense that the app felt too utilitarian. At the same time, I had been thinking about how to make more use of book covers, since these were the most visually appealing part of the app. These two trains of thought converged to form my solution for the book screen transition. When the user selected a book, the cover would expand and blur, and the book's information would be displayed on this background.
(video of transition)
It felt like you were immersed in the book, which I liked, and made the app feel more engaging and interesting.
I wanted users to be able to add books to their lists in two ways: via search, as would be expected, and by scanning the barcode of a physical book.
Iterating Based on User Feedback
Removed Goodreads accounts
Added sorting options
Changed how lists could be edited, removed more info button on book pages