Framer Development
Production-ready Framer builds with CMS structure, reusable components, and polished interactions.
About the Projects
San Francisco-based company SpaceBooks operates as a SaaS platform that provides accounting software to small and medium-sized businesses. SpaceBooks has built a comprehensive solution with invoicing and time tracking, as well as financial dashboards and tax summaries, through its components.
Users were abandoning the system, while most customers failed to progress beyond their initial visit. SpaceBooks needed only cosmetic changes because their team needed an update that would strengthen user engagement, simplify platform navigation, and increase the platform’s overall credibility.
The Problem
Spacebook's site was losing users fast. New users struggled to know where to begin. The UI looked overwhelming, and lots of them gave up on easy tasks. Even return customers didn't return after a first visit, and support tickets kept increasing.
60% user drop-off after first use
Poor navigation frustrated users
Customers couldn’t find key features
Untold support teams face overwhelming usability complaints from users.
The Solutions
Spacebook's site was losing users fast. New users struggled to know where to begin. The UI looked overwhelming, and lots of them gave up on easy tasks. Even return customers didn't return after a first visit, and support tickets kept increasing.
60% user drop-off after first use
Poor navigation frustrated users
Customers couldn’t find key features
Untold support teams face overwhelming usability complaints from users.
Design System
We developed a comprehensive style guide for Boon, emphasizing a vibrant and engaging visual approach. Green was selected as the primary color due to its strong associations with growth, success, and reliability.
Design Process
Our Spacebook design process follows a Lean UX methodology consisting of four distinct steps. The methodology provides business-oriented steps supported by the principles of transparency and the requirements of both velocity and scalability.
UX Research & Design Artifacts
Understanding what customers required was our first step, which we achieved through in-depth research. We observed how real users behaved across different product pages and tasks. The goal was to identify friction points and turn them into opportunities for clarity, speed, and elegance.
We learned that people who buy online mainly focus on ease, inspiration and trust instead of just the clothing itself. Because of this, we updated important flows to suit that demand. Every choice in the design was focused on clear navigation, reactive responses and a superior feel.
69% of people said that the old layout was hard to navigate since there was no clear way to direct them.
54% did not get vital feedback after adding something to their cart or buying it.
47% felt the overall look didn’t reflect the high-end brand image they expected.
Over 75% requested clearer step-by-step paths when navigating between categories and products.
More than 60% struggled to locate the right feature or product on their first visit.
Above 40% found the UI visually distracting and cluttered, making them hesitant to continue.
Wireframe Concept & Strucher
Clarity, speed, and user confidence were prioritized in the previous UX design. We created an intuitive dashboard that provides real-time financial insights, total transaction amounts, invoicing information, and time tracking, all in one place. Simple status indicators, intuitive data visualizations, and bold fonts (Inter Font) ensure usability on any device.
Final UI/UX Design
Clarity, speed, and user confidence were prioritized in the previous UX design. We created an intuitive dashboard that provides real-time financial insights, total transaction amounts, invoicing information, and time tracking, all in one place. Simple status indicators, intuitive data visualizations, and bold fonts (Inter Font) ensure usability on any device.
Mobile and desktop layouts were combined into a responsive design with consistent styling. Every step, from invoice creation to analysis, was optimized for fast decision-making. Spaced typography, icons, and guided interactions reduced unnecessary stress for finance teams. The result? A clear, assured interface designed to empower users without confusion or complexity.
