---
title: "Sampling & Survey"
output: 
  flexdashboard::flex_dashboard:
    vertical_layout: scroll
    theme: yeti
    source_code: embed
---

<style>
/* =============================================
   UAS STATDAS — CLEAN SOFT BLUE THEME v2
   ============================================= */

/* ── 0. Custom Properties ─────────────────── */
:root {
  --uas-primary:       #1a6bbf;
  --uas-primary-dark:  #1a5a9e;
  --uas-primary-light: #5ba3e0;
  --uas-surface:       #ffffff;
  --uas-bg:            #eef4fb;
  --uas-border:        #d0e4f7;
  --uas-text:          #2d3a4a;
  --uas-text-muted:    #3a4f65;
  --uas-info-bg:       #f0f7ff;
  --uas-shadow:        rgba(26, 107, 191, 0.10);
  --uas-radius-sm:     6px;
  --uas-radius-md:     8px;
  --uas-radius-lg:     10px;
}

/* ── 1. Base ──────────────────────────────── */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html, body {
  font-family: 'Segoe UI', system-ui, Tahoma, Geneva, Verdana, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  background-color: var(--uas-bg);
  color: var(--uas-text);
  overflow-y: auto;
  height: auto;
  scroll-behavior: smooth;
}

h1, h2, h3 { color: var(--uas-primary-dark); }
h4, h5     { color: var(--uas-primary); }

p          { color: var(--uas-text-muted); line-height: 1.75; }
ul li,
ol li      { color: var(--uas-text-muted); line-height: 1.7; margin-bottom: 4px; }
strong     { color: var(--uas-primary-dark); }

/* ── 2. Navbar ────────────────────────────── */
.navbar {
  background-color: var(--uas-primary) !important;
  border-bottom: 3px solid var(--uas-primary-light);
  box-shadow: 0 2px 8px rgba(26, 107, 191, 0.25);
}

.navbar-brand {
  font-weight: 700;
  font-size: 20px;
  color: #ffffff !important;
  letter-spacing: 0.3px;
}

.navbar-nav > li > a {
  color: #d6eaff !important;
  font-weight: 500;
  transition: background 0.15s ease, color 0.15s ease;
}

.navbar-nav > li > a:hover,
.navbar-nav > li.active > a {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.18) !important;
  border-radius: var(--uas-radius-sm);
}

/* ── 3. Chart Box ─────────────────────────── */
.chart-wrapper {
  background-color: var(--uas-surface);
  border: 1px solid var(--uas-border);
  border-radius: var(--uas-radius-lg);
  box-shadow: 0 3px 12px var(--uas-shadow);
  margin-bottom: 20px;
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}

.chart-wrapper:hover {
  box-shadow: 0 5px 18px rgba(26, 107, 191, 0.15);
}

.chart-stage {
  overflow: visible;
  height: auto;
}

/* ── 4. Chart Title ───────────────────────── */
.chart-title {
  font-weight: 600;
  font-size: 13px;
  color: var(--uas-primary);
  background-color: var(--uas-info-bg);
  border-bottom: 1px solid var(--uas-border);
  padding: 10px 15px;
  border-radius: var(--uas-radius-lg) var(--uas-radius-lg) 0 0;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

/* ── 5. Tabs ──────────────────────────────── */
.nav-tabs {
  border-bottom: 2px solid #aed0f0;
}

.nav-tabs > li > a {
  color: #5590c7;
  font-weight: 500;
  font-size: 13px;
  background-color: #f5f9ff;
  border: 1px solid #cce0f5;
  border-radius: var(--uas-radius-sm) var(--uas-radius-sm) 0 0;
  margin-right: 3px;
  transition: background 0.15s ease, color 0.15s ease;
}

.nav-tabs > li > a:hover {
  color: var(--uas-primary);
  background-color: #dceeff;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
  color: #ffffff !important;
  background-color: var(--uas-primary) !important;
  border-color: var(--uas-primary) !important;
  font-weight: 600;
}

.nav-tabs-custom > .nav-tabs > li.active {
  border-top-color: var(--uas-primary);
}

/* ── 6. Interpretasi Box ──────────────────── */
.interpretasi-box {
  background-color: var(--uas-info-bg);
  border-left: 5px solid var(--uas-primary);
  padding: 13px 16px;
  margin-top: 12px;
  margin-bottom: 20px;
  border-radius: 0 var(--uas-radius-md) var(--uas-radius-md) 0;
  box-shadow: 0 2px 6px rgba(26, 107, 191, 0.07);
}

.interpretasi-box p {
  margin: 0;
  text-align: justify;
}

.interpretasi-title {
  display: block;
  font-weight: 700;
  font-size: 11px;
  color: var(--uas-primary);
  text-transform: uppercase;
  letter-spacing: 0.6px;
  margin-bottom: 5px;
}

/* ── 7. Info / Kesimpulan Box ─────────────── */
.custom-info-box {
  background-color: var(--uas-surface);
  border-left: 5px solid var(--uas-primary-light);
  padding: 16px 20px;
  margin-bottom: 18px;
  border-radius: 0 var(--uas-radius-md) var(--uas-radius-md) 0;
  box-shadow: 0 3px 10px var(--uas-shadow);
}

/* ── 8. DataTables ────────────────────────── */
.dataTables_wrapper {
  font-size: 13.5px;
}

table.dataTable thead th {
  background-color: var(--uas-primary);
  color: #ffffff;
  border-bottom: 2px solid var(--uas-primary-light);
  font-weight: 600;
  letter-spacing: 0.2px;
}

table.dataTable tbody tr:nth-child(odd)  { background-color: #f5f9ff; }
table.dataTable tbody tr:nth-child(even) { background-color: #ffffff; }
table.dataTable tbody tr:hover           { background-color: #e8f2fc !important; }

/* ── 9. Scrollbar ─────────────────────────── */
::-webkit-scrollbar       { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--uas-bg); }
::-webkit-scrollbar-thumb {
  background-color: #90bde8;
  border-radius: 10px;
  transition: background 0.2s ease;
}
::-webkit-scrollbar-thumb:hover {
  background-color: var(--uas-primary);
}
</style>
  
```{r setup, include=FALSE}
packages <- c(
  "flexdashboard",
  "tidyverse",
  "highcharter",
  "viridis",
  "DT",
  "gapminder",
  "jsonlite"
)

installed <- packages %in% rownames(installed.packages())
if (any(!installed)) {
  install.packages(packages[!installed])
}

# Load library
library(flexdashboard)
library(tidyverse)
library(highcharter)
library(viridis)
library(DT)
library(gapminder)
library(jsonlite)
```

MEMBERS {data-orientation=rows}
=======================================================================

```{r}
library(htmltools)

tags$div(
  tags$style(HTML("
  
    body{
      background:#ffffff;
      font-family: 'Poppins', sans-serif;
    }

    .card-container {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 25px;
      padding: 30px;
      justify-content: center;
    }

    .my-profile-card {
      position: relative;
      background: #ffffff;
      border: 1px solid #e5e5e5;
      border-radius: 25px;
      padding: 25px;
      text-align: center;
      overflow: hidden;
      transition: all 0.4s ease;
      cursor: pointer;
      min-height: 350px;
      color: #222;
      box-shadow: 0 5px 18px rgba(0,0,0,0.08);
    }

    .my-profile-card:hover {
      transform: scale(1.06);
      box-shadow: 0 12px 35px rgba(0,0,0,0.18);
    }

    .my-profile-card img {
      width: 140px;
      height: 180px;
      object-fit: cover;
      border-radius: 20px;
      margin-bottom: 15px;
      transition: 0.4s ease;
    }

    .my-profile-card:hover img{
      transform: scale(1.05);
    }

    .my-profile-card h3{
      margin-bottom: 5px;
      font-size: 22px;
      color:#111;
    }

    .my-profile-card p{
      font-size: 14px;
      margin-bottom: 10px;
      color:#444;
    }

    .my-badge {
      display: inline-block;
      padding: 6px 12px;
      border-radius: 20px;
      font-size: 11px;
      color: white;
      margin: 3px;
      font-weight: bold;
    }

    .desc {
      opacity: 0;
      max-height: 0;
      overflow: hidden;
      transition: all 0.5s ease;
      font-size: 13px;
      line-height: 1.6;
      margin-top: 15px;
      color:#333;
    }

    .my-profile-card:hover .desc{
      opacity: 1;
      max-height: 300px;
    }

    .title-main{
      text-align:center;
      color:#111;
      font-size:42px;
      font-weight:700;
      margin-top:20px;
    }

    .subtitle{
      text-align:center;
      color:#666;
      margin-bottom:20px;
    }

  ")),

  tags$h1(class="title-main","Pembagian Peran Kelompok"),
  tags$p(class="subtitle","Survey & Sampling Project"),

  tags$div(class = "card-container",

# CHANDRA
tags$div(class = "my-profile-card",

  tags$img(src = "https://raw.githubusercontent.com/adindaadeliafutri6-gif/chandraa/main/chandra-removebg-preview.png"),

  tags$h3("Chandra Rizal Alamsyah"),
  tags$p(tags$strong("NIM: "), "52250068"),

  tags$div(
    tags$span(class = "my-badge", style = "background:#007bff", "R Programming"),
    tags$span(class = "my-badge", style = "background:#28a745", "Data Science")
  ),

  tags$div(class="desc",
    tags$b("Pengolahan Data Menggunakan RStudio"),
    tags$p("Bertugas melakukan pembersihan data, pengolahan statistik, perhitungan Margin of Error, serta membuat visualisasi data menggunakan RStudio dan RPubs.")
  )
),

# ADINDA
tags$div(class = "my-profile-card",

  tags$img(src = "https://raw.githubusercontent.com/caroldupinopereira-cmyk/adinda/main/adinda_baru-removebg-preview.png"),

  tags$h3("Adinda Adelia Futri"),
  tags$p(tags$strong("NIM: "), "52250055"),

  tags$div(
    tags$span(class = "my-badge", style = "background:#17a2b8", "Analytics"),
    tags$span(class = "my-badge", style = "background:#28a745", "Statistics")
  ),

  tags$div(class="desc",
    tags$b("Penyusunan Instrumen Survei"),
    tags$p("Bertugas menyusun pertanyaan kuesioner, menentukan variabel penelitian, serta memastikan pertanyaan sesuai dengan tujuan survei mengenai gaya hidup dan kualitas belajar mahasiswa.")
  )
),

# LULU
tags$div(class = "my-profile-card",

  tags$img(src = "https://raw.githubusercontent.com/najlasalsabilalulu-cloud/lulunajlaa/main/foto%20lulu.jpeg"),

  tags$h3("Lulu Najla Salsabila"),
  tags$p(tags$strong("NIM: "), "52250069"),

  tags$div(
    tags$span(class = "my-badge", style = "background:#ffc107", "Presentation"),
    tags$span(class = "my-badge", style = "background:#6610f2", "Documentation")
  ),

  tags$div(class="desc",
    tags$b("Interpretasi dan Dokumentasi Hasil"),
    tags$p("Bertugas melakukan interpretasi hasil analisis, menyusun kesimpulan penelitian, serta membuat dokumentasi dan presentasi hasil survei dalam Canva dan RPubs.")
  )
),

# VERONICA
tags$div(class = "my-profile-card",

  tags$img(src = "https://raw.githubusercontent.com/adindaadeliafutri6-gif/vero/main/vero.jpeg"),

  tags$h3("Veronica Xavier"),
  tags$p(tags$strong("NIM: "), "52250021"),

  tags$div(
    tags$span(class = "my-badge", style = "background:#dc3545", "Sampling"),
    tags$span(class = "my-badge", style = "background:#6c757d", "Survey")
  ),

  tags$div(class="desc",
    tags$b("Pengumpulan dan Sampling Data"),
    tags$p("Bertugas menentukan teknik sampling, menyebarkan survei kepada responden, serta mengumpulkan data responden yang digunakan dalam penelitian.")
  )
)

  )
)
```


Pendahuluan {data-orientation=rows}
=======================================================================

Row
-----------------------------------------------------------------------

### Latar Belakang

Gaya hidup mahasiswa merupakan salah satu faktor yang dapat mempengaruhi kualitas belajar. Gaya hidup mencakup berbagai kebiasaan sehari-hari seperti pola tidur, penggunaan gadget, aktivitas fisik, serta kebiasaan lain yang dapat berdampak pada proses belajar. Saat ini banyak mahasiswa memiliki kebiasaan seperti begadang, penggunaan media sosial yang tinggi, serta menunda pengerjaan tugas.

Kebiasaan tersebut dapat mempengaruhi konsentrasi belajar, pemahaman materi, serta produktivitas mahasiswa dalam kegiatan akademik. Oleh karena itu, perlu dilakukan survei untuk mengetahui bagaimana gaya hidup mahasiswa berpengaruh terhadap kualitas belajar mereka.

Row
-----------------------------------------------------------------------

### Tujuan Penelitian

Analisis data ini bertujuan untuk:

1.	Mengetahui gaya hidup mahasiswa ITSB.

2.	Mengetahui kualitas belajar mahasiswa ITSB.

3.	Mengetahui pengaruh gaya hidup terhadap kualitas belajar mahasiswa

Row
-----------------------------------------------------------------------

### Rumusan Masalah

Berdasarkan latar belakang tersebut, penelitian ini mencoba menjawab pertanyaan:

1.	Bagaimana gaya hidup mahasiswa ITSB dalam kehidupan sehari-hari?

2.	Bagaimana kualitas belajar mahasiswa ITSB?

3.	Apakah gaya hidup mahasiswa mempengaruhi kualitas belajar mahasiswa?


Dataset {data-orientation=rows}
=======================================================================
  
### Table
```{r}
# 1. Load Library
library(readxl)
library(dplyr)
library(DT)
library(janitor)

# 2. Membaca file Excel
df <- readxl::read_excel("C:/Users/Adinda/Downloads/Sampling kel 5(Jawaban).xlsx") %>% 
  janitor::clean_names()

# 3. Manipulasi Data (Disederhanakan)
df1 <- df %>% 
  # Kita matikan dulu fungsi distinct dan filter untuk mengecek data asli
  # dplyr::distinct(across(contains("name")), .keep_all = TRUE) %>% 
  # filter(across(contains("rating"), ~ .x >= 4.5)) %>% 
  select(everything()) 

# 4. Menampilkan tabel
datatable(
  df1, 
  options = list(
    scrollX = TRUE, 
    pageLength = 10
  ),
  caption = htmltools::tags$caption(
    style = 'caption-side: bottom; text-align: center;',
    'Table: Data Sampling Kelompok 5 (Cek Seluruh Baris)'
  )
)
```

Metodologi & Sampling {data-orientation=rows}
=======================================================================

Row
-----------------------------------------------------------------------

### Metode Pengambilan Sampel

Penelitian ini menggunakan teknik **Non-Probability Sampling**, khususnya **Convenience Sampling**. Responden dipilih berdasarkan kesediaan dan aksesibilitas peneliti terhadap populasi mahasiswa. Meskipun metode ini memiliki keterbatasan dalam generalisasi ke seluruh populasi mahasiswa secara luas, hasil yang diperoleh memberikan gambaran awal yang signifikan mengenai tren gaya hidup di lingkungan akademik terkait.

Row
-----------------------------------------------------------------------

### Landasan Probabilitas & Teori

Setiap butir pertanyaan dalam kuesioner ini dipandang sebagai sebuah **Variabel Acak Bernoulli**, di mana hasil dari setiap responden hanya memiliki dua kemungkinan (Ya atau Tidak). Secara kolektif, jawaban-jawaban ini membentuk **Distribusi Binomial**. Kami menggunakan pendekatan **Distribusi Normal** (melalui *Central Limit Theorem*) untuk mengestimasi proporsi populasi berdasarkan sampel yang ada.

Row
-----------------------------------------------------------------------

### Estimasi Statistik (Confidence Interval 95%)

Untuk mengukur tingkat kepercayaan dari data yang dikumpulkan, kami menerapkan perhitungan **Interval Kepercayaan (CI)**. Kami menggunakan tingkat kepercayaan **95%** dengan nilai kritis **Z = 1.96**.

**Rumus Estimasi Proporsi:**
$$ \hat{p} \pm 1.96 \times \sqrt{\frac{\hat{p}(1-\hat{p})}{n}} $$

Di mana:
* **$\hat{p}$**: Proporsi responden yang menjawab "Ya" pada sampel.
* **$n$**: Ukuran sampel (total responden).

Row
-----------------------------------------------------------------------

### Visualisasi Teori: Kurva Distribusi Normal (Z-Score)

```{r}
library(plotly)

# Simulasi Kurva Normal Standar
x_val <- seq(-4, 4, length.out = 1000)
y_val <- dnorm(x_val)

# Membuat plot kurva normal standar dengan Plotly
p_norm <- plot_ly(x = ~x_val, y = ~y_val, type = 'scatter', mode = 'lines', 
                  line = list(color = '#7BAFC4', width = 3),
                  name = 'Normal Dist') %>%
  # Menambahkan area shading 95%
  add_polygons(x = c(-1.96, seq(-1.96, 1.96, length.out = 100), 1.96),
               y = c(0, dnorm(seq(-1.96, 1.96, length.out = 100)), 0),
               fillcolor = 'rgba(168, 216, 200, 0.5)',
               line = list(color = 'transparent'),
               name = '95% Confidence Level',
               hoverinfo = "none") %>%
  layout(title = "Distribusi Normal: Area Kepercayaan 95% (Z = 1.96)",
         xaxis = list(title = "Z-Score", range = c(-4, 4)),
         yaxis = list(title = "Density"),
         showlegend = FALSE)

p_norm
```

Row
-----------------------------------------------------------------------

### Visualisasi Aplikasi: Margin of Error Variabel Utama

```{r}
# Fungsi hitung CI otomatis
calc_ci <- function(var_name, label) {
  n <- nrow(df)
  p_hat <- sum(df[[var_name]] == "Ya", na.rm = TRUE) / n
  moe <- 1.96 * sqrt((p_hat * (1 - p_hat)) / n)
  return(data.frame(Variabel = label, Proporsi = p_hat, Lower = p_hat - moe, Upper = p_hat + moe))
}

# Mengambil 3 variabel kunci untuk contoh
ci_results <- rbind(
  calc_ci("saya_mampu_menjelaskan_kembali_materi_yang_telah_dipelajari", "Pemahaman Materi"),
  calc_ci("saya_sering_begadang_untuk_aktivitas_non_akademik", "Sering Begadang"),
  calc_ci("saya_menggunakan_gadget_lebih_dari_tiga_jam_per_hari_di_luar_keperluan_belajar", "Gadget > 3 Jam")
)

# Plotting Error Bars menggunakan Plotly
plot_ly(ci_results, x = ~Proporsi, y = ~reorder(Variabel, Proporsi), 
        type = 'scatter', mode = 'markers',
        marker = list(size = 14, color = '#FBBE89', symbol = 'diamond'),
        error_x = list(type = 'data', 
                       array = ~Upper - Proporsi, 
                       thickness = 2,
                       width = 5,
                       color = '#F4A87A')) %>%
  layout(title = "Estimasi Proporsi Populasi (Margin of Error)",
         xaxis = list(title = "Proporsi (0 - 1)", range = c(0, 1), tickformat = ".0%"),
         yaxis = list(title = ""))
```

Row
-----------------------------------------------------------------------

### Ringkasan Validitas Sampel

```{r}
n_total <- nrow(df)
# Menghitung MoE konservatif (p=0.5) untuk keseluruhan dataset
avg_moe <- 1.96 * sqrt((0.5 * 0.5) / n_total)
```

Statistik Akhir:

* Total Responden ($n$): r n_total Mahasiswa

* Tingkat Kepercayaan: 95%

* Maksimum Margin of Error: ±r round(avg_moe * 100, 2)%

Kesimpulan Metodologi: Dengan jumlah responden sebanyak r n_total dan Margin of Error yang terkendali, data ini memiliki tingkat validitas yang cukup untuk menggambarkan perilaku kelompok mahasiswa dalam ruang lingkup survei ini. Hasil analisis pada tab berikutnya harus dibaca dengan mempertimbangkan rentang kesalahan ini.


Pemeriksaan Variabel Individu {data-orientation=rows}
=======================================================================

Row
-----------------------------------------------------------------------

### Analisis Distribusi Variabel Mandiri

Bagian ini menyajikan pemeriksaan mendalam terhadap setiap variabel yang dikumpulkan dalam survei. Kami menggunakan visualisasi bar chart untuk melihat kecenderungan perilaku mahasiswa secara individu sebelum melakukan analisis korelasi lebih lanjut.

Row {.tabset .tabset-fade}
-----------------------------------------------------------------------

### Program Studi

```{r}
library(plotly)
library(dplyr)

# Menghitung data prodi dan diurutkan agar yang terbanyak di atas
prodi_data <- df %>%
  group_by(program_studi) %>%
  summarise(Total = n()) %>%
  arrange(Total) # Diurutkan untuk tampilan tangga yang rapi

# Visualisasi Bar Chart Horizontal
plot_ly(prodi_data, 
        x = ~Total, 
        y = ~reorder(program_studi, Total), # Mengurutkan nama prodi berdasarkan jumlah
        type = 'bar', 
        orientation = 'h', # 'h' untuk horizontal
        marker = list(color = '#7EC8E3', # Warna biru soft pastel
                      line = list(color = '#5BAFD4', width = 1.5)),
        text = ~Total, 
        textposition = 'outside') %>%
  layout(title = "Distribusi Responden Berdasarkan Program Studi",
         xaxis = list(title = "Jumlah Mahasiswa"),
         yaxis = list(title = ""),
         margin = list(l = 150)) # Memberi ruang lebih di kiri untuk nama prodi yang panjang
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Penggunaan grafik batang horizontal ini dipilih untuk memberikan ruang baca yang lebih baik bagi nama-nama Program Studi responden. Urutan batang menunjukkan kontribusi data dari yang terkecil hingga terbesar, memudahkan kita mengidentifikasi kelompok responden mana yang paling dominan dalam survei ini.

Row
-----------------------------------------------------------------------

### Jenis Kelamin
  
```{r}
library(plotly)
library(dplyr)

# Menghitung data jenis kelamin
gender_data <- df %>%
  group_by(jenis_kelamin) %>%
  summarise(Total = n())

# Visualisasi Bar Chart Vertikal
plot_ly(gender_data, 
        x = ~jenis_kelamin, 
        y = ~Total, 
        type = 'bar', 
        marker = list(color = c('#7EC8E3', '#F4A7B9'), # Biru untuk Laki-laki, Pink untuk Perempuan (opsional)
                      line = list(color = '#B0C4D8', width = 1.5)),
        text = ~Total, 
        textposition = 'auto') %>%
  layout(title = "Distribusi Responden Berdasarkan Jenis Kelamin",
         xaxis = list(title = "Jenis Kelamin"),
         yaxis = list(title = "Jumlah Mahasiswa"),
         bargap = 0.5) # Memberi jarak antar batang agar tidak terlalu rapat
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Grafik ini menunjukkan perbandingan jumlah responden laki-laki dan perempuan. Keseimbangan partisipasi antar gender ini penting untuk memastikan bahwa data gaya hidup yang terkumpul bersifat representatif dan tidak bias terhadap satu kelompok gender tertentu saja.

Row
-----------------------------------------------------------------------

### Kualitas Tidur
  
```{r}
library(plotly)
library(dplyr)

# Menghitung data berdasarkan dua variabel (Kualitas Tidur & Jenis Kelamin)
tidur_gender_data <- df %>%
  group_by(saya_tidur_cukup_7_8_jam_dalam_sehari, jenis_kelamin) %>%
  summarise(Total = n(), .groups = 'drop')

# Visualisasi Grouped Bar Chart
plot_ly(tidur_gender_data, 
        x = ~saya_tidur_cukup_7_8_jam_dalam_sehari, 
        y = ~Total, 
        color = ~jenis_kelamin, # Membedakan warna berdasarkan gender
        type = 'bar', 
        colors = c('#7EC8E3', '#F4A7B9'), # Biru untuk Laki-laki, Pink untuk Perempuan
        text = ~Total, 
        textposition = 'auto') %>%
  layout(title = "Kecukupan Tidur Mahasiswa (Bedah per Gender)",
         xaxis = list(title = "Apakah Tidur Cukup (7-8 Jam)?"),
         yaxis = list(title = "Jumlah Mahasiswa"),
         barmode = 'group', # Membuat batang berdampingan
         legend = list(title = list(text = '<b> Jenis Kelamin </b>')))
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Dengan membedah data berdasarkan gender, kita dapat melihat pola distribusi kualitas tidur yang lebih spesifik. Visualisasi ini membantu kita mengidentifikasi apakah masalah kurang tidur (jawaban "Tidak") didominasi oleh kelompok gender tertentu atau tersebar merata. Data ini sangat berguna untuk memberikan rekomendasi kesehatan yang lebih personal di lingkungan kampus.

Row
-----------------------------------------------------------------------

### Aktivitas Fisik

```{r}
library(plotly)
library(dplyr)

# Menghitung data: Aktivitas Fisik vs Jenis Kelamin
olahraga_gender_data <- df %>%
  group_by(saya_berolahraga_minimal_satu_kali_dalam_seminggu, jenis_kelamin) %>%
  summarise(Total = n(), .groups = 'drop')

# Visualisasi Grouped Bar Chart
plot_ly(olahraga_gender_data, 
        x = ~saya_berolahraga_minimal_satu_kali_dalam_seminggu, 
        y = ~Total, 
        color = ~jenis_kelamin, 
        type = 'bar', 
        # Konsisten: Biru untuk Laki-laki, Pink untuk Perempuan
        colors = c('#7EC8E3', '#F4A7B9'), 
        text = ~Total, 
        textposition = 'auto') %>%
  layout(title = "Kedisiplinan Olahraga (Bedah per Gender)",
         xaxis = list(title = "Olahraga Minimal 1x Seminggu?"),
         yaxis = list(title = "Jumlah Mahasiswa"),
         barmode = 'group', # Batang berdiri berdampingan
         legend = list(title = list(text = '<b> Jenis Kelamin </b>')),
         bargap = 0.2,
         bargroupgap = 0.1)
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Visualisasi ini membandingkan tingkat partisipasi aktivitas fisik mingguan antara mahasiswa laki-laki dan perempuan. Analisis ini membantu kita memahami apakah gaya hidup sehat terdistribusi secara merata di seluruh spektrum gender responden, atau terdapat kecenderungan kelompok tertentu yang lebih aktif secara fisik. Data ini krusial untuk perancangan fasilitas atau kegiatan olahraga kampus yang lebih inklusif.

Row
-----------------------------------------------------------------------

### Penggunaan Gadget

```{r}
library(plotly)
library(dplyr)

# Menghitung data: Penggunaan Gadget vs Jenis Kelamin
gadget_gender_data <- df %>%
  group_by(saya_menggunakan_gadget_lebih_dari_tiga_jam_per_hari_di_luar_keperluan_belajar, jenis_kelamin) %>%
  summarise(Total = n(), .groups = 'drop')

# Visualisasi Grouped Bar Chart
plot_ly(gadget_gender_data, 
        x = ~saya_menggunakan_gadget_lebih_dari_tiga_jam_per_hari_di_luar_keperluan_belajar, 
        y = ~Total, 
        color = ~jenis_kelamin, 
        type = 'bar', 
        # Konsisten: Biru untuk Laki-laki, Pink untuk Perempuan
        colors = c('#7EC8E3', '#F4A7B9'), 
        text = ~Total, 
        textposition = 'auto') %>%
  layout(title = "Penggunaan Gadget > 3 Jam/Hari",
         xaxis = list(title = "Gunakan Gadget > 3 Jam di Luar Belajar?"),
         yaxis = list(title = "Jumlah Mahasiswa"),
         barmode = 'group', # Batang berdiri berdampingan
         legend = list(title = list(text = '<b> Jenis Kelamin </b>')),
         bargap = 0.2,
         bargroupgap = 0.1)
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Data ini membedah pola konsumsi digital mahasiswa di luar kebutuhan akademik. Tingginya angka pada kategori "Ya" menunjukkan potensi distraksi digital yang signifikan. Dengan melihat distribusi berdasarkan gender, kita dapat memahami apakah kecenderungan ketergantungan gadget ini merata atau didominasi oleh kelompok tertentu, yang nantinya berpengaruh pada rekomendasi manajemen waktu belajar.

Row
-----------------------------------------------------------------------

### Pemahaman Materi

```{r}
library(plotly)
library(dplyr)

# Menghitung data: Pemahaman Materi vs Jenis Kelamin
paham_gender_data <- df %>%
  group_by(saya_mampu_menjelaskan_kembali_materi_yang_telah_dipelajari, jenis_kelamin) %>%
  summarise(Total = n(), .groups = 'drop')

# Visualisasi Grouped Bar Chart
plot_ly(paham_gender_data, 
        x = ~saya_mampu_menjelaskan_kembali_materi_yang_telah_dipelajari, 
        y = ~Total, 
        color = ~jenis_kelamin, 
        type = 'bar', 
        # Konsisten: Biru untuk Laki-laki, Pink untuk Perempuan
        colors = c('#7EC8E3', '#F4A7B9'), 
        text = ~Total, 
        textposition = 'auto') %>%
  layout(title = "Kemampuan Menjelaskan Kembali Materi (Bedah per Gender)",
         xaxis = list(title = "Mampu Menjelaskan Kembali Materi?"),
         yaxis = list(title = "Jumlah Mahasiswa"),
         barmode = 'group', 
         legend = list(title = list(text = '<b> Jenis Kelamin </b>')),
         bargap = 0.2,
         bargroupgap = 0.1)
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Kemampuan menjelaskan kembali materi adalah indikator tertinggi dari pemahaman (deep learning). Visualisasi ini menunjukkan efektivitas belajar responden. Jika terdapat perbedaan signifikan antar gender, hal ini bisa menjadi bahan diskusi mengenai gaya belajar atau metode penyerapan informasi yang berbeda antara mahasiswa laki-laki dan perempuan di kelas.

Row
-----------------------------------------------------------------------

### Kesimpulan

Berdasarkan rangkaian pemeriksaan variabel individu dan analisis lintas gender yang telah dilakukan melalui dashboard ini, berikut adalah poin-poin kesimpulan utama:

* **Temuan Utama :**

1. **Dominasi Responden:** Mayoritas data berasal dari mahasiswa **Program Studi Sains Data**, dengan komposisi gender yang cukup berimbang, sehingga memberikan gambaran perilaku yang cukup representatif untuk lingkungan prodi terkait.
2. **Krisis Istirahat:** Terdapat indikasi bahwa sebagian besar mahasiswa (baik laki-laki maupun perempuan) mengalami kendala dalam memenuhi standar tidur 7-8 jam sehari. Hal ini menjadi catatan penting bagi kesehatan mental dan fisik mahasiswa.
3. **Pola Aktivitas Fisik:** Kedisiplinan berolahraga minimal satu kali seminggu masih menunjukkan angka yang perlu ditingkatkan. Analisis per gender memperlihatkan adanya variasi tingkat keaktifan fisik yang dapat memengaruhi kebugaran selama perkuliahan.
4. **Distraksi Digital:** Penggunaan gadget di atas 3 jam per hari untuk keperluan non-akademik terpantau cukup tinggi. Faktor ini teridentifikasi sebagai salah satu potensi hambatan utama dalam menjaga durasi konsentrasi belajar yang efektif.
5. **Capaian Kognitif:** Meskipun menghadapi tantangan dalam pola tidur dan distraksi gadget, sebagian responden masih merasa mampu menjelaskan kembali materi yang dipelajari. Namun, optimalisasi gaya hidup sehat diprediksi akan meningkatkan kualitas pemahaman ini ke level yang lebih maksimal.

* **Rekomendasi :** 

* **Manajemen Waktu:** Mahasiswa disarankan untuk mengevaluasi durasi penggunaan gadget dan mulai menerapkan prioritas waktu istirahat (tidur) guna menjaga ketahanan fokus.
* **Inisiatif Kesehatan:** Perlunya dorongan untuk meningkatkan aktivitas fisik mingguan sebagai sarana *stress release* dan penjaga kebugaran kognitif.
* **Kesadaran Metakognisi:** Mempertahankan kebiasaan menjelaskan kembali materi sebagai metode belajar efektif, sambil meminimalisir distraksi lingkungan saat belajar mandiri.

* **Pernyataan Penutup :**

Dashboard ini telah berhasil memetakan variabel gaya hidup responden dengan pendekatan statistika deskriptif interaktif. Data ini diharapkan dapat menjadi fondasi awal bagi penelitian lebih lanjut mengenai faktor-faktor yang memengaruhi keberhasilan akademik mahasiswa di masa depan.

Appendix {data-orientation=rows}
=======================================================================

Row {.tabset .tabset-fade}
-----------------------------------------------------------------------

### Prodi & Jenis Kelamin

```{r}
# Analisis sebaran gender di tiap prodi
prodi_gender <- df %>%
  group_by(program_studi, jenis_kelamin) %>%
  summarise(Jumlah = n(), .groups = 'drop')

plot_ly(prodi_gender, x = ~program_studi, y = ~Jumlah, color = ~jenis_kelamin, 
        type = 'bar', colors = c('#7EC8E3', '#F4A7B9')) %>%
  layout(title = "Distribusi Program Studi & Jenis Kelamin",
         barmode = 'stack', xaxis = list(title = ""), yaxis = list(title = "Jumlah"))
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Visualisasi ini menunjukkan komposisi gender dalam setiap program studi. Hal ini penting untuk melihat apakah ada dominasi gender tertentu pada prodi spesifik yang mungkin memengaruhi hasil survei secara keseluruhan.

Row
-----------------------------------------------------------------------

### Prodi & Kualitas Tidur

```{r}
# Analisis kecukupan tidur per program studi
prodi_tidur <- df %>%
  group_by(program_studi, saya_tidur_cukup_7_8_jam_dalam_sehari) %>%
  summarise(Jumlah = n(), .groups = 'drop')

plot_ly(prodi_tidur, x = ~program_studi, y = ~Jumlah, 
        color = ~saya_tidur_cukup_7_8_jam_dalam_sehari, 
        type = 'bar', colors = c('#F4A7A7', '#A8D8A8')) %>%
  layout(title = "Hubungan Prodi dengan Kualitas Tidur",
         barmode = 'group', xaxis = list(title = ""))
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Grafik ini membandingkan kecukupan tidur antar program studi. Perbedaan mencolok pada batang "Tidak" di prodi tertentu dapat mengindikasikan adanya beban akademik atau kultur belajar yang berbeda yang berdampak pada jam istirahat mahasiswa.

Row
-----------------------------------------------------------------------

### Prodi & Gadget

```{r}
# Analisis penggunaan gadget per prodi
prodi_gadget <- df %>%
  group_by(program_studi, saya_menggunakan_gadget_lebih_dari_tiga_jam_per_hari_di_luar_keperluan_belajar) %>%
  summarise(Jumlah = n(), .groups = 'drop')

plot_ly(prodi_gadget, x = ~program_studi, y = ~Jumlah, 
        color = ~saya_menggunakan_gadget_lebih_dari_tiga_jam_per_hari_di_luar_keperluan_belajar, 
        type = 'bar', colors = c('#F9E4A0', '#B0C4DE')) %>%
  layout(title = "Distraksi Gadget per Program Studi",
         barmode = 'stack', xaxis = list(title = ""))
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Tabulasi ini memperlihatkan tingkat ketergantungan gadget di luar jam belajar pada setiap program studi. Jika angka penggunaan gadget tinggi (batang kuning), ini menunjukkan adanya potensi distraksi digital yang merata di berbagai disiplin ilmu.

Row
-----------------------------------------------------------------------

### Jenis Kelamin & Olahraga

```{r}
# Analisis kebiasaan olahraga berdasarkan gender
gender_olahraga <- df %>%
  group_by(jenis_kelamin, saya_berolahraga_minimal_satu_kali_dalam_seminggu) %>%
  summarise(Jumlah = n(), .groups = 'drop')

plot_ly(gender_olahraga, x = ~jenis_kelamin, y = ~Jumlah, 
        color = ~saya_berolahraga_minimal_satu_kali_dalam_seminggu, 
        type = 'bar', colors = c('#FBBE89', '#A8D8B0')) %>%
  layout(title = "Aktivitas Fisik Berdasarkan Gender",
         barmode = 'group')
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Analisis ini membedah kedisiplinan olahraga antara mahasiswa laki-laki dan perempuan. Ini memberikan wawasan apakah gaya hidup sehat (aktivitas fisik) dipengaruhi oleh faktor gender atau cenderung memiliki pola yang sama.

Row
-----------------------------------------------------------------------

### Jenis Kelamin & Pemahaman

```{r}
# Analisis kemampuan menjelaskan materi berdasarkan gender
gender_paham <- df %>%
  group_by(jenis_kelamin, saya_mampu_menjelaskan_kembali_materi_yang_telah_dipelajari) %>%
  summarise(Jumlah = n(), .groups = 'drop')

plot_ly(gender_paham, x = ~jenis_kelamin, y = ~Jumlah, 
        color = ~saya_mampu_menjelaskan_kembali_materi_yang_telah_dipelajari, 
        type = 'bar', colors = c('#C9B1D9', '#96D9C9')) %>%
  layout(title = "Tingkat Pemahaman Materi per Gender",
         barmode = 'group')
```

Row
-----------------------------------------------------------------------

### Interpretasi:

Grafik ini mengevaluasi apakah tingkat pemahaman materi (metakognisi) memiliki perbedaan signifikan antara gender. Hasil ini berguna untuk melihat efektivitas belajar mandiri dari perspektif demografis.

Row
-----------------------------------------------------------------------