<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>身体感覚 &#8211; Tranquilvæj</title>
	<atom:link href="https://tranquilguides.com/tag/%E8%BA%AB%E4%BD%93%E6%84%9F%E8%A6%9A/feed/" rel="self" type="application/rss+xml" />
	<link>https://tranquilguides.com</link>
	<description>心地よい暮らしの始め方</description>
	<lastBuildDate>Thu, 25 Jun 2026 11:31:00 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.0</generator>

<image>
	<url>https://tranquilguides.com/wp-content/uploads/2026/01/cropped-IMG_3364-32x32.jpeg</url>
	<title>身体感覚 &#8211; Tranquilvæj</title>
	<link>https://tranquilguides.com</link>
	<width>32</width>
	<height>32</height>
</image> 
<site xmlns="com-wordpress:feed-additions:1">251661265</site>	<item>
		<title>静寂採集</title>
		<link>https://tranquilguides.com/quiet-capture/</link>
					<comments>https://tranquilguides.com/quiet-capture/#respond</comments>
		
		<dc:creator><![CDATA[案内人のアシカ]]></dc:creator>
		<pubDate>Tue, 23 Jun 2026 07:02:11 +0000</pubDate>
				<category><![CDATA[生存ログ]]></category>
		<category><![CDATA[時間]]></category>
		<category><![CDATA[観察]]></category>
		<category><![CDATA[記録]]></category>
		<category><![CDATA[身体感覚]]></category>
		<category><![CDATA[静けさ]]></category>
		<guid isPermaLink="false">https://tranquilguides.com/?p=1040</guid>

					<description><![CDATA[<p><img src="https://tranquilguides.com/wp-content/uploads/2026/06/20260623_155541-1024x683.jpg" class="webfeedsFeaturedVisual" /></p>音、光、身体、時間。いまこの瞬間を採集するための小さな観察装置。]]></description>
										<content:encoded><![CDATA[<p><img src="https://tranquilguides.com/wp-content/uploads/2026/06/20260623_155541-1024x683.jpg" class="webfeedsFeaturedVisual" /></p>
<style data-wp-block-html="css">
.tq-quiet-capture {
  max-width: 720px;
  margin: 0 auto;
  padding: clamp(32px, 7vw, 72px) clamp(20px, 5vw, 48px);
  border-radius: 32px;
  background:
    radial-gradient(circle at 20% 10%, rgba(255,255,255,.75), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.72), rgba(245,245,240,.48));
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 24px 80px rgba(0,0,0,.10);
  backdrop-filter: blur(18px) saturate(130%);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  color: #26302f;
  text-align: center;
}

.tq-qc-stage {
  animation: tqQcFade .45s ease both;
}

.tq-qc-kicker,
.tq-qc-count {
  margin: 0 0 16px;
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(38,48,47,.55);
}

.tq-quiet-capture h1{
  margin: 0 0 24px;
  font-weight: 300;
  letter-spacing: .08em;
  line-height: 1.5;
}

.tq-quiet-capture h1 {
  font-size: clamp(28px, 6vw, 46px);
}

.tq-qc-title,
.tq-qc-question,
.tq-qc-result-title {
  margin: 0 0 24px;
  font-weight: 500;
  letter-spacing: .08em;
  line-height: 1.5;
}

.tq-qc-title {
  font-size: clamp(28px, 6vw, 46px);
}

.tq-qc-question,
.tq-qc-result-title {
  font-size: clamp(22px, 4.8vw, 34px);
}

.tq-qc-lead {
  margin: 0 auto 36px;
  max-width: 520px;
  line-height: 2;
  color: rgba(38,48,47,.72);
}

.tq-qc-options {
  display: grid;
  gap: 14px;
  margin: 32px auto 24px;
}

.tq-qc-actions {
  display: grid;
  gap: 12px;
  margin-top: 8px;
}

/* 共通ボタン */
.tq-qc-options button,
#tq-qc-start-btn,
#tq-qc-restart,
.tq-qc-back,
#tq-qc-save {
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  padding: 15px 20px;
  border-radius: 999px;
  font-size: 15px;
  letter-spacing: .06em;
  cursor: pointer;
  transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
}

/* 通常ボタン */
.tq-qc-options button,
#tq-qc-start-btn,
#tq-qc-restart {
  border: 1px solid rgba(38,48,47,.18);
  background: rgba(255,255,255,.58);
  color: #26302f;
}

.tq-qc-options button:hover,
#tq-qc-start-btn:hover,
#tq-qc-restart:hover {
  transform: scale(1.025);
  background: rgba(255,255,255,.86);
  box-shadow: 0 12px 32px rgba(0,0,0,.10);
}

/* 保存ボタン */
#tq-qc-save {
  border: 1px solid rgba(38,48,47,.18);
  background: rgba(38,48,47,.88);
  color: #fff;
}

#tq-qc-save:hover {
  transform: scale(1.025);
  box-shadow: 0 12px 32px rgba(0,0,0,.14);
}

.tq-qc-result-text {
  margin: 32px auto 36px;
  max-width: 540px;
  text-align: left;
  line-height: 2.15;
  color: rgba(38,48,47,.78);
}

.tq-qc-result-text p {
  margin: 0 0 1.4em;
}

.tq-qc-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 18px;
}

.tq-qc-nav .tq-qc-count {
  margin: 0;
}

.tq-qc-nav .tq-qc-back {
  width: auto;
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  color: rgba(38,48,47,.56);
}

@keyframes tqQcFade {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


</style>

<script data-wp-block-html="js">
document.addEventListener("DOMContentLoaded", () => {
  const questions = [
    {
      q: "いま、周囲でいちばん近い音は何ですか？",
      key: "sound",
      options: ["空調の音", "車や街の音", "人の声", "鳥や虫の声", "ほとんど無音"]
    },
    {
      q: "いまの光は、どんな状態ですか？",
      key: "light",
      options: ["明るい", "やわらかい", "暗い", "画面の光だけ", "よくわからない"]
    },
    {
      q: "あなたの身体は、いまどうありますか？",
      key: "body",
      options: ["座っている", "立っている", "横になっている", "歩いている", "少し固まっている"]
    },
    {
      q: "いま、時間はどんな速さに感じますか？",
      key: "time",
      options: ["早い", "普通", "遅い", "止まっているよう", "遠くにある"]
    },
    {
      q: "この瞬間に、名前をつけるなら？",
      key: "name",
      options: ["休息", "通過", "待機", "回復", "不在"]
    }
  ];

  let index = 0;
  let resultDate = "";
  const answers = {};

  const start = document.getElementById("tq-qc-start");
  const quiz = document.getElementById("tq-qc-quiz");
  const result = document.getElementById("tq-qc-result");
  const startBtn = document.getElementById("tq-qc-start-btn");
  const backBtn = document.getElementById("tq-qc-back");
  const restartBtn = document.getElementById("tq-qc-restart");
  const saveBtn = document.getElementById("tq-qc-save");
  const canvas = document.getElementById("tq-qc-canvas");
  const countEl = document.getElementById("tq-qc-count");
  const questionEl = document.getElementById("tq-qc-question");
  const optionsEl = document.getElementById("tq-qc-options");
  const resultText = document.getElementById("tq-qc-result-text");

  if (!start || !quiz || !result || !startBtn || !backBtn || !restartBtn || !countEl || !questionEl || !optionsEl || !resultText) {
    return;
  }

  function show(el) {
    start.hidden = true;
    quiz.hidden = true;
    result.hidden = true;
    el.hidden = false;
  }

  function renderQuestion() {
    const current = questions[index];

    countEl.textContent = `${index + 1} / ${questions.length}`;
    questionEl.textContent = current.q;
    optionsEl.innerHTML = "";

    current.options.forEach(option => {
      const btn = document.createElement("button");
      btn.type = "button";
      btn.textContent = option;

      btn.addEventListener("click", () => {
        answers[current.key] = option;
        index++;

        if (index >= questions.length) {
          renderResult();
        } else {
          renderQuestion();
        }
      });

      optionsEl.appendChild(btn);
    });

    backBtn.hidden = false;
  }

  function renderResult() {
    const now = new Date();

const yyyy = now.getFullYear();
const mm = String(now.getMonth() + 1).padStart(2, "0");
const dd = String(now.getDate()).padStart(2, "0");
const hh = String(now.getHours()).padStart(2, "0");
const min = String(now.getMinutes()).padStart(2, "0");

resultDate = `${yyyy}.${mm}.${dd} ${hh}:${min}`;

    resultText.innerHTML = `
      <p>${resultDate}</p>
      <p>
        ${answers.sound}があり、<br>
        光は${answers.light}。<br>
        身体は${answers.body}。
      </p>
      <p>
        時間は${answers.time}ように感じられ、<br>
        この瞬間には「${answers.name}」という名前がつきました。
      </p>
      <p>
        これは診断ではありません。<br>
        ただ、あなたが今ここにいたという小さな記録です。
      </p>
    `;

    show(result);
  }

  startBtn.addEventListener("click", () => {
    index = 0;
    Object.keys(answers).forEach(key => delete answers[key]);
    renderQuestion();
    show(quiz);
  });

backBtn.addEventListener("click", () => {
  if (index === 0) {
    Object.keys(answers).forEach(key => delete answers[key]);
    show(start);
    return;
  }

  index--;
  renderQuestion();
});

  restartBtn.addEventListener("click", () => {
    index = 0;
    Object.keys(answers).forEach(key => delete answers[key]);
    show(start);
  });

  function wrapText(ctx, text, x, y, maxWidth, lineHeight) {
    const chars = Array.from(text);
    let line = "";

    chars.forEach(ch => {
      const test = line + ch;

      if (ctx.measureText(test).width > maxWidth) {
        if (line) {
          ctx.fillText(line, x, y);
          line = ch;
          y += lineHeight;
        } else {
          line = test;
        }
      } else {
        line = test;
      }
    });

    if (line) ctx.fillText(line, x, y);
    return y + lineHeight;
  }

  async function saveResultImage() {
    if (!canvas) return;

    const ctx = canvas.getContext("2d");
    const w = canvas.width;
    const h = canvas.height;

const bg = new Image();
bg.crossOrigin = "anonymous";
bg.src = "https://tranquilguides.com/wp-content/uploads/2026/06/20260623_155541.jpg";

await new Promise(resolve => {
  bg.onload = resolve;
  bg.onerror = resolve;
});

const imgRatio = bg.width / bg.height;
const canvasRatio = w / h;

let drawW;
let drawH;
let drawX;
let drawY;

if (imgRatio > canvasRatio) {
  drawH = h;
  drawW = h * imgRatio;
  drawX = w - drawW;
  drawY = 0;
} else {
  drawW = w;
  drawH = w / imgRatio;
  drawX = 0;
  drawY = (h - drawH) / 2;
}

ctx.save();
ctx.filter = "blur(100px)";
ctx.drawImage(
  bg,
  drawX - 120,
  drawY - 120,
  drawW + 240,
  drawH + 240
);
ctx.restore();

ctx.fillStyle = "rgba(247,245,239,.50)";
ctx.fillRect(0, 0, w, h);

    ctx.fillStyle = "#26302f";
    ctx.textAlign = "left";

    ctx.font = "25px serif";
    ctx.fillText("Tranquilvæj", 90, 140);

    ctx.font = "28px serif";
    ctx.fillText("Quiet Capture", 90, 230);

    ctx.font = "64px serif";
    ctx.fillText("静寂採集", 90, 330);

ctx.font = "30px serif";
ctx.fillStyle = "rgba(38,48,47,.55)";
ctx.fillText(resultDate, 90, 470);

ctx.fillStyle = "#26302f";
ctx.font = "35px serif";
ctx.fillText("あなたは今ここにいました。", 90, 550);

ctx.font = "34px serif";
let y = 690;

    y = wrapText(ctx, `${answers.sound}があり、`, 90, y, 900, 56);
    y = wrapText(ctx, `光は${answers.light}。`, 90, y, 900, 56);
    y = wrapText(ctx, `身体は${answers.body}。`, 90, y, 900, 56);

    y += 40;

    y = wrapText(ctx, `時間は${answers.time}ように感じられ、`, 90, y, 900, 56);
    y = wrapText(ctx, `この瞬間には「${answers.name}」という名前がつきました。`, 90, y, 900, 56);

    y += 70;

    ctx.font = "28px serif";
    ctx.fillStyle = "rgba(38,48,47,.66)";
    wrapText(ctx, "これは診断ではありません。ただ、あなたが今ここにいたという小さな記録です。", 90, y, 900, 48);

    ctx.font = "24px serif";
    ctx.fillStyle = "rgba(38,48,47,.48)";
    ctx.fillText("TranquilGuides.com", 90, h - 120);

    const blob = await new Promise(resolve => {
      canvas.toBlob(resolve, "image/png");
    });

    const file = new File([blob], "quiet-capture.png", {
      type: "image/png"
    });

    if (navigator.canShare) {
      if (navigator.canShare({ files: [file] })) {
        try {
          await navigator.share({
            files: [file],
            title: "静寂採集",
            text: "静寂採集の記録画像"
          });
          return;
        } catch (e) {
          return;
        }
      }
    }

    const dataUrl = canvas.toDataURL("image/png");
    const a = document.createElement("a");
    a.href = dataUrl;
    a.download = "quiet-capture.png";
    document.body.appendChild(a);
    a.click();
    a.remove();
  }

  if (saveBtn) {
    saveBtn.addEventListener("click", saveResultImage);
  }
});
</script>

<div class="tq-quiet-capture">
  <section id="tq-qc-start" class="tq-qc-stage">
    <p class="tq-qc-kicker">Quiet Capture</p>
    <h1>静寂採集</h1>
    <p class="tq-qc-lead">
      いま、あなたの周囲にあるものを少しだけ採集します。<br>
      1分ほどで終わります。
    </p>
    <button type="button" id="tq-qc-start-btn">はじめる</button>
  </section>

  <section id="tq-qc-quiz" class="tq-qc-stage" hidden>
<p id="tq-qc-question" class="tq-qc-question"></p>

    <div id="tq-qc-options" class="tq-qc-options"></div>

    <div class="tq-qc-nav">
      <button type="button" id="tq-qc-back" class="tq-qc-back">もどる</button>
      <p id="tq-qc-count" class="tq-qc-count"></p>
    </div>
  </section>

  <section id="tq-qc-result" class="tq-qc-stage" hidden>
    <p class="tq-qc-kicker">Collected Silence</p>
<p class="tq-qc-result-title">あなたは今ここにいました。</p>

    <div id="tq-qc-result-text" class="tq-qc-result-text"></div>

    <div class="tq-qc-actions">
      <button type="button" id="tq-qc-save">画像を保存</button>
      <button type="button" id="tq-qc-restart">もう一度採集する</button>
    </div>

    <canvas id="tq-qc-canvas" width="1080" height="1920" hidden aria-hidden="true"></canvas>
  </section>
</div>



<style data-wp-block-html="css">
.cl-copyright{
  margin:80px auto 24px;
  text-align:center;
  font-size:13px;
  letter-spacing:.08em;
  opacity:.55;
}

.cl-copyright a{
  color:inherit;
  text-decoration:none;
  transition:opacity .2s ease;
}

.cl-copyright a:hover{
  opacity:1;
}
</style>

<div class="cl-copyright">
  <a href="https://tranquilguides.com/">
Return to Tranquilvæj
  </a>
</div>



<style data-wp-block-html="css">
/* 診断ページ専用：外側UI削除 */
#header,
.l-header,
.l-fixHeader,
#fix_header,
#sp_menu,
.p-spMenu,
.p-spMenu__inner,
.p-spMenu__body,
.p-spMenu__overlay,
#breadcrumb,
.c-postTitle,
.p-articleMetas,
.p-postTax,
.p-articleFoot,
.l-articleBottom,
.l-contentBottom,
.w-beforeFooter,
.l-footerWidgets,
.l-footer {
  display: none !important;
}

/* 余白リセット */
:root {
  --swl-headerH: 0px !important;
  --swl-fix_headerH: 0px !important;
  --swl-offset_y: 0px !important;
}

html,
body,
#body_wrap,
#content,
.l-content,
.l-mainContent,
.l-mainContent__inner,
#main_content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
</style>

<script data-wp-block-html="js">
document.addEventListener("DOMContentLoaded", () => {
  [
    "#header",
    ".l-header",
    ".l-fixHeader",
    "#fix_header",
    "#sp_menu",
    ".p-spMenu",
    "#breadcrumb",
    ".c-postTitle",
    ".p-articleMetas",
    ".p-postTax",
    ".p-articleFoot",
    ".l-articleBottom",
    ".l-contentBottom",
    ".w-beforeFooter",
    ".l-footerWidgets",
    ".l-footer"
  ].forEach(selector => {
    document.querySelectorAll(selector).forEach(el => el.remove());
  });
});
</script>



<style data-wp-block-html="css">
.p-fixBtnWrap {
  border-radius: 999px !important;
  overflow: hidden !important;
  border: 0 !important;

  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(255,255,255,.00) 0%,
      rgba(255,255,255,.02) 58%,
      rgba(255,255,255,.12) 100%
    ) !important;

  backdrop-filter: blur(.3px) saturate(135%) contrast(108%) brightness(106%);
  -webkit-backdrop-filter: blur(.3px) saturate(135%) contrast(108%) brightness(106%);

  box-shadow:
    inset 2px 2px 2px rgba(255,255,255,.55),
    inset 0 0 14px rgba(255,255,255,.28),
    0 3px 8px rgba(0,0,0,.03) !important;
}

.p-fixBtnWrap::before {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: 999px;
  pointer-events: none;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.75) 0%,
      rgba(255,255,255,.28) 18%,
      rgba(255,255,255,0) 42%
    );
  mix-blend-mode: screen;
  opacity: .65;
}

.p-fixBtnWrap:hover {
  background: #2f4f4f !important;
  box-shadow: none !important;
}

.c-fixBtn__icon {
  color: #2f2f2f !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
}

.p-fixBtnWrap:hover .c-fixBtn__icon {
  color: #fff !important;
}

.p-fixBtnWrap a,
.p-fixBtnWrap button,
.p-fixBtnWrap [class*="fixBtn"],
.p-fixBtnWrap [class*="icon"] {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.p-fixBtnWrap [class*="fixBtn"],
.p-fixBtnWrap [class*="icon"],
.p-fixBtnWrap a,
.p-fixBtnWrap button {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.p-fixBtnWrap {
  width: 52px !important;
  height: 52px !important;
  position: fixed !important;
  display: block !important;

  transition:
    width .22s ease,
    background-color .18s ease,
    box-shadow .18s ease !important;
}

.p-fixBtnWrap .c-fixBtn__icon {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 2;
}

.p-fixBtnWrap::after {
  content: "Page top";
  position: absolute;
  top: 50%;
  left: 54px;
  transform: translateY(-55%);

  z-index: 2;
  opacity: 0;
  max-width: 0;
  overflow: hidden;
  white-space: nowrap;

  height: 24px;
  line-height: 24px;

  font-size: 14px;
  letter-spacing: .03em;
  color: #fff;

  transition:
    opacity .15s ease,
    max-width .22s ease;
}

.p-fixBtnWrap:hover {
  width: 132px !important;
}

.p-fixBtnWrap:hover .c-fixBtn__icon {
  left: 28px !important;
}

.p-fixBtnWrap:hover::after {
  opacity: 1;
  max-width: 80px;
}

#breadcrumb {
  display: none !important;
}
</style>
]]></content:encoded>
					
					<wfw:commentRss>https://tranquilguides.com/quiet-capture/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">1040</post-id>	</item>
	</channel>
</rss>
