SKATEBOARD HELLOWEEN

This is a submission for Frontend Challenge – Halloween Edition, Perfect Landing

What I Built

I created an interactive landing page where users can customize their own skateboard shape with Halloween-themed prints.
The page mixes punk, horr…


This content originally appeared on DEV Community and was authored by Rogerio Orioli

This is a submission for Frontend Challenge - Halloween Edition, Perfect Landing

What I Built

I created an interactive landing page where users can customize their own skateboard shape with Halloween-themed prints.

The page mixes punk, horror, and Halloween aesthetics, featuring dark tones, neon accents, and creepy visuals like skulls, pumpkins, and ghosts.

Users can:

  • Choose a print from a gallery of Halloween designs and see it instantly applied to the skateboard mockup.
  • Upload their own artwork (PNG, JPG, or SVG) to create a truly unique and scary board.
  • Buy the customized skateboard directly through a purchase button.

The goal was to blend interactivity and e-commerce with a strong Halloween visual identity, appealing to skateboarders who love edgy, horror-inspired art.

Demo

🚀 Live Demo: https://custom-helloween-skateboard-deck.vercel.app/
🧠 Code Repository: https://github.com/rogeriorioli/custom-helloween-skateboard-deck

Journey

This project was a blast to build!

I started with the idea of bringing Halloween energy into the skate culture, combining both worlds through a clean yet chaotic interface.

Technically, I used React + TailwindCSS, and implemented interative click to image to overlay prints onto the skateboard shape dynamically.

The biggest challenge was making the image overlay feel natural and visually satisfying — like a real printed shape.

What I learned:

  • How to handle image layering and uploads efficiently in React.
  • How to design a dark, high-contrast UI that’s still visually balanced.
  • The importance of subtle animations and small visual details (hover glows, fades, etc.) to create immersion.

Happy Halloween 🎃

May your code be spooky and your UI delightfully haunted!


This content originally appeared on DEV Community and was authored by Rogerio Orioli


Print Share Comment Cite Upload Translate Updates
APA

Rogerio Orioli | Sciencx (2025-10-23T12:00:40+00:00) SKATEBOARD HELLOWEEN. Retrieved from https://www.scien.cx/2025/10/23/skateboard-helloween/

MLA
" » SKATEBOARD HELLOWEEN." Rogerio Orioli | Sciencx - Thursday October 23, 2025, https://www.scien.cx/2025/10/23/skateboard-helloween/
HARVARD
Rogerio Orioli | Sciencx Thursday October 23, 2025 » SKATEBOARD HELLOWEEN., viewed ,<https://www.scien.cx/2025/10/23/skateboard-helloween/>
VANCOUVER
Rogerio Orioli | Sciencx - » SKATEBOARD HELLOWEEN. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2025/10/23/skateboard-helloween/
CHICAGO
" » SKATEBOARD HELLOWEEN." Rogerio Orioli | Sciencx - Accessed . https://www.scien.cx/2025/10/23/skateboard-helloween/
IEEE
" » SKATEBOARD HELLOWEEN." Rogerio Orioli | Sciencx [Online]. Available: https://www.scien.cx/2025/10/23/skateboard-helloween/. [Accessed: ]
rf:citation
» SKATEBOARD HELLOWEEN | Rogerio Orioli | Sciencx | https://www.scien.cx/2025/10/23/skateboard-helloween/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.