AICODING.TWAI程式學院AIART.TWAI藝術學院AIVIDEO.TWAI影片學院AIMUSIC.TWAI音樂學院AI3D.TWAI 3D學院AIFILM.TWAI電影學院AIADS.TWAI廣告學院AIBRAND.TWAI品牌學院AIMEDIA.TWAI媒體學院AISHOP.TWAI電商學院AICOACH.TWAI教練學院AISTARTUP.TWAI創業學院
先做實驗,再換首頁:我實際的建造順序
← Blog

實驗,首頁:實際建造順序

BUILDING IN PUBLIC2026.08.19by AI-MAN

換掉 aistartup.tw 首頁這件事,我沒有直接動手做,是先做一個實驗頁確認可行,才拿來取代。這篇記錄真實發生的順序,包括中途量測、走錯路、又撤掉重來的細節。

我把 aistartup.tw 的首頁整個換掉了。做法不是直接動手改首頁。

先做一個看不太到的實驗

我先做了一個獨立的選單頁,藏在導覽列裡,內容是「AI全端創業家」介紹。它不是首頁,不會影響訪客第一眼看到的東西。

這一步的目的只有一個:先看設計能不能成立,不賭上首頁。

看過之後我判斷可行,才進到下一步——把這個實驗頁的內容整個搬去當首頁,原本的首頁下架。搬完之後,我先讓兩個網址內容一樣,沒有馬上處理那個實驗頁。

實驗頁要長什麼樣,我先決定好才動手

實驗頁一開始的樣子,我沒有跟 AI 說「幫我做一個好看的頁面」——那樣它只會給平均值,置中大標、方塊卡片、加個漸層,你再叫它改,它就換一組漸層給你。

我是先自己決定要長什麼樣,具體到講得出來:黑色底、卡片像毛玻璃一樣半透明、背景放滿版影片。有了這個目標,AI 才知道要往哪裡做。這種目標可以用月費制的設計指令找,也可以用免費開源、授權允許商用的零件庫拿現成的動畫卡片來用。我這次是拿一套現成的深色動態版型當參考,用自己的內容重做一次。

中途做錯的一次

首頁換完,我發現標題看起來不對勁——中英文夾雜的地方,兩種字大小不一致,看得出怪但一開始說不出哪裡怪。

我沒有靠感覺調,請它把兩種字實際佔的高度量出來給我看數字:中文字比英文大寫高了兩成。這不是我的錯覺,是兩種字型天生比例不一樣,中英夾雜就一定會發生。

我第一個反應是把中文縮小去對齊英文。做完發現代價太大:全站所有標題的中文都變小了,包含跟這次無關的純中文標題。這不是我要的結果,我把它撤掉。

改成反過來,把英文放大約一成五去配合中文。但放大之後英文會顯得偏高,大概 3 個像素點,要再往下挪一點,兩種字才會落在同一條線上,這兩件事得一起做。這次確認可行,我決定把它推廣到全站的標題,不只是首頁。

字級跟間距,也走錯過一次

我把最重要的那句放到最大,結果它比最小的字大了 3.3 倍,太吵,收回到 2.4 倍才對。

間距也一樣。標題下面的留白、段落之間的距離,我都收窄過。中間收過頭一次——收到比行跟行之間的距離還窄,標題整個黏在下一行上,只好往回調鬆。這種判斷沒有工具能代勞,只能自己盯著看。

確認之後,把多餘的東西收掉

等首頁跟標題都確定沒問題,我回頭處理那個實驗用的選單頁——內容已經跟首頁重複了,我把它刪掉,選單項目也拿掉,舊網址設定自動導去新首頁。

真正花時間的地方

回頭看整個過程,版型結構一開始就定了,沒有大改。真正反覆修的是細節看起來對不對。

這代表一件事:做出一個能動的版本不難,難的是讓它看起來有質感。這是我這次做完最直接的體會。

這是我建造的方式

先自己決定要長什麼樣,再交給 AI 做。做出來覺得怪,要它把數字量出來,不接受「調到看起來一樣」這種模糊指令。最後的間距跟節奏,自己收。

先做小範圍的實驗,不賭上正式的東西。確認可行才推廣。推廣完回頭清掉重複的。

不是一次到位,是一步一步驗證過再往前走。

Author

AI-MAN
創辦人

AI-MAN

我是 AI-MAN12AI學院創辦人,開放品牌領導者。我的工作打造12AI學院+200開放品牌。我的核心信念是:Live Different.AI 時代,人類要有新的