Give a Feedback
為幫助快速找到各情境下適合使用的元件，將通知類型元件統整，並透過四種主要使用情境分類做說明。 此單元主要講述如何在用戶執行動作後，給予適當的回饋，相關細節說明亦可從介紹中連結至該頁面查看。
⚡️ 此情境包含元件：
設計稿
Text toast
無範例檔（請參考線上APP）
Icon toast
Scenarios
運用情境
- 當用戶操作完成，我可以如何反饋狀態？
1. 當用戶操作完成，我可以如何反饋狀態？
建議使用的 UI 元件
- 若為操作後發生的錯誤告知，建議使用 ➊
- 若為操作成功的通知，建議使用 ❷
➊ Text toast
- 功能特色：
- 為用戶主動的行為觸發，而非系統自動觸發的狀態
- 當用戶執行動作後，給予適當的回饋
- 適用於簡短的純文字回饋
- 互動形式：
- 無互動行為，顯示數秒後會自行消失
- 設計進度：
- 在資產的專案有設計完稿，期望讓雙平台的樣式一樣
- 未元件化
- RD 進度：
- 未元件化且未上線，建議開發團隊可接續完成實作
如果後續要接續設計，需要定義文字顯示規則（字數、行數…）
建議替代方案：
* Toast 原為 Android 系統原生元件，也有出套件讓 iOS 直接套用 Android 長相的 iOS元件
❷ Icon toast
- 功能特色：
- 當用戶執行動作後，給予適當的回饋
- 可顯示功能 icon 及簡短的純文字
- 利用 icon 來表達狀態，藉此輔助用戶理解他執行的動作
- 互動形式：
- 在 iOS 上無互動行為，顯示數秒後會自行消失
- 在 Android 上含有一個 LInk，顯示數秒後會自行消失
- 設計進度：
- 沒有設計原檔，可於之後專案應用時製作 component
- RD 進度：
- 已元件化
雙平台差異：
- ios 的 icon toast 是沒有帶連結的
- Android 的 icon toast 是有帶連結的
Changelog
Date | Version | Notes | Chapters | Person |
|---|---|---|---|---|
June 16, 2023 | 1.24 | ・新增 Scenario 區塊 ・新增 Something to notice 情境 | Notification | C Camille Cheng Paris Han |
July 24, 2023 | 1.32 | ・修改 Comparison table 表格 ・修改 something to guide ・修改 give a feedback ・修改 special status | Notification | Paris Han C Camille Cheng |
July 6, 2023 | 1.28 | ・新增 Comparison table 草稿 | Notification | C Camille Cheng |
July 10, 2023 | 1.30 | ・新增 special status 草稿 | Notification | Paris Han |
July 7, 2023 | 1.29 | ・新增 give a feedback 草稿 | Notification | Paris Han |
July 19, 2023 | 1.31 | ・Comparison table 表格調整 ・修改 something to guide 草稿 ・修改 give a feedback 草稿 | Notification | C Camille ChengParis Han |
July 6, 2023 | 1.28 | ・新增 something to guide 草稿 | Notification | Paris Han |
June 26, 2023 | 1.26 | ・修改 something to notice 內容 | Notification | C Camille ChengParis Han |