Parallax Slider Design: Make Your Website Come to Life

Martin Perhiniak, Design Your Career

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
14 Lessons (1h 22m)
    • 1. Introduction

    • 2. What is parallax?

    • 3. Planning the design

    • 4. Creating a panoramic photo

    • 5. Finding stock photos

    • 6. Combining images

    • 7. Adding text

    • 8. Splitting up the background image

    • 9. Testing the animation in Photoshop

    • 10. Exporting images for Web

    • 11. Creating slider in Wordpress

    • 12. Importing the images

    • 13. Adding Parallax effect to images

    • 14. Conclusion


About This Class

Learn how to design engaging and interactive web sliders using Photoshop and WordPress! In this course Martin - Adobe Certified Instructor and freelance designer - will guide you through an easy-to-follow workflow showing you several best practices and explaining some theory too.

This course is for anyone who is into web design or planning to get into designing websites and blogs. You should join this course if you have some basic Photoshop knowledge and if you are planning to use WordPress, Joomla or other CMS for the website you are working on.

Sliders are probably one of the most important elements in web design so it is crucial to make them engaging and interactive. Almost every blog needs a good slider that crowns the site and welcomes the users. Parallax is a great technique, which uses the same principal as in animation when the background images move by the camera slower than foreground images, creating an illusion of depth in a 2D scene and adding to the immersion.

Watch the first video in the course to see the final result or check it out here.