Peabody
a mobile-first SaaS storefront for Prismatext
Background
Prior to the launch of the SaaS business model, Prismatext was an e-commerce bookstore hosted on Shopify. While Shopify was a fantastic solution early on, we quickly came up against its limitations—namely, the checkout workflow was a "black box" to the store owners. We needed a way to tie together the storefront and mobile app experiences, while being able to have finer control over the entire customer journey.
Less is more. Here, we rely heavily on the typed animation of the highlighted words to alternate between languages.
Process
Thankfully, having an existing storefront that we were more-or-less satisfied with gave us a significant head start when creating the wireframes for the self-hosted storefront. However, we had to be careful not to miss some critical details, so everything was re-worked from a mobile-first approach.
A mobile-first approach to the storefront ensured that the most important content was front-and-center, regardless of device.
Each book detail page has rich information about the book, the available language variants, and similar titles.
One of my favorite visual cues was the skewed buttons/containers peppered throughout the interface
We constantly referred back to the phrase 'get out of the way' when designing the UI, as we didn't want to present any obstructions to the user browsing for books.
Takeaway
Since we were transitioning to a SaaS model, we had to re-work how the users interacted with the credits they received with their subscription. With the checkout process completely decoupled from the credit redemption, we successfully reduced user friction of adding books to their bookshelf.
Peabody was my first deep dive of the Svelte/SvelteKit ecosystem. I was impressed that Svelte didn't lock the developer into weird abstractions and syntax unique to the framework—something I'd struggled with in React and Vue. It was also a great way to exercise integrating all of the disparate APIs that underpin the platform. Svelte is the opposite of verbose, and it's a joy to write in. I find myself reaching for it more and more in both work and personal projects.