Learn how to design a parallax website for headphones using Adobe XD in this 27-minute tutorial. Explore character styles, panel editing, and parallax animation techniques. Master the Photosplash 2 plugin, create and duplicate components, apply 3D rotation, and prototype engaging animations. Follow along with the provided starter file to complete the XD Daily Creative Challenge and enhance your web design skills.
Designing a Parallax Website Landing Page in Adobe XD - Daily Creative Challenge
Overview
Syllabus
Join your host every afternoon at pm PT to learn how to approach each challenge using Adobe XD. Complete 9 challenges by Friday, June 4th and you’ll be on your way to sharpening your skills. Get your questions answered, see what the community is creating and get feedback on your work - see you there!
Start
Introduction and today’s challenge
Design overview
Adding character styles
Editing the first panel
Parallax overview
Math in XD
Designing the other panels
Photosplash 2 plugin
Creating and duplicating components
Creating a parallax animation
3D rotation
Prototyping the animation
Finished animation
Taught by
Adobe Creative Cloud
Related Courses
-
XD Daily Creative Challenge - Designing a Social Media Navigation Bar
-
Adobe XD Crash Course - Design a Real Layout
-
Adobe XD Masterclass: Tips and Tricks for Improved Design Workflows - Episode 33
-
Photoshop Daily Creative Challenge - Photo Polishing
-
Credit Card Payment Screen Design with 3D Transforms and Auto-Animate - XD Daily Creative Challenge
-
Designing an Online History Class Portal with Drag and Drop - XD Daily Creative Challenge
