經過前幾天的開發，AI Recipe 已經有食材輸入、AI 推薦、條件篩選和收藏功能。

不過，功能完成不代表使用者一定能輕鬆操作。

今天要認識 UI 和 UX，並檢查網站有哪些地方可以改善。

一、UI 和 UX 是什麼？

UI（User Interface） 是使用者介面，例如按鈕、文字、顏色和排版。

UX（User Experience） 則是使用者操作網站時的整體體驗，例如操作是否直覺、資訊是否容易理解。

二、改善網站操作

我決定先進行幾個小調整：

1. 讓主要推薦按鈕更明顯。
2. 為食材輸入框加入清楚的提示。
3. 將料理時間和類型放在一起。
4. 加入載入提示，避免使用者不知道網站是否正在運作。
5. 在沒有收藏資料時顯示友善訊息。

例如，可以使用 CSS 調整主要按鈕：

#recommendBtn {
    background-color: #e98246;
    color: white;
    padding: 14px 24px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: bold;
}

#recommendBtn:hover {
    background-color: #cc6a32;
}

三、今天的成果

今天沒有加入新的 AI 功能，而是將重點放在使用者體驗。

我發現，一個好的網站不只是功能多，還需要讓使用者知道每個功能怎麼使用。

接下來要檢查 API 金鑰和程式碼的安全性，準備將網站部署到網路上。