580 lines
28 KiB
PHP
580 lines
28 KiB
PHP
@section('title', 'Tentang')
|
|
@extends('user.layouts.index')
|
|
@section('content')
|
|
<!-- Page Title -->
|
|
<div class="page-title">
|
|
<div class="heading">
|
|
<div class="container">
|
|
<div class="row d-flex justify-content-center text-center">
|
|
<div class="col-lg-8">
|
|
<h1 class="heading-title">About</h1>
|
|
<p class="mb-0">
|
|
Penjelasan tentang sistem Deteksi Kecemasan Melalui Gerakan Mata
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<nav class="breadcrumbs">
|
|
<div class="container">
|
|
<ol>
|
|
<li><a href="index.html">Home</a></li>
|
|
<li class="current">About</li>
|
|
</ol>
|
|
</div>
|
|
</nav>
|
|
</div><!-- End Page Title -->
|
|
|
|
<!-- About Section -->
|
|
<section id="about" class="about section">
|
|
|
|
<div class="container" data-aos="fade-up" data-aos-delay="100">
|
|
|
|
<div class="row align-items-center my-5">
|
|
<div class="col-lg-6" data-aos="fade-right" data-aos-delay="100">
|
|
<div class="about-content">
|
|
<h2>Introduction</h2>
|
|
<p class="lead">Anxiety Detection System merupakan sistem berbasis web yang dirancang untuk membantu proses asesmen tingkat kecemasan selama sesi konsultasi psikologis. Sistem ini memanfaatkan teknologi eye tracking untuk menganalisis pergerakan pupil mata dan mengolahnya menggunakan metode machine learning.</p>
|
|
</div><!-- End About Content -->
|
|
</div>
|
|
|
|
<div class="col-lg-6" data-aos="fade-left" data-aos-delay="200">
|
|
<div class="image-wrapper">
|
|
<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>
|
|
</div>
|
|
|
|
<div class="row align-items-center my-5">
|
|
<div class="col-lg-6" data-aos="fade-left" data-aos-delay="200">
|
|
<div class="image-wrapper">
|
|
<img src="{{ asset('assets/users/assets/img/gangguan-cemas-menyeluruh.jpg') }}" class="img-fluid main-image" alt="Healthcare facility">
|
|
</div><!-- End Image Wrapper -->
|
|
</div>
|
|
|
|
<div class="col-lg-6" data-aos="fade-right" data-aos-delay="100">
|
|
<div class="about-content">
|
|
<h2>Background</h2>
|
|
<p class="lead">Gangguan kecemasan merupakan salah satu kondisi kesehatan mental yang banyak dialami oleh berbagai kelompok usia. Proses asesmen kecemasan umumnya dilakukan melalui observasi dan wawancara oleh tenaga profesional. Oleh karena itu, penelitian ini mengembangkan sistem berbasis teknologi yang dapat membantu memberikan data objektif berupa analisis pergerakan mata selama sesi konsultasi.</p>
|
|
</div><!-- End About Content -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="values-section" data-aos="fade-up" data-aos-delay="300">
|
|
<div class="row">
|
|
<div class="col-lg-12 text-center">
|
|
<h3>Purpose of The System</h3>
|
|
<p class="section-description"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="100">
|
|
<div class="value-item">
|
|
<div class="value-icon">
|
|
<i class="bi bi-eye"></i>
|
|
</div>
|
|
<h4>Eye Movement Monitoring</h4>
|
|
<p>Memantau pergerakan mata dan pola fokus pengguna selama proses asesmen berlangsung.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="200">
|
|
<div class="value-item">
|
|
<div class="value-icon">
|
|
<i class="bi bi-activity"></i>
|
|
</div>
|
|
<h4>Anxiety Estimation</h4>
|
|
<p>Menganalisis tingkat kecemasan berdasarkan data visual menggunakan model machine learning.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<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-clipboard2-pulse"></i>
|
|
</div>
|
|
<h4>Decision Support</h4>
|
|
<p>Membantu tenaga profesional dalam proses evaluasi kondisi psikologis pengguna.</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-display"></i>
|
|
</div>
|
|
<h4>Real-Time Visualization</h4>
|
|
<p>Menampilkan hasil analisis dan aktivitas visual pengguna secara real-time pada dashboard.</p>
|
|
</div>
|
|
</div>
|
|
</div><!-- End Values Row -->
|
|
</div><!-- End Values Section -->
|
|
|
|
<div class="values-section" data-aos="fade-up" data-aos-delay="300">
|
|
<div class="row">
|
|
<div class="col-lg-12 text-center">
|
|
<h3>How The System Works</h3>
|
|
<p class="section-description"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row justify-content-between">
|
|
<div class="col-lg-3 col-md-6" data-aos="fade-up" data-aos-delay="100">
|
|
<div class="value-item">
|
|
<div class="value-icon">
|
|
<i class="bi bi-camera-video"></i>
|
|
</div>
|
|
<h4>Eye Tracking Capture</h4>
|
|
<p>Kamera atau eye tracker menangkap koordinat dan pergerakan pupil pengguna.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<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-cpu"></i>
|
|
</div>
|
|
<h4>Data Processing</h4>
|
|
<p>Data gaze dan pergerakan mata diproses menjadi fitur analisis.</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-cpu-fill"></i>
|
|
</div>
|
|
<h4>Machine Learning Classification</h4>
|
|
<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><!-- End Values Row -->
|
|
</div><!-- End Values Section -->
|
|
|
|
</div>
|
|
</section><!-- /About Section -->
|
|
|
|
<!-- Departments Tabs Section -->
|
|
<section id="system-architecture-tabs" class="departments-tabs section">
|
|
|
|
<div class="container" data-aos="fade-up" data-aos-delay="100">
|
|
|
|
<div class="medical-specialties">
|
|
<div class="row">
|
|
<div class="col-12" data-aos="fade-up" data-aos-delay="100">
|
|
<div class="row mb-3">
|
|
<h2 class="text-center">System Architecture</h2>
|
|
</div><!-- End About Content -->
|
|
</div>
|
|
<div class="col-12">
|
|
<div class="specialty-navigation">
|
|
<div class="nav nav-pills d-flex" id="specialty-tabs" role="tablist" data-aos="fade-up"
|
|
data-aos-delay="400">
|
|
<a class="nav-link department-tab active" id="neurology-tab" data-bs-toggle="pill"
|
|
href="#camera-tabs" role="tab" aria-controls="camera-tabs"
|
|
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"
|
|
href="#eye-detection-tabs" role="tab" aria-controls="eye-detection-tabs"
|
|
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"
|
|
href="#departments-tabs-dental" role="tab" aria-controls="departments-tabs-dental"
|
|
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"
|
|
href="#departments-tabs-ophthalmology" role="tab" aria-controls="departments-tabs-ophthalmology"
|
|
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"
|
|
href="#departments-tabs-cardiology" role="tab" aria-controls="departments-tabs-cardiology"
|
|
aria-selected="false" data-aos="fade-up" data-aos-delay="300">Technologies</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-12">
|
|
<div class="tab-content department-content" id="specialty-content" data-aos="fade-up"
|
|
data-aos-delay="500">
|
|
|
|
<div class="tab-pane fade show active" id="camera-tabs" role="tabpanel"
|
|
aria-labelledby="neurology-tab">
|
|
<div class="row department-layout">
|
|
<div class="col-lg-4 order-lg-2">
|
|
<div class="department-image">
|
|
<img src="{{ asset('assets/users/assets/img/health/neurology-3.webp') }}" alt="Neurology Department" class="img-fluid">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-8 order-lg-1">
|
|
<div class="department-info">
|
|
<h2 class="department-title">Facial Expression Analysis</h2>
|
|
<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="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-person-bounding-box"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Face Detection</h4>
|
|
<p>Sistem mendeteksi area wajah pengguna secara real-time selama asesmen berlangsung.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-eye"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Eye Movement Tracking</h4>
|
|
<p>Pergerakan mata dan titik fokus pengguna dianalisis untuk memperoleh pola visual.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-emoji-neutral"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Emotion Observation</h4>
|
|
<p>Ekspresi wajah digunakan sebagai indikator tambahan dalam analisis kecemasan.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-cpu"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>AI Classification</h4>
|
|
<p>Model machine learning melakukan estimasi tingkat kecemasan berdasarkan data visual pengguna.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div><!-- End Camera Tab -->
|
|
|
|
<div class="tab-pane fade" id="eye-detection-tabs" role="tabpanel" aria-labelledby="surgery-tab">
|
|
<div class="row department-layout">
|
|
<div class="col-lg-4 order-lg-2">
|
|
<div class="department-image">
|
|
<img src="{{ asset('assets/users/assets/img/health/surgery-2.webp') }}" alt="Surgery Department" class="img-fluid">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-8 order-lg-1">
|
|
<div class="department-info">
|
|
<h2 class="department-title">Eye Tracking Analysis</h2>
|
|
<p class="department-description">
|
|
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>
|
|
|
|
<div class="row mt-4">
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-eye"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Gaze Tracking</h4>
|
|
<p>Sistem melacak arah pandangan dan titik fokus mata pengguna secara real-time.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-crosshair"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Fixation Analysis</h4>
|
|
<p>Durasi fokus pengguna pada area tertentu dianalisis untuk mendeteksi pola perhatian visual.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-grid-3x3-gap"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Heatmap Visualization</h4>
|
|
<p>Pergerakan mata divisualisasikan dalam bentuk heatmap untuk melihat distribusi perhatian pengguna.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-cpu"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>AI-Based Classification</h4>
|
|
<p>Model machine learning mengklasifikasikan tingkat kecemasan berdasarkan pola gaze pengguna.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div><!-- End Eye Detection Tab -->
|
|
|
|
<div class="tab-pane fade" id="departments-tabs-dental" role="tabpanel" aria-labelledby="dental-tab">
|
|
<div class="row department-layout">
|
|
<div class="col-lg-4 order-lg-2">
|
|
<div class="department-image">
|
|
<img src="{{ asset('assets/users/assets/img/health/dermatology-1.webp') }}" alt="Dental Care Department" class="img-fluid">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-8 order-lg-1">
|
|
<div class="department-info">
|
|
<h2 class="department-title">Result Visualization</h2>
|
|
<p class="department-description">
|
|
Sistem menampilkan hasil analisis eye tracking dan estimasi kecemasan dalam bentuk visualisasi data interaktif secara real-time.
|
|
Dashboard digunakan untuk membantu proses observasi, evaluasi, dan interpretasi hasil analisis pengguna.
|
|
</p>
|
|
|
|
<div class="row mt-4">
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-grid-3x3-gap"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Heatmap Analytics</h4>
|
|
<p>Visualisasi heatmap digunakan untuk melihat distribusi perhatian visual pengguna pada layar.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-activity"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Real-Time Monitoring</h4>
|
|
<p>Sistem memantau aktivitas pengguna dan data eye tracking secara langsung selama asesmen berlangsung.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-graph-up-arrow"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Anxiety Prediction</h4>
|
|
<p>Model machine learning menghasilkan estimasi tingkat kecemasan berdasarkan pola visual pengguna.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-display"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Interactive Dashboard</h4>
|
|
<p>Seluruh hasil analisis divisualisasikan melalui dashboard interaktif yang mudah dipahami.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div><!-- End Dental Tab -->
|
|
|
|
<div class="tab-pane fade" id="departments-tabs-ophthalmology" role="tabpanel"
|
|
aria-labelledby="ophthalmology-tab">
|
|
<div class="row department-layout">
|
|
<div class="col-lg-4 order-lg-2">
|
|
<div class="department-image">
|
|
<img src="{{ asset('assets/users/assets/img/health/pediatrics-4.webp') }}" alt="Ophthalmology Department" class="img-fluid">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-8 order-lg-1">
|
|
<div class="department-info">
|
|
<h2 class="department-title">Behavioral Analysis</h2>
|
|
<p class="department-description">
|
|
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="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-bullseye"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Attention Analysis</h4>
|
|
<p>Sistem mengevaluasi fokus dan perhatian visual pengguna selama proses asesmen berlangsung.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-emoji-neutral"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Facial Behavior</h4>
|
|
<p>Ekspresi wajah dianalisis untuk membantu mendeteksi perubahan perilaku emosional pengguna.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-diagram-3"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Pattern Recognition</h4>
|
|
<p>Model AI mengenali pola visual tertentu yang berkaitan dengan tingkat kecemasan pengguna.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-cpu"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>AI Assessment</h4>
|
|
<p>Machine learning menghasilkan estimasi tingkat kecemasan berdasarkan kombinasi data visual pengguna.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div><!-- End Ophthalmology Tab -->
|
|
|
|
<div class="tab-pane fade" id="departments-tabs-cardiology" role="tabpanel"
|
|
aria-labelledby="cardiology-tab">
|
|
<div class="row department-layout">
|
|
<div class="col-lg-4 order-lg-2">
|
|
<div class="department-image">
|
|
<img src="{{ asset('assets/users/assets/img/health/cardiology-3.webp') }}" alt="Cardiology Department" class="img-fluid">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-8 order-lg-1">
|
|
<div class="department-info">
|
|
<h2 class="department-title">Core Technologies</h2>
|
|
<p class="department-description">
|
|
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="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-eye"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Eye Tracking Device</h4>
|
|
<p>Perangkat eye tracker digunakan untuk menangkap koordinat dan pergerakan mata pengguna secara real-time.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-cpu"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Machine Learning</h4>
|
|
<p>Model AI menganalisis pola visual pengguna untuk menghasilkan estimasi tingkat kecemasan.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-wifi"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Real-Time Communication</h4>
|
|
<p>Teknologi WebSocket digunakan untuk mengirim data monitoring secara langsung dan responsif.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="service-item">
|
|
<div class="service-icon">
|
|
<i class="bi bi-display"></i>
|
|
</div>
|
|
<div class="service-content">
|
|
<h4>Interactive Dashboard</h4>
|
|
<p>Dashboard interaktif menampilkan visualisasi data, heatmap, dan hasil analisis AI secara real-time.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div><!-- End Cardiology Tab -->
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</section><!-- /Departments Tabs Section -->
|
|
|
|
<!-- Technologies Section -->
|
|
<section id="technologies" class="about section">
|
|
<div class="certifications-section" data-aos="fade-up" data-aos-delay="400">
|
|
<div class="row">
|
|
<div class="col-lg-12 text-center">
|
|
<h3>Technologies Used</h3>
|
|
<p class="section-description">Beberapa teknologi yang dipakai pada sistem ini</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-2 col-md-3 col-sm-4 col-6" data-aos="zoom-in" data-aos-delay="100">
|
|
<div class="certification-item">
|
|
<img src="{{ asset('assets/users/assets/img/logo/Tobii_Logo.png') }}" class="img-fluid" alt="Tobii Eye Tracking">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-2 col-md-3 col-sm-4 col-6" data-aos="zoom-in" data-aos-delay="200">
|
|
<div class="certification-item">
|
|
<img src="{{ asset('assets/users/assets/img/logo/Python_logo_and_wordmark.svg') }}" class="img-fluid" alt="Python">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-2 col-md-3 col-sm-4 col-6" data-aos="zoom-in" data-aos-delay="300">
|
|
<div class="certification-item">
|
|
<img src="{{ asset('assets/users/assets/img/logo/laravel_logo.png') }}" class="img-fluid" alt="Laravel Logo">
|
|
</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="certification-item">
|
|
<img src="{{ asset('assets/users/assets/img/logo/node-js.png') }}" class="img-fluid" alt="Node.js Logo">
|
|
</div>
|
|
</div>
|
|
</div><!-- End Certifications Row -->
|
|
</div><!-- End Certifications Section -->
|
|
</section>
|
|
@endsection |