Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/psparwez/quick-reel

A fully responsive Quick Reel landing page, using HTML5, CSS3 and JavaScript.
https://github.com/psparwez/quick-reel

css3 html-css-javascript html-css-javascript-project html-css-projects html5 javascript javascript-projects web-dev-portfolio webdevelopment-project

Last synced: about 2 months ago
JSON representation

A fully responsive Quick Reel landing page, using HTML5, CSS3 and JavaScript.

Host: GitHub
URL: https://github.com/psparwez/quick-reel
Owner: psparwez
Created: 2024-12-01T12:26:28.000Z (3 months ago)
Default Branch: main
Last Pushed: 2024-12-01T13:36:33.000Z (3 months ago)
Last Synced: 2024-12-01T13:40:41.680Z (3 months ago)
Topics: css3, html-css-javascript, html-css-javascript-project, html-css-projects, html5, javascript, javascript-projects, web-dev-portfolio, webdevelopment-project
Language: HTML
Homepage:
Size: 700 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

![GitHub repo size](https://img.shields.io/github/repo-size/psparwez/quick-reel)
![GitHub stars](https://img.shields.io/github/stars/psparwez/quick-reel?style=social)
![GitHub forks](https://img.shields.io/github/forks/psparwez/quick-reel?style=social)

Quick Reel Website

A fully responsive Quick Reel landing page,
designed to promote an AI-powered tool for creating viral short clips.
Responsive for all devices, built using HTML, CSS, and JavaScript.

➥ Live Demo

### Demo Screeshots

## 📋 Table of Contents

1. 🤖 [Introduction](#introduction)
2. ⚙️ [Tech Stack](#tech-stack)
3. 🔋 [Features](#features)

## 🤖 Introduction

This project is a modern landing page built using **HTML5**, **CSS3**, and **JavaScript**. It is designed to promote **QuickReel**, an AI-powered tool for converting long videos into viral short clips. The website features a clean, responsive design with an intuitive layout, ensuring a seamless and engaging user experience. By leveraging modern web development techniques, this project creates a fast, scalable, and user-friendly interface that highlights the platform's key features and benefits.

## ⚙️ Tech Stack

- **`HTML5`**
- **`CSS3`**
- **`JavaScript`**

## 🔋 Features

👉 **Hero Section:**
A compelling hero section that highlights the key benefits of the platform—AI-powered video editing, user trust, and a call-to-action button for getting started.

👉 **Features & Services Section:**
An overview of the platform’s advanced tools, including AI-generated clips, auto-cropping, subtitles, and social media previews.

👉 **How It Works Section:**
A step-by-step guide explaining how users can upload a video, let the AI generate short clips, and download or publish the results in one click.

👉 **User Testimonials Section:**
Feedback from real users highlighting their experience and satisfaction with QuickReel.

👉 **Pricing Plans Section:**
A detailed comparison of the Free, Pro, and Premium subscription tiers, showcasing what each plan offers.

👉 **FAQ Section:**
Answers to frequently asked questions to address user concerns and simplify onboarding.

👉 **Animated Sections with ScrollReveal:** Smooth animations triggered as the user scrolls through the page, implemented using the ScrollReveal library to enhance engagement and visual appeal.

👉 **Footer:**
A footer with navigation links, social media icons, and a subscription option for the newsletter.

## 🤸 Quick Start

To set up the **QuickReel** project on your local machine, follow these steps.

---

### Prerequisites

Before starting, make sure you have the following installed:

- [Git](https://git-scm.com/) : Required for cloning the repository.
- A code editor like [VS Code](https://code.visualstudio.com/) with **Live Server** installed for local hosting.

---

### Steps

1. **Clone the repository:**

```bash
git clone https://github.com/psparwez/quick-reel.git
```

2. **Navigate to the project folder:**

```bash
cd quick-reel
```

3. **Open the project in your editor:**

```bash
code .
```

4. **Run the project using Live Server:**

- Right-click the `index.html` file in your editor.
- Select **"Open with Live Server"** to launch the website in your default browser.

---

You’re now ready to explore and customize **QuickReel** locally!

---

## 📞 Contact

If you have any questions, encounter issues, or would like to collaborate on this project, feel free to reach out!

[![Contact](https://img.shields.io/badge/Contact-175fd4?style=for-the-badge&logo=gmail&logoColor=white)](https://github.com/psparwez/psparwez/)
[![LinkedIn](https://img.shields.io/badge/LinkedIn-0077b5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/)

### Reporting Issues

If you encounter any bugs or have suggestions, please open an issue on the [GitHub Issues page](https://github.com/psparwez/quick-reel/issues).

I look forward to hearing from you and collaborating!

### License

[MIT](https://choosealicense.com/licenses/mit/)