Inspiration
As someone who’s navigated the stress of building and repairing credit, I saw a gap: most people don’t understand how small financial choices impact their credit scores. I wanted to create a tool that demystifies credit – no jargon, just clear, visual feedback on everyday decisions like paying off a card or opening a new line of credit.
What it does
The CreditScore Simulator lets users input their credit score, simulate financial actions (e.g., late payments, paying loans early), and see real-time score changes. It generates personalized improvement roadmaps and compares loan costs across credit tiers, making credit health actionable and understandable.
How we built it
I started with wireframing in Figma, focusing on premium animations and intuitive UX. Using HTML/CSS (TailwindCSS) for structure/styling, JavaScript/React for interactivity, GSAP for smooth animations (3D card tilts, number morphing), and Chart.js for data visualization. Deployed on Vercel for seamless web access.
Challenges we ran into
Getting animations to run smoothly at 60fps across devices was tough – balancing visual flair (parallax, particle effects) with performance required optimizing GSAP timelines and reducing render-blocking code. Also, ensuring credit tier logic and loan APR calculations were accurate and easy to visualize.
Accomplishments that we're proud of
Creating a fully responsive tool with premium, engaging animations that don’t sacrifice performance. Users love the side-by-side score comparisons and personalized roadmaps – it’s accessible, jargon-free, and actually makes credit education enjoyable.
What we learned
I deepened my understanding of frontend performance optimization, credit scoring mechanics, and user-centric design. Animating data visualizations (like score trajectory charts) taught me to balance aesthetics with clarity, and testing across devices highlighted the importance of responsive, inclusive design.
What's next for this project
I plan to add more financial action simulations (e.g., debt consolidation), integrate localized loan rate data for different regions, and add a mobile app version. I also want to include short, interactive tutorials to further demystify credit score factors for new users.
Built With
- chart.js
- gsap
- tailwindcss
Log in or sign up for Devpost to join the conversation.