Role: Interactive and UI Designer
Tool: Spline (Hana), MidJourney, Adobe Lightroom, Framer
Hana Techniques: Liquid Glass • 3D transforms • AutoLayout • States and Events
Tools Used for Video Presentation: Ae, Pr, Artlist
🎯 Project Overview
The Interactive Carousel is designed as part of a Contra+Spline(Hana) contest, aiming to explore a use case on the National Geographic website. It was made in a glassmorphism HUD style.
Basically, I wanted to explore how National Geographic could present a summary of some species in a modern UI with targeting overlay vibes, using glass with a high aberration effect for a subtle moment during interactions, and keeping the immersive feeling with micro motion.
🏞️ Images
To create a real-world use case concept that follows NatGeo vibes without infringing on any copyright issues, a key visual UI element was securing the right images for the prototype presentation. There were many attempts and corrections, testing different prompts with MidJourney and testing in the UI until I got the final images I wanted to play it as “Photography” on the concept.
After being happy with the selected outputs from MJ, I retouched the images in Adobe Lightroom, achieving a more polished result across color, style, lighting, and other parameters. Also, to get the BW version for each one.
🖥️ UI and Interactions
Designing all the UI and interactions in Spline(Hana), having also designed using Liquid Glass, 3D transforms and other style effects, hover some elements and States and Events to handle the interactions and the micro interactions.
I wanted to explore a visual way of how National Geographic could present a summary of some species in a modern UI using Spline in a glassmorphism HUD style.