Overview
Responsive redesign translating the culture of Walden Pond Books, an established local bookstore, into an online space.
Roles: Research, UX Design, UI Design, Branding
Industry: Retail
Platforms: Web, iOS
Tools: Figma, Maze
Walden Pond Books is an independent bookstore in Oakland, CA, established in 1973. They carry a wide selection of new books, and buy and sell used books and records. They are a beloved local institution, receiving “Best Of” accolades from East Bay Express and Oakland Magazine for multiple years running.
Their existing website did not reflect their vibrant in-store culture. Its dated design suffered from a lack of usability and structure. I was tasked with updating the site to reflect modern usability and design principles.
Problem
Stakeholders desired a responsive, easy-to-use website which echoed their in-store culture and their status as a local institution. They wished to prominently feature both their Bookshop.org affiliate link, and their co-operative marketing arrangement with book publishers, in which the bookstore receives royalties for publishing reviews of new releases.
How might we incorporate Walden Pond’s in-store culture into an online space while also increasing online visibility and streams of revenue?
Challenges
Capturing the essence of a physical store in an online space is a balancing act, as users’ emotional connections with their favorite bookstore greatly impacts their continued patronage.
The existing site was coded on an outdated platform, and lacked scalability. I focused on a simplified interface allowing for scalability and accessibility, enabling other store employees to maintain and update the site as needed.
I began this project with regular input from stakeholders and developers. However, the business’ priorities shifted throughout the course of my design process, and they ultimately decided not to proceed with the revamp. I have included recommendations below which I would have presented had the project continued into a development phase.
Research
Market Research
I analyzed the websites of three other East Bay independent booksellers with Bookshop affiliations, with a specific focus on site layout and how they advertise their affiliation with Bookshop.
These stores’ minimal online presences serve mainly as an information hub for those looking to pay an in-store visit or order a book for in-store pickup.
I took more detailed notes on how Walden Pond’s affiliate partner, Bookshop.org, approaches their visual and layout inspiration.
This online bookstore donates a portion of each book sold to an independent bookstore of the shoppers’ choice. Their model of displaying book titles on “shelves”, easily curated by the individual booksellers, combined with a robust search function, gives the sense of a digital bookstore.
User Research
I conducted a series of interviews with self-described avid readers who frequented used bookstores. I targeted questions to uncover what factors influenced their loyalty to specific bookstores, and how the pandemic impacted their reading habits.
“I feel like I could really spend the whole day in a used bookstore if I wanted to.”
“I like the ‘treasure hunt’ factor of used bookstores”
“If I buy a book I want to make sure more than one person can enjoy it when I’m done.”
While users’ individual reading habits varied, all users prioritized maintaining a connection to a local business and literary community when purchasing books.
User Needs
I was able to extrapolate the following user needs based off my interviews and research:
Personal connection to title, author, or bookseller
Efficient option for pickup when unable to browse in-store or online
Ideation
Site Map
The existing site map was bloated and suffered from a lack of information hierarchy. Based on my research, I constructed a streamlined site map which emphasized generating online revenue and helping to replicate the in=store culture online.
Visual Design
Wireframe Sketches
I sketched out a set of low-fidelity wireframes to contextualize content from the site map and research. I included a series of easily modifiable “shelves” to highlight reviews.
Logo Redesign
The new site logo has a higher contrast while retaining the oak tree and oval composition present in the original. I incorporated hand-drawn elements to create a design reminiscent of a book plate.
Branding
I rebranded the entire site, including the logo, to reflected current accessibility standards, while maintaining a timeless feel befitting a historic business. I wanted the site to replicate the act of opening a crisp new book.
High Fidelity Wireframes
I applied my UI kit to the wireframes to produce my final high fidelity wireframes.
Conclusion
Summary of Findings
With an overwhelming amount of consumers shifting to online retail, a dynamic online presence has become an essential component of a small business’ survival in recent years.
Capturing the essence of a physical store in an online space is a balancing act, as users’ emotional connections with their favorite bookstore greatly impacts their continued patronage.
Next Steps
Stakeholder meeting with developer to discuss necessary modifications and web hosting platform.
Integrate social media feed on site,
Iterate on site design based on further user testing and feedback.
Madeleine Buck
© 2024
