GIOVANNI’S ROOM / PHILADELPHIA
A home for stories.
A place to belong.
An expressive bookstore website and a collection-led online shop, connected by one unmistakable community identity.
01 / WEBSITE SHOWCASE
BOOKS & BELONGING
● ● ● queerbooks.com
THE COMMUNITY WEBSITE
● ● ● shop.queerbooks.com
THE SHOPIFY STOREFRONT
Two complete homepage views from the supplied project assets. Select either image to inspect the original.
THE ONLINE BOOKSTORE / SHOPIFY
The bookstore.
Beyond the block.
Giovanni’s Room also has a dedicated e-commerce store at shop.queerbooks.com. Readers can explore new releases, in-store bestsellers, themed collections, and Giovanni’s Room merchandise.
The community website and online store serve different needs while sharing the same literary identity. Explore the storefront or see the separate e-commerce case study.
THE ONLINE STORE / FULL HOMEPAGE
Supplied store homepage. Select the screenshot to inspect the full image.
02 / THE CHALLENGE
More than
a bookshop.
Honor the personality.
Make room for queer literature, the bookstore’s history, and community programming without losing the warmth of an independent bookseller.
Make the next step clear.
Help visitors move naturally from a recommendation or book-club feature to an event, a store visit, or the separate online shop.
03 / PLANNING & UX
From the page
to the shelf.
The supplied wireframe makes space for editorial features, book-club information, collections, and events. The planning concept below follows the same priorities into online shopping.
CONTENT SKETCH / RECONSTRUCTED
Stories → Community
Collections → Events
A simple content hierarchy keeps discovery and participation visible.
01 / DISCOVER
Curated collections
Start with a theme, a new release, a staff recommendation, or the store’s merchandise.
02 / CONSIDER
A clear product story
Keep the cover, title, author, price, and next action easy to scan.
03 / CONTINUE
From interest to purchase
Maintain a recognizable handoff from the community website to the Shopify shopping experience.
RESPONSIVE CONCEPT
Desktop: room for layered editorial features and collection rows.
Mobile: a single reading order, followed by clear routes to books, events, and shopping.
SUPPLIED WIREFRAME / MAY 8
Original planning asset supplied by RUBI Digital.
04 / VISUAL IDENTITY
Literary.
Lively. Human.
Aa
Literary serif headlines.
Clear sans-serif navigation.
Colorful covers take center stage.
Case-study type pairing: Georgia Regular + Open Sans Regular / Semibold. Original website font families are unverified.
Teal
#008080
Paper
#EEE9C8
Blush
#FFF0F3
Ink
#172525
Teal, cream, and blush sampled from the supplied design; dark ink used for this case study. Each swatch and hex label is independently editable.
DISCOVER
05 / DELIVERABLES
A story on every screen.
01
Editorial discovery
Featured releases, staff picks, themed collections, and prominent cover imagery make browsing feel curated.
02
Community participation
Book-club features, author events, and visit information connect the digital experience to the physical bookstore.
03
E-commerce presentation
Collection-led browsing and branded merchandise give the Shopify storefront its own purpose while retaining the bookstore identity.
04
Connected content & support
Content updates, image descriptions, search presentation, and store-link review support the ongoing experience.
THE SHOPPING JOURNEY
Find a story.
Make it yours.
Genre and theme collections
New releases and bestsellers
Book covers and prices
Store merchandise
A clear route to Shopify
06 / COMPETITIVE ADVANTAGE
Independent in every sense.
A point of view
Queer and feminist literature shapes the presentation, rather than appearing as one category inside a generic store.
Community before transaction
Events, staff recommendations, and book-club content create reasons to return beyond a single purchase.
Two spaces, one identity
The website supports connection and discovery; the store supports collection browsing and shopping.