jxlee007 / project-5-sundown

The Sundown Studio portfolio website, recognized by Awwwards, showcases modern design elements, interactive features like smooth scrolling, and project showcases. Built with HTML5, CSS3, and JavaScript, it offers a responsive experience across devices, supported by external libraries like Locomotive Scroll and Swiper JS. Explore the live website

PROJECT-5: Sundown

Portfolio Website from Awwwards

Description

The Sundown Studio portfolio website is a showcase of unique experiences and environments created by a multi-disciplinary design team. The website incorporates modern design elements and interactive features to engage visitors.

Key Features

• Navigation and Hero Section: The navigation bar includes links to different sections like Work, Studio, and Contact. The hero section features a striking tagline "SPACES THAT INSPIRE" and introduces Sundown Studio as a studio focused on creating unique experiences and environments.
• Interactive Elements and Section Transitions: Interactive elements like a dot that follows the mouse enhance the user experience. Smooth transitions between sections make navigation seamless and enjoyable.
• Project Showcase and About Me: The portfolio showcases various projects with videos, images, and descriptions, highlighting the studio's capabilities. An "About Me" section introduces the team behind Sundown Studio, their design philosophy, and their passion for collaboration and creativity.
• Subscription Call-to-Action and Footer: The website encourages visitors to subscribe to the developer's content on YouTube, fostering engagement and community building. The footer includes copyright information, location details, and links to social media profiles for further interaction.

Technologies Used

• HTML5: Markup language for structuring the content.
• CSS3: Styling language for layout and presentation.
• JavaScript: Used for interactive elements, animations, and functionality.
• External Libraries: Utilizes Locomotive Scroll for smooth scrolling and Swiper JS for interactive slideshows.

Responsive Design

The website is designed to be responsive, ensuring a seamless and enjoyable user experience across various devices. Media queries are employed to adjust styles for small screens.

How to Use

1. Clone the repository.
2. Open the index.html file in a web browser to explore the website.

Credits

• Original Website: https://www.sundown-studio.com/
• Locomotive Scroll: https://github.com/locomotivemtl/locomotive-scroll
• Swiper JS: https://swiperjs.com/
• Remixicon: https://remixicon.com/

Author

Jagmohan Singh Malhi