I specialize in ambiguous problems, highly crafted UI and dynamic interactions.
Los Angeles, California
I’ve designed and shipped mobile and web products from 0-1, built and led cross-functional teams, and utilized design to achieve high-level objectives and create measurable impact.
My work has been dedicated to transforming ambiguous problems into elegantly designed user interfaces that are simple and user-friendly. I'm obsessed with the details.
Graduated Art Center College of Design with Honors. Passionate about digital products from a young age, I started coding and designing at age 10. At 14, I was invited to Microsoft’s campus for my work exploring web-based animation.
Dynamic Cursor Tracking
November 2, 2023
With this concept I set out to create a hover state that follows the user's cursor. This is not natively offered in Framer, so I had to find a custom way to create it.
Below is a live demo you can interact with to get a feel for it:
![](https://framerusercontent.com/images/91cCQPBuABfQRb1cehZ0BXnzacs.jpg?scale-down-to=512)
Hi, I'm Jamie
There's no easy way around it– as you probably guessed there are multiple hover states for each button.
The hover areas are highlighted green in the example below. There's 9 total hover areas:
![](https://framerusercontent.com/images/dP77qDgrsXQb8bgrETZQYSiE6o.png)
After that you just need to duplicate the variant 9x times and connect them. Since there's 9 hover areas, each variant will have 9 connections like you can see in the default variant below:
![](https://framerusercontent.com/images/TY59Q6cBAPt7EVNelM6LDlgwPpk.png)
Once you've done the hard work once, you can duplicate the component and create additional versions. Here's an example of a button with multiple component properties:
![](https://framerusercontent.com/images/DbjCWPazUZlYOLFFuaRFw9gt8w.png)
As you can see, Framer is really an amazing tool for building dynamic interactions like this without any code.
Dynamic Cursor Tracking
November 2, 2023
With this concept I set out to create a hover state that follows the user's cursor. This is not natively offered in Framer, so I had to find a custom way to create it.
Below is a live demo you can interact with to get a feel for it:
![](https://framerusercontent.com/images/91cCQPBuABfQRb1cehZ0BXnzacs.jpg?scale-down-to=512)
Hi, I'm Jamie
There's no easy way around it– as you probably guessed there are multiple hover states for each button.
The hover areas are highlighted green in the example below. There's 9 total hover areas:
![](https://framerusercontent.com/images/dP77qDgrsXQb8bgrETZQYSiE6o.png)
After that you just need to duplicate the variant 9x times and connect them. Since there's 9 hover areas, each variant will have 9 connections like you can see in the default variant below:
![](https://framerusercontent.com/images/TY59Q6cBAPt7EVNelM6LDlgwPpk.png)
Once you've done the hard work once, you can duplicate the component and create additional versions. Here's an example of a button with multiple component properties:
![](https://framerusercontent.com/images/DbjCWPazUZlYOLFFuaRFw9gt8w.png)
As you can see, Framer is really an amazing tool for building dynamic interactions like this without any code.
Dynamic Cursor Tracking
November 2, 2023
With this concept I set out to create a hover state that follows the user's cursor. This is not natively offered in Framer, so I had to find a custom way to create it.
Below is a live demo you can interact with to get a feel for it:
![](https://framerusercontent.com/images/91cCQPBuABfQRb1cehZ0BXnzacs.jpg?scale-down-to=512)
Hi, I'm Jamie
There's no easy way around it– as you probably guessed there are multiple hover states for each button.
The hover areas are highlighted green in the example below. There's 9 total hover areas:
![](https://framerusercontent.com/images/dP77qDgrsXQb8bgrETZQYSiE6o.png)
After that you just need to duplicate the variant 9x times and connect them. Since there's 9 hover areas, each variant will have 9 connections like you can see in the default variant below:
![](https://framerusercontent.com/images/TY59Q6cBAPt7EVNelM6LDlgwPpk.png)
Once you've done the hard work once, you can duplicate the component and create additional versions. Here's an example of a button with multiple component properties:
![](https://framerusercontent.com/images/DbjCWPazUZlYOLFFuaRFw9gt8w.png)
As you can see, Framer is really an amazing tool for building dynamic interactions like this without any code.