Integrating Mobile and Web for an optimal UX
.webp)
About this project
obé Fitness reached out to Imaginary Cloud to improve their user experience, optimise internal processes, and reduce technical debt accumulated over time. We delivered it through our Agile development process.
Result: A more efficient, intuitive application, achieved by redesigning the home screen for a user-centric experience, refactoring code to reduce technical debt, and optimising internal processes for greater stability.
our INVOLVEMENT
Development
technologies
React
Next.js
Typescript
Ruby on Rails
Directus
GitHub Actions
obé Fitness is a digital fitness platform that offers engaging and accessible workouts for all fitness levels. With over 10,000 on-demand classes across 20+ workout categories—ranging from strength and HIIT to yoga and dance—users can find workouts that suit their preferences.
The platform provides personalised fitness plans based on individual goals, which auto-update in the "Schedule" tab for a structured yet flexible workout experience. It is accessible via web browsers and iOS/Android apps, supporting streaming to Apple TV or Chromecast and offering offline downloads.obé also integrates health tracking features, including Apple Health and cycle-based workout recommendations, to provide insights into cardiovascular health, activity levels, and body composition. These tools help users track progress holistically and optimise their fitness journey.
.webp)
Imaginary Cloud played a key role in enhancing obé Fitness's digital platforms by providing technical expertise and development support. The team's main responsibilities included:
- Providing feedback on software architecture decisions and contributing to strategic planning.
- Developing new features while adhering to best coding practices to ensure maintainability and scalability.
- Refactoring code and conducting thorough code reviews to improve overall code quality.
- Identifying and addressing technical debt to enhance system performance and long-term sustainability.
By focusing on these areas, the team helped optimise the platform’s efficiency, stability, and user experience.
NEW PROJECT IN MIND? LET'S TALKduring the project
The client was already using the Agile Development Process, consisting of two weeks sprints.
Three stages
Analysis
Execution
MVP Launch
two stages
Migration
Development
four stages
Research
Ideation
Execution
Technical Assessment
four stages
Requirements
Back-end integration
Website development
Advanced filtering and search
four stages
Research
Ideation
Execution
Technical Assessment
four stages
Backlog
Bootstrap
Wave 0
Wave N
four stages
Research
Ideation
Execution
Launch & Handover
two processes
MVP
ADP
Four stages
Scope meeting
Code review
Test review
Quality review
Assessment
Four stages
Backlog
Bootstrap
Wave 0
Wave N
during the project
The client was already using the Agile Development Process, consisting of two weeks sprints.
TECHNOLOGIES used
Used to develop the mobile app, enabling cross-platform development for iOS and Android.
Used as the framework to build the web application, providing server-side rendering, routing, and overall structure.
Used for adding type definitions to JavaScript, ensuring type safety and improving development efficiency.
Used as the web application framework to build the API that powers both the mobile and web applications.
Used as a headless CMS (Content Management System) to manage and serve content, including courses and media.
Used for automating the CI/CD pipeline, ensuring smooth and automated deployment.
We adopted the Managed Teams model, integrating Mobile, Backend, and Frontend developers to enhance obé Fitness's platform across multiple areas.
Mobile Developers: Developed the app with React Native and TypeScript, using Redux for state management and JWPlayer for video streaming. Integrated Chromecast, Apple TV, and HealthKit, with testing via Jest and CI/CD automation using Fastlane & Bitrise.
Backend Developers: Built the Ruby on Rails API, with PostgreSQL for data storage and Redis for caching. Managed payments via Stripe and App Store/Play Store, using Directus CMS, New Relic, and Sentry for monitoring, with CI/CD via GitHub Actions and hosting on Heroku.
Frontend Developers: Developed the web platform with Next.js, styled with Tailwind CSS, and added animations with React Spring. Integrated Vimeo Player, used SWR for data fetching, and enabled A/B testing with Segment & SplitIO, hosted on Vercel.
This project delivered an in-depth understanding of the customer persona and their interaction with the service.
User-Centric Home Screen: Redesigned the home screen to be cleaner and more intuitive, focusing on user needs rather than a class-based structure.
Refactoring and Technical Debt Reduction: Improved code to enhance efficiency and simplify future maintenance.
Increased Development Efficiency: Delivered more story points per sprint, with an improved completion ratio, boosting overall productivity.
Improved User Experience: Simplified the login/signup process by integrating Google and Apple authentication, reducing friction and improving accessibility.
