238 lines
26 KiB
HTML
238 lines
26 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Wheel of Wellness — Question Bank</title>
|
|
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700;800&family=DM+Sans:wght@300;400;500;600;700&display=swap" rel="stylesheet">
|
|
<style>
|
|
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
|
|
html,body{width:100%;height:100%;overflow:hidden;background:#4A5A5B;font-family:'DM Sans',sans-serif}
|
|
.scaler{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center}
|
|
.slide{width:1920px;height:1080px;overflow:hidden;position:relative;transform-origin:center center;display:none}
|
|
.slide.active{display:block}
|
|
.bg-cream{background:radial-gradient(ellipse at 70% 10%,#FBF8F5 0%,#F5F0EB 40%,#EDE6DB 100%)}
|
|
.bg-dark{background:linear-gradient(160deg,#3A6B6B 0%,#2D5454 100%)}
|
|
.deco{position:absolute;border-radius:50%;opacity:0.04;background:white}
|
|
.deco-1{width:600px;height:600px;top:-200px;right:-100px}
|
|
.deco-2{width:400px;height:400px;bottom:-100px;left:-80px}
|
|
.deco-3{width:250px;height:250px;top:200px;left:300px}
|
|
.h-display{font-family:'Playfair Display',Georgia,serif;font-weight:800;line-height:1.1}
|
|
.h-sub{font-family:'DM Sans',sans-serif;font-weight:600}
|
|
.body-text{font-family:'DM Sans',sans-serif;font-weight:400;line-height:1.55;color:#2D3436}
|
|
.card{background:#FBF8F5;border:1px solid rgba(224,216,204,0.92);border-radius:16px;box-shadow:0 4px 20px rgba(30,40,41,0.08);overflow:hidden;position:relative}
|
|
.card-top{height:10px;position:absolute;top:0;left:0;right:0}
|
|
.card-inner{padding:22px 24px 18px}
|
|
.card h3{font-family:'DM Sans',sans-serif;font-weight:700;font-size:22px;color:#2D3436;margin-bottom:8px}
|
|
.card p{font-size:16px;color:#6B6B6B;line-height:1.45}
|
|
.tag{display:inline-block;font-size:12px;font-weight:700;padding:3px 12px;border-radius:20px;letter-spacing:0.4px;margin-bottom:10px}
|
|
.tag-teal{background:rgba(46,125,111,0.1);color:#2E7D6F}
|
|
.tag-coral{background:rgba(232,131,92,0.1);color:#E8835C}
|
|
.tag-sage{background:rgba(95,122,97,0.1);color:#5F7A61}
|
|
.tag-tan{background:rgba(206,181,154,0.15);color:#8B7355}
|
|
.tag-purple{background:rgba(123,31,162,0.08);color:#7B1FA2}
|
|
.ct .card-top{background:#2E7D6F}
|
|
.ce .card-top{background:#E8835C}
|
|
.cs .card-top{background:#5F7A61}
|
|
.cd .card-top{background:#E65100}
|
|
.cp .card-top{background:#F57F17}
|
|
.cg .card-top{background:#C62828}
|
|
.dim-pills{display:flex;gap:14px;flex-wrap:wrap;margin:16px 0}
|
|
.dim-pill{display:flex;align-items:center;gap:8px;padding:8px 18px;border-radius:24px;font-weight:700;font-size:16px;border:2px solid}
|
|
.dp-phys{border-color:#1565C0;color:#1565C0;background:rgba(21,101,192,0.06)}
|
|
.dp-emo{border-color:#7B1FA2;color:#7B1FA2;background:rgba(123,31,162,0.06)}
|
|
.dp-soc{border-color:#2E7D32;color:#2E7D32;background:rgba(46,125,50,0.06)}
|
|
.dp-day{border-color:#E65100;color:#E65100;background:rgba(230,81,0,0.06)}
|
|
.dp-pur{border-color:#F57F17;color:#F57F17;background:rgba(245,127,23,0.06)}
|
|
.dp-grow{border-color:#C62828;color:#C62828;background:rgba(198,40,40,0.06)}
|
|
.q-row{display:flex;align-items:flex-start;gap:16px;padding:12px 20px;border-radius:10px;margin-bottom:6px}
|
|
.q-row:nth-child(odd){background:rgba(46,125,111,0.03)}
|
|
.q-id{font-weight:800;font-size:15px;color:#2E7D6F;min-width:45px;padding-top:1px}
|
|
.q-dim{font-size:12px;font-weight:700;color:#5F7A61;min-width:120px;text-transform:uppercase;letter-spacing:0.8px;padding-top:2px}
|
|
.q-text{font-size:17px;color:#2D3436;flex:1;line-height:1.4}
|
|
.q-src{font-size:12px;color:#6B6B6B;font-style:italic;min-width:160px;text-align:right;padding-top:2px}
|
|
.score-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-top:20px}
|
|
.score-box{background:white;border-radius:14px;padding:24px;text-align:center;border:2px solid #E0D8CC}
|
|
.score-num{font-family:'Playfair Display',serif;font-size:52px;font-weight:800;line-height:1}
|
|
.score-label{font-size:16px;font-weight:600;margin-top:6px}
|
|
.score-desc{font-size:13px;color:#6B6B6B;margin-top:4px}
|
|
.sb-attention .score-num{color:#E85C4A}.sb-attention{border-color:#E85C4A}
|
|
.sb-moderate .score-num{color:#F9A825}.sb-moderate{border-color:#F9A825}
|
|
.sb-strong .score-num{color:#4CAF50}.sb-strong{border-color:#4CAF50}
|
|
.nav-bar{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:12px 30px;background:rgba(45,52,54,0.9);color:white;z-index:100;font-size:14px}
|
|
.nav-bar button{background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.25);color:white;padding:6px 18px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer}
|
|
.nav-bar button:hover{background:rgba(255,255,255,0.25)}
|
|
.nav-bar .counter{font-weight:600;font-variant-numeric:tabular-nums}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="scaler">
|
|
<div class="slide bg-dark active">
|
|
<div class="deco deco-1"></div><div class="deco deco-2"></div><div class="deco deco-3"></div>
|
|
<div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:2">
|
|
<div class="h-display" style="font-size:100px;color:white;margin-bottom:20px">Wheel of Wellness</div>
|
|
<div class="h-display" style="font-size:72px;color:#CEB59A;margin-bottom:30px">Full Question Bank</div>
|
|
<div class="h-sub" style="font-size:24px;color:rgba(255,255,255,0.65);letter-spacing:0.5px">HELPipedia / SpecialNeeds.help · Evidence-Based Assessment Items</div>
|
|
<div style="margin-top:40px;font-size:18px;color:rgba(255,255,255,0.45)">Prepared by Kayla Newkirk, M.S.Ed., MHC-LP · July 2026</div>
|
|
</div>
|
|
</div>
|
|
<div class="slide bg-cream">
|
|
<div style="padding:80px 100px">
|
|
<div class="h-display" style="font-size:56px;color:#1F5C52;margin-bottom:12px">What This Is</div>
|
|
<div class="body-text" style="font-size:22px;max-width:1600px;margin-bottom:40px">A complete set of evidence-based assessment questions across 5 audience variants and 6 wellness dimensions. Each item is mapped to a validated instrument, adapted at or below a 4th-grade reading level.</div>
|
|
<div style="display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;gap:20px">
|
|
<div class="card ct"><div class="card-top"></div><div class="card-inner"><div class="tag tag-teal">Audience 1</div><h3>Generalized</h3><p>18 questions · WHO-5 + PROMIS-10</p></div></div>
|
|
<div class="card ce"><div class="card-top"></div><div class="card-inner"><div class="tag tag-coral">Audience 2</div><h3>Parent / Caregiver</h3><p>18 questions · CWBS-SF + CAREPAL-8</p></div></div>
|
|
<div class="card cs"><div class="card-top"></div><div class="card-inner"><div class="tag tag-sage">Audience 3</div><h3>Family Member</h3><p>18 questions · Beach Center FQOL</p></div></div>
|
|
<div class="card cd"><div class="card-top"></div><div class="card-inner"><div class="tag tag-tan">Audience 4</div><h3>Professional</h3><p>18 questions · ProQOL-5 + OLBI</p></div></div>
|
|
<div class="card cp"><div class="card-top"></div><div class="card-inner"><div class="tag tag-purple">Audience 5</div><h3>Person w/ Disability</h3><p>12 questions · PWI-ID + WHO-5</p></div></div>
|
|
</div>
|
|
<div style="display:flex;gap:14px;margin-top:30px;justify-content:center">
|
|
<div class="tag tag-teal" style="font-size:15px;padding:8px 24px">90 total items</div>
|
|
<div class="tag tag-coral" style="font-size:15px;padding:8px 24px">6 validated instruments</div>
|
|
<div class="tag tag-sage" style="font-size:15px;padding:8px 24px">All 6 wellness dimensions</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="slide bg-cream">
|
|
<div style="padding:60px 100px;display:flex;gap:60px;height:100%">
|
|
<div style="flex:1;display:flex;flex-direction:column;justify-content:center">
|
|
<div class="h-display" style="font-size:52px;color:#1F5C52;margin-bottom:24px">The Six Dimensions</div>
|
|
<div class="body-text" style="font-size:20px;margin-bottom:32px">Adapted from Myers, Sweeney, & Witmer (1998) and tailored for the caregiver and disability community.</div>
|
|
<div class="dim-pills">
|
|
<div class="dim-pill dp-phys">💪 Physical</div>
|
|
<div class="dim-pill dp-emo">💗 Emotional</div>
|
|
<div class="dim-pill dp-soc">🤝 Social</div>
|
|
<div class="dim-pill dp-day">📋 Daily Life</div>
|
|
<div class="dim-pill dp-pur">⭐ Purpose</div>
|
|
<div class="dim-pill dp-grow">🌱 Growth</div>
|
|
</div>
|
|
</div>
|
|
<div style="flex:1;display:flex;align-items:center;justify-content:center">
|
|
<svg viewBox="0 0 500 500" width="500" height="500">
|
|
<g transform="translate(250,250)">
|
|
<circle r="210" fill="white" stroke="#E8E8E8" stroke-width="1"/>
|
|
<path d="M 0,-210 A 210,210 0 0,1 181.9,-105 L 0,0 Z" fill="#2E7D6F" opacity="0.85"/>
|
|
<path d="M 181.9,-105 A 210,210 0 0,1 181.9,105 L 0,0 Z" fill="#E8835C" opacity="0.85"/>
|
|
<path d="M 181.9,105 A 210,210 0 0,1 0,210 L 0,0 Z" fill="#5BA4CF" opacity="0.85"/>
|
|
<path d="M 0,210 A 210,210 0 0,1 -181.9,105 L 0,0 Z" fill="#F4B942" opacity="0.85"/>
|
|
<path d="M -181.9,105 A 210,210 0 0,1 -181.9,-105 L 0,0 Z" fill="#9B72CF" opacity="0.85"/>
|
|
<path d="M -181.9,-105 A 210,210 0 0,1 0,-210 L 0,0 Z" fill="#E85C4A" opacity="0.85"/>
|
|
<circle r="70" fill="white" stroke="#E8E8E8" stroke-width="1"/>
|
|
<text text-anchor="middle" y="-8" font-size="16" font-weight="800" fill="#2E7D6F" font-family="DM Sans,sans-serif">WHEEL OF</text>
|
|
<text text-anchor="middle" y="16" font-size="16" font-weight="800" fill="#2E7D6F" font-family="DM Sans,sans-serif">WELLNESS</text>
|
|
<g transform="translate(80,-145)"><text text-anchor="middle" y="0" font-size="32">💪</text><text text-anchor="middle" y="28" font-size="16" font-weight="700" fill="white" font-family="DM Sans,sans-serif">Physical</text></g>
|
|
<g transform="translate(170,0)"><text text-anchor="middle" y="0" font-size="32">💗</text><text text-anchor="middle" y="28" font-size="16" font-weight="700" fill="white" font-family="DM Sans,sans-serif">Emotional</text></g>
|
|
<g transform="translate(95,130)"><text text-anchor="middle" y="0" font-size="32">🤝</text><text text-anchor="middle" y="28" font-size="16" font-weight="700" fill="white" font-family="DM Sans,sans-serif">Social</text></g>
|
|
<g transform="translate(-95,130)"><text text-anchor="middle" y="0" font-size="32">📋</text><text text-anchor="middle" y="28" font-size="16" font-weight="700" fill="white" font-family="DM Sans,sans-serif">Daily Life</text></g>
|
|
<g transform="translate(-170,0)"><text text-anchor="middle" y="0" font-size="32">⭐</text><text text-anchor="middle" y="28" font-size="16" font-weight="700" fill="white" font-family="DM Sans,sans-serif">Purpose</text></g>
|
|
<g transform="translate(-80,-145)"><text text-anchor="middle" y="0" font-size="32">🌱</text><text text-anchor="middle" y="28" font-size="16" font-weight="700" fill="white" font-family="DM Sans,sans-serif">Growth</text></g>
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="slide bg-dark"><div class="deco deco-1"></div><div class="deco deco-2"></div><div class="deco deco-3"></div><div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:1400px;z-index:2"><div class="h-display" style="font-size:90px;color:white;margin-bottom:16px">👥 Generalized</div><div class="h-sub" style="font-size:28px;color:rgba(255,255,255,0.7)">WHO-5 Well-Being Index + PROMIS Global Health-10</div></div></div>
|
|
<div class="slide bg-cream"><div style="padding:50px 80px"><div style="display:flex;align-items:center;gap:20px;margin-bottom:10px"><div class="h-display" style="font-size:42px;color:#1F5C52">Generalized — Sample Items</div><div class="tag tag-teal" style="font-size:14px;padding:6px 16px">All Audiences · 18 items</div></div><div style="font-size:15px;color:#6B6B6B;margin-bottom:20px">Response scale: Almost all the time · More than half · Some of the time · Once in a while</div><div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">G1</div><div class="q-dim">Physical</div><div class="q-text">In the past month, how often have you felt tired or worn out?</div><div class="q-src">PROMIS Global08</div></div>
|
|
<div class="q-row" style=""><div class="q-id">G4</div><div class="q-dim">Emotional</div><div class="q-text">In the past two weeks, how often have you felt calm and at ease?</div><div class="q-src">WHO-5 Item 2</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">G7</div><div class="q-dim">Social</div><div class="q-text">Do you have people in your life you can count on when things get hard?</div><div class="q-src">PROMIS Global05</div></div>
|
|
<div class="q-row" style=""><div class="q-id">G10</div><div class="q-dim">Daily Life</div><div class="q-text">How confident are you that you can handle everyday tasks like bills, forms, and schedules?</div><div class="q-src">PROMIS Global06</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">G13</div><div class="q-dim">Purpose</div><div class="q-text">In the past two weeks, how often has your daily life been filled with things that interest you?</div><div class="q-src">WHO-5 Item 5</div></div>
|
|
<div class="q-row" style=""><div class="q-id">G16</div><div class="q-dim">Growth</div><div class="q-text">In the past two weeks, how often have you felt active and full of energy?</div><div class="q-src">WHO-5 Item 3</div></div>
|
|
</div></div>
|
|
<div class="slide bg-dark"><div class="deco deco-1"></div><div class="deco deco-2"></div><div class="deco deco-3"></div><div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:1400px;z-index:2"><div class="h-display" style="font-size:90px;color:white;margin-bottom:16px">👩👧 Parent / Caregiver</div><div class="h-sub" style="font-size:28px;color:rgba(255,255,255,0.7)">CWBS-SF + CAREPAL-8 + Preparedness for Caregiving Scale</div></div></div>
|
|
<div class="slide bg-cream"><div style="padding:50px 80px"><div style="display:flex;align-items:center;gap:20px;margin-bottom:10px"><div class="h-display" style="font-size:42px;color:#1F5C52">Parent / Caregiver — Sample Items</div><div class="tag tag-coral" style="font-size:14px;padding:6px 16px">Caregivers · 18 items</div></div><div style="font-size:15px;color:#6B6B6B;margin-bottom:20px">Response scale: Almost every day · More days than not · Once in a while · Rarely</div><div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">P1</div><div class="q-dim">Physical</div><div class="q-text">When did you last see a doctor for YOUR own health check?</div><div class="q-src">CWBS-SF</div></div>
|
|
<div class="q-row" style=""><div class="q-id">P4</div><div class="q-dim">Emotional</div><div class="q-text">How often do you feel worn out or weighed down by all you have to do?</div><div class="q-src">CAREPAL-8 Item 2</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">P7</div><div class="q-dim">Social</div><div class="q-text">Do you have someone who can watch your kids so you can take a break?</div><div class="q-src">CWBS-SF</div></div>
|
|
<div class="q-row" style=""><div class="q-id">P10</div><div class="q-dim">Daily Life</div><div class="q-text">How confident are you about handling school meetings, doctor visits, and paperwork?</div><div class="q-src">Preparedness Scale</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">P13</div><div class="q-dim">Purpose</div><div class="q-text">Do you feel accepted and respected by the professionals who work with your family?</div><div class="q-src">CAREPAL-8 Item 8</div></div>
|
|
<div class="q-row" style=""><div class="q-id">P16</div><div class="q-dim">Growth</div><div class="q-text">Are you learning new things about how to support your family member?</div><div class="q-src">Preparedness Scale</div></div>
|
|
</div></div>
|
|
<div class="slide bg-dark"><div class="deco deco-1"></div><div class="deco deco-2"></div><div class="deco deco-3"></div><div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:1400px;z-index:2"><div class="h-display" style="font-size:90px;color:white;margin-bottom:16px">🏠 Family Member</div><div class="h-sub" style="font-size:28px;color:rgba(255,255,255,0.7)">Beach Center Family Quality of Life Scale</div></div></div>
|
|
<div class="slide bg-cream"><div style="padding:50px 80px"><div style="display:flex;align-items:center;gap:20px;margin-bottom:10px"><div class="h-display" style="font-size:42px;color:#1F5C52">Family Member — Sample Items</div><div class="tag tag-sage" style="font-size:14px;padding:6px 16px">Household · 18 items</div></div><div style="font-size:15px;color:#6B6B6B;margin-bottom:20px">Response scale: Very satisfied · Satisfied · Neither · Dissatisfied</div><div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">F1</div><div class="q-dim">Physical</div><div class="q-text">Do members of your family get the medical care they need when they need it?</div><div class="q-src">FQOL Item 19</div></div>
|
|
<div class="q-row" style=""><div class="q-id">F4</div><div class="q-dim">Emotional</div><div class="q-text">Does your family have the support you need to handle stress?</div><div class="q-src">FQOL Item 13</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">F8</div><div class="q-dim">Social</div><div class="q-text">Does your family enjoy spending time together?</div><div class="q-src">FQOL Item 1</div></div>
|
|
<div class="q-row" style=""><div class="q-id">F10</div><div class="q-dim">Daily Life</div><div class="q-text">Are you able to get the services your family member with a disability needs?</div><div class="q-src">FQOL Items 22-25</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">F13</div><div class="q-dim">Purpose</div><div class="q-text">Does your family solve problems together?</div><div class="q-src">FQOL Item 3</div></div>
|
|
<div class="q-row" style=""><div class="q-id">F16</div><div class="q-dim">Growth</div><div class="q-text">Do family members help the children learn to be independent?</div><div class="q-src">FQOL Item 7</div></div>
|
|
</div></div>
|
|
<div class="slide bg-dark"><div class="deco deco-1"></div><div class="deco deco-2"></div><div class="deco deco-3"></div><div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:1400px;z-index:2"><div class="h-display" style="font-size:90px;color:white;margin-bottom:16px">🩺 Professional</div><div class="h-sub" style="font-size:28px;color:rgba(255,255,255,0.7)">ProQOL-5 + Oldenburg Burnout Inventory</div></div></div>
|
|
<div class="slide bg-cream"><div style="padding:50px 80px"><div style="display:flex;align-items:center;gap:20px;margin-bottom:10px"><div class="h-display" style="font-size:42px;color:#1F5C52">Professional — Sample Items</div><div class="tag tag-tan" style="font-size:14px;padding:6px 16px">Helping Professionals · 18 items</div></div><div style="font-size:15px;color:#6B6B6B;margin-bottom:20px">Response scale: Almost every day · Several days a week · Once in a while · Rarely</div><div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">PR1</div><div class="q-dim">Physical</div><div class="q-text">How often do you feel physically drained after your workday?</div><div class="q-src">ProQOL-5 Item 19</div></div>
|
|
<div class="q-row" style=""><div class="q-id">PR4</div><div class="q-dim">Emotional</div><div class="q-text">I find my work as a helper to be deeply satisfying.</div><div class="q-src">ProQOL-5 Item 3</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">PR7</div><div class="q-dim">Social</div><div class="q-text">Do you have colleagues you can talk with honestly about difficult cases?</div><div class="q-src">ProQOL-5 (adapted)</div></div>
|
|
<div class="q-row" style=""><div class="q-id">PR10</div><div class="q-dim">Daily Life</div><div class="q-text">How well do you maintain a boundary between work and personal life?</div><div class="q-src">OLBI (adapted)</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">PR13</div><div class="q-dim">Purpose</div><div class="q-text">I believe I can make a difference through my work.</div><div class="q-src">ProQOL-5 Item 22</div></div>
|
|
<div class="q-row" style=""><div class="q-id">PR16</div><div class="q-dim">Growth</div><div class="q-text">I am pleased with how I keep up with helping techniques and protocols.</div><div class="q-src">ProQOL-5 Item 16</div></div>
|
|
</div></div>
|
|
<div class="slide bg-dark"><div class="deco deco-1"></div><div class="deco deco-2"></div><div class="deco deco-3"></div><div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:1400px;z-index:2"><div class="h-display" style="font-size:90px;color:white;margin-bottom:16px">♿ Person with Disability</div><div class="h-sub" style="font-size:28px;color:rgba(255,255,255,0.7)">PWI-ID + WHO-5 (simplified) · Emoji response scale</div></div></div>
|
|
<div class="slide bg-cream"><div style="padding:50px 80px"><div style="display:flex;align-items:center;gap:20px;margin-bottom:10px"><div class="h-display" style="font-size:42px;color:#1F5C52">Person with Disability — Sample Items</div><div class="tag tag-purple" style="font-size:14px;padding:6px 16px">Accessible Format · 12 items</div></div><div style="font-size:15px;color:#6B6B6B;margin-bottom:20px">Response scale: 😟 Not Good · 😐 Okay · 🙂 Pretty Good · 😊 Good · 😄 Very Good</div><div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">SN1</div><div class="q-dim">My Body</div><div class="q-text">How do you feel about your health?</div><div class="q-src">PWI-ID: Health</div></div>
|
|
<div class="q-row" style=""><div class="q-id">SN3</div><div class="q-dim">My Feelings</div><div class="q-text">In the past two weeks, how often have you felt happy?</div><div class="q-src">WHO-5 Item 1</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">SN5</div><div class="q-dim">My People</div><div class="q-text">How do you feel about how you get along with people?</div><div class="q-src">PWI-ID: Relationships</div></div>
|
|
<div class="q-row" style=""><div class="q-id">SN7</div><div class="q-dim">My Day</div><div class="q-text">How do you feel about the things you have? Like your money and things you own.</div><div class="q-src">PWI-ID: Standard of Living</div></div>
|
|
<div class="q-row" style="background:rgba(46,125,111,0.03)"><div class="q-id">SN9</div><div class="q-dim">What Matters</div><div class="q-text">How do you feel about the things you do or make?</div><div class="q-src">PWI-ID: Achievement</div></div>
|
|
<div class="q-row" style=""><div class="q-id">SN11</div><div class="q-dim">Growing</div><div class="q-text">How do you feel about what will happen to you later in your life?</div><div class="q-src">PWI-ID: Future Security</div></div>
|
|
</div></div>
|
|
<div class="slide bg-cream">
|
|
<div style="padding:60px 100px">
|
|
<div class="h-display" style="font-size:52px;color:#1F5C52;margin-bottom:16px">Scoring & Interpretation</div>
|
|
<div class="body-text" style="font-size:20px;max-width:1500px;margin-bottom:36px">Each dimension is scored 0-100. Overall wellness score is the mean of all six dimensions.</div>
|
|
<div class="score-grid">
|
|
<div class="score-box sb-attention"><div class="score-num">0-39</div><div class="score-label" style="color:#E85C4A">Needs Attention</div><div class="score-desc">Area may need support or intervention</div></div>
|
|
<div class="score-box sb-moderate"><div class="score-num">40-59</div><div class="score-label" style="color:#F9A825">Moderate</div><div class="score-desc">Some strength, room to grow</div></div>
|
|
<div class="score-box sb-strong"><div class="score-num">60-100</div><div class="score-label" style="color:#4CAF50">Strong</div><div class="score-desc">Area of strength and stability</div></div>
|
|
</div>
|
|
<div style="margin-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:24px">
|
|
<div class="card ct"><div class="card-top"></div><div class="card-inner"><div class="tag tag-teal">Scoring</div><h3>Standard (18 items)</h3><p>3 items per dimension. Score = mean of 3 items × 25 (range: 0-100).</p></div></div>
|
|
<div class="card cs"><div class="card-top"></div><div class="card-inner"><div class="tag tag-sage">Accessible (12 items)</div><h3>Special Needs Format</h3><p>2 items per dimension. Score = mean of 2 items × 20 (range: 0-100).</p></div></div>
|
|
</div>
|
|
<div style="margin-top:24px;font-size:15px;color:#6B6B6B;font-style:italic">All instruments are screening tools for self-reflection and supportive conversation. Not diagnostic instruments.</div>
|
|
</div>
|
|
</div>
|
|
<div class="slide bg-dark">
|
|
<div class="deco deco-1"></div><div class="deco deco-2"></div><div class="deco deco-3"></div>
|
|
<div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:2">
|
|
<div class="h-display" style="font-size:80px;color:white;margin-bottom:20px">Next Steps</div>
|
|
<div class="h-sub" style="font-size:26px;color:rgba(255,255,255,0.7);max-width:1000px;line-height:1.5;margin-bottom:40px">Select audience-specific item sets for pilot testing. Validate reading level with target population. Connect to SpecialNeeds.help resource directory.</div>
|
|
<div style="display:flex;gap:24px;justify-content:center">
|
|
<div class="tag tag-teal" style="font-size:16px;padding:10px 28px">90 validated items</div>
|
|
<div class="tag tag-coral" style="font-size:16px;padding:10px 28px">5 audience variants</div>
|
|
<div class="tag tag-sage" style="font-size:16px;padding:10px 28px">6 evidence-based instruments</div>
|
|
</div>
|
|
<div style="margin-top:50px;font-size:18px;color:rgba(255,255,255,0.4)">Kayla Newkirk, M.S.Ed., MHC-LP · HELPipedia / SpecialNeeds.help · July 2026</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="nav-bar">
|
|
<button id="prevBtn">← Prev</button>
|
|
<span class="counter" id="counter">1 / 15</span>
|
|
<button id="nextBtn">Next →</button>
|
|
</div>
|
|
<script>
|
|
var current=0;
|
|
var slides=document.querySelectorAll('.slide');
|
|
slides[0].classList.add('active');
|
|
function navigate(d){
|
|
var next=Math.max(0,Math.min(slides.length-1,current+d));
|
|
if(next===current)return;
|
|
slides[current].classList.remove('active');
|
|
current=next;
|
|
slides[current].classList.add('active');
|
|
document.getElementById('counter').textContent=(current+1)+' / '+slides.length;
|
|
scaleSlide();
|
|
}
|
|
function scaleSlide(){
|
|
var s=slides[current];
|
|
var sx=window.innerWidth/1920;
|
|
var sy=(window.innerHeight-50)/1080;
|
|
s.style.transform='scale('+Math.min(sx,sy)+')';
|
|
}
|
|
window.addEventListener('resize',scaleSlide);
|
|
document.getElementById('prevBtn').onclick=function(){navigate(-1)};
|
|
document.getElementById('nextBtn').onclick=function(){navigate(1)};
|
|
document.addEventListener('keydown',function(e){
|
|
if(e.key==='ArrowRight'||e.key===' '){e.preventDefault();navigate(1)}
|
|
if(e.key==='ArrowLeft'){e.preventDefault();navigate(-1)}
|
|
});
|
|
scaleSlide();
|
|
</script>
|
|
</body>
|
|
</html> |