RELAP | Creative Agency Template (DEMO)

Project Description

RELAP is a modern, visually appealing demo template designed for creative agencies or digital studios. This responsive web layout showcases a clean, professional design to help agencies present their portfolio, team, and services effectively. Currently, this template serves as a prototype and demonstration, ideal for UI/UX designers and front-end developers to build upon.

Figma Design File

You can view or duplicate the original design on Figma: 🔗 View Figma File

Features

• Responsive layout adaptable to various screen sizes
• Hero section with headline, description, CTA, and social links
• Interactive expandable sections using <details> for feature highlights
• Video placeholder with play button for embedded media
• Image gallery with captions for portfolio showcase
• Multiple content sections: About, Services, Team, Blog, Testimonials
• Simple contact form in the footer
• Mobile navigation with menu toggle
• Google Fonts integration: Poppins and Source Sans 3
• Icon support via Remix Icon library
• SEO meta tags (Open Graph and Twitter Cards)
• Semantic HTML5 structure for accessibility and SEO

Installation / Setup

This is a static HTML/CSS project. To use locally:

1. Clone or download the repository:

   git clone https://github.com/zakariadakir/relap.git

2. Ensure you have the following files/folders:

   • index.html
   • styles.css
   • images/ (folder with image assets)
   • README.md
   • favicon.ico

3. Open index.html in your web browser.

No frameworks, build tools, or servers required for basic use.

Usage Guidelines

• Replace demo content (text, images, links) with your own branding.
• Update navigation links to match your actual sections/pages.
• Embed a real video player or link in the video placeholder section.
• Modify styles.css to adjust styling and layout as needed.
• Optimize all images for faster performance.
• You may integrate JavaScript or backend logic if needed.

Technologies Used

• HTML5
• CSS3
• Google Fonts (Poppins, Source Sans 3)
• Remix Icons (https://remixicon.com)
• Responsive design techniques
• Meta tags for SEO and social media previews

Screenshots

License

This template is for demonstration and educational purposes only. Contact the author for commercial use or licensing inquiries.