Jayzhushi.com
I recently redesigned my personal website. With the support of Framer Motion, the new site now has more subtle animations and interactions. You can switch between different layouts, enable sounds, and enjoy a variety of scroll-triggered effects.
Compared to most web designs, the jayzhushi.com homepage uses horizontal scrolling by default. It's a unique experience on touchpad and touchscreen devices. I also added an extra switch to allow horizontal scrolling to be controlled with the mouse wheel (Setting - Control with wheel) to account for traditional conventions.
Open the Settings panel and you can watch the animation of the background moving away from the focus. In the settings you can enable sounds, which will add trigger sounds to most of the buttons and cards.
Once Docker is enabled, you can quickly navigate to projects and articles, going to the front or the end. This component is inspired by the Finder and Dock, commonly found on macOS.
On the About page, you can see that there is a statement about me with a scroll-triggered animation effect.
All icons feature magnetic effects with intuitive clicks, and in some of them special icon animations can be seen. The design of the icon animation is based on Hugeicons.
jayzhushi.com is a project that I will keep updating in the future, you are welcome to keep following it and I welcome any suggestions.
Thank you for watching.😀