# 5.7 產品介紹

## 5.7. 產品介紹

5.7.1 畫面連結位置

有兩種方式可到產品介紹頁面：

(1) 首頁登入後預設顯示產品介紹頁面。&#x20;

(2) 點擊功能列的產品介紹

5.7.2 功能說明

顯示產品類別與產品項目，並且可顯示產品項目的詳細規格資訊，若會員對某商品有興趣可將產品加入購物車。

5.7.3 畫面說明

![](https://839601301-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LDqHCDuHO17jEDLqmJp%2F-LGGN2vlqEVxATtsO7k8%2F-LGGNpPgf4qQa1KgOYsW%2F5.7-1.png?alt=media\&token=1494df8a-1f8a-41c3-a05e-3857f60e2991)

![](https://839601301-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LDqHCDuHO17jEDLqmJp%2F-LGGN2vlqEVxATtsO7k8%2F-LGGNrHEu80W4Xxxqgo9%2F5.7-2.png?alt=media\&token=1d9e51c5-97ac-4bff-9841-9678eb92dd69)

![](https://839601301-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LDqHCDuHO17jEDLqmJp%2F-LGGN2vlqEVxATtsO7k8%2F-LGGNtl9LSum40kwlPbW%2F5.7-3.png?alt=media\&token=051f89c7-91fa-41cd-9465-2403049b2f02)

5.7.4 欄位/項目屬性說明

* 糕餅類的產品項目畫面
* 會糕餅類的產品項目的欄位說明

| 欄位名稱 | 顯示格式 | 規則說明                                                        |
| ---- | ---- | ----------------------------------------------------------- |
| 產品名稱 | 文字連結 | <p>1. 共有三種蛋糕類的產品，分別是鳯犁酥、蛋黃酥、綠豆碰。<br> 2. 點擊：顯示蛋糕類的產品項目資訊</p> |
| 產品圖片 | 圖片   | <p>1. 共有三種蛋糕類的產品，分別是鳯犁酥、蛋黃酥、綠豆碰。<br> 2. 點擊：顯示蛋糕類的產品項目資訊</p> |

* 糕餅類的產品項目的功能項目按鈕

| 功能項目名稱 | 類別/動作    | 系統回應與詳細處理邏輯     |
| ------ | -------- | --------------- |
| 糕餅     | Tab頁籤/點擊 | 1. 顯示糕餅類的產品項目資訊 |

* 蛋糕類的產品項目畫面
* 蛋糕類的產品項目的欄位說明

| 欄位名稱 | 顯示格式 | 規則說明                                                                 |
| ---- | ---- | -------------------------------------------------------------------- |
| 產品名稱 | 文字連結 | <p>1. 共有三種蛋糕類的產品名稱，分別是黑森林蛋糕、香草蛋糕、水果蛋糕。<br> 2. 點擊：進入點擊到的詳細產品資訊頁面</p>  |
| 產品圖片 | 圖片   | <p>1. 共有三種蛋糕類的產品圖片，分別是黑森林蛋糕、香草蛋糕、水果蛋糕。<br> 2. 點擊：進入點擊到的詳細產品資訊頁面。</p> |

* 蛋糕類的產品項目的功能項目按鈕

| 功能項目名稱 | 類別/動作    | 系統回應與詳細處理邏輯      |
| ------ | -------- | ---------------- |
| 蛋糕     | Tab頁籤/點擊 | 1. 顯示蛋糕類的產品項目資訊。 |

* 產品項目的詳細資訊畫面
* 產品項目的詳細資訊的欄位說明

| 欄位名稱 | 顯示格式 | 規則說明                                                                                                                                                   |
| ---- | ---- | ------------------------------------------------------------------------------------------------------------------------------------------------------ |
| 產品照片 | 圖片   | 1. 顯示所點選的產品照片                                                                                                                                          |
| 品名   | 文字顯示 | 1. 顯示所點選的產品名稱                                                                                                                                          |
| 規格   | 文字顯示 | <p>1. 顯示所點選的產品規格。<br> 2. 以下為六項產品的規格：<br> (1)鳯犁酥：6入/盒<br> (2)蛋黃酥：6入/盒<br> (3)綠豆碰：6入/盒<br> (4)黑森林蛋糕：6吋<br> (5)香草蛋糕：6吋<br>(6)水果蛋糕：6吋</p>                  |
| 價格   | 文字顯示 | <p>1. 顯示所點選的產品價格<br> 2. 以下為六項產品的價格：<br> (1)鳯犁酥：120元/盒<br> (2)蛋黃酥：160元/盒<br> (3)綠豆碰：180元/盒<br> (4)黑森林蛋糕：400元/盒<br> ()香草蛋糕：450元/盒<br> (6)水果蛋糕：500元/盒</p> |

* 產品項目的詳細資訊的功能項目按鈕

| 功能項目名稱 | 類別/動作 | 系統回應與詳細處理邏輯                  |
| ------ | ----- | ---------------------------- |
| 加入購物車  | 按鈕點擊  | 1. 顯示購物車內容頁面，詳細資訊請參考購物車章節說明。 |
