Inspiration

Many people want to stay active at home but find it difficult to maintain a consistent workout routine. We wanted to make home fitness more accessible and engaging by transforming the television into a personal fitness space. This inspired us to build FitScreen — Smart TV Fitness Coach, an application designed around a large-screen experience and simple remote-control navigation.

What it does

FitScreen helps users follow guided home workouts through an intuitive, TV-friendly interface. It offers four workout categories: cardio, strength, yoga, and stretching.

Key features include:

  • Guided exercises with instructions and recommended durations.
  • Start, pause, previous, and next controls for workout sessions.
  • Countdown timers for individual exercises.
  • Keyboard navigation designed to support Smart TV remotes.
  • A progress dashboard showing completed sessions, planned workout minutes, and weekly activity.
  • Local storage to retain workout history between visits.

How we built it

We built FitScreen using React, Vite, JavaScript, and CSS. React manages the application's screens, workout state, exercise navigation, and countdown timer. CSS provides the visual design, responsive layouts, and focus indicators for keyboard and remote navigation. Browser local storage preserves completed workout records so users can revisit their fitness progress.

We structured the application around the home screen, active workout screen, completion screen, and progress dashboard to create a connected workout experience.

Challenges we ran into

One of our main challenges was designing navigation that works well without a mouse. Smart TV users often rely on directional buttons and an Enter or OK button, so we needed to manage keyboard focus carefully across workout cards, categories, and controls.

We also worked on coordinating the exercise timer with pause and resume actions, resetting durations when changing exercises, and retaining workout history without requiring a backend database.

Accomplishments that we're proud of

We are proud to have built a functional fitness application with a dedicated large-screen interface and remote-friendly navigation. FitScreen brings multiple workout types, guided exercise instructions, countdown timing, and progress tracking into one experience.

We also implemented persistent workout history and a progress dashboard, helping the application feel more complete than a simple collection of workout cards.

What we learned

We learned how to manage application state across multiple screens, implement timed interactions with React hooks, and persist user activity using local storage. We also gained practical experience with keyboard event handling, focus management, responsive CSS, and designing interfaces for users who navigate with a remote rather than a mouse.

This project helped us understand that building for a Smart TV requires more than making a website larger: navigation, readability, focus visibility, and interaction simplicity are essential.

What's next for FitScreen — Smart TV Fitness Coach

Our next goal is to make FitScreen a more complete and accessible home fitness companion. Planned improvements include:

  • A polished circular countdown timer and clearer exercise-by-exercise progress indicators.
  • More workout routines, difficulty levels, and customizable session durations.
  • Improved accessibility, including larger text and clearer visual focus states.
  • A live, publicly accessible deployment for judges and users to try.
  • Optional voice guidance, workout reminders, and richer progress analytics.

Our vision is to make everyday fitness more convenient by turning the living room television into an engaging, easy-to-use workout companion.

Built With

Share this project:

Updates

Submission history