A Deep Dive into the 'Automate Your Gains' Workout App UI & Features

![[IMG-Series - Automate Your Gains-20250628140935549.png|500]] --- While the 6-part ( [[Automate Your Gains, Part 1 - Plan a Custom Workout App with Google Sheets|1]], [[Automate Your Gains, Part 2 - Build a Workout App UI with Apps Script|2]], [[Automate Your Gains, Part 3 - Save Form Data to Google Sheets with Apps Script|3]], [[Automate Your Gains, Part 4 - Read & Display Data from Google Sheets in Your App|4]], [[Automate Your Gains, Part 5 - Code Smart Automation for Your Fitness App|5]], [[Automate Your Gains, Part 6 - When to Scale Your Google Apps Script Project|6]] ) tutorial series dives deep into _how_ to build an automated workout logger, this post focuses on the _what_—what is it actually like to use this application. This article will provide a detailed tour of the user interface and the key features that make it a unique tool for strength training. --- ### **The Main Dashboard: Workout Selection and Planning** After opening the web app, the user is presented with a interface designed for quick interaction in the gym. #### **1. Dynamic Workout Template System** The user journey begins by selecting a predefined "Workout Plan" from a dropdown menu. These are not static lists; they are dynamic templates that are configured in the backend Google Sheet, allowing for complete personalization of your routines (e.g., "Full Body A," "Push Day"). The loading screen is my favorite part. ![[IMG-A Deep Dive into the 'Automate Your Gains' Workout App UI & Features-20250627175528274.gif|300]] #### **2. The Dynamic Plan Summary** Once a plan is selected, the appgenerates and displays a summary of the entire workout for the day. This includes the exact sets, reps, and the **calculated weights** prescribed for the current session. This summary is dynamically generated based on past performance and the progression model assigned to each exercise. Any exercises already logged for the day are visually marked with a checkmark, so you can see your progress at a glance. ![[IMG-A Deep Dive into the 'Automate Your Gains' Workout App UI & Features-20250627175528431.gif|300]] --- ### **The Core Workflow: Logging an Exercise** After reviewing the plan, you select an individual exercise from the second dropdown to begin logging. This is where the app's intelligence really shines. #### **1. Context is King: "Last Workout Recall"** Immediately after selecting an exercise, a blue "toast" message appears. This message displays the details from the _last time_ the exercise was performed within the workout current plan, including the sets, reps, weight, RPE, and any notes that were taken. ![[IMG-A Deep Dive into the 'Automate Your Gains' Workout App UI & Features-20250627175528572.png|400]] #### **2. A Pre-filled, Intelligent Form** The logging form is designed for speed. It pre-fills with the planned sets, reps, and weight for the current session. The Rate of Perceived Exertion (RPE) field defaults to 8, a common target for working sets, to save you a tap. ![[IMG-A Deep Dive into the 'Automate Your Gains' Workout App UI & Features-20250627175528747.png|400]] Simply adjust the numbers to reflect your actual performance and add any notes. The form also has a dedicated field for "As Many Reps As Possible" (AMRAP) sets, a key component of the progression logic. ![[IMG-A Deep Dive into the 'Automate Your Gains' Workout App UI & Features-20250627175528890.png|400]] #### **3. Submission and Instant Feedback** Clicking the "Submit Exercise" button will show a clear UI with animated feedback. The button's icon changes from a blue paper plane to a green loading spinner, letting you know your data is being saved. ![[IMG-A Deep Dive into the 'Automate Your Gains' Workout App UI & Features-20250627175529022.gif|300]] Once the backend confirms the save, the button's icon changes to a success checkmark. Simultaneously, the workout summary list updates to visually mark the exercise as complete. ![[IMG-A Deep Dive into the 'Automate Your Gains' Workout App UI & Features-20250627175529249.png|400]] Behind the scenes, the app is not only saving your log but also evaluating your logged RPE to determine if your prescribed weights should increase for your next session, truly automating your progressive overload. ### **Conclusion: A Simple UI and Powerful Features** This tour highlights how a user interface, built with tools like Bootstrap and powered by Google Apps Script, can deliver a effective and personalized user experience. --- ## Resources You can find the completed code for the entire project, including all features and documentation, on GitHub. - **[View Project on GitHub](https://github.com/drusho/workout-logger-google-apps-script)** - **[Try the Live Web App Demo](https://script.google.com/macros/s/AKfycbwiQyKHvKap9oiKqSpAhFdbq9xH36wOZCr0a6QRZEgSL0ErCWXhaUoVAIPcqD1zM_2I/exec)** Check out the other articles from **Automate Your Gains** series: %% DATAVIEW_PUBLISH_CONVERT start ```dataview LIST WITHOUT ID "**" + file.link + "** " + description + "" FROM "07 - Publish - Obsidian" WHERE publish = true AND file.name != "About Me" AND file.name != "Home" AND file.name != "Series - Automate Your Gains" AND series = "Automate Your Gains" SORT title DESC, published ``` %% - **[[07 - Publish - Obsidian/Articles/Automate Your Gains, Part 6 - When to Scale Your Google Apps Script Project.md|Automate Your Gains, Part 6 - When to Scale Your Google Apps Script Project]]** A complete review of the workout app project. Covers the pros and cons of using Google Sheets as a database, ideas for future features, and how to know when it's time to migrate. - **[[07 - Publish - Obsidian/Articles/Automate Your Gains, Part 5 - Code Smart Automation for Your Fitness App.md|Automate Your Gains, Part 5 - Code Smart Automation for Your Fitness App]]** Elevate the app from a simple logger to a smart training partner. Code automation logic that analyzes user performance (RPE) to recommend workout progressions. - **[[07 - Publish - Obsidian/Articles/Automate Your Gains, Part 4 - Read & Display Data from Google Sheets in Your App.md|Automate Your Gains, Part 4 - Read & Display Data from Google Sheets in Your App]]** Close the data loop for the workout app. Fetch, filter, and sort data from a Google Sheet backend and display it dynamically into web app's UI for a richer user experience. - **[[07 - Publish - Obsidian/Articles/Automate Your Gains, Part 3 - Save Form Data to Google Sheets with Apps Script.md|Automate Your Gains, Part 3 - Save Form Data to Google Sheets with Apps Script]]** Connect front-end to your back-end. This guide covers using google.script.run to capture HTML form data and save it directly to Google Sheets, creating a complete "write path." - **[[07 - Publish - Obsidian/Articles/Automate Your Gains, Part 2 - Build a Workout App UI with Apps Script.md|Automate Your Gains, Part 2 - Build a Workout App UI with Apps Script]]** Turn a Google Sheet into a database and build a mobile-friendly UI with Google Apps Script. A step-by-step guide to creating the foundation for the workout logger. - **[[07 - Publish - Obsidian/Articles/Automate Your Gains, Part 1 - Plan a Custom Workout App with Google Sheets.md|Automate Your Gains, Part 1 - Plan a Custom Workout App with Google Sheets]]** A fitness app project that shows how to plan a smart workout logger using Google Apps Script and Google Sheets to automate your training. - **[[07 - Publish - Obsidian/Articles/A Deep Dive into the 'Automate Your Gains' Workout App UI & Features.md|A Deep Dive into the 'Automate Your Gains' Workout App UI & Features]]** Take a tour of a custom workout logger built with Google Apps Script. See its mobile-friendly UI, dynamic workout planning, "last workout recall," and automated progression features in action. %% DATAVIEW_PUBLISH_CONVERT end %%