Skip to content

Commit

Permalink
Initial Complete Page
Browse files Browse the repository at this point in the history
  • Loading branch information
Aditya01229 committed May 25, 2024
1 parent 3408a0d commit 37e776b
Show file tree
Hide file tree
Showing 5 changed files with 975 additions and 83 deletions.
315 changes: 278 additions & 37 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,66 +2,307 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>adfyou</title>
<link
href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css"
rel="stylesheet"
/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="styles/style.css" />
<script defer src="scripts/fade.js"></script>
</head>
<body>
<!-- NAVBAR + MAIN BODY -->
<div class="main">
<!-- HEADER -->
<header class="header">
<a href="#home" class="logo">adfyou.</a>

<!-- TIMELINE -->
<section class="process" id="process">
<h2 class="heading"><span>Process</span></h2>
<i class="bx bx-menu" id="menu-icon"></i>

<div class="timeline-items">
<div class="timeline-item">
<div class="timeline-dot"></div>
<div class="timeline-content">
<h3>Step 1: Initial Video</h3>
<p>
It all starts with you filming a 2-minute video talking about any
topic you're passionate about. This initial video is crucial as it
serves as the foundation for creating your digital twin.
</p>
<nav class="navbar">
<a href="#process" class="nav-a">Process</a>
<a href="#faq" class="nav-a">FAQ</a>
<a
href="https://calendly.com/aneeshmedane/adfyou-intro-call"
class="book-box"
><span class="book">Book your call </span
><i class="bx bx-right-arrow-alt"></i
></a>
</nav>
</header>

<!-- BODY -->
<section class="hide body-info" id="home">
<h1>ALL DONE FOR YOU</h1>
<p>
Helping
<span class="body-highlight"
>busy business professionals, small businesses, and CEOs </span
>establish a strong online presence by creating AI-powered content.
Our AI creates a
<span class="body-highlight"
>digital clone of you to produce unlimited video content</span
>, enhancing your reputation and growing a dedicated audience while
saving you over 100+ hours a month
<span class="body-highlight">guaranteed</span>.
</p>
<p class="quote">
"Forget Filming and Retakes.Concentrate on what matters-You and Your
Business"
</p>
</section>

<!-- TIMELINE -->
<section class="hide process" id="process">
<h2 class="heading"><span>Process</span></h2>
<div class="container">
<div class="js-timeline ag-timeline">
<div class="js-timeline_line ag-timeline_line">
<div
class="js-timeline_line-progress ag-timeline_line-progress"
></div>
</div>
<div class="ag-timeline_list">
<div class="js-timeline_item ag-timeline_item">
<div class="ag-timeline-card_box">
<div
class="js-timeline-card_point-box ag-timeline-card_point-box"
>
<div class="ag-timeline-card_point"></div>
</div>
<div class="timeline-item hide">
<div class="timeline-content">
<h3>Step 1: Initial Video</h3>
<p>
It all starts with you filming a 2-minute video talking
about any topic you're passionate about. This initial
video is crucial as it serves as the foundation for
creating your digital twin.
</p>
</div>
</div>
</div>
</div>
<div class="js-timeline_item ag-timeline_item">
<div class="ag-timeline-card_box">
<div
class="js-timeline-card_point-box ag-timeline-card_point-box"
>
<div class="ag-timeline-card_point"></div>
</div>
<div class="timeline-item hide">
<div class="timeline-content">
<h3>Step 2: Digital Clone Creation</h3>
<p>
Once we have your video, we feed it into our
sophisticated Al algorithm. This advanced technology
meticulously analyzes your body, face, and voice to
create an accurate and lifelike virtual replica of you.
</p>
</div>
</div>
</div>
</div>
<div class="js-timeline_item ag-timeline_item">
<div class="ag-timeline-card_box">
<div
class="js-timeline-card_point-box ag-timeline-card_point-box"
>
<div class="ag-timeline-card_point"></div>
</div>
<div class="timeline-item hide">
<div class="timeline-content">
<h3>Step 3: Content Strategy and Production</h3>
<p>
Generate Custom Content With your digital twin ready, we
can now generate videos of you speaking on any subject
you wish, tailored for social media. Whether it's
sharing insights, giving tips, or promoting your
services, the possibilities are endless.
</p>
</div>
</div>
</div>
</div>
<div class="js-timeline_item ag-timeline_item">
<div class="ag-timeline-card_box">
<div
class="js-timeline-card_point-box ag-timeline-card_point-box"
>
<div class="ag-timeline-card_point"></div>
</div>
<div class="timeline-item hide">
<div class="timeline-content">
<h3>Step 4: Multi-Platform Distribution</h3>
<p>
Finally, we distribute your videos across major
platforms like Instagram, YouTube, TikTok, and Twitter,
ensuring a strong and consistent online presence that
keeps you top of mind with your audience.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- BOOK A CALL -->
<div class="book-center">
<a
href="https://calendly.com/aneeshmedane/adfyou-intro-call"
class="book-box"
><span class="book">Book your call </span
><i class="bx bx-right-arrow-alt"></i
></a>
</div>
</section>

<!-- FOUNDERS AI CLONE -->
<section class="hide founders-sec container">
<h2 class="heading"><span>Founder's AI Clone</span></h2>
<div class="founder">
<video
src="static/videos/videoplayback.mp4"
autoplay
loop
muted
id="myVideo"
></video>
<p>
Hello, I'm Aneesh,the founder of adfyou.I started with video editing
and have
<span class="body-highlight"
>worked with influencers and businesses totaling over 180,000
followers and agencies generating $20,000+ a month.</span
>
I'm passionate about using AI to simplifyand amplify your digital
presence.Lets make your online presence effortless and impactful, so
you can focus on growing your buisness.
</p>
</div>
</section>

<!-- TESTIMONIAL -->
<section class="hide testimonials" id="testimonials">
<div class="testimonials-box">
<h2 class="heading"><span>Testimonial</span></h2>
<div class="wrapper">
<div class="testimonial-item">
<video
src="static/videos/videoplayback.mp4"
autoplay
loop
muted
></video>
<h2>Stefan Van De Vlasakker</h2>
<p class="sub">Founder of VDV Vision</p>
<p>
300% increase in subscribers and view counts the first month
</p>
</div>
<div class="testimonial-item">
<video
src="static/videos/videoplayback.mp4"
autoplay
loop
muted
></video>
<h2>Saksham Gaur</h2>
<p class="sub">Founder of MetromediaHouse</p>
<p>
Worked as a Video Edior for MMH.Personal branding agency
$20k+MRR
</p>
</div>
</div>
</div>
<div class="timeline-item">
<div class="timeline-dot"></div>
<div class="timeline-content">
<h3>Step 2: Digital Clone Creation</h3>
</section>
<section class="hide schedule container">
<h2 class="heading"><span>Schedule Your Call</span></h2>
<p>
If you want to focus on other parts of your business instead of
worrying about what to record, book your call here. We'll go over your
creative strategy and craft an offer that fits your needs.
</p>
<!-- BOOK A CALL -->
<div class="book-center">
<a
href="https://calendly.com/aneeshmedane/adfyou-intro-call"
class="book-box"
><span class="book">Book your call </span
><i class="bx bx-right-arrow-alt"></i
></a>
</div>
</section>

<!-- FAQ's -->
<section class="hide" id="faq">
<h2 class="heading"><span>Your Questions, Answered</span></h2>

<div class="questions-container">
<div class="question">
<button>
<span>Who is this for?</span>
<i class="bx bx-plus"></i>
</button>
<p>
Once we have your video, we feed it into our sophisticated Al algorithm. This advanced technology meticulously analyzes your body, face, and voice to create an accurate and lifelike virtual replica of you.
Our services are designed for busy business professionals and CEOs
who want to establish and maintain a strong online presence,
enhance their reputation and influence in their industry, and grow
a dedicated audience, all without having to invest significant
time and effort into content creation and management
</p>
</div>
</div>
<div class="timeline-item">
<div class="timeline-dot"></div>
<div class="timeline-content">
<h3>Step 3: Content Strategy and Production</h3>

<div class="question">
<button>
<span>Is there any guarantee?</span>
<i class="bx bx-plus"></i>
</button>
<p>
Generate Custom Content With your digital twin ready, we can now
generate videos of you speaking on any subject you wish, tailored
for social media. Whether it's sharing insights, giving tips, or
promoting your services, the possibilities are endless.
Absolutely. If we don’t get you results, we work for free until
you get there
</p>
</div>
</div>
<div class="timeline-item">
<div class="timeline-dot"></div>
<div class="timeline-content">
<h3>Step 4: Multi-Platform Distribution</h3>

<div class="question">
<button>
<span>Why AI Clone?</span>
<i class="bx bx-plus"></i>
</button>
<p>
Finally, we distribute your videos across major platforms like Instagram, YouTube, TikTok, and Twitter, ensuring a strong and consistent online presence that keeps you top of mind with your audience.
An AI clone saves you time and effort by creating and managing
high-quality, personalized content. It ensures a consistent online
presence, enhances your brand image, and engages your audience
effectively, all with minimal involvement from you
</p>
</div>
</div>
</div>
</section>
</section>
<footer class="footer hide">
<h2 class="heading"><span>Follow Us</span></h2>
<div class="social">
<a href="#"><i class="bx bxl-instagram"></i></a>
<a href="#"><i class="bx bxl-youtube"></i></a>
<a href="#"><i class="fa-brands fa-x-twitter"></i></i></a>
<a href="#"><i class="bx bxl-linkedin-square"></i></a>
<a href="#"><i class="bx bxl-tiktok"></i></a>
</div>
<p class="copyright">
AI Clone | 100% Hands Free content | Saving 100+ hours a month |
Increasing social presence aka your status
</p>

<p class="copyright reserved">All rights Reserved by Adfyou</p>
</footer>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script
src="https://code.jquery.com/jquery-3.7.1.js"
integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4="
crossorigin="anonymous"
></script>
<script src="https://unpkg.com/boxicons@2.1.4/dist/boxicons.js"></script>
<script src="scripts/script.js"></script>
</body>
Expand Down
16 changes: 16 additions & 0 deletions scripts/fade.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
// Fade In
const observer = new IntersectionObserver((entries)=>{
entries.forEach((entry)=>{
console.log(entry);
if(entry.isIntersecting){
entry.target.classList.add('show');
} else{
entry.target.classList.remove('show');
}
});
});

const hiddenElements = document.querySelectorAll('.hide');
hiddenElements.forEach((el)=>{
observer.observe(el);
});
Loading

0 comments on commit 37e776b

Please sign in to comment.