Tình cờ lướt Twitter thì mình thấy được một ảnh gif khá hay, các bạn có thể xem ngay bên dưới:
Như các bạn có thể thấy thì đó là một login form sử dụng các animation để tạo hiệu ứng focus vào những gì người dùng đang thao tác trên form. Trông khá là thú vị phải không.
Form sử dụng SVG animated để tạo các hiệu ứng chuyển động, với sự trợ giúp của một vài trigonometry & GSAP. Việc tạo nên nó phức tạp nên mình sẽ chia sẻ source code ở cuối bài viết. Chứ không hướng dẫn tạo trong bài viết này.
Nguồn: 𝖛𝖆𝖑𝖊𝖓𝖙𝖎𝖓𝖆 ✣ 𝖑𝖔𝖗𝖉 ‘s tweet.
Link demo và download tại đây:
Trong trường hợp link trên không hoạt động, các bạn có thể tải tại đây: animated-svg-avatar-v2-full.zip