DEV Community

張旭豐
張旭豐

Posted on

為什麼那個會「注意你」的展品,反而讓你更想靠近

為什麼那個會「注意你」的展品,反而讓你更想靠近

博物館互動設計的隱形槓桿


東京。

teamLab 展覽入口。

地面是一整片黑色的水面,倒映著數位花朵。

你踏進去。

花朵在你腳步周圍散開,隨著你的移動一圈一圈地綻放和飄落。

你停下來,花也停下來。

你開始走,花就跟著你。

你以為是感應。但仔細看——延遲了大概 0.3 秒。

不是「立刻反應」,是「好像在觀察你,然後才決定」。

你站在那裡又多看了三秒。


你第一個「對」

讓我問你一個問題。

你去過那種「互動博物館」嗎?牆上寫著「請觸摸」,但你碰了之後什麼都沒發生——或者是那種「語音導覽機」,你對著它說話,它說「請靠近一點」。

然後你就失去興趣了。

現在讓我想另一個場景。

一個會動的恐龍骨骼。你站在它面前的時候,它頭轉過來看了你一眼。

你知道這是感應器。你知道工程師設計了「檢測到人」的時候讓它轉頭。

但你還是覺得——

「它在看我。」

兩種互動,哪一個讓你停留更久?


你第一個「咦」

這裡有一個秘密。

讓人停留更久的,通常不是「立刻反應」的互動。

是那種「好像在決定要不要理你」的互動。

為什麼?

因為「立刻反應」讓你確認了——「這是機器」。

但「好像在決定要不要理你」讓你的大腦進入了一個不確定的狀態——

「它真的知道我來了嗎?」
「它在決定什麼?」
「我想看看它決定什麼。」

這個「我想看看」就是互動設計裡最重要的瞬間——

參與者的好奇心,被啟動了。


玉樹真一郎在《任天堂的體驗設計》裡,分析了一個現象:

《超級馬里奧》裡,當玩家靠近一個問號磚塊,頂了它,沒有任何東西掉下來。

玩家不會覺得「這個遊戲壞了」。

玩家會想:「為什麼這次沒有?

然後再頂一次。

為什麼「沒有東西掉下來」沒有讓玩家放棄?

因為設計師在玩家心裡創造了一個「還沒發生的確定事件」。

玩家知道「遲早會有東西掉下來」。所以他們願意等待、願意再試一次。

博物館的互動設計也應該這樣。

不是立刻給答案。是讓你相信「答案快來了」,然後讓你一直站在那裡等。


你最後「我要改變做法」

讓我說一個失敗的設計。

一個科技博物館有一面「觸控牆」。牆上有很多按鈕,碰了就會播放影片、發出聲音、變色。

一開始很多小孩去碰。

但大概十五分鐘之後,那面牆就沒人碰了。

為什麼?

因為碰了 100 次,沒有任何一次比另一次更「值得等待」。

每一次都是立刻發生,每一次都是同樣的結果。

沒有任何一件事需要「決定」。


現在讓我說一個成功的設計。

同一個博物館的另一區,有一面「情緒牆」。

你站在牆前,系統會掃描你的臉——不是真的分析情緒,而是給你一個顏色。

每個人的顏色都不太一樣。

但顏色不是立刻出現的。

大概等了兩秒——然後它慢慢浮現出來。

在這兩秒裡,每個站在牆前的人都沒有動。

他們在等。

他們相信顏色一定會出現。但他們不確定會是什麼顏色。


三個馬上可以用的方向

第一:不要立刻給回饋。

加入一個 0.3 到 2 秒的「思考時間」。

讓互動看起來像「系統在決定」,而不只是「系統在檢測」。

壞掉的燈 vs 正在決定的燈——後者讓人更想站在那裡等。


自己試試看:30 行做出「延遲反應」的燈

// p5.js — 試試延遲回饋的感覺
let lights = [];
const DELAY = 12;  // 幀數延遲(約 0.2 秒)

function setup() {
  createCanvas(400, 400);
  for (let i = 0; i < 5; i++) {
    lights.push({ history: [], lit: false });
    for (let j = 0; j < Math.max(DELAY, 1); j++) lights[i].history.push(false);
  }
}

function draw() {
  background(30);
  let hovered = floor(mouseX / 80);

  for (let i = 0; i < lights.length; i++) {
    lights[i].history.push(hovered === i);
    if (DELAY > 0) lights[i].history.shift();
    lights[i].lit = DELAY > 0 ? lights[i].history[0] : (hovered === i);
  }

  // 畫燈泡
  noStroke();
  for (let i = 0; i < lights.length; i++) {
    fill(lights[i].lit ? color(255, 220, 100) : color(60));
    ellipse(80 + i * 80, 200, 50, 50);
  }

  fill(200);
  textSize(12);
  textAlign(CENTER);
  text('hover 燈泡,試試把 DELAY 改成 0 或 24', 200, 360);
  textSize(10);
  text('(當前延遲:' + DELAY + ' 幀)', 200, 378);
}
Enter fullscreen mode Exit fullscreen mode

試著把 DELAY = 0 會怎樣?然後 DELAY = 24(約 0.4 秒)呢?

第二:每次互動要有「未知變量」。

不是「碰了燈就亮」。

是「碰了燈亮,但亮的方式每次都不完全一樣」。

顏色?強度?閃爍頻率?總有一個元素是不確定的。

不確定性等於「還沒看見的全貌」。人天生想補完故事。

第三:讓回饋分層。

第一層:立刻出現(讓你知道「系統收到了」)
第二層:三秒後升級(讓你驚訝「還有更多」)
第三層:整個空間連動(讓你回頭看見「我的行動影響了整個房間」)

分層的回饋,會讓人想要「重新走一遍」。


結尾

下次你設計一個互動環節,在「感應到」和「給出回饋」之間——停兩秒。

問自己:「這兩秒裡,我的用戶在心裡說什麼?」

如果他們說的是「壞了吧」——需要加一個讓他們願意等下去的理由。

如果他們說的是「它在決定什麼」——這個設計在起作用了。

人想要的從來不是操作一台機器。

人想要的是——在操作的過程中,感覺到「這個空間記得我」。

當設計師學會在「感應」和「回應」之間,加上那 0.3 秒的「思考時間」——

人就不會離開了。

因為他們想看看,這次會決定什麼。

Top comments (0)