Dear OJS community,
I want to share an enhanced visual element I’ve developed to elevate the user experience on academic journal platforms. This is an Animated 3D Journal Collection featuring a carousel that showcases various journal issues with smooth GSAP animations and a direct redirect to OJS archives/publications.
The carousel has been custom-designed using CodePen.io, specifically adapted for academic environments: https://codepen.io/Kevin_Gutier09/pen/XJmNJaO
Key Features:
- GSAP-powered 3D animations simulating a digital bookshelf
- Each journal as an interactive “flip book” revealing covers and descriptions
- Smooth hover effects and elegant transitions
- Direct navigation to journal archives/publications
- Optimized for academic UX
Description: This CodePen project showcases an interactive visualization of seven UCA journals using the GSAP library for fluid, dynamic animations. The interface simulates a bookshelf collection where each journal appears as a “flip book” that opens to display its cover and description. The animations deliver an engaging visual experience, providing an elegant, modern way to explore academic publications, titles, and abstracts—like browsing a digitally animated library.
Original design by Filip Zrnzevic, customization and adaptation © Credits to: Gutierrez, Kevin (2025). Created with Codepen.io
Additionally, here’s our recently updated journals portal featuring custom CSS enhancements: [Portal de Revistas UCA]
If you’re interested in implementing this add-on in your OJS platforms, feel free to adapt the code. I’d love to hear your feedback or see implementations!
Best regards,
Kevin Gutiérrez
Librarian
CRAI - Universidad Centroamericana José Simeón Cañas (UCA)
