492 lines
44 KiB
PHP
492 lines
44 KiB
PHP
@extends('landing.layout.main')
|
|
|
|
@section('content')
|
|
<section class="vs-hero-wrapper">
|
|
<div class="vs-hero-carousel" data-height="770" data-container="1900" data-slidertype="responsive"
|
|
data-navbuttons="true">
|
|
|
|
<!-- Slide 1-->
|
|
<div class="ls-slide" data-ls="duration:12000; transition2d:5; kenburnszoom:in; kenburnsscale:1.1;">
|
|
<img width="1920" height="770" src="{{ asset('assets/img/hero/hero-1-1.jpg') }}" class="ls-bg"
|
|
alt="bg" decoding="async">
|
|
<ls-layer
|
|
style="font-size:36px; color:#000; stroke:#000; stroke-width:0px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; border-style:solid; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; width:255px; height:255px; border-width:60px 60px 60px 60px; border-color:#FFD600; border-radius:50% 50% 50% 50%; top:126px; left:740px; z-index:4; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="static:forever;">
|
|
</ls-layer>
|
|
<div style="font-size:36px; stroke:#000; stroke-width:0px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; width:711px; height:410px; left:312px; top:213px; background-color:#490D59; border-radius:213px 206px 50px 213px; z-index:5; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="static:forever;"></div>
|
|
<div style="font-size:36px; stroke:#000; stroke-width:0px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; opacity:0.9; overflow:visible; width:1200px; height:600px; left:350px; top:76px; background-color:#490D59; border-radius:213px 206px 50px 213px; z-index:5; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="static:forever;"></div>
|
|
<div style="font-size:36px; stroke:#000; stroke-width:0px; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; opacity:0.9; overflow:visible; width:1300px; height:700px; left:50%; top:33px; background-color:#490D59; border-radius:213px 206px 50px 213px; z-index:5; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer" data-ls="static:forever;"></div>
|
|
<h1 style="font-size:60px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:60px; color:#ffffff; top:284px; left:312px; width:711px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:-100; delayin:200; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Media Pembelajaran
|
|
</h1>
|
|
<h1 style="font-size:60px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:60px; color:#ffffff; top:361px; left:312px; width:711px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:100; delayin:300; easingin:easeOutQuint; offsetxout:100; easingout:easeOutQuint;">
|
|
Interaktif
|
|
</h1>
|
|
<p style="font-size:18px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Jost', sans-serif; color:#ffffff; width:711px; left:312px; top:438px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
|
|
data-ls="offsetyin:100; delayin:500; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
Menggunakan Metode CNN (Convolutional Neuro Network)</p>
|
|
<div style="font-size:30px; color:#000; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; left:100%; top:494px; font-family:'Fredoka', sans-serif; width:711px; margin-left:-877px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-html-layer"
|
|
data-ls="offsetyin:100; delayin:700; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
<a href="contact.html" class="vs-btn">Coba Sekarang</a>
|
|
</div>
|
|
<h1 style="font-size:90px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:90px; color:#ffffff; top:141px; left:50%; width:1200px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:-100; delayin:200; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Media Pembelajaran
|
|
</h1>
|
|
<h1 style="stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:90px; color:#ffffff; top:255px; left:50%; width:1200px; font-size:90px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:100; delayin:400; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Interaktif
|
|
</h1>
|
|
<p style="stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Jost', sans-serif; color:#ffffff; width:1200px; left:50%; top:384px; font-size:38px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
|
|
data-ls="offsetyin:100; delayin:500; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
Menggunakan Metode CNN (Convolutional Neuro Network)</p>
|
|
<div style="font-size:30px; color:#000; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; left:50%; top:495px; font-family:'Fredoka', sans-serif; width:1200px; margin-left:0px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-html-layer"
|
|
data-ls="offsetyin:100; delayin:700; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
<a href="contact.html" class="vs-btn">Coba Sekarang</a>
|
|
</div>
|
|
<h1 style="font-size:110px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:110px; color:#ffffff; top:113px; left:50%; width:1200px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
|
|
data-ls="offsetxin:-100; delayin:200; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Media Pembelajaran
|
|
</h1>
|
|
<h1 style="stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:110px; color:#ffffff; top:247px; left:50%; width:1200px; font-size:110px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
|
|
data-ls="offsetxin:100; delayin:400; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Interaktif
|
|
</h1>
|
|
<div style="font-size:30px; color:#000; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; left:50%; top:430px; font-family:'Fredoka', sans-serif; width:1200px; margin-left:0px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-html-layer"
|
|
data-ls="offsetyin:100; delayin:700; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
<a href="contact.html" class="vs-btn">Coba Sekarang</a>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- Slide 2-->
|
|
<div class="ls-slide" data-ls="duration:12000; transition2d:5; kenburnszoom:out; kenburnsscale:1.1;">
|
|
<img width="1920" height="770" src="{{ asset('assets/img/hero/hero-1-2.jpg') }}" class="ls-bg"
|
|
alt="bg" decoding="async">
|
|
<h1 style="font-size:60px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:60px; color:#ffffff; top:284px; left:312px; width:711px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:-100; delayin:200; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Media Pembelajaran
|
|
</h1>
|
|
<h1 style="font-size:60px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:60px; color:#ffffff; top:361px; left:312px; width:711px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:100; delayin:300; easingin:easeOutQuint; offsetxout:100; easingout:easeOutQuint;">
|
|
Interaktif
|
|
</h1>
|
|
<p style="font-size:18px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Jost', sans-serif; color:#ffffff; width:711px; left:312px; top:438px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
|
|
data-ls="offsetyin:100; delayin:500; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
Menggunakan Metode CNN (Convolutional Neuro Network)</p>
|
|
<div style="font-size:30px; color:#000; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; left:100%; top:494px; font-family:'Fredoka', sans-serif; width:711px; margin-left:-877px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-html-layer"
|
|
data-ls="offsetyin:100; delayin:700; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
<a href="contact.html" class="vs-btn">Coba Sekarang</a>
|
|
</div>
|
|
<h1 style="font-size:90px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:90px; color:#ffffff; top:141px; left:50%; width:1200px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:-100; delayin:200; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Media Pembelajaran
|
|
</h1>
|
|
<h1 style="stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:90px; color:#ffffff; top:255px; left:50%; width:1200px; font-size:90px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:100; delayin:400; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Interaktif
|
|
</h1>
|
|
<p style="stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Jost', sans-serif; color:#ffffff; width:1200px; left:50%; top:384px; font-size:38px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
|
|
data-ls="offsetyin:100; delayin:500; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
Menggunakan Metode CNN (Convolutional Neuro Network)</p>
|
|
<div style="font-size:30px; color:#000; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; left:50%; top:495px; font-family:'Fredoka', sans-serif; width:1200px; margin-left:0px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-html-layer"
|
|
data-ls="offsetyin:100; delayin:700; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
<a href="contact.html" class="vs-btn">Coba Sekarang</a>
|
|
</div>
|
|
<h1 style="font-size:110px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:110px; color:#ffffff; top:113px; left:50%; width:1200px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
|
|
data-ls="offsetxin:-100; delayin:200; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Media Pembelajaran
|
|
</h1>
|
|
<h1 style="stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:110px; color:#ffffff; top:247px; left:50%; width:1200px; font-size:110px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
|
|
data-ls="offsetxin:100; delayin:400; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Interaktif
|
|
</h1>
|
|
<div style="font-size:30px; color:#000; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; left:50%; top:430px; font-family:'Fredoka', sans-serif; width:1200px; margin-left:0px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-html-layer"
|
|
data-ls="offsetyin:100; delayin:700; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
<a href="contact.html" class="vs-btn">Coba Sekarang</a>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- Slide 3-->
|
|
<div class="ls-slide" data-ls="duration:12000; transition2d:5; kenburnszoom:in; kenburnsscale:1.1;">
|
|
<img width="1920" height="770" src="{{ asset('assets/img/hero/hero-1-3.jpg') }}" class="ls-bg"
|
|
alt="bg" decoding="async">
|
|
<h1 style="font-size:60px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:60px; color:#ffffff; top:284px; left:312px; width:711px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:-100; delayin:200; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Media Pembelajaran
|
|
</h1>
|
|
<h1 style="font-size:60px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:60px; color:#ffffff; top:361px; left:312px; width:711px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:100; delayin:300; easingin:easeOutQuint; offsetxout:100; easingout:easeOutQuint;">
|
|
Interaktif
|
|
</h1>
|
|
<p style="font-size:18px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Jost', sans-serif; color:#ffffff; width:711px; left:312px; top:438px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer"
|
|
data-ls="offsetyin:100; delayin:500; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
Menggunakan Metode CNN (Convolutional Neuro Network)</p>
|
|
<div style="font-size:30px; color:#000; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; left:100%; top:494px; font-family:'Fredoka', sans-serif; width:711px; margin-left:-877px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-tablet ls-hide-phone ls-html-layer"
|
|
data-ls="offsetyin:100; delayin:700; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
<a href="contact.html" class="vs-btn">Coba Sekarang</a>
|
|
</div>
|
|
<h1 style="font-size:90px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:90px; color:#ffffff; top:141px; left:50%; width:1200px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:-100; delayin:200; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Media Pembelajaran
|
|
</h1>
|
|
<h1 style="stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:90px; color:#ffffff; top:255px; left:50%; width:1200px; font-size:90px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
|
|
data-ls="offsetxin:100; delayin:400; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Interaktif
|
|
</h1>
|
|
<p style="stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Jost', sans-serif; color:#ffffff; width:1200px; left:50%; top:384px; font-size:38px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer"
|
|
data-ls="offsetyin:100; delayin:500; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
Menggunakan Metode CNN (Convolutional Neuro Network)</p>
|
|
<div style="font-size:30px; color:#000; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; left:50%; top:495px; font-family:'Fredoka', sans-serif; width:1200px; margin-left:0px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-phone ls-html-layer"
|
|
data-ls="offsetyin:100; delayin:700; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
<a href="contact.html" class="vs-btn">Coba Sekarang</a>
|
|
</div>
|
|
<h1 style="font-size:110px; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:110px; color:#ffffff; top:113px; left:50%; width:1200px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
|
|
data-ls="offsetxin:-100; delayin:200; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Media Pembelajaran
|
|
</h1>
|
|
<h1 style="stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:600; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; font-family:'Fredoka', sans-serif; line-height:110px; color:#ffffff; top:247px; left:50%; width:1200px; font-size:110px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer"
|
|
data-ls="offsetxin:100; delayin:400; easingin:easeOutQuint; offsetxout:-100; easingout:easeOutQuint;">
|
|
Interaktif
|
|
</h1>
|
|
<div style="font-size:30px; color:#000; stroke:#000; stroke-width:0px; text-align:center; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; background-clip:border-box; overflow:visible; left:50%; top:430px; font-family:'Fredoka', sans-serif; width:1200px; margin-left:0px; -webkit-background-clip:border-box;"
|
|
class="ls-l ls-hide-desktop ls-hide-tablet ls-html-layer"
|
|
data-ls="offsetyin:100; delayin:700; easingin:easeOutQuint; offsetyout:100; easingout:easeOutQuint;">
|
|
<a href="contact.html" class="vs-btn">Coba Sekarang</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
<section id="tentang" class="space-top space-extra-bottom">
|
|
<div class="container">
|
|
<div class="row gx-70 align-items-center">
|
|
|
|
<div class="col-lg-6">
|
|
<div class="img-box1">
|
|
<div class="vs-circle"></div>
|
|
<div class="img-1 mega-hover"><img src="{{ asset('assets/img/about/ab-1-1.jpg') }}"
|
|
alt="about"></div>
|
|
<div class="img-2 mega-hover"><img src="{{ asset('assets/img/about/ab-1-2.jpg') }}"
|
|
alt="about"></div>
|
|
<div class="img-3 mega-hover"><img src="{{ asset('assets/img/about/ab-1-3.jpg') }}"
|
|
alt="about"></div>
|
|
<div class="img-4 mega-hover"><img src="{{ asset('assets/img/about/ab-1-4.jpg') }}"
|
|
alt="about"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-6 text-center text-lg-start">
|
|
<h2 class="sec-title">Media Pembelajaran Interaktif Berbasis CNN</h2>
|
|
<p class="sec-text pe-xl-5 mb-4 pb-xl-3">
|
|
Media pembelajaran ini menggunakan teknologi Convolutional Neural Network (CNN) untuk membantu
|
|
anak usia dini mengenali berbagai objek, seperti hewan, buah, angka, dan huruf. Sistem ini dapat
|
|
mengidentifikasi gambar secara otomatis dan memberikan informasi edukatif, sehingga anak-anak
|
|
dapat belajar dengan cara yang lebih menyenangkan dan interaktif.
|
|
</p>
|
|
<div class="row gx-70 justify-content-center justify-content-lg-start text-md-start">
|
|
<div class="col-auto">
|
|
<div class="vs-media media-style1">
|
|
<div class="media-icon"><img src="{{ asset('assets/img/icon/ab-1-1.svg') }}"
|
|
alt="icon"></div>
|
|
<div class="media-body">
|
|
<p class="media-label">4</p>
|
|
<p class="media-title">Model</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto">
|
|
<div class="vs-media media-style1">
|
|
<div class="media-icon"><img src="{{ asset('assets/img/icon/ab-1-2.svg') }}"
|
|
alt="icon"></div>
|
|
<div class="media-body">
|
|
<p class="media-label">CNN</p>
|
|
<p class="media-title">Teknologi</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section id="media-pembelajaran" class="space-extra-bottom">
|
|
<div class="container">
|
|
<div class="title-area text-center">
|
|
<div class="sec-bubble">
|
|
<div class="bubble"></div>
|
|
<div class="bubble"></div>
|
|
<div class="bubble"></div>
|
|
</div>
|
|
<h2 class="sec-title">Jelajahi Media Pembelajaran Interaktif</h2>
|
|
<p class="sec-text">Berbagai media pembelajaran berbasis teknologi untuk membantu anak mengenal dunia
|
|
dengan cara yang menyenangkan.</p>
|
|
</div>
|
|
<div class="row vs-carousel" data-slide-show="4" data-ml-slide-show="3" data-lg-slide-show="3"
|
|
data-md-slide-show="2">
|
|
<div class="service-style1 col-xl-3">
|
|
<div class="service-body">
|
|
<div class="service-img"><a href="/media/hewan"><img
|
|
src="{{ asset('assets/img/service/sr-1-1.jpg') }}" alt="service"></a></div>
|
|
<div class="service-content">
|
|
<div class="service-icon"><img src="{{ asset('assets/img/icon/sr-1-1.svg') }}"
|
|
alt="icon"></div>
|
|
<h3 class="service-title"><a href="/media/hewan">Media Pembelajaran Hewan</a></h3>
|
|
<p class="service-text">Mengenalkan berbagai jenis hewan dengan teknologi interaktif
|
|
berbasis CNN.</p>
|
|
<div class="service-bottom">
|
|
<a href="/media/hewan" class="service-btn">Coba</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="service-style1 col-xl-3">
|
|
<div class="service-body">
|
|
<div class="service-img"><a href="/media/buah"><img
|
|
src="{{ asset('assets/img/service/sr-1-2.jpg') }}" alt="service"></a></div>
|
|
<div class="service-content">
|
|
<div class="service-icon"><img src="{{ asset('assets/img/icon/sr-1-2.svg') }}"
|
|
alt="icon"></div>
|
|
<h3 class="service-title"><a href="/media/buah">Media Pembelajaran Buah</a></h3>
|
|
<p class="service-text">Membantu anak mengenali berbagai macam buah dengan gambar dan suara
|
|
interaktif.</p>
|
|
<div class="service-bottom">
|
|
<a href="/media/buah" class="service-btn">Coba</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="service-style1 col-xl-3">
|
|
<div class="service-body">
|
|
<div class="service-img"><a href="/media/angka"><img
|
|
src="{{ asset('assets/img/service/sr-1-3.jpg') }}" alt="service"></a></div>
|
|
<div class="service-content">
|
|
<div class="service-icon"><img src="{{ asset('assets/img/icon/sr-1-3.svg') }}"
|
|
alt="icon"></div>
|
|
<h3 class="service-title"><a href="/media/angka">Media Pembelajaran Angka</a></h3>
|
|
<p class="service-text">Belajar angka dengan pendekatan interaktif yang membuat anak
|
|
semakin tertarik.</p>
|
|
<div class="service-bottom">
|
|
<a href="/media/angka" class="service-btn">Coba</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="service-style1 col-xl-3">
|
|
<div class="service-body">
|
|
<div class="service-img"><a href="/media/huruf"><img
|
|
src="{{ asset('assets/img/service/sr-1-4.jpg') }}" alt="service"></a></div>
|
|
<div class="service-content">
|
|
<div class="service-icon"><img src="{{ asset('assets/img/icon/sr-1-4.svg') }}"
|
|
alt="icon"></div>
|
|
<h3 class="service-title"><a href="/media/huruf">Media Pembelajaran Huruf</a></h3>
|
|
<p class="service-text">Mengenalkan huruf kepada anak dengan kombinasi visual dan audio
|
|
yang menarik.</p>
|
|
<div class="service-bottom">
|
|
<a href="/media/huruf" class="service-btn">Coba</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<div data-bg-src="{{ asset('assets/img/bg/bg-h-1-1.jpg') }}">
|
|
<section id="fitur" class="space-top space-extra-bottom">
|
|
<div class="container">
|
|
<div class="row align-items-center justify-content-between flex-row-reverse">
|
|
<div class="col-lg-6 text-center text-lg-end">
|
|
<div class="img-box2">
|
|
<div class="transform-banner"><img src="{{ asset('assets/img/about/ab-2-1.jpg') }}"
|
|
alt="about"></div>
|
|
<div class="vs-circle jump"></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6 text-center text-lg-start">
|
|
<h2 class="sec-title me-xxl-5">Media Pembelajaran Interaktif Berbasis CNN</h2>
|
|
<p class="sec-text col-xl-10 pe-4 mb-4">Media pembelajaran ini dirancang untuk membantu anak
|
|
mengenali berbagai objek seperti hewan, buah, angka, dan huruf dengan teknologi
|
|
Convolutional Neural Network (CNN). Dengan pendekatan berbasis AI, anak-anak dapat belajar
|
|
secara lebih interaktif, visual, dan menyenangkan.</p>
|
|
<div class="row justify-content-center justify-content-lg-start text-start">
|
|
<div class="col-auto">
|
|
<div class="list-style1">
|
|
<ul class="list-unstyled">
|
|
<li>Mengenali objek melalui gambar dan suara</li>
|
|
<li>Teknologi Computer Vision untuk identifikasi otomatis</li>
|
|
<li>Interaksi langsung dengan model berbasis AI</li>
|
|
<li>Pembelajaran yang menyenangkan dan mudah dipahami</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<section id="panduan" class="space-top space-extra-bottom">
|
|
<div class="container">
|
|
<div class="row gx-80">
|
|
<div class="col-lg-6 pb-3 pb-xl-0">
|
|
<div class="img-box3">
|
|
<div class="img-1 mega-hover">
|
|
<img src="{{ asset('assets/img/about/faq-1-1.jpg') }}" alt="FAQ">
|
|
<a href="https://www.youtube.com/watch?v=_sI_Ps7JSEk"
|
|
class="play-btn popup-video position-center"><i class="fas fa-play"></i></a>
|
|
</div>
|
|
<div class="vs-circle jump"></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6 align-self-center">
|
|
<div class="title-area text-center text-lg-start">
|
|
<h2 class="sec-title">Panduan Menggunakan Media Pembelajaran</h2>
|
|
</div>
|
|
<div class="accordion accordion-style1" id="faqVersion1">
|
|
<div class="accordion-item active">
|
|
<div class="accordion-header" id="headingOne1">
|
|
<button class="accordion-button" type="button" data-bs-toggle="collapse"
|
|
data-bs-target="#collapseOne1" aria-expanded="true" aria-controls="collapseOne1">
|
|
Bagaimana cara menggunakan media ini?
|
|
</button>
|
|
</div>
|
|
<div id="collapseOne1" class="accordion-collapse collapse show" aria-labelledby="headingOne1"
|
|
data-bs-parent="#faqVersion1">
|
|
<div class="accordion-body">
|
|
<p>Media pembelajaran ini menggunakan teknologi Convolutional Neural Network (CNN)
|
|
untuk mengenali gambar yang diunggah atau dipindai melalui kamera. Setelah itu,
|
|
sistem akan menampilkan informasi edukatif sesuai dengan objek yang terdeteksi.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" id="headingTwo1">
|
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
|
|
data-bs-target="#collapseTwo1" aria-expanded="false" aria-controls="collapseTwo1">
|
|
Apa saja kategori yang dapat dikenali?
|
|
</button>
|
|
</div>
|
|
<div id="collapseTwo1" class="accordion-collapse collapse" aria-labelledby="headingTwo1"
|
|
data-bs-parent="#faqVersion1">
|
|
<div class="accordion-body">
|
|
<p>Media ini mampu mengenali berbagai kategori, termasuk hewan, buah-buahan, angka,
|
|
dan huruf. Setiap kategori memiliki model pengenalan yang telah dilatih
|
|
menggunakan ribuan data gambar untuk memastikan akurasi.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" id="headingThree1">
|
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
|
|
data-bs-target="#collapseThree1" aria-expanded="false"
|
|
aria-controls="collapseThree1">
|
|
Apakah media ini memerlukan koneksi internet?
|
|
</button>
|
|
</div>
|
|
<div id="collapseThree1" class="accordion-collapse collapse" aria-labelledby="headingThree1"
|
|
data-bs-parent="#faqVersion1">
|
|
<div class="accordion-body">
|
|
<p>Tergantung pada implementasi sistem. Jika model CNN berjalan secara lokal, maka
|
|
tidak diperlukan koneksi internet. Namun, jika menggunakan API berbasis cloud,
|
|
koneksi internet mungkin diperlukan untuk memproses data.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" id="headingFour1">
|
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
|
|
data-bs-target="#collapseFour1" aria-expanded="false" aria-controls="collapseFour1">
|
|
Apakah media ini cocok untuk semua usia?
|
|
</button>
|
|
</div>
|
|
<div id="collapseFour1" class="accordion-collapse collapse" aria-labelledby="headingFour1"
|
|
data-bs-parent="#faqVersion1">
|
|
<div class="accordion-body">
|
|
<p>Media ini dirancang khusus untuk anak usia dini, namun juga dapat digunakan oleh
|
|
anak-anak yang lebih besar untuk memperkuat pemahaman mereka tentang objek-objek
|
|
yang dikenali.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-item">
|
|
<div class="accordion-header" id="headingFive1">
|
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
|
|
data-bs-target="#collapseFive1" aria-expanded="false" aria-controls="collapseFive1">
|
|
Bagaimana cara memastikan model AI tetap akurat?
|
|
</button>
|
|
</div>
|
|
<div id="collapseFive1" class="accordion-collapse collapse" aria-labelledby="headingFive1"
|
|
data-bs-parent="#faqVersion1">
|
|
<div class="accordion-body">
|
|
<p>Model AI dapat diperbarui secara berkala dengan dataset terbaru untuk
|
|
meningkatkan akurasi pengenalan gambar. Selain itu, teknik evaluasi seperti
|
|
confusion matrix dapat digunakan untuk mengukur performa model.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
{{-- <section class="form-wrap1 space" data-bg-src="{{ asset('assets/img/bg/newsletter-bg-1-1.png') }}">
|
|
<div class="container">
|
|
<div class="title-area text-center">
|
|
<div class="mb-3 pb-1"><img src="{{ asset('assets/img/icon/bell-1-1.svg') }}" alt="bell icon"></div>
|
|
<p class="sec-text text-title font-title">Keep up to date with the latest news and offers</p>
|
|
<h2 class="sec-title2">Sign up for our newsletter</h2>
|
|
</div>
|
|
<form action="#" class="form-style1">
|
|
<div class="form-group">
|
|
<input type="email" placeholder="Enter Your Email Address...">
|
|
<button class="vs-btn" type="submit">Subscribe</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</section> --}}
|
|
@endsection
|