Replike

Fixed alot of nasty bugs!

In this session I fixed a bug where the cards would pop up when hovered over but the ones on the edges of the page would get a straight edge because of the page layering. Right now they pop up without issue. And the big stuff I added:

app/hooks/useIsMobile.ts — a hook that detects touch devices via pointer: coarse media query. Any component can import it to make device-aware decisions.

app/components/BottomNav.tsx — a glass-morphism bottom tab bar with svg icons for: Home, Workout, History, Builder, Settings
Added it to AppShell.tsx so it’s on every page
It’s hidden at desktop sizes and only shows on mobile (max-width: 768px)

So basically the website understands when it is being used on mobile and changes the UI so its easier to use. This was my try at a more detailed devlog let me know if I am going in the right direction! :D

Made it so that the repetition counter is in the camera section , so you can both see yourself and the repetition counter at the same time! And I heard that some people, when voting, have difficulty seeing the AI use section, so I’m going to be giving a copy of how I used AI in this project down below»

                                                            How I used AI:

I was responsible for the core concept, feature set, and overall UI/UX design of this project. I defined how the app should work, what problems it solves, and how users interact with it.
I used AI tools to assist with implementing parts of the code, since I am still developing my programming skills. However, this was not a one-shot generation process — I iterated extensively on the outputs by refining prompts, modifying logic, fixing issues, and testing each feature to make sure it behaved as intended.
I made decisions about how the system should function, how features should be structured, and how the user experience should feel. I also tested the application myself, debugged problems, and handled deployment.
Throughout the project, I focused on understanding the code and how each part works rather than blindly using generated output. AI was used as a tool to support development, while the direction, design, and iteration process were driven by me.

I changed the feel and design of the website a lot because I got some feedback that said the website was generic and honestly looked AI-generated. I looked for a more warm option, and I am so grateful for all that feedback because I think these new changes significantly improved the website. Special thanks to everyone that gave feedback, THANK YOU!!!!

I changed the color palette and a few design elements to be more warm and alive, I added a orange glow to the bottom of the pages, I made it so that the glow didnt interfere with the camera and I made sure the changes work in Dark and Light modes!

In this session I; Added Light/Dark theme, Added a lovely loading animation for when the model is being started (it is a limb with joints moving up and down, great for the projects core idea), There was also a bug where the animation would get stuck and I thankfully fixed that as well, I also made the resume button appear as “Start Workout” at the beginning (before I changed it it said resume even before any exercise was started.), I removed the Lifestyle logging (sleep time and hydration) as it was really unnecessary and a pain to keep track of, I rewrote parts of the about page because I wanted to answer some questions from testers about privacy and how the camera is used (if you are curious you can check the page), I fixed a bug where the background gradient would make this weird line in the background,

In this session I; added a new page for trends which lets you log your sleep hours and hydration levels,
added a string of text that scrolls of to the side and out of view that lists the exercises you can accurately count using Replike and I also changed some text in the about page. Cant wait for your feedback!

This is the first update to this project, so here is what I did:
I got the idea of counting repetitions when I was actually exercising. I was very annoyed on both focusing on the quality of my exercises and trying to keep up with the count, so I made this. In this update, I created the web app, the user interface, the design, and also created pose detection logic that allows you to, with your phone or laptop’s camera, in real time detect your exercise repetitions.