This is a submission for the GitHub Finish-Up-A-Thon Challenge
What I Built
LifeSquares is a reflective web application that visualizes a person's life as a grid of weeks. Each square represents a single week, turning the abstract concept of time into something tangible and easier to understand.
The project was inspired by the idea that life is finite and that seeing time visually can encourage more intentional living. Rather than focusing on productivity or achievement, LifeSquares is designed as a personal reflection tool that helps users think about their past, present, and future.
Key features include:
- Interactive life grid where every week is represented as a square
- Birthdate-based calculations for weeks lived and weeks remaining
- Adjustable lifespan projections
- Life phase visualization using color-coded stages
- Weekly journaling and reflection entries
- Life statistics and summary metrics
- Responsive and accessible interface
- Light and dark theme support
- Local storage persistence
Live Demo: https://lifesquares.vercel.app/
Source Code: https://github.com/zennmarieee/LifeSquares
Demo
Video Walkthrough
Demo: https://www.youtube.com/watch?v=frlmt0q53Pw
The walkthrough demonstrates:
- Creating a life grid from a birthdate
- Exploring life statistics
- Switching lifespan projections
- Writing journal entries
- Theme switching and persistence
Screenshots
Before
After
The Comeback Story
LifeSquares started as an experiment inspired by the popular "life in weeks" concept. The initial version successfully displayed a life grid, but it felt more like a visualization than a complete product.
Before participating in the Finish-Up-A-Thon, LifeSquares could display a life grid and calculate weeks lived, but it lacked journaling, life statistics, theme support, local persistence, and many of the features needed to make it useful beyond a simple visualization.
During the challenge, I focused on transforming it from a simple concept into a more complete experience by:
- Adding weekly journaling functionality
- Building life summaries and statistics dashboards
- Creating lifespan customization options
- Improving accessibility and keyboard navigation
- Implementing light and dark themes
- Adding local persistence so data survives page refreshes
- Improving the overall UI and responsiveness
- Preparing the application for deployment and public use
The biggest improvement was shifting the project from merely showing time to helping users reflect on how they spend it.
My Experience with GitHub Copilot
GitHub Copilot acted as a development partner throughout the project.
I used Copilot to:
- Accelerate React component development
- Generate repetitive UI boilerplate
- Refactor existing code
- Improve accessibility implementations
- Explore alternative approaches for state management
- Speed up debugging and iteration
Rather than replacing my decision-making, Copilot helped reduce development friction and allowed me to focus more on product design, user experience, and feature refinement.
The Finish-Up-A-Thon provided the perfect motivation to revisit an unfinished idea and turn it into something I was excited to share publicly.
What's Next
Future plans for LifeSquares include:
- Data export and backup options
- Richer journaling experiences
- Goal and milestone tracking
- Calendar integrations
- Additional visualization modes
- Optional cloud synchronization
LifeSquares reminded me that unfinished projects still have potential—it just takes the decision to come back and finish them.
Top comments (0)