Back to projects
edgefit-workout-builder-timer-tracker

EdgeFit - Workout App

I was frustrated by the lack of certain features in existing workout apps, to address the needs of intermediate and advanced lifters I started building EDGEFIT. This blog post details its first version, highlighting its features, UI/UX design, and hinting at its future plans (can’t reveal much tho 🤫).

Here’s an overview of the first version of EdgeFit:

TOC

Architecture & Tech Overview

The current system is pretty straightforward so no need for a diagram or anything of that sort. Is a direct connection between the client and Supabase which takes practically the whole of the backend load.

Backend: Supabase

  • User authentication.
  • Data Retrieval:
    • The app retrieves data directly from Supabase, enabling seamless and real-time updates.
  • Access Control Policies:
    • PostgreSQL enforces Row Level Security (RLS) policies. The ones I created ensure that users can only perform CRUD operations on their own data.
  • Database Management (PostgreSQL)

Frontend: Client-Side Operations

  • Framework:
    • Vue 3 with Quasar: Rich set of components for fast development & multiplatform deployment from a single codebase (has its tradeoffs of course).
  • State Management: Pinia
  • Routing: Simply the Vue Router
  • Internationalization: For multi-language support (althou barely implemented).
  • Direct queries from the client to Supabase:. A simple yet good enough method for this type of app.

Workouts List

listing

Today’s Workout (Yet To Implement)

  • Users will be able to view their programmed workout for the day of the week.

Personal Routines List

  • Dynamic Routines List: Displays all user-created workouts with brief descriptions for easy recall & quick actions for starting, editing or deleting a routine.
  • Filtering Options: Includes:
    • Search filter for routine names
    • Multi-select filter for muscle groups, such as Chest, Shoulders, Arms, Back, Abs, and Legs.

Creating Custom Workouts

creator

Routine Name, Tags, and Layout

  • Routine Name & Tags: Users can name their routines and assign tags for better organization.
  • Structured Layout: A table layout helps users build detailed routines, including exercise type, name, reps, weight, duration, and comments.

Dynamic Row Management & Description Area

  • Row Management: Users can add/delete rows above/below the selected row.
  • Description Area: A space at the bottom for documenting thoughts, goals, or instructions.

Exercise Categorization & Audio Notifications

  • Categorization: Exercises can be classified as Warm Up, Work, Rest, Stretch, and more.
  • Audio Cues: Unique sounds for each category help signal transitions between exercises.

The Workout Experience

session

Progress Tracking & Interaction

  • Progress Indicator & Timer: Helps manage pacing.
  • Navigation & Hold Functions: Easily move between exercises or pause as needed.
  • Comments Section: Recall previous notes to personalize and reflect on sessions.
  • Audio Controls: Ensure clear cues without distractions.

Real-Time Customization

  • Current Workout Display: Users see their workout status and can make live edits.
  • Adaptability: This feature allows for on-the-fly adjustments to ensure an effective session (though it still needs a few tweaks for smoother operation).

Settings Section

settings

Theme & Unit of Mass Switch

  • Theme Switch: Toggle between light and dark mode (planning on adding more “themes”, not just color related).
  • Unit of Mass: kG/LB, pretty important for calculations.

User Information & Data Management

  • User Info Display: Email and last login information for security.
  • Data Management: import/export data & track it for efficient data handling (Yet To Implement).

Conclusion

The process of exploring and experimenting with the app has clarified my vision for its future. Many planned features will transform the current system, requiring a fresh build… But this initial version has already offered valuable insights and established a strong foundation for upcoming developments. Stay tuned for updates as I refine and expand EdgeFit to better serve dedicated fitness enthusiasts!

Back to projects