跳至主要内容

Code.Wiwi.Blog

· 閱讀時間約 1 分鐘

之前如果有程式碼要分享，我都是放在 GitHub。但是既然現在有 Wiwi.Blog 這個家，何不也放一份在自己這裡呢？

所以剛剛用 Gitea 架了 Code.Wiwi.Blog，把我在 GitHub 的程式碼全部備份過來了。

Gitea 很讚耶！程式好乾淨、安裝簡單，介面幾乎跟 GitHub 一樣。內建直接從 GitHub 「移民」的功能，搬家超容易！

在網站上方在頁尾新增了「程式碼」連結，可以直接連到我的 Gitea 頁面。

撲克牌密碼

· 閱讀時間約 10 分鐘

你是一個間諜（代號「蛋餅俠」），正在執行一個機密任務。目標：傳遞一條重要訊息「九點老地方見面，幫我買蛋餅」傳給你的搭檔（代號「豆漿哥」）。

但情況比預想中的更棘手。你身在人潮湧動的酒吧中，到處有形形色色的目光在遊走，任何一點疏忽都可能暴露你的身份。你該如何把訊息傳出去？

  • 寫小紙條？太冒險了，一旦被發現，多年的臥底生涯就毀於一旦。
  • 傳 LINE？別鬧了，你以為政府的監控系統是吃素的嗎？

正當你陷入沉思時，眼角瞄到桌上放著一盒撲克牌。你若無其事地走過去，假裝整理桌面，順手把牌拿了出來。

在其他客人眼中，你只是一個無聊在把玩紙牌的上班族，但其實你的雙手正以訓練有素的技巧，重新排列著這 52 張牌。排列完後，你把牌重新收回盒子裡放在桌上，起身離開酒吧，就像什麼都沒發生過一樣。

半小時後，豆漿哥走進店裡，看似隨意地拿起那副牌，看了幾眼之後，他嘴角微微上揚。

晚上九點整，老地方。豆漿哥準時出現，手裡拿著兩個熱騰騰的蛋餅。

這是什麼爛故事？​

不重要啦。重點是蛋餅俠是怎麼做到的。

當然不是直接在牌上做暗號（例如寫字或折起來什麼的），那太明顯了。而是直接用撲克牌的「排列方式本身」來儲存訊息！

一副撲克牌的 52 張牌，有超級多種可能的排列順序，精確地說是 52!（52 的階乘），大約 8 ⋅ 1067 種。既然牌的排列順序本身，就包含了這麼多資訊，那我們有沒有可能把祕密訊息編碼成撲克牌的順序，然後拿到牌的人就可以靠這個排列順序，解碼出原本的文字呢？

Lehmer Code​

答案當然是可以的！

有個叫做 Lehmer Code 的演算法，可以把任意的排列順序對應成獨一無二的數字。

簡單來說，52 張牌的每一種排法，都可以用 Lehmer Code 轉換成專屬的數值，而這個數值又可以進一步編碼成文字訊息。反過來操作，任何文字也能先轉成數字，再透過 Lehmer Code 對應到特定的排序。

這樣一來，我們就可以將撲克牌的「排列順序」作為訊息載體了。

舉個實例

例如，你想傳送「HELLO」這個訊息給朋友。具體的步驟如下：

  1. 文字轉數字：把「HELLO」用 ASCII 或其他編碼方式，變成一個超級大的數字，例如：310939249775（這只是舉例，實際數字會有 68 位數）。
  2. 數字轉排列：用 Lehmer Code 把這個巨大數字對應到一個 52 張牌的特定排列順序，例如 紅心K，黑桃7，方塊A，梅花Q……。
  3. 實際排牌：把這個順序實際用真的牌排出來。
  4. 傳遞訊息：把這副「看似隨機排列」的撲克牌交給朋友。
  5. 解碼：朋友收到牌後，將完整的排列順序用 Lehmer Code 反推回那個巨大數字 310939249775，再將這個數字以約定好的文字編碼方式轉為文字，就得到「HELLO」了！

撲克牌編碼程式​

網路上已經有個叫做 Asher Falcon 的人把這個概念實作出來了，你可以讀他的部落格文章了解他是怎麼做的，也可以到這個網址直接使用他的編碼程式。

但 Falcon 的版本有個致命的缺陷：為了讓傳遞的訊息夠長，它只使用 5 個位元來儲存每個字元。也就是它的訊息內容只能使用 .,-\"/abcdefghijklmnopqrstuvwxyz 這 32 個字元的其中之一，連阿拉伯數字都不能用。身為一個國際化的現代間諜，這種限制怎麼能接受？

所以我重弄了一個使用 UTF-16 編碼的版本，每個字元用 16 位元來儲存，可以支援絕大部分的中文字和表情符號，這樣用一副牌還是能夠放進長度 14 字元的訊息1。用我的版本，就算是要傳「🥞早安我ㄉ朋友おはよう🌸」這樣的訊息也沒問題唷！

原始碼放在：https://code.wiwi.blog/wiwi/text-to-cards

玩玩看！​

使用方式：

  • 編碼：輸入一個字串（14 個字元以內），程式會輸出 52 張撲克牌的排列。
  • 解碼：輸入 52 張撲克牌的排列（例如：As 3d Th 8c……），程式會輸出訊息字串。

透過這個程式，你就可以把任何文字訊息藏在一副撲克牌裡面了！

試試看解碼我的訊息吧：

As 3s Js 6c 7s 9s Ad 2d 7d Jc 9c 2s Jd
4h 8s Kc 4c 4s Qc Kh 7c 5h 3d 7h 5s Td
9h 5d Ac Qh 6s Kd Th 3h 9d 2c 6h Ts Jh
5c 8d 6d 3c Qs 8h 2h 4d Ks Qd Tc Ah 8c
0 / 14 字元
等待輸入文字...
等待輸入撲克牌...
準備就緒

Footnotes​

  1. 52 張撲克牌的排列順序資訊約是 224 位元，每個字元使用 16 位元的話剛好可以放入 14 個字元。 ↩

彈珠檯

· 閱讀時間約 6 分鐘

如果你問我這輩子花最多時間在哪個遊戲上，答案可能會讓你驚訝。不是什麼熱門的線上遊戲，不是經典的 JRPG，也不是什麼 3A 大作，而是小鋼珠叮叮咚咚到處亂彈的「彈珠檯」（Pinball）。從紅白機上面的 Pinball，到大型電玩店裡的實體機檯，我都超愛。

（紅白機上的 Pinball）

太空軍校生​

如果你有點年紀了的話，你一定記得 Windows 95 年代時，隨著 Microsoft Plus! 附贈的「太空軍校生」（Space Cadet）彈珠檯。在當時它可能是許多人電腦中僅有的（除了接龍跟踩地雷之外）幾個遊戲之一；小時候根本整個玩爆，不曉得花了多少時間在這個上面。

（「太空軍校生」彈珠檯）

給沒玩過彈珠檯的人：彈珠檯可不只是球快要掉下來，然後你就用擊球板（flippers）打上去，然後看著它亂彈而已喔！彈珠檯通常都是有主題、有關卡任務的。以這個「太空軍校生」為例：

  • 首先，你要先擊中左方三個目標的其中一個來「選擇任務」
  • 然後，你要把球打到左方的立體球道來「接受任務」
  • 根據選定的任務，你會需要達到某些目標（例如把球打到某處某個次數）才「完成任務」
  • 完成足夠任務之後你會「升級」
  • 目標是從一開始的 Cadet（軍校生）升級到最高的 Fleet Admiral（元帥），當然我一次都沒有成功升到最高級過

想要一些這遊戲的秘訣的話，看這個網頁：
http://www.rdrop.com/~half/General/GameTips/space.cadet.html

這個超耐玩的遊戲，竟然在 2001 年的 Windows XP 64 位元版本中被無情地移除了，原因只是因為有個 bug 來不及在上市前修好，微軟就直接索性砍掉了！等等，Internet Explorer 的 bug 明明就更多，為什麼不把它砍掉？

2006 年推出的 Windows Vista 也沒有把這個遊戲放回來，從此它就從 Windows 當中消失了。幸好，網路上有神人把它逆向工程後移植到了各種平台，除了各種電腦作業系統之外，在 Android 上也可以玩到！（抱歉了 iOS 用戶）

（Android 版本！）

我最愛的彈珠檯遊戲​

雖然「太空軍校生」很讚，但它還不是我心目中最愛的彈珠檯遊戲。這個獎項要頒給兩個真正的傳奇：Pinball Dreams 和 Epic Pinball！

Pinball Dreams（1992）​

Pinball Dreams 在 1992 年發行於 Amiga 平台，後來再被移植到 DOS 系統上，我玩的是 DOS 版本。這是我人生中有購買盒裝版的最早的遊戲之一。

它包含了四個不同主題的彈珠檯：

  • Ignition：火箭發射和太空探索主題
  • Steel Wheel：蒸汽火車和美國西部主題
  • Beat Box：音樂產業、排行榜和樂團巡演主題
  • Nightmare：墳墓、鬼魂和惡魔的恐怖主題

這個的音樂做得超讚！作曲家 Olof Gustafsson 創作的主選單音樂是一首五分鐘的搖滾樂，使用 MOD 格式製作，是一個很有曲式發展、藝術性很高的神作（很少會這樣形容一首搖滾樂吧）。我以前經常停在主選單就為了聽這首曲子，重複聽過 N 遍，我到現在應該都還可以從頭到尾完整哼出來！（YouTube 連結）

到今天你都還是可以用 DOSBox 完美遊玩它，你看以前的遊戲沒有 DRM 就是棒！以下影片是我用 DOSBox 錄製的，Beat Box 機台的簡短影片。

Epic Pinball（1993）​

Epic Pinball 在 1993 年發行，完全用組合語言寫成，畫面捲動超順暢，是畫面技術上超強的作品！

它在 1990 年代真的非～常～紅～！幾乎每個有在玩遊戲的人，電腦裡都至少會有它的共享軟體（Shareware）試玩版。試玩版就已經很好玩了喔！可以無限次數地玩第一個機檯「Android」。

正式版的話則是包含 8 個不同主題的機檯（後來更擴充到 12 個，但最後四個品質不太好）。音樂也是用 MOD 格式製作，同樣也非常非常強，作曲家是 Robert A. Allen 和 Joshua Jensen，我也超愛它的主選單曲！（YouTube 連結）

現在你只要用超便宜（個位數美金）的價格，就可以在 GOG.com 上面買到 12 個機檯的完整版！現在就買吧，不要懷疑了！

以下是我自己錄製的，其中一個叫做「Deep Sea」機檯的影片。

額外一提：Microsoft Pinball Arcade​

還有一個順便想提到的是微軟在 1998 年推出的 Microsoft Pinball Arcade，裡面包含了七個真實存在的彈珠檯。

我也曾經花了很多很多時間在這上面，但因為 Linux 上的 Wine 無法執行這個，所以我現在不能玩了。如果你用 Windows 的話，據說現代的 Windows 好像還可以執行，但我沒有 Windows 電腦可以驗證了。

備註

你可以到 YouTube 看別人的遊玩影片：
https://www.youtube.com/watch?v=6W7NKLzUH40

試試看彈珠檯吧​

如果你還沒體驗過彈珠檯「一個人、一顆球、永遠玩不膩」的魅力，就從剛才提到的幾個遊戲入坑吧！以上的幾個遊戲都只占幾 MB 的硬碟空間，不用連網認證和付訂閱費，就可以提供你數百小時的樂趣，根本就是超極簡、超划算的啊！

選擇文字

· 閱讀時間約 1 分鐘

當你想要用滑鼠選擇一個句子時，會不會常常手殘沒把游標放準，少選到一個字母呢？例如，明明想選「The quick brown fox jumps over the lazy dog」，結果卻選成了「he quick brown fox jumps over the lazy do」。

解決方法其實超簡單：

  • 在開始選擇時，把滑鼠移到想選擇的第一個單字上的任一處（不需精準，任一處就好）
  • 連續按滑鼠兩下，但在第二下的時候按住不放
  • 開始拖曳選擇，這時候就會以整個單字（而不是字母）為單位選擇了

恭喜你，以後不用再為了圈選文字而感到挫折了！不客氣！

說到「The quick brown fox jumps over the lazy dog」（敏捷的棕色狐狸跳過懶惰的狗），你知道為什麼字型選擇視窗常常拿它當例句嗎？因為這個句子裡面有從 A 到 Z 的每一個字母！這種句子叫做「全字母句」（Pangram），用來測試字型最好用！

當仙草凍比遊戲還大

· 閱讀時間約 7 分鐘

在這個人人都有手機網路吃到飽、高速光纖網路到府的時代，似乎有一群人真的以為網路頻寬是天上掉下來的免費禮物。沒錯，我說的就是現代的網頁設計師們，他們之中有許多人已經連基本圖片使用、頻寬節省的常識都沒有了。

現在在網路上，你到處都可以看到這些荒謬的情況：

  • 直接把印刷用的高解度圖片丟到網頁上
  • 用超大圖片來當縮圖
  • 搞不清楚到底應該用 PNG 還是 JPG
  • 明明只是根本不會注意到的背景圖，卻用檔案超大的圖

這些設計師們彷彿活在一個頻寬無限、流量免費的平行宇宙裡。

台灣彩券：誰需要縮圖？​

之前寫刮刮樂那篇查資料的時候，我就注意到大家現在都不做縮圖了耶！

在台灣彩券官網的「歷史刮刮樂銷售資訊」頁面，這個在螢幕上看起來小小、寬度還不到 200 畫素的縮圖（下圖紅箭頭處），實際上載入的竟然是一張 500 KB、1080 x 720 畫素的大圖！這個頁面有十幾張這樣的縮圖，累積起來很快地就超過 5 MB 了。1

（這個小不拉嘰的縮圖，檔案大小要 500 KB！）

他們應該怎麼做：先把圖片縮放到實際要顯示的大小（以這種小縮圖而言，可能 200 x 133 畫素就夠了），然後用 JPEG 格式壓縮，品質大約 70-80% 即可。這麼簡單的步驟，就可以把原本要 500 KB 的圖，縮小到只有 14 KB。

但設計師不 care，反正網路頻寬又不用錢。

（下面這張圖，檔案大小只要 14 KB！我知道你可以用 WebP 格式讓檔案更小，但那對舊裝置的相容性比較不好。）

京城銀行：在你看不見的地方揮霍​

最近檸檬卷到京城銀行的網站辦事，發現他們的網站慢到你可以先泡杯咖啡再回來。

首頁最上方那個圖片跑馬燈（carousel），放了八張長寬為 2720 x 1300 畫素的圖（比 1080p 影片還大），光是這樣就毫無意義地浪費了 4 MB 的頻寬。

（圖片上半部是圖片跑馬燈：沒有人會看，但很佔頻寬）

（沒錯，這張圖的大小真的是 2720 x 1300）

拜託，現在是 2025 年，沒有人會在你的首頁上看圖片輪播！沒有人會坐在電腦前面，看著你的圖片三秒換一張，然後期待地想：「不知道下一張會是什麼驚喜呢？」不會的，所有人都會直接無視它們！而且沒人的裝置可以完整顯示那 2720 x 1300 的圖，我們不是用 80 吋家庭劇院在上銀行網站，快拿掉這些愚蠢的圖片輪播！

往下捲一點，來到「NEWS」區。考考你，這區的重點是什麼呢？

（益智問答：這區的重點為何？）

你說重點是那些最新消息？拜託，誰在意最新消息？訪客來京城銀行網站，當然是為了看背景那張模糊的花圖片呀！這張名為 bg_flower01.png 的藝術品是 1493 x 996 畫素、檔案 1 MB 的 PNG 檔案！

（如果你是正在國際漫遊，當日超過流量被限速的用戶，這張模糊的花圖片會讓你等上 31 秒）

這只要用個二十分之一檔案大小的 JPG 圖片就可以達到完全同樣的效果了。連我這個音樂系畢業的、不是網頁設計師的人都有這個常識。

但他們不 care，反正網路頻寬又不用錢。

鮮芋仙：頻寬終結者​

但以上這些，全都比不上史上最強的頻寬浪費王者——「鮮芋仙」。

我多年前已經在好檸檬 Podcast 嘲笑過它官網的肥大，但它到現在還是一樣驚人：首頁檔案大小 90.5 MB！

（鮮芋仙首頁：90.5 MB。載入時間足夠你出門買一碗真的仙草凍回來。）

（看看統計數字，真的就是 90.5 MB，不要懷疑。）

到底是要怎麼把一個首頁弄到 90.5 MB 啦？到底塞了什麼東西在這裡面？

首先，圖片輪播當然少不了。但他們放的是 8000 x 3708 畫素、17 MB 的巨大圖片，大小足以直接輸出成巨大戶外廣告看板。

（8000 畫素寬的仙草凍圖，是你家 4K 電視畫素的四倍，讓你彷彿能聞到仙草香）

還有這張 4333 x 4333 畫素，檔案大小 12 MB 的圖。更神奇的是，我上下捲動尋找，這張圖根本沒有顯示在網頁上！

（4333 畫素寬的隱藏版圖片：存在的意義就是浪費你的流量）

還有什麼東西？cwTeXFangSong-zhonly.woff2，它把整個 5 MB 大小的中文仿宋字體直接丟進網頁中！

（對，為了顯示幾個字，我們需要載入整個 5 MB 的字體檔案）

最後，直接擊敗我的是這個。看到下方這個小小的 Instagram 圖示了嗎？

你猜猜最中間那個 Instagram 圖示 instagram.svg 檔案多大？不是五個圖示加在一起喔，是只有最中間那個 IG 圖示。

（你真的沒有看錯，是 2.9 MB，不是 2.9 KB）

2.9 MB！ 🤯

是真的！一個 30 x 30 畫素的 Instagram 的小圖示，2.9 MB！我真的很好奇這個 SVG 裡面到底寫了什麼，是不是包含了 Instagram 的完整程式碼？還是他們把 Meta 的整個元宇宙都不小心放進去了？

這檔案真的太天才了，超出我的理解，你可以按以下連結下載原檔來研究看看：

見證奇蹟！2.9 MB 的 Instagram 圖示：

https://www.meetfresh.com.tw/assets/img/icon/instagram.svg

假設你今天在一個手機訊號不是太好的地方（比如說 2 mbps 好了，這還不算太糟的情況喔），你會需要花超過六分鐘才能完整讀取完鮮芋仙的首頁。這段時間足夠你走到附近的鮮芋仙店面，排隊買一碗仙草凍後回家，把仙草凍吃完，網頁可能還沒載入好。

更新 2025-07-31

結果一個 Wiwi.Blog 的讀者找到元兇了！這個 instagram.svg 裡面到底裝的是什麼？請到他的貼文看答案：

https://blogg.ttheng.com/p/3-megabytes-svg-file/

當仙草凍比遊戲還大​

你知道嗎？1993 年發行的經典遊戲《Doom》（毀滅戰士），整個遊戲檔案只有 2.39 MB2。

沒錯，《Doom》裡面的所有程式碼、畫面、關卡、音樂、音效……完整的 3D 第一人稱射擊遊戲，檔案比一個鮮芋仙網站上的 Instagram 圖示還小。

（經典射擊遊戲《Doom》整個遊戲的檔案，比以下這個 Instagram 圖示還小）

當年的遊戲開發者用不到 2.4 MB 創造了革命性的 3D 新世界，而現在的網頁設計師卻需要 17 MB 來展示一個仙草凍。你說時代是進步了，還是倒退了？

並不是每個人都有無限的網路流量。對於室內訊號不佳、出國漫遊、住在偏遠地區的人來說，網路頻寬是很珍貴的資源。當你的網站連初學者等級的基本最佳化常識都不管，隨便揮霍使用者的頻寬時，在我眼裡是對使用者極度不尊重的。

我在 wiwi.blog 這裡，只要放一張超過 100 KB 的圖，我都會覺得這太慢了、有點罪惡感耶！但顯然在這個「仙草凍比遊戲還大」的年代，我這種想法已經落伍了。

（這篇貼文中的所有圖片，加起來的檔案大小還不到 400 KB。）

Footnotes​

  1. 1,000 KB = 1 MB，1,000 MB = 1 GB。 ↩

  2. https://qz.com/1490069/doom-the-game-that-kicked-off-a-video-game-revolution-turns-25-today ↩

WiwiStudio 音樂能力測驗

· 閱讀時間約 16 分鐘

2008 年，我在當時的官網 WiwiStudio.com 推出了一個用 Flash 製作的音樂測驗遊戲，就叫做《WiwiStudio 音樂能力測驗》。

（《WiwiStudio 音樂能力測驗》的歡迎畫面截圖）

第一個爆紅作品​

《WiwiStudio 音樂能力測驗》從 2008 年上線以來，一直到大約 2019 左右我把 WiwiStudio.com 網站徹除（轉址到 NiceChord.com）這十年出頭的期間，它累積了超過五百萬人次觀看，是我製作過的第一個「真正的爆紅作品」（就算是你現在搜尋它，也能找到很多以前的討論串和文章）。

隨著 Flash 在 2020 年正式停止支援，這個程式也無法在現代的瀏覽器中執行了。（又一次地展示了我們為什麼不該使用專有格式）

其實這作品的原始碼是有保存下來的，只是我遲遲沒有重製它，倒不是因為技術困難，而是不想破壞這份「歷史的回憶」。你知道，有時候最好的作品就是已經消失的作品，因為這樣它就變成了一個傳說，大家記憶中的版本往往比實際上的更美好。

重新釋出​

但是，最近我就在我的硬碟裡考古嘛，看到這些原始碼和素材，讓它們一直躺在我的硬碟裡發霉也沒意思。所以我今天把它以部落格貼文的形式重新放出來，現在你可以重新完整體驗所有題目和音樂了！

原始版本的規則是每一題只能播放兩次。但這邊我只是直接貼上音樂檔，你要照規則玩還是作弊無限次播放都隨你！畢竟都 2025 年了，誰在乎 17 年前的遊戲規則呢？

我在文末移植了原汁原味的算分系統到這個網頁上喔！只要輸入你的答案，它就會用當年那套比星座更不科學的演算法給你「音感、節奏感、音樂記憶力、專注力、整體音樂天份」的五項分析數據！當然，原始的排行榜功能就沒有了，資料庫早就不見啦！

開始玩吧！​

準備好測試你的音樂能力了嗎？拿出一張紙寫下你的答案吧！有 26 題，應該大約 20 分鐘可完成，記得用你最好的耳機或喇叭玩。

不過再次提醒一下，這是 2008 年的作品，我那時候還很菜，不要期待太高的品質。

《WiwiStudio 音樂能力測驗》題目開始​

01​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？

  • a. 完全相同
  • b. 有些不同

02​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？

  • a. 完全相同
  • b. 有些不同

03​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？

  • a. 完全相同
  • b. 有些不同

04​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？

  • a. 完全相同
  • b. 有些不同

05​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？

  • a. 完全相同
  • b. 不相同，兩個片段的「音高」有些不同
  • c. 不相同，兩個片段的「節奏」有些不同

06​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？

  • a. 完全相同
  • b. 不相同，兩個片段的「音高」有些不同
  • c. 不相同，兩個片段的「節奏」有些不同

07​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？

  • a. 完全相同
  • b. 不相同，兩個片段的「音高」有些不同
  • c. 不相同，兩個片段的「節奏」有些不同
  • d. 不相同，兩個片段的「音高和節奏」都有些不同

08​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？

  • a. 完全相同
  • b. 不相同，兩個片段的「音高」有些不同
  • c. 不相同，兩個片段的「節奏」有些不同
  • d. 不相同，兩個片段的「音高和節奏」都有些不同

09​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。音樂片段是由電吉他、電貝斯和爵士鼓演奏。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？如果不相同，請指出是哪一個樂器的部份不同。

  • a. 完全相同
  • b. 不相同，兩個片段的「電吉他部份」有些不同
  • c. 不相同，兩個片段的「電貝斯部份」有些不同
  • d. 不相同，兩個片段的「爵士鼓部份」有些不同

10​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。音樂片段是由電鋼琴、電貝斯和合成鼓組演奏，請注意聽當中電鋼琴的部份。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？如果不相同，請明確指出它們如何不同。

  • a. 完全相同
  • b. 不相同，電鋼琴彈的「音高」有些不同
  • c. 不相同，電鋼琴彈的「節奏」有些不同
  • d. 不相同，電鋼琴彈的「音高和節奏」都有些不同

11​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。音樂片段是由鋼琴、低音提琴和爵士鼓演奏。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？如果不相同，請指出是哪一個樂器的部份不同。

  • a. 完全相同
  • b. 不相同，兩個片段的「鋼琴部份」有些不同
  • c. 不相同，兩個片段的「低音提琴部份」有些不同
  • d. 不相同，兩個片段的「鋼琴和低音提琴部份」都有些不同

12​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？如果不相同，請明確指出它們如何不同。

  • a. 完全相同
  • b. 不相同，兩個片段的「音高」有些不同
  • c. 不相同，兩個片段的「節奏」有些不同
  • d. 不相同，兩個片段的「音高和節奏」都有些不同

13​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？如果不相同，請明確指出它們如何不同。

  • a. 完全相同
  • b. 不相同，兩個片段的「音高」有些不同
  • c. 不相同，兩個片段的「節奏」有些不同
  • d. 不相同，兩個片段的「音高和節奏」都有些不同

14​

按下播放鈕後，會連續播放兩個音樂片段，兩個片段之間會有約兩秒鐘的間隔。音樂片段是由鋼琴、電貝斯和爵士鼓演奏。你有兩次的播放機會，請仔細聽兩個音樂片段，然後回答下面的問題。

這兩個音樂片段是否相同？如果不相同，請指出是哪一個樂器的部份不同。

  • a. 完全相同
  • b. 不相同，兩個片段的「鋼琴部份」有些不同
  • c. 不相同，兩個片段的「爵士鼓部份」有些不同
  • d. 不相同，兩個片段的「鋼琴和爵士鼓部份」都有些不同

15​

第 15-17 題，將測驗你將音樂視覺化的能力。

按下播放鈕後，會播放一個音樂片段，請選出最能代表這個音樂片段的圖形。你有兩次的播放機會。

以下哪一個圖形，最能代表剛才播放的音樂片段？

16​

按下播放鈕後，會播放一個音樂片段，請選出最能代表這個音樂片段的圖形。你有兩次的播放機會。

以下哪一個圖形，最能代表剛才播放的音樂片段？

17​

按下播放鈕後，會播放一個音樂片段，請選出最能代表這個音樂片段的圖形。你有兩次的播放機會。

以下哪一個圖形，最能代表剛才播放的音樂片段？

18​

第 18-20 題，要測試你的心理節拍穩定度。

按下播放鈕後，會播放一個音樂片段，仔細聽音樂的速度變化。你有兩次的播放機會。

這個音樂片段的速度變化為何？

  • a. 速度完全沒有變化
  • b. 越來越快
  • c. 越來越慢

19​

按下播放鈕後，會播放一個音樂片段，仔細聽音樂的速度變化。你有兩次的播放機會。

這個音樂片段的速度變化為何？

  • a. 速度完全沒有變化
  • b. 越來越快
  • c. 越來越慢

20​

按下播放鈕後，會播放一個音樂片段，仔細聽音樂的速度變化。你有兩次的播放機會。

這個音樂片段的速度變化為何？

  • a. 速度完全沒有變化
  • b. 越來越快
  • c. 越來越慢

21​

最後六題，也就是第 21-26 題，要測試你的節奏辨識力和記憶力。

按下播放鈕後，會播放一個用鼓演奏的音樂片段，你要算出鼓總共敲了幾下。你有兩次的播放機會。

鼓總共敲了幾下？

  • a. 10
  • b. 11
  • c. 12
  • d. 13

22​

按下播放鈕後，會播放一個用鼓演奏的音樂片段，你要算出鼓總共敲了幾下。你有兩次的播放機會。

鼓總共敲了幾下？

  • a. 10
  • b. 11
  • c. 12
  • d. 13

23​

按下播放鈕後，會播放一個用鼓演奏的音樂片段，你要算出鼓總共敲了幾下。你有兩次的播放機會。

鼓總共敲了幾下？

  • a. 17
  • b. 18
  • c. 19
  • d. 20

24​

按下播放鈕後，會播放一個用鼓演奏的音樂片段，你要算出鼓總共敲了幾下。你有兩次的播放機會。

鼓總共敲了幾下？

  • a. 22
  • b. 23
  • c. 24
  • d. 25

25​

按下播放鈕後，會播放一個用鼓演奏的音樂片段，你要算出鼓總共敲了幾下。你有兩次的播放機會。

鼓總共敲了幾下？

  • a. 23
  • b. 24
  • c. 25
  • d. 26

26​

按下播放鈕後，會播放一個用鼓演奏的音樂片段，你要算出鼓總共敲了幾下。你有兩次的播放機會。

鼓總共敲了幾下？

  • a. 28
  • b. 29
  • c. 30
  • d. 31

恭喜你完成測驗，來對答案！​

按我看解答！
ababbbadcbdabcacdbcbbdcacb

或者直接在下面的文字框輸入答案，讓我直接用原始遊戲的公式幫你算分！

目前輸入長度：0 / 26

好玩嗎？​

如果你喜歡以上的測驗，我在 2019 年做了這個音樂測驗的續集《尋找黃金檸檬卷之聽力大挑戰》，它是一個 YouTube 影片迷宮遊戲，很好玩唷！還沒玩過的趕快到以下連結：

不要擋住我

· 閱讀時間約 4 分鐘

現代的許多媒體播放程式，都喜歡把控制介面（播放／停止按鈕、進度條、音量控制等等）直接蓋在影片上。不論是 YouTube 網頁版的播放器、還是 macOS 上的 QuickTime Player 都一樣。

（macOS 15 Sequoia 的 QuickTime Player：不只控制介面超大蓋在中間，它連「視窗標題列」也是蓋在影片上的，所以你可以看到我的頭髮被切掉了。）

（YouTube 網頁版播放器：控制介面完美地把我的影片字幕擋得一乾二淨）

雖然按下播放鈕後把滑鼠移開，這些東西過幾秒就會不見；但問題是，如果我就是想要看到「完全不被任何東西遮蔽的影片第一秒」呢？這樣簡單的願望，在現代播放器中竟然變成了一種奢求。

截圖遊戲​

想在 YouTube 網頁播放器上截一張乾淨的圖？請先通過這個反應速度測試遊戲吧！

因為 YouTube 播放器有個堅持：在暫停狀態下，控制按鈕就是要永遠蓋在影片上。因此，想要截到「不被任何東西擋住的圖」，你必須：

  • 先把影片倒轉到想截圖處的前幾秒
  • 按播放按鈕，接著馬上把滑鼠移開影片區
  • 祈禱控制介面來得及完全消失
  • 然後在影片「播放中」抓準時機截圖
  • 沒抓準時機？倒回前十秒再挑戰一次！

恭喜你，終於得到了一張乾淨的影片截圖！這個截圖小遊戲很好玩吧！

消失的角落​

不過剛才我其實騙了你，用以上方法得到的其實並不是「不被任何東西擋住的截圖」。不信的話，你仔細看看截圖的四個角落。

（看到了嗎？圓角！）

為什麼 YouTube 和 Apple QuickTime 都硬要把影片切成圓角？角落的畫素也是畫素啊！它們也是我的作品的一部分呀！為什麼要把角落的畫素丟掉？也許有些人的影片有自己設計的邊框，這不就被破壞了嗎？

大頭貼也是呀，為什麼一定要把照片切成圓的？這就像你辛辛苦苦畫了一幅方形的畫，結果美術館卻堅持把它裝到圓形的框裡展示一樣。

（2015 年的 YouTube：我們會好好地把你的圖片顯示出來，是方的也沒關係。）

（現在的 YouTube：全部給我切成圓的！不然多危險，小朋友割傷手怎麼辦？）

然後等到以後某天設計潮流改變，他們突然發現了「大自然美學」，決定響應「蜂巢風潮」，把所有東西都變成六邊形，到時所有創作者就又要配合平台的任性，重新裁切所有作品。

簡單播影片就好，很難嗎？​

這讓人懷念起以前 Windows 3.1 年代時的媒體播放程式：超極簡設計，影片區域永遠完整可見，下方永遠顯示著播放和停止按鈕，加上可以拉動的進度條，就這樣，沒了。

沒有各種會突然出現、消失、擋住影片的東西，更沒有那完全沒必要的圓角！簡簡單單播影片就好，不是很棒嗎？

（Windows 3.1 內建的媒體播放程式）

還我乾淨的播放器​

如果你也受夠了這些「貼心」的設計，想要享受不囉唆、極簡風的影片播放體驗，可以試試看 mpv 和 VLC media player 這兩個自由軟體播放器。

mpv 的預設雖然下方也會有扁扁的操作介面，但比 QuickTime 小很多；而且只要按鍵盤的 Delete 鍵，就可以切換控制介面是「永遠顯示、永遠不顯示，或自動隱藏」。

（mpv 的控制介面相對不擾人，而且可以按 Delete 把它永遠隱藏）

VLC media player 的控制介面則是採用比較傳統的下方永久顯示型，不會遮到影片，但按 Ctrl+H 也可以把選單和控制介面完全隱藏。

（VLC 的控制介面比較傳統，但也可以按 Ctrl+H 永遠隱藏）

至於 YouTube 截圖的問題？用 FreeTube 吧，它本身直接就給你一個截圖按鈕！只要按下去就可以另存 PNG 檔案，超不囉唆！或者，你也可以用 yt-dlp 把影片下載回來，再用 mpv 和 VLC 播放。

（FreeTube 直接給你截圖按鈕！你看自由軟體就是這麼貼心！）

恭喜你，讀完這篇抱怨文後，你終於可以享受乾淨影片和乾淨截圖的基本人權了！不客氣！

網址

· 閱讀時間約 5 分鐘

收到別人傳來的網址，到底該不該點進去？會不會是詐騙、網路釣魚？其實只要有一些關於網址的基本知識，就不會那麼容易被騙了。

📍 這裡到底是誰家？​

益智問答：以下兩個網址，哪一個才是 Google 擁有的？

  • xyz.google.com
  • google.xyz.com

答案是「xyz.google.com」！

記得網址是從右往左讀的。在 xyz.google.com 中：

  • .com 是頂級域名（原意是「商業組織」）
  • google 是主網域
  • 而 xyz 是 google.com 旗下的子網域

所以 xyz.google.com 就像是「Google 裡面的 XYZ 部門」，這個網址是完全由 Google 控制的。

而反過來說，google.xyz.com 就像是「XYZ 公司裡面的 Google 部門」，網域的擁有者是 XYZ 公司，他們可以任意決定這個網址要做什麼。

許多基礎知識不足的人都會被這個騙到，當你傻傻地點進網址為 instagram.security-check.com 之類的網址，輸入了你的 Instagram 密碼後，恭喜你，你的帳號就這樣掰了！

👁️ 眼見不一定為憑​

在網頁中，你看到的文字跟實際的連結網址可以完全不同！

這個連結會連到 Google 喔（真的嗎？）：https://google.com

看起來明明寫著 google.com，但實際上可能連到完全不同的地方，這就是 HTML 超連結的厲害！

在電腦上，你可以把滑鼠停在連結上，通常在左下角就會顯示真正的目標網址。在手機上，你可以長按連結，通常也會跳出選單顯示真實網址。

🔒 鎖頭符號就表示安全？​

瀏覽器常常會在 https:// 的網址旁邊顯示一個鎖頭圖案，說這連線是「安全」的。這只表示你跟這個網站之間的通訊是有加密的，無法被第三者竊聽，並不代表這個網站的主人是心懷好意的喔！

現在申請 SSL 憑證（就是那個鎖頭）既簡單又免費，就算是詐騙網站也能輕鬆取得。所以看到鎖頭不要太開心，還是要仔細檢查網址本身。

📱 App 內嵌瀏覽器​

當你在 Line 或其他 App 裡點開連結時，打開的常常不會是系統的預設瀏覽器，而是 App 自己內嵌的瀏覽器。有些 App 內嵌瀏覽器不會顯示完整網址，讓你連最基本的從網址判斷釣魚頁面都做不到。

更糟的是，根據 Felix Krause 的研究，許多 App 內嵌瀏覽器（包含 TikTok、Instagram、FB Messenger 和 Facebook）都會偷偷更改網頁來追蹤你的行為，甚至監控你的鍵盤輸入1！（該研究是 2022 年 8 月寫的，可能已經過時，但不影響本文論點）

"TikTok iOS subscribes to every keystroke (text inputs) happening on third party websites rendered inside the TikTok app. This can include passwords, credit card information and other sensitive user data."

（TikTok iOS 能監看在 TikTok 應用程式內顯示的第三方網站上發生的每一次按鍵（文字輸入）。這可能包括密碼、信用卡資訊和其他敏感用戶資料。）

——Felix Krause

解決方法：盡量複製網址到正常的瀏覽器開啟。

🔗 短網址​

看到短網址服務（像是 bit.ly、tinyurl.com）的連結也要小心，因為你看不到實際的目標網址，很容易被引導到怪怪的網站。

而且短網址服務商的後台也會記錄一堆資訊，包括你的 IP、裝置資訊、什麼時候點了連結等等。雖然大部分只是做統計分析用，但如果你不想被記錄下來，就不要直接點這個連結。

如果想要事先確認短網址的目標，可以搜尋「URL expander」、「unshorten URL」等關鍵字，使用線上工具來展開短網址。

🔤 這個字怎麼拼？​

訓練自己對拼字的敏銳度，不要到了 googgle.com、face-book.com、amazom.com 上面輸入自己的帳密啊！

有趣的是，Google 早就料到這一點，所以他們把 gooogle.com 和 googel.com 都註冊下來了。但應該還是有幾千種拼錯的方式他們還沒想到，詐騙集團總是能找到新的錯字組合。

❓ 問號？​

你有沒有注意過，許多網址後面都有一個 ? 後面跟著許多奇怪的字母數字組合？這些叫做「參數」（Parameters），是網站用來傳遞額外資訊的方式。

例如 https://www.google.com/search?q=貓咪圖片 中，? 後面就是要告訴網站我們要搜尋「貓咪圖片」。

這些參數有些是為了正常的功能運作，有些則是為了追蹤你。你可以刪除看看，看看網頁是不是還能正常運作。

結論​

以上就是關於網址你需要知道的一些小知識，歡迎分享給你喜歡亂點連結的朋友們。總之，避免被騙的關鍵就是：不要輕易相信任何東西。

Footnotes​

  1. 另外一篇中文的報導：https://www.koc.com.tw/archives/455858 ↩

隱密錄製，全天直播

· 閱讀時間約 2 分鐘

剛剛看到一個新產品：「Waves」，一支可以錄影、直接直播的眼鏡。（官方網站）

創辦人 Chris Samra 在 Twitter 上寫1：

introducing Waves, camera glasses for creators.
record in stealth. livestream all day.
pre-order now.

隆重介紹 Waves，專為創作者而生的攝影機眼鏡。
隱密錄製，全天直播。
立即預購。

（Waves 眼鏡的官網）

看到這個我只想說，如果誰在跟我見面的時候給我戴這眼鏡「record in stealth, livestream all day」（隱密錄製，全天直播），我一定把他連人帶眼鏡一起踢出門外然後跟他絕交。專為創作者而生？我看是偷拍狂吧？

更離譜的是，它們官方網站 https://www.waveglasses.com/ 上 FAQ 的第一題居然寫：

Q: Is there an external LED Indicator?
（問：是否有外部 LED 指示燈？）

A: Waves will have an external indicator, but the user will be able to control whether or not it's in use.
（答：Waves 配備外部指示燈，但使用者可以控制是否啟用。）

哇靠，你把「能不能關掉錄影指示燈」放在 FAQ 第一題？這就是你覺得買你眼鏡的人最迫切想知道的問題？從這裡就能看出他們的目標客群是哪種人了：「各位偷拍狂們，你們的夢幻神器終於來了！」

（正常的產品 FAQ：「電池續航多久？」；Waves 眼鏡的 FAQ：「我偷拍會被發現嗎？」）

歡迎來到「預設被錄影」的新世界。從今以後，每次跟人見面都要假設對方可能在錄影，說出來的每句話都要考慮是否會被直播到全世界。每天的日常生活將變成 24 小時不間斷的實境秀，而且還是在不知情的狀況下被迫參演。

Footnotes​

  1. https://x.com/crsamra/status/1948050596029952000 ↩