halaman-psikolog #1

Merged
Mahayoga merged 52 commits from halaman-psikolog into master 2026-07-06 12:37:30 +07:00
9 changed files with 162 additions and 217 deletions
Showing only changes of commit 3b6968c2ae - Show all commits

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 214 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

View File

@ -8,23 +8,22 @@
<div class="col-lg-5"> <div class="col-lg-5">
<div class="brand-section"> <div class="brand-section">
<a href="index.html" class="logo d-flex align-items-center mb-4"> <a href="index.html" class="logo d-flex align-items-center mb-4">
<span class="sitename">Clinic</span> <span class="sitename">{{ env('APP_NAME') }}</span>
</a> </a>
<p class="brand-description">Crafting exceptional digital experiences through thoughtful design and <p class="brand-description">Sistem berbasis web yang membantu proses asesmen kecemasan melalui analisis pergerakan pupil mata menggunakan teknologi eye-tracking dan machine learning.</p>
innovative solutions that elevate your brand presence.</p>
<div class="contact-info mt-5"> <div class="contact-info mt-5">
<div class="contact-item"> <div class="contact-item">
<i class="bi bi-geo-alt"></i> <i class="bi bi-geo-alt"></i>
<span>123 Creative Boulevard, Design District, NY 10012</span> <span>Politeknik Negeri Jember, Jurusan Teknologi Informasi, Jl. Mastrip, Krajan Timur, Sumbersari, Kec. Sumbersari, Kabupaten Jember, Jawa Timur</span>
</div> </div>
<div class="contact-item"> <div class="contact-item">
<i class="bi bi-telephone"></i> <i class="bi bi-telephone"></i>
<span>+1 (555) 987-6543</span> <span>+62 8233 7341 446</span>
</div> </div>
<div class="contact-item"> <div class="contact-item">
<i class="bi bi-envelope"></i> <i class="bi bi-envelope"></i>
<span>hello@designstudio.com</span> <span>e31231392@student.polije.ac.id</span>
</div> </div>
</div> </div>
</div> </div>
@ -34,65 +33,32 @@
<div class="footer-nav-wrapper"> <div class="footer-nav-wrapper">
<div class="row"> <div class="row">
<div class="col-6 col-lg-3"> <div class="col-6 col-lg-5">
<div class="nav-column"> <div class="nav-column">
<h6>Studio</h6> <h6>Informasi</h6>
<nav class="footer-nav"> <nav class="footer-nav">
<a href="#!">Our Story</a> <a href="https://maps.app.goo.gl/mLViMQhvs2KUq6An9" target="_blank">Politeknik Negeri Jember</a>
<a href="#!">Design Process</a> <a href="https://maps.app.goo.gl/2FpPBrs67Akm4PMZ9" target="_blank">Jurusan Teknologi Informasi</a>
<a href="#!">Portfolio</a> <a href="https://jti.polije.ac.id/lab/ksi" target="_blank">Lab. Komputasi Sistem Informasi</a>
<a href="#!">Case Studies</a> <a href="https://maps.app.goo.gl/C3eKW5gSoKqCTRYq8" target="_blank">Poliklinik Politeknik Negeri Jember</a>
<a href="#!">Awards</a>
</nav> </nav>
</div> </div>
</div> </div>
<div class="col-6 col-lg-3"> <div class="col-6 col-lg-5">
<div class="nav-column"> <div class="nav-column">
<h6>Services</h6> <h6>Contact Person</h6>
<nav class="footer-nav"> <nav class="footer-nav">
<a href="#!">Brand Identity</a> <a href="mailto:khafid@polije.ac.id" target="_blank">Khafidurrohman Agustianto, S.Pd, M.Eng</a>
<a href="#!">Web Design</a> <a href="mailto:myoga.bahtiar@gmail.com" target="_blank">Mahayoga Ksatria Hanafi Bahtiar</a>
<a href="#!">Mobile Apps</a>
<a href="#!">Digital Strategy</a>
<a href="#!">Consultation</a>
</nav> </nav>
</div> </div>
</div> </div>
<div class="col-6 col-lg-3">
<div class="nav-column">
<h6>Resources</h6>
<nav class="footer-nav">
<a href="#!">Design Blog</a>
<a href="#!">Style Guide</a>
<a href="#!">Free Assets</a>
<a href="#!">Tutorials</a>
<a href="#!">Inspiration</a>
</nav>
</div>
</div>
<div class="col-6 col-lg-3">
<div class="nav-column">
<h6>Connect</h6>
<nav class="footer-nav">
<a href="#!">Start Project</a>
<a href="#!">Schedule Call</a>
<a href="#!">Join Newsletter</a>
<a href="#!">Follow Updates</a>
<a href="#!">Partnership</a>
</nav>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="footer-bottom"> <div class="footer-bottom">
@ -102,7 +68,7 @@
<div class="col-lg-6"> <div class="col-lg-6">
<div class="copyright"> <div class="copyright">
<p>© <span class="sitename">Clinic</span>. All rights reserved.</p> <p>© <span class="sitename">{{ env('APP_NAME') }}</span>. All rights reserved.</p>
</div> </div>
</div> </div>
@ -112,11 +78,7 @@
<a href="#!">Terms of Service</a> <a href="#!">Terms of Service</a>
<a href="#!">Cookie Policy</a> <a href="#!">Cookie Policy</a>
<div class="credits"> <div class="credits">
<!-- All the links in the footer should remain intact. --> Designed by <a href="https://github.com/Mahayoga" target="_blank">Mahayoga</a>. Distributed by <a href="https://jti.polije.ac.id/lab/ksi" target="_blank">Lab. Komputasi Sistem Informasi</a>
<!-- You can delete the links only if you've purchased the pro version. -->
<!-- Licensing information: https://bootstrapmade.com/license/ -->
<!-- Purchase the pro version with working PHP/AJAX contact form: [buy-url] -->
Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>. Distributed by <a href="https://themewagon.com" target="_blank">ThemeWagon</a>
</div> </div>
</div> </div>
</div> </div>

View File

@ -5,12 +5,12 @@
<div class="contact-info d-flex align-items-center"> <div class="contact-info d-flex align-items-center">
<i class="bi bi-envelope d-flex align-items-center"><a <i class="bi bi-envelope d-flex align-items-center"><a
href="mailto:e31231392@student.polije.ac.id">e31231392@student.polije.ac.id</a></i> href="mailto:e31231392@student.polije.ac.id">e31231392@student.polije.ac.id</a></i>
<i class="bi bi-phone d-flex align-items-center ms-4"><span>+62 8233 7341 446</span></i> <a href="https://wa.me/6282337341446" target="_blank"><i class="bi bi-phone d-flex align-items-center ms-4"><span>+62 8233 7341 446</span></i></a>
</div> </div>
<div class="social-links d-none d-md-flex align-items-center"> <div class="social-links d-none d-md-flex align-items-center">
<a href="#!" class="twitter"><i class="bi bi-github"></i></a> <a href="https://github.com/Mahayoga" class="twitter"><i class="bi bi-github"></i></a>
<a href="#!" class="instagram"><i class="bi bi-instagram"></i></a> <a href="https://www.instagram.com/_myoga.exe.zip/" class="instagram"><i class="bi bi-instagram"></i></a>
<a href="#!" class="linkedin"><i class="bi bi-discord"></i></a> <a href="https://discord.com/users/681789849342050304" class="linkedin"><i class="bi bi-discord"></i></a>
</div> </div>
</div> </div>
</div><!-- End Top Bar --> </div><!-- End Top Bar -->
@ -21,16 +21,16 @@
<a href="{{ route('beranda.index') }}" class="logo d-flex align-items-center"> <a href="{{ route('beranda.index') }}" class="logo d-flex align-items-center">
<!-- Uncomment the line below if you also wish to use an image logo --> <!-- Uncomment the line below if you also wish to use an image logo -->
<!-- <img src="assets/img/logo.webp" alt=""> --> <!-- <img src="assets/img/logo.webp" alt=""> -->
<h1 class="sitename">Smart Anxiety</h1> <h1 class="sitename">{{ env('APP_NAME') }}</h1>
</a> </a>
<nav id="navmenu" class="navmenu"> <nav id="navmenu" class="navmenu">
<ul> <ul>
<li><a href="{{ route('beranda.index') }}" class="active">Home</a></li> <li><a href="{{ route('beranda.index') }}" class="{{ request()->routeIs('beranda.index') ? 'active' : '' }}">Home</a></li>
<li><a href="{{ route('beranda.about') }}">About</a></li> <li><a href="{{ route('beranda.about') }}" class="{{ request()->routeIs('beranda.about') ? 'active' : '' }}">About</a></li>
<li><a href="{{ route('beranda.about') }}#system-architecture-tabs">System Architecture</a></li> <li><a href="{{ route('beranda.about') }}#system-architecture-tabs" class="">System Architecture</a></li>
<li><a href="{{ route('cek-status.index') }}">Cek Status</a></li> <li><a href="{{ route('cek-status.index') }}" class="{{ request()->routeIs('cek-status.index') ? 'active' : '' }}">Cek Status</a></li>
<li><a href="contact.html">Contact</a></li> <li><a href="#footer">Contact</a></li>
@if (session('is_logged_in')) @if (session('is_logged_in'))
<li class="dropdown"><a href="#"><span>{{ Auth::user()->name }}</span> <i class="bi bi-chevron-down toggle-dropdown"></i></a> <li class="dropdown"><a href="#"><span>{{ Auth::user()->name }}</span> <i class="bi bi-chevron-down toggle-dropdown"></i></a>
<ul> <ul>

View File

@ -40,7 +40,7 @@
<div class="col-lg-6" data-aos="fade-left" data-aos-delay="200"> <div class="col-lg-6" data-aos="fade-left" data-aos-delay="200">
<div class="image-wrapper"> <div class="image-wrapper">
<img src="{{ asset('assets/users/assets/img/health/facilities-6.webp') }}" class="img-fluid main-image" alt="Healthcare facility"> <img src="{{ asset('assets/users/assets/img/tobii_eye_tracker_device.webp') }}" class="img-fluid main-image" alt="Healthcare facility">
</div><!-- End Image Wrapper --> </div><!-- End Image Wrapper -->
</div> </div>
</div> </div>
@ -48,7 +48,7 @@
<div class="row align-items-center my-5"> <div class="row align-items-center my-5">
<div class="col-lg-6" data-aos="fade-left" data-aos-delay="200"> <div class="col-lg-6" data-aos="fade-left" data-aos-delay="200">
<div class="image-wrapper"> <div class="image-wrapper">
<img src="{{ asset('assets/users/assets/img/health/facilities-6.webp') }}" class="img-fluid main-image" alt="Healthcare facility"> <img src="{{ asset('assets/users/assets/img/gangguan-cemas-menyeluruh.jpg') }}" class="img-fluid main-image" alt="Healthcare facility">
</div><!-- End Image Wrapper --> </div><!-- End Image Wrapper -->
</div> </div>
@ -72,40 +72,40 @@
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="100"> <div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="100">
<div class="value-item"> <div class="value-item">
<div class="value-icon"> <div class="value-icon">
<i class="bi bi-heart-pulse"></i> <i class="bi bi-eye"></i>
</div> </div>
<h4>Compassion</h4> <h4>Eye Movement Monitoring</h4>
<p>Membantu tenaga profesional dalam proses asesmen kecemasan</p> <p>Memantau pergerakan mata dan pola fokus pengguna selama proses asesmen berlangsung.</p>
</div> </div>
</div> </div>
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="200"> <div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="200">
<div class="value-item"> <div class="value-item">
<div class="value-icon"> <div class="value-icon">
<i class="bi bi-clipboard-data"></i> <i class="bi bi-activity"></i>
</div> </div>
<h4>Excellence</h4> <h4>Anxiety Estimation</h4>
<p>Menyediakan analisis berbasis data terhadap respon visual pasien</p> <p>Menganalisis tingkat kecemasan berdasarkan data visual menggunakan model machine learning.</p>
</div> </div>
</div> </div>
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="300"> <div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="300">
<div class="value-item"> <div class="value-item">
<div class="value-icon"> <div class="value-icon">
<i class="bi bi-flask"></i> <i class="bi bi-clipboard2-pulse"></i>
</div> </div>
<h4>Integrity</h4> <h4>Decision Support</h4>
<p>Menyajikan hasil estimasi tingkat kecemasan secara sistematis</p> <p>Membantu tenaga profesional dalam proses evaluasi kondisi psikologis pengguna.</p>
</div> </div>
</div> </div>
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="400"> <div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="400">
<div class="value-item"> <div class="value-item">
<div class="value-icon"> <div class="value-icon">
<i class="bi bi-regex"></i> <i class="bi bi-display"></i>
</div> </div>
<h4>Innovation</h4> <h4>Real-Time Visualization</h4>
<p>Mendukung proses pengambilan keputusan selama konsultasi</p> <p>Menampilkan hasil analisis dan aktivitas visual pengguna secara real-time pada dashboard.</p>
</div> </div>
</div> </div>
</div><!-- End Values Row --> </div><!-- End Values Row -->
@ -123,40 +123,40 @@
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="100"> <div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="100">
<div class="value-item"> <div class="value-item">
<div class="value-icon"> <div class="value-icon">
<i class="bi bi-eye"></i> <i class="bi bi-camera-video"></i>
</div> </div>
<h4>Compassion</h4> <h4>Eye Tracking Capture</h4>
<p>Kamera menangkap pergerakan pupil pengguna</p> <p>Kamera atau eye tracker menangkap koordinat dan pergerakan pupil pengguna.</p>
</div> </div>
</div> </div>
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="300"> <div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="300">
<div class="value-item">
<div class="value-icon">
<i class="bi bi-bar-chart-steps"></i>
</div>
<h4>Integrity</h4>
<p>Fitur pergerakan mata diekstraksi</p>
</div>
</div>
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="400">
<div class="value-item"> <div class="value-item">
<div class="value-icon"> <div class="value-icon">
<i class="bi bi-cpu"></i> <i class="bi bi-cpu"></i>
</div> </div>
<h4>Innovation</h4> <h4>Data Processing</h4>
<p>Model machine learning melakukan klasifikasi</p> <p>Data gaze dan pergerakan mata diproses menjadi fitur analisis.</p>
</div> </div>
</div> </div>
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="400"> <div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="400">
<div class="value-item"> <div class="value-item">
<div class="value-icon"> <div class="value-icon">
<i class="bi bi-easel"></i> <i class="bi bi-cpu-fill"></i>
</div> </div>
<h4>Innovation</h4> <h4>Machine Learning Classification</h4>
<p>Hasil estimasi kecemasan ditampilkan pada dashboard</p> <p>Model machine learning melakukan klasifikasi tingkat kecemasan berdasarkan pola visual.</p>
</div>
</div>
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="400">
<div class="value-item">
<div class="value-icon">
<i class="bi bi-layout-text-window-reverse"></i>
</div>
<h4>Result Visualization</h4>
<p>Hasil estimasi kecemasan ditampilkan dalam bentuk dashboard dan visualisasi data.</p>
</div> </div>
</div> </div>
</div><!-- End Values Row --> </div><!-- End Values Row -->
@ -183,19 +183,19 @@
data-aos-delay="400"> data-aos-delay="400">
<a class="nav-link department-tab active" id="neurology-tab" data-bs-toggle="pill" <a class="nav-link department-tab active" id="neurology-tab" data-bs-toggle="pill"
href="#camera-tabs" role="tab" aria-controls="camera-tabs" href="#camera-tabs" role="tab" aria-controls="camera-tabs"
aria-selected="true" data-aos="fade-up" data-aos-delay="100">Camera</a> aria-selected="true" data-aos="fade-up" data-aos-delay="100">Facial Analysis</a>
<a class="nav-link department-tab" id="surgery-tab" data-bs-toggle="pill" <a class="nav-link department-tab" id="surgery-tab" data-bs-toggle="pill"
href="#eye-detection-tabs" role="tab" aria-controls="eye-detection-tabs" href="#eye-detection-tabs" role="tab" aria-controls="eye-detection-tabs"
aria-selected="false" data-aos="fade-up" data-aos-delay="150">Eye Detection</a> aria-selected="false" data-aos="fade-up" data-aos-delay="150">Gaze Tracking</a>
<a class="nav-link department-tab" id="dental-tab" data-bs-toggle="pill" <a class="nav-link department-tab" id="dental-tab" data-bs-toggle="pill"
href="#departments-tabs-dental" role="tab" aria-controls="departments-tabs-dental" href="#departments-tabs-dental" role="tab" aria-controls="departments-tabs-dental"
aria-selected="false" data-aos="fade-up" data-aos-delay="200">Feature Extraction</a> aria-selected="false" data-aos="fade-up" data-aos-delay="200">Analytics</a>
<a class="nav-link department-tab" id="ophthalmology-tab" data-bs-toggle="pill" <a class="nav-link department-tab" id="ophthalmology-tab" data-bs-toggle="pill"
href="#departments-tabs-ophthalmology" role="tab" aria-controls="departments-tabs-ophthalmology" href="#departments-tabs-ophthalmology" role="tab" aria-controls="departments-tabs-ophthalmology"
aria-selected="false" data-aos="fade-up" data-aos-delay="250">ML Prediction</a> aria-selected="false" data-aos="fade-up" data-aos-delay="250">AI Assessment</a>
<a class="nav-link department-tab" id="cardiology-tab" data-bs-toggle="pill" <a class="nav-link department-tab" id="cardiology-tab" data-bs-toggle="pill"
href="#departments-tabs-cardiology" role="tab" aria-controls="departments-tabs-cardiology" href="#departments-tabs-cardiology" role="tab" aria-controls="departments-tabs-cardiology"
aria-selected="false" data-aos="fade-up" data-aos-delay="300">Result</a> aria-selected="false" data-aos="fade-up" data-aos-delay="300">Technologies</a>
</div> </div>
</div> </div>
</div> </div>
@ -214,51 +214,53 @@
</div> </div>
<div class="col-lg-8 order-lg-1"> <div class="col-lg-8 order-lg-1">
<div class="department-info"> <div class="department-info">
<h2 class="department-title">Camera</h2> <h2 class="department-title">Facial Expression Analysis</h2>
<p class="department-description">Kamera digunakan pada sistem ini untuk menangkap dan merekam pergerakan pengguna sebagai referensi kedua dari 'eye tracking'. Data dari rekaman kamera ini akan digunakan untuk menjadikan ekspresi muka sebagai bobot kedua dari menentukan kecemasan.</p> <p class="department-description">
Kamera digunakan untuk menangkap ekspresi wajah dan pergerakan pengguna selama proses asesmen berlangsung.
Data visual ini digunakan sebagai sumber analisis tambahan untuk membantu model machine learning dalam mengestimasi tingkat kecemasan pengguna.
</p>
<div class="row mt-4"> <div class="row mt-4">
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-brain"></i> <i class="bi bi-person-bounding-box"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Brain Monitoring</h4> <h4>Face Detection</h4>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore.</p> <p>Sistem mendeteksi area wajah pengguna secara real-time selama asesmen berlangsung.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-wave-square"></i> <i class="bi bi-eye"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>EEG Testing</h4> <h4>Eye Movement Tracking</h4>
<p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia.</p> <p>Pergerakan mata dan titik fokus pengguna dianalisis untuk memperoleh pola visual.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-stethoscope"></i> <i class="bi bi-emoji-neutral"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Neurological Exam</h4> <h4>Emotion Observation</h4>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium.</p> <p>Ekspresi wajah digunakan sebagai indikator tambahan dalam analisis kecemasan.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-file-medical"></i> <i class="bi bi-cpu"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Treatment Plans</h4> <h4>AI Classification</h4>
<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis.</p> <p>Model machine learning melakukan estimasi tingkat kecemasan berdasarkan data visual pengguna.</p>
</div> </div>
</div> </div>
</div> </div>
@ -277,53 +279,54 @@
</div> </div>
<div class="col-lg-8 order-lg-1"> <div class="col-lg-8 order-lg-1">
<div class="department-info"> <div class="department-info">
<h2 class="department-title">Eye Detection</h2> <h2 class="department-title">Eye Tracking Analysis</h2>
<p class="department-description">Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut <p class="department-description">
odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Sistem melakukan analisis pergerakan mata pengguna menggunakan teknologi eye tracking untuk memperoleh pola perhatian visual selama proses asesmen.
Data gaze yang diperoleh digunakan sebagai fitur utama dalam proses estimasi tingkat kecemasan berbasis machine learning.
</p> </p>
<div class="row mt-4"> <div class="row mt-4">
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-cut"></i> <i class="bi bi-eye"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Minimally Invasive</h4> <h4>Gaze Tracking</h4>
<p>Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet.</p> <p>Sistem melacak arah pandangan dan titik fokus mata pengguna secara real-time.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-tools"></i> <i class="bi bi-crosshair"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Advanced Procedures</h4> <h4>Fixation Analysis</h4>
<p>Consectetur, adipisci velit, sed quia non numquam eius modi tempora.</p> <p>Durasi fokus pengguna pada area tertentu dianalisis untuk mendeteksi pola perhatian visual.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-shield-alt"></i> <i class="bi bi-grid-3x3-gap"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Safe Operations</h4> <h4>Heatmap Visualization</h4>
<p>Incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p> <p>Pergerakan mata divisualisasikan dalam bentuk heatmap untuk melihat distribusi perhatian pengguna.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-clock"></i> <i class="bi bi-cpu"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Recovery Support</h4> <h4>AI-Based Classification</h4>
<p>Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis.</p> <p>Model machine learning mengklasifikasikan tingkat kecemasan berdasarkan pola gaze pengguna.</p>
</div> </div>
</div> </div>
</div> </div>
@ -342,53 +345,54 @@
</div> </div>
<div class="col-lg-8 order-lg-1"> <div class="col-lg-8 order-lg-1">
<div class="department-info"> <div class="department-info">
<h2 class="department-title">Dental Care Department</h2> <h2 class="department-title">Result Visualization</h2>
<p class="department-description">Suscipit laboriosam, nisi ut aliquid ex ea commodi <p class="department-description">
consequatur. Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil Sistem menampilkan hasil analisis eye tracking dan estimasi kecemasan dalam bentuk visualisasi data interaktif secara real-time.
molestiae.</p> Dashboard digunakan untuk membantu proses observasi, evaluasi, dan interpretasi hasil analisis pengguna.
</p>
<div class="row mt-4"> <div class="row mt-4">
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="far fa-smile"></i> <i class="bi bi-grid-3x3-gap"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Oral Health</h4> <h4>Heatmap Analytics</h4>
<p>Consequatur aut perferendis doloribus asperiores repellat tempore.</p> <p>Visualisasi heatmap digunakan untuk melihat distribusi perhatian visual pengguna pada layar.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-tooth"></i> <i class="bi bi-activity"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Teeth Cleaning</h4> <h4>Real-Time Monitoring</h4>
<p>Et harum quidem rerum facilis est et expedita distinctio nam libero.</p> <p>Sistem memantau aktivitas pengguna dan data eye tracking secara langsung selama asesmen berlangsung.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-star"></i> <i class="bi bi-graph-up-arrow"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Cosmetic Dentistry</h4> <h4>Anxiety Prediction</h4>
<p>Tempore cum soluta nobis est eligendi optio cumque nihil impedit quo minus.</p> <p>Model machine learning menghasilkan estimasi tingkat kecemasan berdasarkan pola visual pengguna.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-cog"></i> <i class="bi bi-display"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Orthodontics</h4> <h4>Interactive Dashboard</h4>
<p>Id quod maxime placeat facere possimus, omnis voluptas assumenda est.</p> <p>Seluruh hasil analisis divisualisasikan melalui dashboard interaktif yang mudah dipahami.</p>
</div> </div>
</div> </div>
</div> </div>
@ -408,52 +412,53 @@
</div> </div>
<div class="col-lg-8 order-lg-1"> <div class="col-lg-8 order-lg-1">
<div class="department-info"> <div class="department-info">
<h2 class="department-title">Ophthalmology Department</h2> <h2 class="department-title">Behavioral Analysis</h2>
<p class="department-description">Omnis dolor repellendus temporibus autem quibusdam et aut <p class="department-description">
officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae.</p> Sistem menganalisis pola perilaku visual pengguna berdasarkan pergerakan mata, fokus perhatian, dan ekspresi wajah untuk membantu proses estimasi tingkat kecemasan secara lebih akurat.
</p>
<div class="row mt-4"> <div class="row mt-4">
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-eye"></i> <i class="bi bi-bullseye"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Vision Testing</h4> <h4>Attention Analysis</h4>
<p>Sint et voluptatum sint quia dolor sit amet consectetur adipiscing elit.</p> <p>Sistem mengevaluasi fokus dan perhatian visual pengguna selama proses asesmen berlangsung.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-camera"></i> <i class="bi bi-emoji-neutral"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Retinal Imaging</h4> <h4>Facial Behavior</h4>
<p>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua ut.</p> <p>Ekspresi wajah dianalisis untuk membantu mendeteksi perubahan perilaku emosional pengguna.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-bolt"></i> <i class="bi bi-diagram-3"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Laser Surgery</h4> <h4>Pattern Recognition</h4>
<p>Enim ad minim veniam quis nostrud exercitation ullamco laboris nisi.</p> <p>Model AI mengenali pola visual tertentu yang berkaitan dengan tingkat kecemasan pengguna.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-prescription-bottle"></i> <i class="bi bi-cpu"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Eye Care Plans</h4> <h4>AI Assessment</h4>
<p>Ut aliquip ex ea commodo consequat duis aute irure dolor in reprehenderit.</p> <p>Machine learning menghasilkan estimasi tingkat kecemasan berdasarkan kombinasi data visual pengguna.</p>
</div> </div>
</div> </div>
</div> </div>
@ -473,52 +478,53 @@
</div> </div>
<div class="col-lg-8 order-lg-1"> <div class="col-lg-8 order-lg-1">
<div class="department-info"> <div class="department-info">
<h2 class="department-title">Cardiology Department</h2> <h2 class="department-title">Core Technologies</h2>
<p class="department-description">In voluptate velit esse cillum dolore eu fugiat nulla pariatur <p class="department-description">
excepteur sint occaecat cupidatat non proident sunt in culpa qui officia deserunt.</p> Sistem dibangun menggunakan kombinasi teknologi eye tracking, machine learning, dan visualisasi data real-time untuk mendukung proses analisis kecemasan secara interaktif dan akurat.
</p>
<div class="row mt-4"> <div class="row mt-4">
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-heartbeat"></i> <i class="bi bi-eye"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Heart Monitoring</h4> <h4>Eye Tracking Device</h4>
<p>Mollit anim id est laborum sed ut perspiciatis unde omnis iste natus error.</p> <p>Perangkat eye tracker digunakan untuk menangkap koordinat dan pergerakan mata pengguna secara real-time.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-chart-line"></i> <i class="bi bi-cpu"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>ECG Analysis</h4> <h4>Machine Learning</h4>
<p>Sit voluptatem accusantium doloremque laudantium totam rem aperiam.</p> <p>Model AI menganalisis pola visual pengguna untuk menghasilkan estimasi tingkat kecemasan.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-tint"></i> <i class="bi bi-wifi"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Blood Tests</h4> <h4>Real-Time Communication</h4>
<p>Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae.</p> <p>Teknologi WebSocket digunakan untuk mengirim data monitoring secara langsung dan responsif.</p>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<div class="service-item"> <div class="service-item">
<div class="service-icon"> <div class="service-icon">
<i class="fas fa-shield-heart"></i> <i class="bi bi-display"></i>
</div> </div>
<div class="service-content"> <div class="service-content">
<h4>Preventive Care</h4> <h4>Interactive Dashboard</h4>
<p>Vitae dicta sunt explicabo nemo enim ipsam voluptatem quia voluptas sit.</p> <p>Dashboard interaktif menampilkan visualisasi data, heatmap, dan hasil analisis AI secara real-time.</p>
</div> </div>
</div> </div>
</div> </div>
@ -565,7 +571,7 @@
</div> </div>
<div class="col-lg-2 col-md-3 col-sm-4 col-6" data-aos="zoom-in" data-aos-delay="400"> <div class="col-lg-2 col-md-3 col-sm-4 col-6" data-aos="zoom-in" data-aos-delay="400">
<div class="certification-item"> <div class="certification-item">
<img src="{{ asset('assets/users/assets/img/logo/tensorflow_logo.webp') }}" class="img-fluid" alt="Tensorflow Logo"> <img src="{{ asset('assets/users/assets/img/logo/node-js.png') }}" class="img-fluid" alt="Node.js Logo">
</div> </div>
</div> </div>
</div><!-- End Certifications Row --> </div><!-- End Certifications Row -->

View File

@ -19,7 +19,7 @@
</p> </p>
<div class="hero-actions" data-aos="fade-right" data-aos-delay="600"> <div class="hero-actions" data-aos="fade-right" data-aos-delay="600">
<a href="{{ route('beranda.about') }}" class="btn btn-primary">Learn About The System</a> <a href="#appointment" class="btn btn-primary">Coba Sekarang</a>
<a href="https://www.youtube.com/watch?v=Y7f98aduVJ8" class="btn btn-outline glightbox"> <a href="https://www.youtube.com/watch?v=Y7f98aduVJ8" class="btn btn-outline glightbox">
<i class="bi bi-archive me-2"></i> <i class="bi bi-archive me-2"></i>
View Research View Research
@ -41,30 +41,7 @@
<div class="col-lg-6"> <div class="col-lg-6">
<div class="hero-visual" data-aos="fade-left" data-aos-delay="400"> <div class="hero-visual" data-aos="fade-left" data-aos-delay="400">
<div class="main-image"> <div class="main-image">
<img src="{{ asset('assets/users/assets/img/health/staff-10.webp') }}" alt="Modern Healthcare Facility" class="img-fluid"> <img src="{{ asset('assets/users/assets/img/health/depresi_crop.jpg') }}" alt="Modern Healthcare Facility" class="img-fluid">
<div class="floating-card appointment-card">
<div class="card-icon">
<i class="bi bi-calendar-check"></i>
</div>
<div class="card-content">
<h6>Next Available</h6>
<p>Today 2:30 PM</p>
<small>Dr. Sarah Johnson</small>
</div>
</div>
<div class="floating-card rating-card">
<div class="card-content">
<div class="rating-stars">
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
</div>
<h6>4.9/5</h6>
<small>1,234 Reviews</small>
</div>
</div>
</div> </div>
<div class="background-elements"> <div class="background-elements">
<div class="element element-1"></div> <div class="element element-1"></div>
@ -96,7 +73,7 @@
</p> </p>
<div class="cta-section"> <div class="cta-section">
<a href="about.html" class="btn-primary">Learn More About Us</a> <a href="{{ route('beranda.about') }}" class="btn-primary">Learn More About Us</a>
</div> </div>
</div> </div>
</div> </div>
@ -104,7 +81,7 @@
<div class="col-lg-6" data-aos="fade-left" data-aos-delay="300"> <div class="col-lg-6" data-aos="fade-left" data-aos-delay="300">
<div class="about-visual"> <div class="about-visual">
<div class="main-image"> <div class="main-image">
<img src="{{ asset('assets/users/assets/img/health/facilities-9.webp') }}" alt="Modern medical facility" class="img-fluid"> <img src="{{ asset('assets/users/assets/img/health/about.jpg') }}" alt="Modern medical facility" class="img-fluid">
</div> </div>
{{-- <div class="floating-card"> {{-- <div class="floating-card">
<div class="card-content"> <div class="card-content">
@ -146,7 +123,7 @@
<div class="service-image"> <div class="service-image">
<img src="{{ asset('assets/users/assets/img/health/cardiology-2.webp') }}" alt="Cardiology Services" class="img-fluid"> <img src="{{ asset('assets/users/assets/img/health/cardiology-2.webp') }}" alt="Cardiology Services" class="img-fluid">
<div class="service-overlay"> <div class="service-overlay">
<i class="fas fa-heartbeat"></i> <i class="fas fa-message"></i>
</div> </div>
</div> </div>
<div class="service-content"> <div class="service-content">
@ -169,7 +146,7 @@
<div class="service-image"> <div class="service-image">
<img src="{{ asset('assets/users/assets/img/health/neurology-3.webp') }}" alt="Neurology Services" class="img-fluid"> <img src="{{ asset('assets/users/assets/img/health/neurology-3.webp') }}" alt="Neurology Services" class="img-fluid">
<div class="service-overlay"> <div class="service-overlay">
<i class="fas fa-brain"></i> <i class="fas fa-face-rolling-eyes"></i>
</div> </div>
</div> </div>
<div class="service-content"> <div class="service-content">
@ -192,7 +169,7 @@
<div class="service-image"> <div class="service-image">
<img src="{{ asset('assets/users/assets/img/health/orthopedics-1.webp') }}" alt="Orthopedics Services" class="img-fluid"> <img src="{{ asset('assets/users/assets/img/health/orthopedics-1.webp') }}" alt="Orthopedics Services" class="img-fluid">
<div class="service-overlay"> <div class="service-overlay">
<i class="fas fa-bone"></i> <i class="fas fa-chart-gantt"></i>
</div> </div>
</div> </div>
<div class="service-content"> <div class="service-content">
@ -216,7 +193,7 @@
<div class="service-image"> <div class="service-image">
<img src="{{ asset('assets/users/assets/img/health/pediatrics-4.webp') }}" alt="Pediatrics Services" class="img-fluid"> <img src="{{ asset('assets/users/assets/img/health/pediatrics-4.webp') }}" alt="Pediatrics Services" class="img-fluid">
<div class="service-overlay"> <div class="service-overlay">
<i class="fas fa-child"></i> <i class="fas fa-computer"></i>
</div> </div>
</div> </div>
<div class="service-content"> <div class="service-content">
@ -324,7 +301,7 @@
<h1>Make an Appointment</h1> <h1>Make an Appointment</h1>
</div><!-- End Section Title --> </div><!-- End Section Title -->
<div class="container" data-aos="fade-up" data-aos-delay="100"> <div class="container" data-aos="fade-up" data-aos-delay="100" id="appointment">
<div class="row"> <div class="row">
<div class="col-lg-10 mx-auto"> <div class="col-lg-10 mx-auto">
@ -340,8 +317,8 @@
<i class="bi bi-calendar-check"></i> <i class="bi bi-calendar-check"></i>
</div> </div>
<div class="step-content"> <div class="step-content">
<h4>Select Service</h4> <h4>Isi Data Diri</h4>
<p>Choose the medical service you need</p> <p>Mohon isi data diri Anda dengan lengkap</p>
</div> </div>
</div> </div>
<div class="step"> <div class="step">
@ -349,8 +326,8 @@
<i class="bi bi-clock"></i> <i class="bi bi-clock"></i>
</div> </div>
<div class="step-content"> <div class="step-content">
<h4>Pick Date &amp; Time</h4> <h4>Ambil Tanggal &amp; Waktu</h4>
<p>Select your preferred appointment slot</p> <p>Pilih tanggal dan waktu yang paling cocok untuk Anda</p>
</div> </div>
</div> </div>
<div class="step"> <div class="step">
@ -358,8 +335,8 @@
<i class="bi bi-person-check"></i> <i class="bi bi-person-check"></i>
</div> </div>
<div class="step-content"> <div class="step-content">
<h4>Confirm Details</h4> <h4>Konfirmasi Detail</h4>
<p>Provide your information and confirm</p> <p>Periksa kembali semua detail yang telah Anda masukkan</p>
</div> </div>
</div> </div>
</div> </div>