{"id":1,"date":"2025-10-01T14:41:48","date_gmt":"2025-10-01T14:41:48","guid":{"rendered":"https:\/\/imanconsulting.fi\/?p=1"},"modified":"2025-11-14T17:38:39","modified_gmt":"2025-11-14T17:38:39","slug":"koulukummitus","status":"publish","type":"post","link":"https:\/\/imanconsulting.fi\/?p=1","title":{"rendered":"AI &#8211; PoC: Koulukummitus \ud83d\udc7b"},"content":{"rendered":"\n<!-- AI PoC -putki: Idea \u2192 Proto \u2192 Demo \u2192 Mittaa (musta paneeli) -->\n<section class=\"poc-panel\" aria-label=\"AI PoC -putken esikatselu\">\n  <div class=\"poc-stage\" id=\"pocStage\" role=\"button\" tabindex=\"0\" aria-label=\"Avaa AI PoC -sivu\">\n    <!-- Taustaviiva (piirtyy sis\u00e4\u00e4n) -->\n    <svg class=\"poc-path\" viewBox=\"0 0 1000 420\" aria-hidden=\"true\" focusable=\"false\">\n      <!-- pisteet: 120,300 \u2192 360,220 \u2192 640,220 \u2192 880,140 -->\n      <path id=\"pocLine\" d=\"M120,300 C200,240 280,220 360,220 S520,220 640,220 800,180 880,140\"\n            fill=\"none\" stroke=\"rgba(255,255,255,.22)\" stroke-width=\"3\"\n            stroke-dasharray=\"8 10\" stroke-linecap=\"round\"\/>\n    <\/svg>\n\n    <!-- Solmut (animoidaan sis\u00e4\u00e4n) -->\n    <div class=\"node\" style=\"--x:120; --y:300;\">\n      <span class=\"icon\" aria-hidden=\"true\">\ud83d\udca1<\/span>\n      <span class=\"label\">Idea<\/span>\n    <\/div>\n\n    <div class=\"node\" style=\"--x:360; --y:220;\">\n      <span class=\"icon\" aria-hidden=\"true\">\ud83d\udee0\ufe0f<\/span>\n      <span class=\"label\">Proto<\/span>\n    <\/div>\n\n    <div class=\"node\" style=\"--x:640; --y:220;\">\n      <span class=\"icon\" aria-hidden=\"true\">\ud83d\ude80<\/span>\n      <span class=\"label\">Demo<\/span>\n    <\/div>\n\n    <div class=\"node\" style=\"--x:880; --y:140;\">\n      <span class=\"icon\" aria-hidden=\"true\">\ud83d\udcca<\/span>\n      <span class=\"label\">Mittaa<\/span>\n    <\/div>\n\n    <!-- CTA -->\n    <button class=\"poc-cta\" aria-label=\"Katso AI PoC -sivu (avaa uuteen v\u00e4lilehteen)\">\n      Katso AI&nbsp;PoC t\u00e4st\u00e4 \u2192\n    <\/button>\n  <\/div>\n<\/section>\n\n<style>\n\/* Paneeli \u2013 sama tyyli kuin heksa-osa: musta kortti, varjo, radius *\/\n.poc-panel{\n  --bg:#0B0C0F;\n  --border: rgba(255,255,255,.08);\n  --shadow: 0 10px 28px rgba(0,0,0,.28);\n  max-width: 980px;\n  margin: 24px auto;\n  padding: 0 12px;\n}\n.poc-stage{\n  position: relative;\n  min-height: 420px;\n  background: var(--bg);\n  border: 1px solid var(--border);\n  border-radius: 16px;\n  box-shadow: var(--shadow);\n  overflow: hidden;\n  cursor: pointer;\n  isolation: isolate;\n  outline: none;\n  display: block;\n}\n\n\/* Taustapolku piirtyy sis\u00e4\u00e4n *\/\n.poc-path{ position:absolute; inset:0; width:100%; height:100%; }\n#pocLine{ stroke-dashoffset: 600; animation: path-draw 2200ms ease forwards 300ms; }\n@keyframes path-draw{ from{ stroke-dashoffset:600; } to{ stroke-dashoffset:0; } }\n\n\/* Solmut (korttimaiset) *\/\n.node{\n  position: absolute;\n  left: calc((var(--x) \/ 1000) * 100%);\n  top:  calc((var(--y) \/ 420) * 100%);\n  transform: translate(-50%, -50%) translate(var(--ox, 0px), var(--oy, 0px)) scale(.96);\n  display: grid; place-items: center;\n  gap: 6px;\n  width: 96px; height: 96px;\n  border-radius: 16px;\n  background: #121521;\n  border: 1px solid rgba(255,255,255,.10);\n  box-shadow: 0 10px 26px rgba(0,0,0,.32);\n  opacity: 0;\n}\n.node .icon{ font-size: 34px; line-height: 1; filter: drop-shadow(0 6px 12px rgba(0,0,0,.35)); }\n.node .label{ font: 700 12px\/1 system-ui,-apple-system,Segoe UI,Roboto,sans-serif; color:#fff; opacity:.9; }\n\n\/* Rauhallinen sis\u00e4\u00e4ntulo *\/\n.node.ready{\n  transition:\n    transform 1600ms cubic-bezier(.2,.8,.2,1),\n    opacity   1100ms ease;\n  transform: translate(-50%, -50%) translate(0, 0) scale(1);\n  opacity: 1;\n}\n\/* Kevyt hengitys paikallaan *\/\n.node.ready .icon{ animation: breathe 2600ms ease-in-out infinite 900ms; }\n@keyframes breathe{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-4px); } }\n\n\/* CTA \u2013 valkoinen nappi, musta teksti *\/\n.poc-cta{\n  position: absolute; left:50%; bottom:16px; transform:translateX(-50%);\n  background:#fff; color:#0B0C0F;\n  border:1px solid rgba(0,0,0,.08);\n  border-radius:12px;\n  padding:11px 16px;\n  font:700 14px\/1 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;\n  box-shadow:0 8px 22px rgba(0,0,0,.25);\n  transition: transform .15s ease, box-shadow .2s ease;\n  pointer-events:auto;\n}\n.poc-cta:hover{ transform:translateX(-50%) translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.32); }\n\n\/* Mobiili *\/\n@media (max-width: 640px){\n  .poc-stage{ min-height: 420px; }\n  .node{ width:84px; height:84px; border-radius:14px; }\n  .node .icon{ font-size:30px; }\n}\n\n\/* V\u00e4hemm\u00e4n liikett\u00e4 pyyt\u00e4neille *\/\n@media (prefers-reduced-motion: reduce){\n  #pocLine{ animation:none; stroke-dashoffset:0; }\n  .node{ transition:none !important; transform:translate(-50%,-50%) !important; opacity:1 !important; }\n  .node .icon{ animation:none !important; }\n}\n<\/style>\n\n<script>\n\/* MUUTA T\u00c4H\u00c4N kohdesivu *\/\nconst AIPOC_URL = \"https:\/\/imanconsulting.fi\/pocs\/ghost2\";\n\n\/* Hitaampi, rauhallinen tempo \u2013 suurempi = hitaampi *\/\nconst SPEED = 1.6;\n\nwindow.addEventListener('DOMContentLoaded', () => {\n  const stage = document.getElementById('pocStage');\n  if (!stage) return;\n  const nodes = stage.querySelectorAll('.node');\n\n  \/\/ Satunnaiset aloitus-offsetit (ylh\u00e4\u00e4lt\u00e4\/alas\/vasemmalta)\n  nodes.forEach((n) => {\n    const ox = ((Math.random() * 260) - 130) | 0; \/\/ -130..130\n    const oy = ((Math.random() * 180) -  90) | 0; \/\/  -90..90\n    n.style.setProperty('--ox', ox + 'px');\n    n.style.setProperty('--oy', oy + 'px');\n  });\n\n  \/\/ Reflow \u2192 varmistaa transitionin\n  void stage.offsetWidth;\n\n  \/\/ Porrastettu sis\u00e4\u00e4ntulo\n  nodes.forEach((n, i) => {\n    const base = 160 * SPEED;\n    const rand = 420 * SPEED;\n    const step = 120 * SPEED;\n    const delay = base + Math.random() * rand + i * step;\n    setTimeout(() => { n.classList.add('ready'); n.style.setProperty('--ox','0px'); n.style.setProperty('--oy','0px'); }, delay);\n  });\n\n  \/\/ Avaus uuteen v\u00e4lilehteen klikatessa (tai Enter\/Space)\n  const open = () => { const win = window.open(AIPOC_URL, '_blank', 'noopener,noreferrer'); if (win) win.focus(); };\n  stage.addEventListener('click', open);\n  stage.addEventListener('keydown', (e) => {\n    if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); open(); }\n  });\n  stage.querySelector('.poc-cta').addEventListener('click', (e) => { e.stopPropagation(); open(); });\n});\n<\/script>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Mit\u00e4 t\u00e4m\u00e4 opettaa teko\u00e4lyn hy\u00f6dynt\u00e4misest\u00e4?<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Pieni rajaus \u2192 nopea arvo.<\/strong> Koulukummitus keskittyy yhteen teht\u00e4v\u00e4tyyppiin (sananarvaus\/ohjattu vihje). T\u00e4m\u00e4 tekee prompttien suunnittelusta hallittavaa ja tuloksista ennakoitavia \u2013 hyv\u00e4 periaate kaikkiin AI-kokeiluihin.<br><\/li>\n\n\n\n<li><strong>Ohjattu generointi.<\/strong> Taustalla oleva generatiivinen malli toimii \u201ckaiteiden\u201d sis\u00e4ll\u00e4: isot kirjaimet, mahdollinen tavutus, kiltin\/ilkikurisen persoonan s\u00e4vy, ei henkil\u00f6tietojen k\u00e4sittely\u00e4. N\u00e4in saat <strong>turvallisen<\/strong> ja <strong>tasalaatuisen<\/strong> kokemuksen.<br><\/li>\n\n\n\n<li><strong>Palaute muotoilee oppimista.<\/strong> Kieli on kannustavaa, vihjeet skaalautuvat osaamisen mukaan, ja vaikeustaso el\u00e4\u00e4 kevyesti \u2013 t\u00e4m\u00e4 on generatiivisen teko\u00e4lyn vahvuus opetuksessa.<br><\/li>\n\n\n\n<li><strong>Mittaaminen heti mukaan.<\/strong> Peliss\u00e4 on luonnostaan metriikat (yritykset, onnistumiset, poistumiskohdat, moodien k\u00e4ytt\u00f6). Ker\u00e4\u00e4 vain olennaiset ja k\u00e4yt\u00e4 niit\u00e4 seuraavan sprintin p\u00e4\u00e4t\u00f6ksiin.<br><\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Miss\u00e4 sama malli toimii?<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Termist\u00f6n harjoittelu:<\/strong> hoiva-ala, ICT, talous \u2013 \u201cselit\u00e4 termi 2 lauseella, anna esimerkki ja minitesti\u201d.<br><\/li>\n\n\n\n<li><strong>Perehdytys\/mikro-oppiminen:<\/strong> turvallisuus- ja k\u00e4yt\u00e4nt\u00f6testit lyhyin\u00e4 skenaarioina, v\u00e4lit\u00f6n palaute.<br><\/li>\n\n\n\n<li><strong>Br\u00e4nd\u00e4tyt kampanjapelit:<\/strong> tapahtumassa tai laskeutumissivulla koukuttava minipeli, joka ker\u00e4\u00e4 oivalluksia \u2013 ilman rekister\u00f6itymist\u00e4.<br><\/li>\n\n\n\n<li><strong>Erityisoppimisen tuet:<\/strong> iso fontti, selkokieli, tavutus-tila, \u00e4\u00e4nipalautteen helppo lis\u00e4\u00e4minen.<\/li>\n<\/ul>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Koulukummitus on kevyt, selaimessa toimiva peli, jossa \u201ckummitus\u201d kyselee ja kannustaa lasta arvaamaan sanoja tai ratkaisemaan pieni\u00e4 teht\u00e4vi\u00e4. Se on pieni mutta napakka AI-Proof-of-Concept (AI-PoC): demonstroi, miten generatiivinen teko\u00e4ly voidaan valjastaa turvallisesti, ohjatusti ja innostavasti oppimiskokemuksiin \u2013 muutamalla sprintill\u00e4 protosta k\u00e4ytett\u00e4v\u00e4\u00e4n demo\u00adon. <\/p>\n","protected":false},"author":1,"featured_media":296,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-1","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ai-poc"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=\/wp\/v2\/posts\/1","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1"}],"version-history":[{"count":20,"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=\/wp\/v2\/posts\/1\/revisions"}],"predecessor-version":[{"id":363,"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=\/wp\/v2\/posts\/1\/revisions\/363"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=\/wp\/v2\/media\/296"}],"wp:attachment":[{"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/imanconsulting.fi\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}