Bringing a Rock Poster to Life – Blink-182 & Green Day in 3D!

January 25, 2025

In this tutorial, I’ll show you how I turned a 2D Blink-182 & Green Day poster into a 3D animation using Spline 3D. I’ll walk through the process of adding depth, textures, and motion to bring the design to life.

Timestamps:

  • 0:00 Introduction / 3D Demo
  • 0:58 Scan Poster Artwork
  • 1:45 Create Photoshop Layers
  • 7:56 Resize Image & Save As WebP Images
  • 9:25 Spline 3D Scene Setup
  • 10:08 Add Images to Spline
  • 11:31 Add Image Material
  • 13:42 Change Z Coordinates
  • 16:00 Add Material Animation
  • 19:00 Open Website Link – Easter Egg
  • 19:54 Setup Orthographic Camera
  • 22:06 Add Responsive Resize for Camera
  • 23:16 Export Settings and Mouse Hover Effect
  • 24:29 Run Performance Test
  • 25:52 Add 3D Scene to Elementor

Links:

*Some of the links on this page are affiliate links, meaning we may receive a commission if you follow them. This allows us to continue providing free content and educational resources for you. Thank you for supporting our small business!

Share this post:

Facebook
Reddit
Twitter
Pinterest
LinkedIn
Email

Sign-up for our Newsletter

Receive members-only discounts to our shop, notifications about live events, tips, tricks, news, and more! Sign up is FREE. Join today!

More Free Resources