{"id":1061,"date":"2026-07-05T23:39:17","date_gmt":"2026-07-05T15:39:17","guid":{"rendered":"https:\/\/idealslearning.cite.hku.hk\/?page_id=1061"},"modified":"2026-07-15T20:43:03","modified_gmt":"2026-07-15T12:43:03","slug":"dlav-%e5%ad%b8%e7%bf%92%e5%88%86%e6%9e%90","status":"publish","type":"page","link":"https:\/\/idealslearning.cite.hku.hk\/?page_id=1061","title":{"rendered":"DLAV: \u5b78\u7fd2\u5206\u6790"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1061\" class=\"elementor elementor-1061\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a1fbd89 e-con-full e-flex e-con e-parent\" data-id=\"a1fbd89\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f67f246 elementor-widget elementor-widget-html\" data-id=\"f67f246\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"zh-Hant\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>DLAV\uff1a\u5b78\u7fd2\u5206\u6790<\/title>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n  :root{\r\n    --orange:#e07b2e;\r\n    --orange-dark:#c2661f;\r\n    --navy:#0c1530;\r\n    --navy-card:#141d3d;\r\n    --text-dark:#13202c;\r\n    --text-gray:#5b6573;\r\n    --bg-light:#f3f5f8;\r\n    --white:#ffffff;\r\n    --shadow:0 10px 30px rgba(0,0,0,0.08);\r\n  }\r\n\r\n  *{margin:0;padding:0;box-sizing:border-box;}\r\n\r\n  html, body{\r\n    width:100%;\r\n    overflow-x:hidden;\r\n  }\r\n\r\n  body{\r\n    font-family:'Poppins', sans-serif;\r\n    font-weight:400;\r\n    font-size:16px;\r\n    color:var(--text-dark);\r\n    background:var(--white);\r\n    -webkit-font-smoothing:antialiased;\r\n  }\r\n\r\n  img{max-width:100%;display:block;}\r\n  a{text-decoration:none;color:inherit;}\r\n\r\n  \/* ===== Full-Bleed Fix (breaks sections out of Elementor's boxed container) ===== *\/\r\n  .topbar,\r\n  .hero,\r\n  .insights-section,\r\n  .final-cta-wrap{\r\n    width:100vw;\r\n    position:relative;\r\n    left:50%;\r\n    right:50%;\r\n    margin-left:-50vw;\r\n    margin-right:-50vw;\r\n  }\r\n\r\n  \/* ===== Animation Utility ===== *\/\r\n  .fade-up{\r\n    opacity:0;\r\n    transform:translateY(30px);\r\n    transition:opacity 0.8s ease, transform 0.8s ease;\r\n  }\r\n  .fade-up.visible{\r\n    opacity:1;\r\n    transform:translateY(0);\r\n  }\r\n  .fade-up.delay-1{transition-delay:0.1s;}\r\n  .fade-up.delay-2{transition-delay:0.25s;}\r\n  .fade-up.delay-3{transition-delay:0.4s;}\r\n\r\n  .hover-lift{\r\n    transition:transform 0.35s ease, box-shadow 0.35s ease;\r\n  }\r\n  .hover-lift:hover{\r\n    transform:translateY(-6px);\r\n    box-shadow:0 18px 40px rgba(0,0,0,0.14);\r\n  }\r\n\r\n  \/* ===== Top Bar ===== *\/\r\n  .topbar{\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:space-between;\r\n    padding:18px 60px;\r\n    background:var(--white);\r\n    border-bottom:1px solid #eee;\r\n  }\r\n  .topbar-left{\r\n    display:flex;\r\n    align-items:center;\r\n    gap:12px;\r\n  }\r\n  .topbar-icon{\r\n    width:38px;\r\n    height:38px;\r\n    background:var(--orange);\r\n    border-radius:10px;\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:center;\r\n    color:#fff;\r\n    font-size:17px;\r\n  }\r\n  .topbar-titles h1{\r\n    font-size:15px;\r\n    font-weight:800;\r\n    letter-spacing:0.3px;\r\n    color:#13202c;\r\n  }\r\n  .topbar-titles p{\r\n    font-size:11px;\r\n    color:#8a93a0;\r\n    font-weight:600;\r\n    letter-spacing:0.4px;\r\n    margin-top:2px;\r\n  }\r\n  .back-btn{\r\n    display:flex;\r\n    align-items:center;\r\n    gap:8px;\r\n    padding:10px 22px;\r\n    border:1px solid #d8dde3;\r\n    border-radius:30px;\r\n    font-size:13px;\r\n    font-weight:700;\r\n    color:#1c2530;\r\n    background:#fff;\r\n    cursor:pointer;\r\n    transition:all 0.3s ease;\r\n  }\r\n  .back-btn:hover{\r\n    background:#f3f3f3;\r\n    border-color:#bbb;\r\n  }\r\n\r\n  \/* ===== Hero Section ===== *\/\r\n  .hero{\r\n    background:var(--bg-light);\r\n    padding:75px 60px 90px;\r\n    text-align:center;\r\n  }\r\n  .badge{\r\n    display:inline-block;\r\n    background:#fbe6d2;\r\n    color:var(--orange);\r\n    font-size:12px;\r\n    font-weight:700;\r\n    letter-spacing:0.6px;\r\n    padding:8px 20px;\r\n    border-radius:20px;\r\n    margin-bottom:30px;\r\n  }\r\n  .hero h2{\r\n    font-size:54px;\r\n    font-weight:800;\r\n    line-height:1.2;\r\n    color:#13202c;\r\n    margin-bottom:38px;\r\n    max-width:950px;\r\n    margin-left:auto;\r\n    margin-right:auto;\r\n  }\r\n  .hero-sub-row{\r\n    display:flex;\r\n    align-items:flex-start;\r\n    justify-content:center;\r\n    gap:40px;\r\n    flex-wrap:wrap;\r\n    margin-bottom:55px;\r\n  }\r\n  .hero-desc{\r\n    font-size:17px;\r\n    font-weight:400;\r\n    line-height:1.75;\r\n    color:var(--text-gray);\r\n    max-width:500px;\r\n    text-align:left;\r\n  }\r\n  .btn-demo{\r\n    background:var(--orange);\r\n    color:#fff;\r\n    font-size:13.5px;\r\n    font-weight:700;\r\n    letter-spacing:0.4px;\r\n    padding:18px 34px;\r\n    border-radius:30px;\r\n    border:none;\r\n    cursor:pointer;\r\n    white-space:nowrap;\r\n    transition:all 0.3s ease;\r\n    box-shadow:0 10px 22px rgba(224,123,46,0.3);\r\n  }\r\n  .btn-demo:hover{\r\n    background:var(--orange-dark);\r\n    transform:translateY(-3px);\r\n    box-shadow:0 14px 26px rgba(224,123,46,0.4);\r\n  }\r\n\r\n  .hero-image-wrap{\r\n    max-width:1180px;\r\n    margin:0 auto;\r\n  }\r\n  .hero-image-card{\r\n    border-radius:18px;\r\n    overflow:hidden;\r\n    box-shadow:0 25px 50px rgba(0,0,0,0.18);\r\n    transition:transform 0.5s ease;\r\n    background:#f3f5f8;\r\n  }\r\n  .hero-image-card:hover{\r\n    transform:scale(1.01);\r\n  }\r\n  .hero-image-placeholder{\r\n    width:100%;\r\n    height:600px;\r\n    background:#dfe3e8 url('IMAGE_URL_HERE') center\/cover no-repeat;\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:center;\r\n    color:#9aa3ad;\r\n    font-size:14px;\r\n    font-weight:500;\r\n  }\r\n\r\n  \/* ===== Deep Insights (Dark Section) ===== *\/\r\n  .insights-section{\r\n    background:linear-gradient(135deg,#0c1530, #13203f);\r\n    padding:95px 60px;\r\n  }\r\n  .insights-grid{\r\n    display:flex;\r\n    gap:50px;\r\n    align-items:flex-start;\r\n    max-width:1180px;\r\n    margin:0 auto;\r\n    flex-wrap:wrap;\r\n  }\r\n  .insights-left{flex:1;min-width:300px;color:#fff;}\r\n  .insights-right{flex:1.4;min-width:340px;}\r\n\r\n  .insights-left h3{\r\n    font-size:38px;\r\n    font-weight:800;\r\n    line-height:1.3;\r\n    margin-bottom:24px;\r\n    color:#ffffff !important;\r\n  }\r\n  .divider-line{\r\n    width:60px;\r\n    height:4px;\r\n    background:var(--orange);\r\n    border-radius:4px;\r\n    margin-bottom:28px;\r\n  }\r\n  .insights-left p{\r\n    font-size:16px;\r\n    font-weight:400;\r\n    line-height:1.85;\r\n    color:#a7afc0;\r\n    max-width:480px;\r\n  }\r\n\r\n  .feature-grid{\r\n    display:grid;\r\n    grid-template-columns:1fr 1fr;\r\n    gap:20px;\r\n  }\r\n  .feature-box{\r\n    background:var(--navy-card);\r\n    border-radius:16px;\r\n    padding:26px 24px;\r\n    transition:transform 0.35s ease, background 0.35s ease;\r\n  }\r\n  .feature-box:hover{\r\n    transform:translateY(-4px);\r\n    background:#1a2548;\r\n  }\r\n  .feature-icon{\r\n    font-size:19px;\r\n    margin-bottom:16px;\r\n    color:var(--orange);\r\n  }\r\n  .feature-box h5{\r\n    font-size:16px;\r\n    font-weight:700;\r\n    color:#fff;\r\n    margin-bottom:9px;\r\n  }\r\n  .feature-box p{\r\n    font-size:13.5px;\r\n    font-weight:400;\r\n    line-height:1.6;\r\n    color:#8993ab;\r\n  }\r\n\r\n  \/* ===== Final CTA ===== *\/\r\n  .final-cta-wrap{\r\n    padding:95px 60px 100px;\r\n    display:flex;\r\n    justify-content:center;\r\n  }\r\n  .final-cta{\r\n    background:linear-gradient(135deg,#e88436,#c2661f);\r\n    border-radius:24px;\r\n    color:#fff;\r\n    text-align:center;\r\n    padding:65px 30px;\r\n    max-width:980px;\r\n    width:100%;\r\n    box-shadow:0 30px 60px rgba(224,123,46,0.22);\r\n  }\r\n  .final-cta h2{\r\n    font-size:38px;\r\n    font-weight:800;\r\n    line-height:1.3;\r\n    margin-bottom:36px;\r\n    max-width:750px;\r\n    margin-left:auto;\r\n    margin-right:auto;\r\n    color:#ffffff !important;\r\n  }\r\n  .final-cta-buttons{\r\n    display:flex;\r\n    gap:18px;\r\n    justify-content:center;\r\n    flex-wrap:wrap;\r\n  }\r\n  .btn-white{\r\n    background:#e07b2e;\r\n    color:#ffffff !important;\r\n    font-size:13.5px;\r\n    font-weight:700;\r\n    letter-spacing:0.4px;\r\n    padding:15px 32px;\r\n    border-radius:30px;\r\n    border:none;\r\n    cursor:pointer;\r\n  }\r\n  .btn-white:hover{\r\n  background:#e07b2e;\r\n  transform:translateY(-3px);\r\n  box-shadow:0 10px 20px rgba(0,0,0,0.2);\r\n}\r\n  .btn-outline-white{\r\n    border:1.5px solid #fff;\r\n    color:#ffffff !important;\r\n    background:#e07b2e;\r\n    font-size:13.5px;\r\n    font-weight:700;\r\n    letter-spacing:0.4px;\r\n    padding:15px 32px;\r\n    border-radius:30px;\r\n    cursor:pointer;\r\n  }\r\n\r\n  \/* ===== Mock Dashboard inside Hero Image ===== *\/\r\n  .dashboard-mock{\r\n    display:flex;\r\n    width:100%;\r\n    height:600px;\r\n    background:#eef1f5;\r\n    overflow:hidden;\r\n    font-size:11px;\r\n  }\r\n  .db-col-left{\r\n    width:160px;\r\n    background:#fff;\r\n    border-right:1px solid #e4e7eb;\r\n    padding:20px 16px;\r\n    flex-shrink:0;\r\n    color:#5b6573;\r\n    overflow:hidden;\r\n  }\r\n  .db-col-left .db-title{font-weight:700;color:#13202c;font-size:12px;margin-bottom:14px;}\r\n  .db-col-left .db-tag{display:inline-block;background:#e1e9ff;color:#2f5bff;font-size:10px;font-weight:600;padding:3px 8px;border-radius:10px;margin-bottom:16px;}\r\n  .db-col-left .db-line{font-size:10.5px;line-height:1.6;margin-bottom:14px;color:#76808e;}\r\n  .db-col-left .db-box{background:#eef3ff;border-radius:8px;padding:10px;font-size:10px;color:#5b6573;margin-bottom:10px;}\r\n\r\n  .db-col-main{\r\n    flex:1;\r\n    background:#eef1f5;\r\n    padding:24px 26px;\r\n    overflow:hidden;\r\n  }\r\n  .db-col-main h6{font-size:15px;font-weight:700;color:#2f5bff;margin-bottom:6px;}\r\n  .db-col-main h4{font-size:16px;font-weight:700;color:#13202c;margin-bottom:16px;}\r\n  .db-tabs{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;}\r\n  .db-tab{font-size:10.5px;font-weight:600;padding:7px 12px;border-radius:16px;background:#fff;color:#5b6573;border:1px solid #e4e7eb;}\r\n  .db-tab.active{background:#2f5bff;color:#fff;border:none;}\r\n\r\n  .db-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:18px;}\r\n  .db-stat{background:#fff;border-radius:10px;padding:12px;}\r\n  .db-stat.red{background:#e0483b;color:#fff;}\r\n  .db-stat .label{font-size:9px;font-weight:600;letter-spacing:0.3px;opacity:0.8;margin-bottom:4px;text-transform:uppercase;}\r\n  .db-stat .value{font-size:18px;font-weight:800;margin-bottom:3px;}\r\n  .db-stat .sub{font-size:8.5px;opacity:0.7;}\r\n\r\n  .db-charts{display:grid;grid-template-columns:1fr 1fr;gap:14px;}\r\n  .db-chart-card{background:#fff;border-radius:10px;padding:16px;}\r\n  .db-chart-card .ctitle{font-size:12px;font-weight:700;color:#13202c;margin-bottom:3px;}\r\n  .db-chart-card .csub{font-size:9.5px;color:#8a93a0;margin-bottom:12px;}\r\n  .bars{display:flex;align-items:flex-end;gap:6px;height:120px;}\r\n  .bar{width:14px;border-radius:3px 3px 0 0;}\r\n  .donut-wrap{display:flex;align-items:center;justify-content:center;}\r\n  .donut{\r\n    width:130px;height:130px;border-radius:50%;\r\n    background:conic-gradient(#3aa172 0% 38%, #e0483b 38% 88%, #e0a23a 88% 100%);\r\n    display:flex;align-items:center;justify-content:center;\r\n    position:relative;\r\n  }\r\n  .donut::after{\r\n    content:'';\r\n    width:78px;height:78px;\r\n    background:#fff;\r\n    border-radius:50%;\r\n    position:absolute;\r\n  }\r\n  .donut-label{position:relative;z-index:2;text-align:center;}\r\n  .donut-label .pct{font-size:17px;font-weight:800;color:#13202c;}\r\n  .donut-label .txt{font-size:8px;color:#8a93a0;}\r\n\r\n  .db-col-right{\r\n    width:180px;\r\n    background:#fff;\r\n    border-left:1px solid #e4e7eb;\r\n    padding:20px 16px;\r\n    flex-shrink:0;\r\n    overflow:hidden;\r\n  }\r\n  .db-col-right .chat-title{font-size:11px;font-weight:700;color:#13202c;margin-bottom:14px;}\r\n  .db-col-right .chat-bubble{background:#f3f5f8;border-radius:10px;padding:10px;font-size:9.5px;color:#5b6573;line-height:1.6;margin-bottom:10px;}\r\n  .db-col-right .chat-bubble.user{background:#2f5bff;color:#fff;text-align:right;}\r\n\r\n  \/* ===== Responsive ===== *\/\r\n  @media(max-width:1100px){\r\n    .db-stats{grid-template-columns:repeat(3,1fr);}\r\n    .dashboard-mock{height:auto;flex-direction:column;}\r\n    .db-col-left, .db-col-right{width:100%;}\r\n  }\r\n  @media(max-width:900px){\r\n    .topbar{padding:16px 24px;}\r\n    .hero{padding:55px 24px 70px;}\r\n    .hero h2{font-size:36px;}\r\n    .insights-section{padding:65px 24px;}\r\n    .final-cta-wrap{padding:65px 24px 70px;}\r\n    .insights-left h3{font-size:28px;}\r\n    .final-cta h2{font-size:28px;}\r\n    .feature-grid{grid-template-columns:1fr 1fr;}\r\n    .db-charts{grid-template-columns:1fr;}\r\n  }\r\n  @media(max-width:600px){\r\n    .topbar-titles p{display:none;}\r\n    .hero h2{font-size:28px;}\r\n    .hero-desc{text-align:center;max-width:100%;}\r\n    .hero-sub-row{flex-direction:column;align-items:center;}\r\n    .feature-grid{grid-template-columns:1fr;}\r\n    .final-cta h2{font-size:24px;}\r\n    .db-stats{grid-template-columns:repeat(2,1fr);}\r\n  }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n  <!-- Top Bar -->\r\n  <div class=\"topbar\">\r\n    <div class=\"topbar-left\">\r\n      <div class=\"topbar-icon\">\ud83d\udcca<\/div>\r\n      <div class=\"topbar-titles\">\r\n        <h1>DLAV\uff1a\u5b78\u7fd2\u5206\u6790<\/h1>\r\n        <p>\u5b78\u7fd2\u5206\u6790\u8207\u53ef\u8996\u5316\u7cfb\u7d71<\/p>\r\n      <\/div>\r\n    <\/div>\r\n    <a href=\"https:\/\/idealslearning.cite.hku.hk\/?page_id=1086\" class=\"back-btn\">\u8fd4\u56de \u2715<\/a>\r\n  <\/div>\r\n\r\n  <!-- Hero -->\r\n  <section class=\"hero\">\r\n    <span class=\"badge fade-up\">\u4ec0\u9ebc\u662f DLAV\uff1f<\/span>\r\n    <h2 class=\"fade-up\">\u5177\u8a2d\u8a08\u610f\u8b58\u7684\u5b78\u7fd2\u5206\u6790\u8207\u53ef\u8996\u5316\u7cfb\u7d71\uff08DLAV\uff09<\/h2>\r\n    <div class=\"hero-sub-row fade-up delay-1\">\r\n      <p class=\"hero-desc\">DLAV \u70ba\u6559\u80b2\u5de5\u4f5c\u8005\u53ca\u6559\u5e2b\u63d0\u4f9b\u57fa\u65bc\u5b78\u7fd2\u5206\u6790\u7684\u6d1e\u5bdf\uff0c\u652f\u63f4\u6839\u64da\u5be6\u8b49\u7684\u6559\u5b78\u6c7a\u7b56\u3002<\/p>\r\n      <a href=\"mailto:ideals@hku.hk?subject=IDEALS:%20Request%20a%20Demo\" \r\n\r\n   style=\"display:inline-block; background:#e07b2e; color:#ffffff; border:1.5px solid #ffffff; padding:14px 30px; border-radius:30px; font-size:12.5px; font-weight:700; letter-spacing:0.4px; text-decoration:none;\">\r\n\r\n   \u793a\u7bc4\u7533\u8acb\r\n\r\n<\/a>\r\n    <\/div>\r\n    <div class=\"hero-image-wrap fade-up delay-2\">\r\n      <div class=\"hero-image-card hover-lift\">\r\n        <!-- Recreated dashboard mockup (image placeholder fallback below) -->\r\n        <div class=\"dashboard-mock\">\r\n          <div class=\"db-col-left\">\r\n            <div class=\"db-title\">Analytics Questions<\/div>\r\n            <span class=\"db-tag\">Level &nbsp; 4 questions<\/span>\r\n            <p class=\"db-line\">Course completion \u2014 which student?<\/p>\r\n            <div class=\"db-box\">Have students in different tools of the during school hours and<\/div>\r\n            <p class=\"db-line\">Students perform in the<\/p>\r\n            <div class=\"db-box\">Students perceive their own the end of the course?<\/div>\r\n          <\/div>\r\n\r\n          <div class=\"db-col-main\">\r\n            <h6>Affordable Clean Energy<\/h6>\r\n            <h4>How do students perform in the course?<\/h4>\r\n            <div class=\"db-tabs\">\r\n              <span class=\"db-tab active\">\ud83d\udccb Overall Performance<\/span>\r\n              <span class=\"db-tab\">\ud83d\udcc4 By Assessment Tool<\/span>\r\n              <span class=\"db-tab\">\u26a0 At-Risk Students<\/span>\r\n              <span class=\"db-tab\">\ud83d\udfe8 Gradebook<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"db-stats\">\r\n              <div class=\"db-stat red\">\r\n                <div class=\"label\">Class Average<\/div>\r\n                <div class=\"value\">49.2%<\/div>\r\n                <div class=\"sub\">\u2193 10.0% from last semester<\/div>\r\n              <\/div>\r\n              <div class=\"db-stat\">\r\n                <div class=\"label\">Total Students<\/div>\r\n                <div class=\"value\">18<\/div>\r\n                <div class=\"sub\">Active enrollment<\/div>\r\n              <\/div>\r\n              <div class=\"db-stat\">\r\n                <div class=\"label\">Pass Rate<\/div>\r\n                <div class=\"value\" style=\"color:#3aa172;\">50%<\/div>\r\n                <div class=\"sub\">\u2191 10.0% improvement<\/div>\r\n              <\/div>\r\n              <div class=\"db-stat\">\r\n                <div class=\"label\">Median Grade<\/div>\r\n                <div class=\"value\">F<\/div>\r\n                <div class=\"sub\">50th percentile: 49%<\/div>\r\n              <\/div>\r\n              <div class=\"db-stat\">\r\n                <div class=\"label\">Std. Deviation<\/div>\r\n                <div class=\"value\">25.3<\/div>\r\n                <div class=\"sub\">Moderate spread<\/div>\r\n              <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"db-charts\">\r\n              <div class=\"db-chart-card\">\r\n                <div class=\"ctitle\">Grade Distribution<\/div>\r\n                <div class=\"csub\">Distribution of final course grades<\/div>\r\n                <div class=\"bars\">\r\n                  <div class=\"bar\" style=\"height:90%;background:#8a1f1f;\"><\/div>\r\n                  <div class=\"bar\" style=\"height:68%;background:#e0483b;\"><\/div>\r\n                  <div class=\"bar\" style=\"height:45%;background:#e0833c;\"><\/div>\r\n                  <div class=\"bar\" style=\"height:45%;background:#e0833c;\"><\/div>\r\n                  <div class=\"bar\" style=\"height:23%;background:#e0c23c;\"><\/div>\r\n                  <div class=\"bar\" style=\"height:45%;background:#9bd13c;\"><\/div>\r\n                  <div class=\"bar\" style=\"height:23%;background:#5fc16a;\"><\/div>\r\n                  <div class=\"bar\" style=\"height:68%;background:#3aa172;\"><\/div>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"db-chart-card\">\r\n                <div class=\"ctitle\">Pass\/Fail Breakdown<\/div>\r\n                <div class=\"csub\">Students meeting passing criteria (&gt;=50%)<\/div>\r\n                <div class=\"donut-wrap\">\r\n                  <div class=\"donut\">\r\n                    <div class=\"donut-label\">\r\n                      <div class=\"pct\">50%<\/div>\r\n                      <div class=\"txt\">Pass Rate<\/div>\r\n                    <\/div>\r\n                  <\/div>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"db-col-right\">\r\n            <div class=\"chat-title\">\ud83e\udd16 Learning Analytics Fac<\/div>\r\n            <div class=\"chat-bubble\">Hi! I'm your Learning Analytics Facilitator. Select a metric or ask me anything about your class performance. What would you like to know?<\/div>\r\n            <div class=\"chat-bubble user\">Do my class pe...<\/div>\r\n            <div class=\"chat-bubble\">Based on the dashboard, your class is performing well overall: the average is just below the pass mark, only half students are passing, and the median grade is an F, with many students clustered in the 0\u201340% range. This suggests that a large portion of the class is struggling to meet core learning outcomes.<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- Deep Insights into Learning Design -->\r\n  <section class=\"insights-section\">\r\n    <div class=\"insights-grid\">\r\n      <div class=\"insights-left fade-up\">\r\n        <h3>\u5c0d\u5b78\u7fd2\u8a2d\u8a08\u7684\u6df1\u5165\u6d1e\u5bdf<\/h3>\r\n        <div class=\"divider-line\"><\/div>\r\n        <p>\u5148\u9032\u7684\u5206\u6790\u5100\u8868\u677f\uff0c\u63d0\u4f9b\u95dc\u65bc\u5b78\u751f\u5b78\u7fd2\u904e\u7a0b\u6a21\u5f0f\u8207\u5b78\u7fd2\u6210\u679c\u7684\u6df1\u5165\u6d1e\u5bdf\u3002\u7cfb\u7d71\u4ee5\u53ef\u8996\u5316\u65b9\u5f0f\u5be6\u6642\u5448\u73fe\u5b78\u751f\u7684\u53c3\u8207\u5ea6\u3001\u9032\u5ea6\u53ca\u8868\u73fe\uff0c\u4e26\u63d0\u4f9b\u5177\u53ef\u884c\u6027\u7684\u56de\u994b\uff0c\u5f9e\u800c\u512a\u5316\u8ab2\u7a0b\u3002<\/p>\r\n      <\/div>\r\n      <div class=\"insights-right fade-up delay-1\">\r\n        <div class=\"feature-grid\">\r\n          <div class=\"feature-box hover-lift\">\r\n            <div class=\"feature-icon\">\u25a6<\/div>\r\n            <h5>\u5177\u8a2d\u8a08\u610f\u8b58<\/h5>\r\n            <p>\u5c07\u5b78\u7fd2\u6578\u64da\u8207\u6700\u521d\u7684\u5b78\u7fd2\u8a2d\u8a08\u76f8\u9023\u7d50\u3002<\/p>\r\n          <\/div>\r\n          <div class=\"feature-box hover-lift\">\r\n            <div class=\"feature-icon\">\ud83d\udcc8<\/div>\r\n            <h5>\u5be6\u6642\u76e3\u6e2c<\/h5>\r\n            <p>\u63d0\u4f9b\u95dc\u65bc\u5b78\u751f\u53c3\u8207\u5ea6\u53ca\u5b78\u7fd2\u9032\u5ea6\u7684\u5be6\u6642\u66f4\u65b0\u3002<\/p>\r\n          <\/div>\r\n          <div class=\"feature-box hover-lift\">\r\n            <div class=\"feature-icon\">\ud83d\udcac<\/div>\r\n            <h5>\u5177\u53ef\u884c\u6027\u7684\u56de\u994b<\/h5>\r\n            <p>\u81ea\u52d5\u751f\u6210\u5206\u6790\uff0c\u5f15\u5c0e\u6559\u5e2b\u9069\u6642\u4ecb\u5165\uff0c\u63d0\u4f9b\u652f\u63f4\u3002<\/p>\r\n          <\/div>\r\n          <div class=\"feature-box hover-lift\">\r\n            <div class=\"feature-icon\">\ud83d\uddc4<\/div>\r\n            <h5>\u57fa\u65bc\u5be6\u8b49<\/h5>\r\n            <p>\u4ee5\u5be6\u8b49\u6578\u64da\u652f\u6301\u6559\u5b78\u6c7a\u7b56\u3002<\/p>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- Final CTA -->\r\n  <div class=\"final-cta-wrap\">\r\n    <div class=\"final-cta fade-up\">\r\n      <h2>\u89e3\u9396\u5177\u884c\u52d5\u529b\u7684\u6d1e\u5bdf<\/h2>\r\n      <div class=\"final-cta-buttons\">\r\n        <a href=\"mailto:ideals@hku.hk?subject=IDEALS:%20Request%20a%20Demo\" \r\n\r\n   style=\"display:inline-block; background:#ffffff; color:#e07b2e; border:1.5px solid #ffffff; padding:14px 30px; border-radius:30px; font-size:12.5px; font-weight:700; letter-spacing:0.4px; text-decoration:none;\">\r\n\r\n   \u793a\u7bc4\u7533\u8acb\r\n\r\n<\/a>\r\n        <a href=\"https:\/\/web.edcity.hk\/zh-hant\/elafp\/project\/20210212\/\"\r\n\r\n   target=\"_blank\"\r\n\r\n   rel=\"noopener\"\r\n\r\n   class=\"btn-outline-white\"\r\n\r\n   style=\"color:#ffffff;\">\r\n\r\n   \u7acb\u5373\u8a02\u8cfc\r\n\r\n<\/a>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<script>\r\n  document.addEventListener('DOMContentLoaded', function () {\r\n    const elements = document.querySelectorAll('.fade-up');\r\n\r\n    const observer = new IntersectionObserver((entries) => {\r\n      entries.forEach(entry => {\r\n        if (entry.isIntersecting) {\r\n          entry.target.classList.add('visible');\r\n        }\r\n      });\r\n    }, { threshold: 0.15 });\r\n\r\n    elements.forEach(el => observer.observe(el));\r\n  });\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>DLAV\uff1a\u5b78\u7fd2\u5206\u6790 \ud83d\udcca DLAV\uff1a\u5b78\u7fd2\u5206\u6790 \u5b78\u7fd2\u5206\u6790\u8207\u53ef\u8996\u5316\u7cfb\u7d71 \u8fd4\u56de \u2715 \u4ec0\u9ebc\u662f DLAV\uff1f \u5177\u8a2d\u8a08\u610f\u8b58\u7684\u5b78\u7fd2\u5206\u6790\u8207\u53ef\u8996\u5316\u7cfb\u7d71\uff08DLAV\uff09 DLAV \u70ba\u6559\u80b2\u5de5\u4f5c\u8005\u53ca\u6559\u5e2b\u63d0\u4f9b\u57fa\u65bc\u5b78\u7fd2\u5206\u6790\u7684\u6d1e\u5bdf\uff0c\u652f\u63f4\u6839\u64da\u5be6\u8b49\u7684\u6559\u5b78\u6c7a\u7b56\u3002 \u793a\u7bc4\u7533\u8acb Analytics Questions Level &nbsp; 4 questions Course completion \u2014 which student? Have students in different tools of the during school hours and Students perform in the Students perceive their own the end of the course? Affordable Clean Energy How do students perform in [&hellip;]<\/p>\n","protected":false},"author":6,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-1061","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=\/wp\/v2\/pages\/1061","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1061"}],"version-history":[{"count":25,"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=\/wp\/v2\/pages\/1061\/revisions"}],"predecessor-version":[{"id":1612,"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=\/wp\/v2\/pages\/1061\/revisions\/1612"}],"wp:attachment":[{"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1061"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}