Wallet

April 2024

A little experiment using framer motion to recreate the subtle animations used in Apple's wallet app. In order to achieve the subtle blur animation between the two states of the header, I absolutely positioned the contents such that they were exactly on top of one another, and conditionally showed each one depending on whether the transaction view was open or not. When the blur effect is applied to the transition, it will feel like the text/buttons are morphing into each other. Click the front card in the stack to give it a try!