Bookmunity: UX/UI Case Study in Paper Prototyping
Looking at the Barnes & Noble mobile experience through Rapid Prototyping
Designers: Brett Wilson (me), Anahita Bagherpour and Aaron Hilado
Project Timeline: 2 weeks
Design Tools: Sketch, Adobe Illustrator, InVision, Hand Sketch/Wireframes
My Role: Interviewer, Storyboard creator, Proto/User Persona Creator, Finalized High-Fidelity Prototype
I rarely have a chance to fix anything that I really want to; what is inherit but may not always be apparent is that you need a working knowledge of how something works in order to imagine how you might fix it. I am an avid book reader and have been consuming printed media since pretty much when I learned to walk.
That’s why when we were presented with an opportunity to fix something that was a passion of ours, I made no bones about pushing for Barnes & Noble. Through a unique re-imagining of the search process, compelling user interview and several rounds of sketches and prototyping we were able to enable some new ideas that delighted our key user.
Design Process
We took a traditional approach to thinking about how we might design a solution to our Barnes and Noble quandary:
- Empathize
- Define
- Ideate
- Prototype
- Test
Empathize: Who is the user really?
There was some debate amongst our group as to who would be the key user that was using this potential solution. Barnes & Noble is a pretty ubiquitous part of the American fabric and with it’s open architecture and lax policies it invites people to come and stay as long as they want.
Eventually we settled upon a woman in her late twenties, journalism as a hobby and someone who has an avid taste for books: for work as well as pleasure. They could be someone who represented the upper-median income consumer that is reminiscent of Barnes & Noble’s average customer . This person would be looking for a solution to help them make suggestions on what they would interact with, solicit feedback from trusted sources and easily choose to purchase when they have something they like.
We really had a chance to dig deep when we actually went into Barnes & Noble for the first time looking for someone to interview to discuss the gap we had identified and see how that made everyday users feel. We had the pleasure of connecting with a vibrant law school student Tatiana Nicolla who was studying for her JD at the University of California San Diego. She was originally from Orange County, so this was her favorite Barnes & Noble and she had a lot to say and suggest.
We had a 30 minute interview with her and learned so much; her love for books were apparent, but she saw some gaps including:
- She loves books but it can be hard to figure out what to read or why.
- She wanted recommendations, but she preferred Barnes & Noble employees or close friends over random people online.
- Once she had found a book she liked she wanted to have something queued up for her next reading opportunity.
- She is busy, but reading is important so if she could make the best use of her time when she did come to a Barnes & Noble it would be great.
When we suggested our ideas around what would become Bookmunity, an app to help improve the experience surrounding the book browsing & buying experience, her response was:
“I would love that. Is there something like that? Because I would totally use it tomorrow.”
Define: Looks like we found a problem.
It was easy to recognize that Barnes & Noble serves a unique community service with low pressure sales tactics, wide aisles to encourage browsing and a record of being one of the first book retailers to embrace technology albeit years earlier. What became immediately apparent is that in their mission to bring a community aspect to big box retail, they were missing the mark in providing quick and educated access to books and by extension the greater community.
What this meant was people were finding more convenient and intelligent ways to make the jump from casual browsing to purchase of those books. Amazon and even other big retailers (i.e. Walmart, Target, etc.) were able to provide convenient structures for their users/buyers to purchase books amongst their other purchases easily. Also, the computers that they did have in store were clearly relics of the late 1990’s with little direction and oftentimes not consistent usability comforts like intelligent search results or relevant location tracking.
With all of this in mind, it presented us with an opportunity to solve a key problem: find a medium in which we could utilize the larger book community, streamline customer traffic and increase overall sales.
Ideate: Cycling towards something better
Coupled with our insights from Tatiana and problem in front of us, it was clear we needed to get our potential ideas on paper. We started with doing some card sorting and attempting to determine where our priorities for our solution might lie.
After that we set out to get some ideas on paper; our iteration of idea gathering is really what drove us towards our moment of clarity. Our insight into the ideal solution revolved around Tatiana’s need for fueling her passion of book reading. We could delight her by delivering a solution that would allow her to find new books to read, decide quickly whether those books were worth her time and then have a way to share them easily with others.
From this I was able to construct storyboard of the experience we imagined based on her feedback:
Finally, we were left with working through how a user might make their way through our proposed app. It took 3 separate sessions to get it right, but we ended up with something that resembled a clean and seamless experience:
With an idea in hand, and a vision for Tatiana (as well as future users), we sought to put this to good use and start prototyping.
Prototype: Repitition is the key to success
With a great idea in hand, it was time to put pen to paper and see what we could come up with. What we discovered very soon was that there are so many ways to represent a login flow as well as how information might best be displayed within the app. The options seemed almost endless so we just started sketching and testing in InVision to see if we could bring Tatiana’s passion to life.
After 5 rounds of changes it was time for testing amongst friends, family and coworkers so we came up with our initial paper prototype and sent it off to them for further testing and feedback.
The feedback we got made sense to many of them, but it was not immediately clear how they might use it or how dynamic certain results might be. There was one part in particular where we had a block of genre of options, and it made it less clear to choose from than a list. This critical feedback allowed us to change the construction of the genre selection part and make future prototypes more logical and functional.
Test: The Proving Grounds
With only days left before we needed to deliver our proposed solution, I connected with Tatiana inquiring if she would be willing to test out the app idea. She eagerly replied and was ready to do so whenever we were. This allowed us to craft and send over a high fidelity InVision prototype complete with some key interactions like map display and favoriting certain items that we had received during initial testing:
Tatiana sent us a long series of responses shortly after receiving the prototype; we were delighted to learn that not only had she used it but she had shared it with her family and a few friends. Most of her feedback was glowing in that:
- It was simple to use and understand when logging in
- She liked that it offered so much information on what she was looking at
- Having a map of the store and finding book locations was a plus
- She also liked it’s appearance on mobile as it was her primary usage device
She had some very thoughtful critiques as well that included:
- There wasn’t as clear of a connection between the Barnes & Noble account and the app: was she supposed to use one or the other?
- It was nice to see one experience but she could not see how things changed as she moved from genre to genre
- Where was the section for suggestions from friends or Barnes & Noble employees?
All in all she was eager to see future iterations and would be willing to test something again in the future should we come up with it.
Learnings: What we took away
Iterating throughout our process was maddening at times, but it ultimately allowed us to disperse our own personal bias and listen more closely to the user. We now have a viable solution that can continue to be iterated upon and deliver an experience that will ultimately endear Barnes & Noble customers more to their brand.
Iterating throughout our process was maddening at times, but it ultimately allowed us to disperse our own personal bias and listen more closely to the user. We now have a viable solution that can continue to be iterated upon and deliver an experience that will ultimately endear Barnes & Noble customers more to their brand.