{"id":765,"date":"2026-06-29T21:33:20","date_gmt":"2026-06-29T13:33:20","guid":{"rendered":"https:\/\/idealslearning.cite.hku.hk\/?page_id=765"},"modified":"2026-07-15T17:05:29","modified_gmt":"2026-07-15T09:05:29","slug":"lds-design-studio","status":"publish","type":"page","link":"https:\/\/idealslearning.cite.hku.hk\/?page_id=765","title":{"rendered":"LDS: Design Studio"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\nLDS: Design Studio<\/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=Montserrat:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n :root{\r\n --blue:#2f5bff;\r\n --blue-dark:#2848d6;\r\n --navy:#0b1530;\r\n --navy-card:#141f42;\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 body{\r\n font-family:'Montserrat', sans-serif;\r\n font-weight:400;\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 \/* ===== 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 .fade-up.delay-4{transition-delay:0.55s;}\r\n\r\n \/* ===== Elementor Editor \u2014 force all fade-up visible ===== *\/\r\n .elementor-editor-active .fade-up,\r\n .elementor-editor-preview .fade-up {\r\n opacity:1 !important;\r\n transform:translateY(0) !important;\r\n }\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:36px;\r\n height:36px;\r\n background:var(--blue);\r\n border-radius:8px;\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n color:#fff;\r\n font-size:16px;\r\n }\r\n .topbar-titles h1{\r\n font-size:14px;\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:10.5px;\r\n color:#8a93a0;\r\n font-weight:600;\r\n letter-spacing:0.3px;\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:9px 20px;\r\n border:1px solid #d8dde3;\r\n border-radius:30px;\r\n font-size:12px;\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:70px 60px 90px;\r\n text-align:center;\r\n }\r\n .badge{\r\n display:inline-block;\r\n background:#e1e9ff;\r\n color:var(--blue);\r\n font-size:11px;\r\n font-weight:700;\r\n letter-spacing:0.6px;\r\n padding:7px 18px;\r\n border-radius:20px;\r\n margin-bottom:24px;\r\n }\r\n .hero h2{\r\n font-size:50px;\r\n font-weight:800;\r\n line-height:1.15;\r\n color:#13202c;\r\n margin-bottom:30px;\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:50px;\r\n }\r\n .hero-desc{\r\n font-size:15.5px;\r\n font-weight:400;\r\n line-height:1.8;\r\n color:#000000;\r\n max-width:480px;\r\n text-align:left;\r\n }\r\n .btn-demo{\r\n background:var(--blue);\r\n color:#fff;\r\n font-size:12.5px;\r\n font-weight:700;\r\n letter-spacing:0.4px;\r\n padding:16px 32px;\r\n border-radius:30px;\r\n border:none;\r\n cursor:pointer;\r\n white-space:nowrap;\r\n box-shadow:0 10px 22px rgba(47,91,255,0.3);\r\n outline:none;\r\n }\r\n .btn-demo:hover,\r\n .btn-demo:focus,\r\n .btn-demo:active,\r\n .btn-demo:visited{\r\n background:var(--blue);\r\n color:#fff;\r\n transform:none;\r\n box-shadow:0 10px 22px rgba(47,91,255,0.3);\r\n outline:none;\r\n }\r\n\r\n .hero-image-wrap{\r\n max-width:980px;\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 }\r\n .hero-image-card:hover{\r\n transform:scale(1.015);\r\n }\r\n .hero-image-placeholder{\r\n width:100%;\r\n height:480px;\r\n background:#dfe3e8 url('https:\/\/idealslearning.cite.hku.hk\/wp-content\/uploads\/2026\/07\/1XYrlhhgAacXkwOZt7SIalZdVKJEtihD6.jpg') 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:13px;\r\n font-weight:500;\r\n }\r\n\r\n \/* ===== What is LDS (Dark Section) ===== *\/\r\n .what-is-section{\r\n background:var(--navy);\r\n padding:90px 60px;\r\n }\r\n .what-is-grid{\r\n display:flex;\r\n gap:60px;\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 .what-is-left{flex:1;min-width:320px;color:#fff;}\r\n .what-is-right{flex:1;min-width:320px;}\r\n\r\n .what-is-left h3{\r\n font-size:34px;\r\n font-weight:800;\r\n line-height:1.3;\r\n margin-bottom:22px;\r\n color:#ffffff !important;\r\n}\r\n .divider-line{\r\n width:60px;\r\n height:4px;\r\n background:var(--blue);\r\n border-radius:4px;\r\n margin-bottom:26px;\r\n }\r\n .what-is-left p{\r\n font-size:14.5px;\r\n font-weight:400;\r\n line-height:1.85;\r\n color:#aab3c5;\r\n margin-bottom:22px;\r\n max-width:460px;\r\n }\r\n\r\n .feature-grid{\r\n background:#101b3d;\r\n border-radius:18px;\r\n padding:28px;\r\n display:grid;\r\n grid-template-columns:1fr 1fr;\r\n gap:20px;\r\n }\r\n .feature-box{\r\n background:#16224a;\r\n border-radius:14px;\r\n padding:26px 22px;\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:#1a2a56;\r\n }\r\n .feature-icon{\r\n width:42px;\r\n height:42px;\r\n border-radius:10px;\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n font-size:18px;\r\n margin-bottom:30px;\r\n }\r\n .feature-icon.blue{background:#2a3a6e;color:#5d8aff;}\r\n .feature-icon.purple{background:#2c2a5c;color:#9f8cff;}\r\n .feature-icon.violet{background:#332a5c;color:#b58cff;}\r\n .feature-icon.green{background:#1c3a44;color:#4fd6b8;}\r\n .feature-box span.label{\r\n font-size:12px;\r\n font-weight:700;\r\n letter-spacing:0.4px;\r\n color:#fff;\r\n }\r\n\r\n \/* ===== Introductory Videos ===== *\/\r\n .videos-section{\r\n padding:90px 60px;\r\n text-align:center;\r\n }\r\n .heading-lg{\r\n font-size:36px;\r\n font-weight:800;\r\n color:#13202c;\r\n margin-bottom:18px;\r\n }\r\n .heading-divider{\r\n width:60px;\r\n height:4px;\r\n background:var(--blue);\r\n border-radius:4px;\r\n margin:0 auto 50px;\r\n }\r\n .videos-grid{\r\n display:grid;\r\n grid-template-columns:repeat(3,1fr);\r\n gap:26px;\r\n max-width:1180px;\r\n margin:0 auto;\r\n }\r\n .video-card{\r\n text-align:left;\r\n cursor:pointer;\r\n display:block;\r\n }\r\n .video-thumb{\r\n position:relative;\r\n border-radius:14px;\r\n overflow:hidden;\r\n height:200px;\r\n margin-bottom:16px;\r\n background:#dcdfe4 center\/cover no-repeat;\r\n box-shadow:0 6px 18px rgba(0,0,0,0.08);\r\n transition:transform 0.4s ease, box-shadow 0.4s ease;\r\n }\r\n .video-thumb:hover{\r\n transform:translateY(-5px);\r\n box-shadow:0 14px 30px rgba(0,0,0,0.16);\r\n }\r\n .play-btn{\r\n position:absolute;\r\n top:50%;left:50%;\r\n transform:translate(-50%,-50%);\r\n width:48px;height:48px;\r\n background:#fff;\r\n border-radius:50%;\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n color:var(--blue);\r\n font-size:16px;\r\n box-shadow:0 6px 16px rgba(0,0,0,0.25);\r\n transition:transform 0.3s ease;\r\n }\r\n .video-thumb:hover .play-btn{\r\n transform:translate(-50%,-50%) scale(1.12);\r\n }\r\n .video-duration{\r\n position:absolute;\r\n bottom:10px;right:10px;\r\n background:rgba(0,0,0,0.7);\r\n color:#fff;\r\n font-size:11px;\r\n font-weight:600;\r\n padding:3px 8px;\r\n border-radius:5px;\r\n }\r\n .video-title{\r\n font-size:14.5px;\r\n font-weight:700;\r\n color:#13202c;\r\n line-height:1.4;\r\n margin-bottom:6px;\r\n }\r\n .video-tag{\r\n font-size:10.5px;\r\n font-weight:600;\r\n letter-spacing:0.4px;\r\n color:#9aa3ad;\r\n }\r\n\r\n \/* ===== Conceptual Framework ===== *\/\r\n .framework-section{\r\n background:var(--bg-light);\r\n padding:90px 60px;\r\n text-align:center;\r\n }\r\n .framework-sub{\r\n font-size:12px;\r\n font-weight:600;\r\n letter-spacing:0.6px;\r\n color:#9aa3ad;\r\n margin-bottom:50px;\r\n }\r\n .framework-grid{\r\n display:flex;\r\n gap:26px;\r\n max-width:920px;\r\n margin:0 auto;\r\n flex-wrap:wrap;\r\n justify-content:center;\r\n }\r\n .framework-card{\r\n background:#fff;\r\n border-radius:16px;\r\n padding:36px 32px;\r\n flex:1;\r\n min-width:300px;\r\n text-align:left;\r\n box-shadow:0 4px 18px rgba(0,0,0,0.05);\r\n }\r\n .framework-icon{\r\n width:46px;\r\n height:46px;\r\n border-radius:10px;\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n font-size:19px;\r\n margin-bottom:24px;\r\n }\r\n .framework-icon.violet{background:#ece9ff;color:#7c6cf0;}\r\n .framework-icon.blue{background:#e1e9ff;color:#2f5bff;}\r\n .framework-card h4{\r\n font-size:18px;\r\n font-weight:700;\r\n line-height:1.4;\r\n color:#13202c;\r\n margin-bottom:14px;\r\n }\r\n .framework-card p{\r\n font-size:14px;\r\n font-weight:400;\r\n line-height:1.75;\r\n color:var(--text-gray);\r\n }\r\n\r\n \/* ===== Final CTA ===== *\/\r\n .final-cta-wrap{\r\n padding:0 60px 100px;\r\n }\r\n .final-cta{\r\n background:linear-gradient(135deg,#3a64ff,#2848d6);\r\n border-radius:24px;\r\n color:#fff;\r\n text-align:center;\r\n padding:70px 30px;\r\n max-width:1180px;\r\n margin:0 auto;\r\n box-shadow:0 30px 60px rgba(47,91,255,0.25);\r\n }\r\n .final-cta h2{\r\n font-size:34px;\r\n font-weight:800;\r\n margin-bottom:34px;\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:#ffffff !important;\r\n color:var(--blue) !important;\r\n font-size:12.5px;\r\n font-weight:700;\r\n letter-spacing:0.4px;\r\n padding:14px 30px;\r\n border-radius:30px;\r\n border:none;\r\n cursor:pointer;\r\n outline:none;\r\n }\r\n .btn-white:hover,\r\n .btn-white:focus,\r\n .btn-white:active,\r\n .btn-white:visited{\r\n background:#ffffff !important;\r\n color:var(--blue) !important;\r\n outline:none;\r\n box-shadow:none;\r\n }\r\n .btn-outline-white{\r\n border:1.5px solid #fff !important;\r\n color:#ffffff !important;\r\n background:var(--blue) !important;\r\n font-size:12.5px;\r\n font-weight:700;\r\n letter-spacing:0.4px;\r\n padding:14px 30px;\r\n border-radius:30px;\r\n cursor:pointer;\r\n outline:none;\r\n }\r\n .btn-outline-white:hover,\r\n .btn-outline-white:focus,\r\n .btn-outline-white:active,\r\n .btn-outline-white:visited{\r\n border:1.5px solid #fff !important;\r\n color:#ffffff !important;\r\n background:var(--blue) !important;\r\n outline:none;\r\n box-shadow:none;\r\n }\r\n \/* ===== Responsive ===== *\/\r\n @media(max-width:1000px){\r\n .videos-grid{grid-template-columns:repeat(2,1fr);}\r\n }\r\n @media(max-width:900px){\r\n .topbar{padding:16px 24px;}\r\n .hero{padding:50px 24px 70px;}\r\n .hero h2{font-size:36px;}\r\n .what-is-section, .videos-section, .framework-section{padding:60px 24px;}\r\n .final-cta-wrap{padding:0 24px 70px;}\r\n .heading-lg{font-size:28px;}\r\n .what-is-left h3{font-size:26px;}\r\n .final-cta h2{font-size:26px;}\r\n .feature-grid{grid-template-columns:1fr 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 .videos-grid{grid-template-columns:1fr;}\r\n .feature-grid{grid-template-columns:1fr 1fr;padding:18px;gap:14px;}\r\n .framework-grid{flex-direction:column;}\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\">\u25a6<\/div>\r\n <div class=\"topbar-titles\">\r\n <h1>LDS: Design Studio<\/h1>\r\n <p>LEARNING DESIGN HUB<\/p>\r\n <\/div>\r\n <\/div>\r\n <a href=\"https:\/\/idealslearning.cite.hku.hk\/\" class=\"back-btn\">BACK \u2715<\/a>\r\n <\/div>\r\n\r\n <!-- Hero -->\r\n <section class=\"hero\">\r\n <span class=\"badge fade-up\">WHAT IS LDS?<\/span>\r\n <h2 class=\"fade-up\">Learning Design Studio\u2122<\/h2>\r\n <div class=\"hero-sub-row fade-up delay-1\">\r\n <p class=\"hero-desc\">A pedagogically grounded productivity and collaboration platform developed by the University of Hong Kong. It particularly supports Teacher Inquiry of Students' Learning (TISL).<\/p>\r\n <a href=\"mailto:ideals@hku.hk?subject=IDEALS:%20Request%20a%20Demo\" \r\n style=\"display:inline-block; background:#2f5bff; 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 REQUEST DEMO\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 <div class=\"hero-image-placeholder\">.<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- What is LDS -->\r\n <section class=\"what-is-section\">\r\n <div class=\"what-is-grid\">\r\n <div class=\"what-is-left fade-up\">\r\n <h3>What is Learning Design Studio\u2122<\/h3>\r\n <div class=\"divider-line\"><\/div>\r\n <p>Learning Design Studio\u2122 is a pedagogically grounded productivity and collaboration platform for professionals in the Learning Design (LD), Learning Analytics (LA), and Education communities (particularly those interested in using LD to support Teacher Inquiry of Student Learning (TISL)).<\/p>\r\n <p>The platform provides users with easy-to-use learning design patterns for various subjects, supplemented by guidance on setting learning outcomes, curriculum components and visual analysis on learning design.<\/p>\r\n <\/div>\r\n <div class=\"what-is-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 blue\">\u25a6<\/div>\r\n <span class=\"label\">EASY PATTERNS<\/span>\r\n <\/div>\r\n <div class=\"feature-box hover-lift\">\r\n <div class=\"feature-icon purple\">\u2713<\/div>\r\n <span class=\"label\">OUTCOME GUIDE<\/span>\r\n <\/div>\r\n <div class=\"feature-box hover-lift\">\r\n <div class=\"feature-icon violet\">\u2726<\/div>\r\n <span class=\"label\">VISUAL ANALYSIS<\/span>\r\n <\/div>\r\n <div class=\"feature-box hover-lift\">\r\n <div class=\"feature-icon green\">\ud83d\udc65<\/div>\r\n <span class=\"label\">COLLABORATION GUIDE<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Introductory Videos -->\r\n <section class=\"videos-section\">\r\n <h2 class=\"heading-lg fade-up\">Introductory Videos<\/h2>\r\n <div class=\"heading-divider\"><\/div>\r\n\r\n <div class=\"videos-grid\">\r\n <a href=\"https:\/\/www.youtube.com\/watch?v=STL7QpT7tFA\" target=\"_blank\" rel=\"noopener\" class=\"video-card fade-up\">\r\n <div class=\"video-thumb\" style=\"background-image:url('https:\/\/idealslearning.cite.hku.hk\/wp-content\/uploads\/2026\/07\/maxresdefault.jpg');\">\r\n <div class=\"play-btn\">\u25b6<\/div>\r\n <span class=\"video-duration\">4:25<\/span>\r\n <\/div>\r\n <div class=\"video-title\">An Introduction to Learning Design Studio<\/div>\r\n <div class=\"video-tag\">YOUTUBE TUTORIAL<\/div>\r\n <\/a>\r\n\r\n <a href=\"https:\/\/www.youtube.com\/watch?v=8g_91Ng5_aI\" target=\"_blank\" rel=\"noopener\" class=\"video-card fade-up delay-1\">\r\n <div class=\"video-thumb\" style=\"background-image:url('https:\/\/idealslearning.cite.hku.hk\/wp-content\/uploads\/2026\/07\/maxresdefault-1.jpg');\">\r\n <div class=\"play-btn\">\u25b6<\/div>\r\n <span class=\"video-duration\">5:12<\/span>\r\n <\/div>\r\n <div class=\"video-title\">How LDS scaffolds the implementation of the LDT<\/div>\r\n <div class=\"video-tag\">YOUTUBE TUTORIAL<\/div>\r\n <\/a>\r\n\r\n <a href=\"https:\/\/www.youtube.com\/watch?v=5HwqoekILZw\" target=\"_blank\" rel=\"noopener\" class=\"video-card fade-up delay-2\">\r\n <div class=\"video-thumb\" style=\"background-image:url('https:\/\/idealslearning.cite.hku.hk\/wp-content\/uploads\/2026\/07\/maxresdefault-2.jpg');\">\r\n <div class=\"play-btn\">\u25b6<\/div>\r\n <span class=\"video-duration\">8:45<\/span>\r\n <\/div>\r\n <div class=\"video-title\">Nested layers of pedagogical decision making in learning design<\/div>\r\n <div class=\"video-tag\">YOUTUBE TUTORIAL<\/div>\r\n <\/a>\r\n\r\n <a href=\"https:\/\/www.youtube.com\/watch?v=gzIU_3j33ZA\" target=\"_blank\" rel=\"noopener\" class=\"video-card fade-up delay-3\">\r\n <div class=\"video-thumb\" style=\"background-image:url('https:\/\/idealslearning.cite.hku.hk\/wp-content\/uploads\/2026\/07\/maxresdefault-3.jpg');\">\r\n <div class=\"play-btn\">\u25b6<\/div>\r\n <span class=\"video-duration\">6:30<\/span>\r\n <\/div>\r\n <div class=\"video-title\">How LDS scaffolds teachers' reflection through the designer dashboard<\/div>\r\n <div class=\"video-tag\">YOUTUBE TUTORIAL<\/div>\r\n <\/a>\r\n\r\n <a href=\"https:\/\/www.youtube.com\/watch?v=NAB9vt25eQc\" target=\"_blank\" rel=\"noopener\" class=\"video-card fade-up delay-4\">\r\n <div class=\"video-thumb\" style=\"background-image:url('https:\/\/idealslearning.cite.hku.hk\/wp-content\/uploads\/2026\/07\/maxresdefault-4.jpg');\">\r\n <div class=\"play-btn\">\u25b6<\/div>\r\n <span class=\"video-duration\">3:15<\/span>\r\n <\/div>\r\n <div class=\"video-title\">What is a \"Learning Design Triangle\"?<\/div>\r\n <div class=\"video-tag\">YOUTUBE TUTORIAL<\/div>\r\n <\/a>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Conceptual Framework -->\r\n <section class=\"framework-section\">\r\n <h2 class=\"heading-lg fade-up\">Conceptual Framework<\/h2>\r\n <p class=\"framework-sub fade-up\">ROOTED IN LEARNING SCIENCES<\/p>\r\n\r\n <div class=\"framework-grid\">\r\n <div class=\"framework-card hover-lift fade-up\">\r\n <div class=\"framework-icon violet\">\u2726<\/div>\r\n <h4>Learning Design as Assessment as\/for Learning And Collaboration Platform<\/h4>\r\n <p>Enabling educators to collaborate, co-create, and share pedagogical innovations in a systematic way.<\/p>\r\n <\/div>\r\n\r\n <div class=\"framework-card hover-lift fade-up delay-1\">\r\n <div class=\"framework-icon blue\">\ud83d\uddc4<\/div>\r\n <h4>Design for Inquiry (TISL)<\/h4>\r\n <p>Supports Teacher Inquiry of Students' Learning by linking learning design with students' learning data.<\/p>\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>Ready to Start Your Design?<\/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:#2f5bff; 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 REQUEST DEMO\r\n\r\n<\/a>\r\n <a href=\"https:\/\/web.edcity.hk\/en\/elafp\/project\/20210212\/\"\r\n target=\"_blank\"\r\n rel=\"noopener\"\r\n class=\"btn-outline-white\">\r\n SUBSCRIBE\r\n<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n<script>\r\n(function() {\r\n function initFadeUp() {\r\n var elements = document.querySelectorAll('.fade-up');\r\n\r\n \/* If inside Elementor editor \u2014 make all visible immediately *\/\r\n if (\r\n document.body.classList.contains('elementor-editor-active') ||\r\n document.body.classList.contains('elementor-editor-preview') ||\r\n window.elementorFrontend ||\r\n window.elementor\r\n ) {\r\n elements.forEach(function(el) {\r\n el.classList.add('visible');\r\n });\r\n return;\r\n }\r\n\r\n \/* Normal front-end \u2014 use IntersectionObserver *\/\r\n if ('IntersectionObserver' in window) {\r\n var observer = new IntersectionObserver(function(entries) {\r\n entries.forEach(function(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(function(el) { observer.observe(el); });\r\n } else {\r\n \/* Fallback for old browsers *\/\r\n elements.forEach(function(el) { el.classList.add('visible'); });\r\n }\r\n }\r\n\r\n \/* Run immediately + on DOM ready + on Elementor frontend init *\/\r\n initFadeUp();\r\n document.addEventListener('DOMContentLoaded', initFadeUp);\r\n\r\n \/* Elementor fires this when editor reloads a widget *\/\r\n window.addEventListener('elementor\/frontend\/init', initFadeUp);\r\n\r\n \/* Extra safety: run again after short delay to catch late renders *\/\r\n setTimeout(initFadeUp, 300);\r\n setTimeout(initFadeUp, 800);\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>LDS: Design Studio \u25a6 LDS: Design Studio LEARNING DESIGN HUB BACK \u2715 WHAT IS LDS? Learning Design Studio\u2122 A pedagogically grounded productivity and collaboration platform developed by the University of Hong Kong. It particularly supports Teacher Inquiry of Students’ Learning (TISL). REQUEST DEMO . What is Learning Design Studio\u2122 Learning Design Studio\u2122 is a pedagogically […]<\/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-765","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=\/wp\/v2\/pages\/765","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=765"}],"version-history":[{"count":33,"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=\/wp\/v2\/pages\/765\/revisions"}],"predecessor-version":[{"id":1578,"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=\/wp\/v2\/pages\/765\/revisions\/1578"}],"wp:attachment":[{"href":"https:\/\/idealslearning.cite.hku.hk\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=765"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}