Teo Corran

About this template

Teo Corran is a 3D portfolio template for art directors, filmmakers, photographers and designers. The site opens on a live sea. A tall ship sails between three islands, and each island opens one part of the portfolio: About, Work and Contact.

Click a link in the header or an island in the scene. The ship turns, sails, slows down and berths at the pier. A small figure walks ashore and the panel opens. Visitors can also steer by hand with W A S D or the arrow keys, drag to look around and scroll to zoom. On tablets and phones a touch stick does the steering.

The scene runs in the browser with real 3D. Waves catch the sun, gulls circle the islands and a faint rainbow sits on the horizon. A moon button turns it to night with stars, lit windows, a turning lighthouse beam and a passing comet. A sound button adds a calm loop with sea sounds.

Work lives in the CMS. Each project takes a cover image or a cover video, a summary, process, client, year, services and up to five media slots, each an image or a video. Case study pages keep the details sticky on the left beside a column of media. Every image and video opens in a full screen viewer with Close, Previous, Next and a counter.

What is included

Home with the 3D scene, Work, case study pages, Styleguide, Imprint and 404

Projects CMS with six sample case studies

Desktop, tablet and phone layouts

Liquid glass header and a full screen phone menu

Animated footer wordmark

Every text on a style and every colour on a token

Scene controls: swap the ship and island models, set sea and sky colours, time of day, labels and your own music file

Framer Skills for the design system and customization

Inter Display throughout. All people, clients and contacts in the demo are fictional.

Made by AidanCreates.