EZ Prep was looking to refresh their quiz results page and I was tasked with creating a reveal animation with input fields for quiz data and a color blend tied to the percentage of correct answers. Additionally, there’s an XP bar that fills according to a varied max XP per level and I revised the project to store max XPs, level names, and the associated medal color depending on a single level input. Other conditional cases include a percent average score change that changes color depending on positive/negative values, smaller type size for 1000+ questions/quizzes completed, and a +XX XP position change for an XP bar with minimal percent fill.

Another request was to implement a tap to speed up the animation, and instead of simply speeding up the entire animation, I wanted to retain control of the timing of some detail animations while moving the larger elements faster. To achieve this, I split the meter and bottom two boxes into separate components, data bound those playback speeds, and signaled when to begin their animations via triggers in a timeline, reducing the time between trigger signals if the screen was tapped at any point.