Day 255 選不出形象照就做個網頁投票

形象照拍完，攝影師給了五張還沒修圖的照片，我盯著看了很久還是選不出來。五張看起來都差不多，每一張我都能挑出一個只有自己會在意的毛病。

所以我把這五張做成一個投票網頁，丟給親朋好友直接選：

形象照票選頁面：五張照片一字排開，每張下面都有留言欄

這篇分享幾件事：為什麼自己選自己的照片最沒判斷力、我怎麼從「哪張好看」改成「哪張適合這個用途」、投票頁上幾個看起來很小、但會決定你收到什麼回饋的設計，還有這個頁面怎麼做出來的。

自己看自己的臉最沒判斷力

五張擺在一起，我看到的全是別人根本不會注意的東西：這張下巴的角度怪、這張笑得有點僵、這張頭髮翹起來一撮。看久了五張變成同一張，比較的基準整個消失。

別人不是這樣看的。別人第一眼看到的是一個整體印象——這個人看起來好不好相處、專不專業、像不像會站在台上講課的人。那個印象我自己感受不到，因為我對自己的臉太熟了。

判斷力既然在別人身上，選擇權就交出去。

我原本想的是直接把五張丟進群組問「哪張比較好看」。後來沒有這樣做。

「好看」是一個沒有標準的問題。每個人心裡那把尺不一樣，收回來的答案沒辦法加總，最後還是我自己在決定——等於繞一圈回到原點。而且形象照是要拿去用的東西。同一張臉放在縮很小的社群大頭貼，跟放在課程封面上，需要的條件完全不一樣。

所以頁面上我直接把用途寫成三種場景，請投票的人照場景選：

頁面上還寫了我的定位：AI 講師／AI 顧問。有了這個前提，投票的人就知道自己在幫我挑什麼。

問題換了，答案的性質也跟著換。「哪張好看」收回來的是一堆各自的偏好；「哪張適合當講者照」收回來的是大家對同一個用途的判斷，而那是可以加總的。

五張照片一字排開，點一下選、再點一下取消，一定要選滿三張才送得出去。畫面底部有一條固定的列，上面是三個小圓點、一個 0 / 3 已選 的計數器，還有送出鍵。做成五選三，是因為三張正好對上三個場景，同時也不逼人硬要一一對應——想直接選三張最喜歡的也可以。

其他幾個設計：

每張照片下面都可以留言，寫幾句為什麼選它
沒選的那兩張也歡迎留言。這是我刻意留的欄位——「為什麼不選它」通常比「為什麼選它」資訊量大很多，選的理由大家講得都差不多，不選的理由才會冒出我沒看到的東西
要填「你是誰」，不匿名。我這邊看得到是誰投的，但結果頁對外還是匿名顯示，真名要輸密碼才看得到
有一個 /results 頁面，隨時看得到目前票數跟大家寫的意見，投完的人自己回去看就好，不用等我公布

送出後會跳出「收到了，謝謝你」，下面兩顆按鈕：換下一位投票、看目前結果——同一支手機可以連續讓好幾個人投，這在面對面的場合很實用。

整個網頁架在 Cloudflare Workers 上，一個網址就夠，投票頁和結果頁都在同一支程式裡。

它是一個 prompt 生出來的。

票收得差不多，要用哪幾張我已經決定了。

投票頁我還留著沒關。你如果也想給個意見，一樣歡迎——網址在上面，五張裡挑三張，順手留兩句話。

為了選五張照片去刻一個投票頁，時間成本不合理，所以沒有人會這樣做。要蒐集這種意見，做法不外乎兩種：一個一個私訊身邊的朋友，或是開一份 Google 表單請人填。

私訊收回來的意見散在各個對話框裡，自己還要再整理一次。Google 表單收得到，但它長得就是一份表單——沒辦法把五張照片一字排開讓人邊看邊選，也放不進「沒選的那兩張也講一句」這種欄位。

現在一個 prompt 就長出來了，這兩個都不用將就。想要什麼樣的介面，把它描述出來就有。

這才是 vibe coding 對我最實用的地方：它讓一些本來不值得寫程式的小事，變得值得。