App UI Cleanup
by work
Software Development Journey Overview
Follow this step-by-step software development journey to see real progress updates, challenges overcome, and practical experience.
Progress Updates (9 total)
Update #1: App UI Cleanup
Why: I'm starting this thread to track UI progression of the app. It is looking quite unfortunate at this moment.
Progress: I'll be adding app bar, bottom navigation bar, theme color coordination, alignment of texts, more appropriate pictures/icons, and etc.
Completion: The app will have a subjective aesthetics score of 3.5/5 tracked with metrics.
Update #2: Add Workout Page
Changing this page w. dropdown menu and other stuff. Setting up a shell so I can start w. Firebase and other streams
Update #3: Live angle charts
Integrated live angle charts so I can tell if someone has left vs right asymmetry on the spot
Update #4: Firebase History Page
streambuilder fetches Firestore user's historic data, and displays in the blue areas
Update #5: Nice gifs and pictures
Had to do some Figma mockup for the website, which really helped me clean up the UI of the real app
Update #6: Results page clean up
Making better looking widgets
Update #7: Prioritizing Information
I got the feedback that despite all the information the app can gather, it needs a hierarchy so people see the overview and then the smaller details.
Update #8: Everything into rows now in results page
embedded pop up page and other to clean up the page, so it doesnt have a million information with no hierarchy at once
Update #9: Completed Major UI changes
lots of hand sketches and moved away from Figma. Sitting down and coding the UI changes made me realize what metrics to prioritize and how to arrange them