# 網頁工作流程簡介

## 介紹網頁工作流程
一般我們在說所謂的系統開發時，通常都是指所謂的 Full Stack (全端)應用，而 Full Stack 所指的便是由 Front End(前端)、Back End(後端)與 Database(資料庫) 所構築起來的應用，可以把它想像成一間餐廳，美麗的店面與擺設，使用者的動線與餐廳的佈局等，都是前端(Front End)所負責的工作，而後端(Back End)則負責將廚房裡的各種食材(DATABASE)，組合加工成使用者所指定的餐點，最後再透過負責傳遞餐點的服務員(資料傳輸)，送至消費者的手上。

當然，並不是所有的網頁都需要後端與資料庫的支持，只是在缺少了這兩項應用的時候，我們變得無法提供較為動態的服務，但相對的，就如同部分企業的形象官網抑或是個人頁面等等，並非是所有的需求都依賴著後端，這裡可以把它想像成名勝古蹟與自然風景等，當只需要定期維護而非長期時，靜態官網也是一個相當好的選擇。

最後我們來說說雛形設計這塊，他其實並不會被歸納進 Full Stack 的應用，因為他就像是建築的設計圖一樣，且能與技術工程完全分離，但若想完成一個可良好操作且美觀的網站，一個好的設計圖是絕對不可或缺的。


### 基礎設計三步驟
- Wireframe 流程線稿設計 - 建立操作流程以確保功能頁面完善(工具或手繪)
- Mockup 視覺槁 - 完成畫面 UI 建置與設計指南(色票組、標題大小、設計風格等)
- Prototype 原型串接 - 完成操作流程串接

<br/>

## 網頁工程師(包含前端後端)涵蓋內容解析
其實只要是從事網頁網站開發的，都可以被稱為「網頁工程師」(Web Developer)，因此這個群體可以說是非常龐大，但隨著各種應用的複雜度日漸攀升，當中的許多項目便慢慢地產生了明顯的分支，而導致分支的主要原因，個人認為是以開發的環境有著相當緊密的關係，以下就讓我們稍微解析一下個職位的工作項目吧。

### 前端網頁工程師
* 主要負責
* 將使用者介面(UI)從設計轉換為網頁
* 處理與後端的資料介接
* 確認各瀏覽器的順利運行
* 確認各裝置的順利運行
* 優化使用者體驗
* 優化操作效能
* 困難點
* 前端技術的更新速度非常快速
* 卡在設計與後端之間，需要較長進行協助溝通

### 後端網頁工程師
* 主要負責
* 負責商務邏輯處理
* 需設計與前端溝通的機制(API)
* 優化傳輸速度或程式效能
* 資訊安全機制
* 與資料庫進行介接(可能有專門的資料庫工程師)
* 確立伺服器端的運作正常(可能有專門的系統網路工程師)
* 困難點
* 較為複雜的計算會在後端處理
* 需面對資訊安全隱患
>其實後端的困難點很容易根據專案需求異動，像大數據的工程師就需要面對演算法等等。

<br/>

## 講授實務工作流程介紹

**瀑布式開發(Waterfall)**
這是最傳統的開發方式，在需求確立之後幾乎不太會進行修改，且每個步驟階段也不會重複進行，需要非常完善的規劃與考慮時間，且基本上沒有所謂的回頭路。

* 優點
* 較長的評估時間與規劃能產生較為穩定的回報
* 專案進行條理明確
* 工作日程規劃相對準確
* 個人負責項目一目暸然
* 缺點
* 專案時程普遍較長
* 很難進行需求變更
* 無法面對即時的市場面動
> 瀑布式開發適合應對穩定需求的大型專案，與硬體和有印成的相關產業，如鞋廠這類需要訂製模板的相關行業。

**敏捷式開發（Agile Methodology）**
近幾年來盛行的開發方式，會同時在多個項目中推薦，最大的特點就是名稱中的「敏捷」，是近代專案開發喜歡的方式。

* 優點
* 需求變更迅速
* 使用者研究與反饋快速
* 所需成本與花費時間較低
* 整體需求彈性
* 缺點
* 容易偏離最初目標，並使產品缺乏一至性
* 參與角色沒分配好容易產生混亂
* 更加注重團隊內部溝通
> Agile 適合面對需求變更快速的市場，近幾年來深受許多企業與新創的喜愛，但 Agile 其實在專案經理等角色缺乏經驗時，反而會導致專案需求左右橫移或產生不合理變更，從而導致專案失敗的風險增高。
>
**Lean UX 的循環：**
:::warning
概念設計 -> 雛形設計 -> 內部驗證 -> 外部測試 -> 研究且應用結果
:::


<br/>

## UI/UX 基礎介紹

### 前言
設計是一種既簡單又複雜的概念，並且這個辭彙出現在許許多多的地方，如程式設計、介面設計、使用者經驗設計等等，不過說到底設計的本質，其實也僅僅是人為了達成目的所規劃的過程而已，程式設計是對程式語言進行設計，提升可重復性並提高效能等等，介面設計則是讓產品UI更加適合目標族群閱讀，而使用者經驗設計則是模擬並規劃人們的使用習慣，從而達到最佳的使用者操作體驗．因此也可以說設計的概念，即是為了讓人更加方便的使用文明所帶來的革新而已．

### 什麼是UI什麼是UX?
其實實際上一個產品並非僅有UI/UX，還包括了所謂的互動設計師以及視覺設計師等等，通常是由UX設計師將人的行為模式設計出來，並且畫出可以操作使用的Prototype，再經由UI設計師將其進行設計與風格的統一，接著再由視覺設計師去統籌細節的字距以及微小的調配，最後再由互動設計師進行使用者與產品的抗爭，設計拉下的回饋與側拉的效果秒速等等，因此其實一個完整美好的系統，均在背後有著台下十年功的苦心。

### 設計守則
1. 明確定義標題與內文的字體大小
2. 特殊標題字可用較大的字體
3. 文字行距建議在120%~150%
4. 文字行寬建議在45~90個字中
5. 內文字體保持在 14-24 pt間

### 顏色搭配

| 色彩 | 廣義代表 | 範例 |
| ------ | -------------------------------------------------------------- | ---- |
| 紅色 | 強大的、刺激的、充滿活力(亮紅色)、強大的與壓迫感(暗紅色)、危險 | 太陽、超人、警告標示、錯誤訊息 |
| 橙色 | 勇氣、友善、和善、溫和 | 橘子、夕陽、燈光、文化 |
| 黃色 | 幸福、可愛、活力、警告 | 黃色小鴨、黃金(金粉)、鈴鐺、向日葵、警告標誌 |
| 綠色 | 自然、生命、安全、金錢 | 自然、樹木、綠茶、安全性、保養品 |
| 藍色 | 耐心、平和、成穩、自信 | 科技、海洋、天空、建築、地球 |
| 紫色 | 神秘、知識、皇室奢華 | 極光、傳統文化、紫羅蘭、化妝品 |
| 粉紅色 | 愛慕、呵護 | 親子、育兒、花蕊 |
| 棕色 | 放鬆、耐用、可靠 | 樹木、自然、咖啡、動物(熊、馬) |

### 圖片搭配
+ 直接將文字丟在圖片上
+ 在圖片上增加遮罩
+ 純色系
+ 漸層色系
+ 半透明文字匡
+ 背景圖片模糊
+ 漸層往下增強

### ICON使用
+ 協助使用者快速瀏覽網頁
+ 協助操作便利性
+ 輔助性

### 使用合理的空白
+ 在元素之間留有空格
+ 在群組之間留有空格
+ 在段落之間留有空格
+ 盡量不要過於誇張

### 設計靈感
+ 模仿
+ 思考共同點
+ 分析使用者思維

## 系統需求分析與使用者分析

### 業務假設
#### 步驟一：每個成員完成一個自己的假設
#### 步驟二：每個成員分享自己的答案
#### 步驟三：彙整、組織、排定優先順序

| 業務假設 | 內容填入 |
| -------- | -------- |
| 我認為客戶需要 | Text |
| 這些需求能以這個方法解決 | Text |
| 我的第一個客戶是(或即將事) | Text |
| 客戶最想從服務裡獲取的價值 | Text |
| 客戶還能獲取這些額外的好處 | Text |
| 通過這項方法獲取大多數的顧客 | Text |
| 獲利營收的方式 | Text |
| 我的市場裡的主要競爭者 | Text |
| 我能打倒競爭對手的原因 | Text |
| 最大的產品風險 | Text |
| 我們會透過這個方式解決問題 | Text |
| 當我們看到客戶產生什麼變化時，代表我們成功了 | Text |
| 還有哪些其他假設一但被證明是錯誤，將會導致專案失敗 | Text |

| 使用者假設 | 內容填入 |
| -------- | -------- |
| 使用者是誰 | Text |
| 產品適用於使用者的工作或是生活中的哪些地方 | Text |
| 產品解決了哪些問題 | Text |
| 產品的使用時機與方法 | Text |
| 產品的重要功能為何 | Text |
| 產品的樣貌與表現方式？ | Text |

### 建立使用者故事模擬

| 草圖、名稱、角色 | 影響行為因素 |
| -------- | -------- |
| 需求、障礙、期望 | 使用者操作週期 |

| Amy 媽媽 40歲 | 已婚、有兩個小孩、關心教育、可支配收入 |
| -------- | -------- |
| 需要了解小孩的在校學習情況、需要明確進行頻估、親師溝通、學校裡學過時的科技工具、幫助小孩學習 | 長期 |

<br/>

# AI 智慧企劃寫作實戰工作坊

## 課程目標
- 掌握 AI 工具輔助企劃撰寫技巧
- 建立高效率的企劃寫作工作流
- 提升企劃內容的專業性與說服力
- 學會運用 AI 工具優化企劃視覺呈現

## 課程詳細內容

### 第一部分：AI 企劃工具介紹（30分鐘）

#### 1. ChatGPT 企劃應用技巧（10分鐘）
- **基礎設定與操作**
* 模型選擇（GPT-3.5 vs GPT-4）
* 對話上下文管理
* 角色設定技巧
- **企劃應用場景**
* 前期研究與資料收集
* 架構建議與內容生成
* 數據分析與解讀

#### 2. Claude 專業寫作特點（10分鐘）
- **核心功能介紹**
* 長文本處理能力
* 專業術語運用
* 邏輯分析特點
- **實務應用重點**
* 企劃書潤稿與優化
* 專業度提升技巧
* 內容深化方法

#### 3. Notion AI 文件整理功能（5分鐘）
- **基礎功能介紹**
* AI 輔助寫作
* 自動摘要生成
* 格式優化工具
- **協作功能應用**
* 團隊共享設置
* 版本管理方法
* 檔案組織技巧

#### 4. 工具優劣勢分析（5分鐘）
- **功能比較**
* 內容生成質量
* 專業度表現
* 使用便利性
- **使用建議**
* 適用場景分析
* 工具組合策略
* 成本效益考量

### 第二部分：企劃書架構與提示詞（45分鐘）

#### 1. 企劃書基本架構解析（15分鐘）
- **標準架構介紹**

  1. 專案摘要
  2. 市場分析
  3. 目標設定
  4. 策略規劃
  5. 執行方案
  6. 預算規劃
  7. 效益評估

- **各章節重點說明**
* 關鍵內容要素
* 撰寫注意事項
* 常見問題解決

#### 2. 提示詞撰寫技巧（15分鐘）
- **基礎提示詞框架**

  角色：您是一位資深企劃顧問
  任務：幫我規劃[項目]的企劃書
  要求：
  1. 符合行業標準
  2. 包含具體數據
  3. 提供實施建議

- **進階提示技巧**
* 上下文管理
* 條件設定
* 範例導引

#### 3. 企劃書關鍵元素（10分鐘）
- **必要組件清單**
* 執行摘要
* 數據支持
* 競爭分析
* 風險評估
- **品質檢查要點**
* 完整性
* 邏輯性
* 可行性

#### 4. 常見錯誤避免（5分鐘）
- **內容方面**
* 數據準確性
* 邏輯連貫性
* 實施可行性
- **形式方面**
* 格式一致性
* 專業術語使用
* 視覺呈現

### 第三部分：實戰演練（60分鐘）

#### 1. 市場分析生成（15分鐘）
- **實作步驟**
1. 設定分析框架
2. 生成市場概況
3. 競爭者分析
4. 趨勢預測
- **實機操作演示**
* 提示詞撰寫
* 內容生成
* 數據整合

#### 2. 目標客群描述（15分鐘）
- **客群分析框架**
* 人口統計特徵
* 行為特點
* 需求痛點
- **AI輔助技巧**
* 精準描述生成
* 案例引用
* 數據支持

#### 3. 行銷策略規劃（15分鐘）
- **策略框架建立**
* 目標設定
* 通路規劃
* 預算分配
- **AI應用重點**
* 策略建議生成
* 執行方案細化
* 效果預估

#### 4. 預算規劃助手（15分鐘）
- **預算分析工具**
* 成本估算
* 資源分配
* ROI預測
- **運用技巧**
* 數據模型建立
* 預算優化建議
* 風險評估

### 第四部分：優化與整合（45分鐘）

#### 1. 內容校正與潤飾（15分鐘）
- **文字優化**
* 專業度提升
* 表達精準化
* 風格統一
- **結構完善**
* 章節銜接
* 重點突出
* 層次分明

#### 2. 邏輯性優化（10分鐘）
- **邏輯檢查要點**
* 因果關係
* 論證完整性
* 推論合理性
- **優化方法**
* AI輔助分析
* 邏輯架構重組
* 案例支持

#### 3. 說服力提升（10分鐘）
- **增強要素**
* 數據支持
* 案例引證
* 專家觀點
- **表現技巧**
* 重點強調
* 視覺化呈現
* 結論導向

#### 4. 視覺化呈現（10分鐘）
- **圖表製作**
* 數據圖表
* 流程圖
* 組織架構圖
- **設計原則**
* 簡潔明瞭
* 重點突出
* 專業美觀

<br/>

# AI 視覺創意工具應用實戰

## 引言
### 什麼是生成式AI？

生成式AI是指利用人工智慧生成內容的技術，這些內容包括圖像、文字、音樂、3D模型等。它能夠根據所給予的輸入資料自動生成新的數據，而這些數據往往具有高創造性和多樣性。生成式AI的強大之處在於，它不僅僅是分析或分類資料，還能創造出新的內容，並且能夠通過學習資料中的規律來預測和產生結果。

在產品設計領域，生成式AI可以用來自動創建設計雛形、優化設計細節，甚至根據特定的設計需求生成多樣化的設計選項。這種技術的應用減少了手工設計的時間和成本，並擴展了設計的創意範圍。

---

### 簡單介紹生成式AI的概念

生成式AI的核心在於它通過學習數據的內在結構，然後根據這些結構生成新的數據。最常見的生成式AI架構包括兩大類：生成對抗網絡（GANs）和變分自動編碼器（VAEs）。

這些技術的基本原理包括兩個步驟：
1. **學習階段**：AI通過大量的數據進行訓練，學習這些數據的分佈和特徵。
2. **生成階段**：AI根據學到的模式，生成與訓練數據相似的全新內容。

---

### GANs (生成對抗網絡) 和 VAEs (變分自動編碼器) 的基礎知識

**GANs（生成對抗網絡）** 是一種基於兩個神經網絡的生成模型，其中一個是「生成器」（Generator），負責生成新的數據；另一個是「判別器」（Discriminator），負責評估生成數據的真實性。

- **生成器**試圖欺騙判別器，使其相信生成的數據是真實的。
- **判別器**則不斷學習來區分真實數據和生成數據。

這兩個網絡相互對抗，通過多次迭代，生成器最終能夠創建出非常逼真的數據。GANs 被廣泛應用於圖像生成、風格轉換、音頻生成等領域，特別適合生成具備創意性和多樣化的產品設計雛形。

> 條件資訊 y 背後的直覺是，透過添加附加訊息，生成器 G 和鑑別器 D 都學會在某些模式下運作。例如，在人臉生成應用程式中，我們可以要求生成器產生一張笑臉，並詢問鑑別器特定圖像是否包含笑臉。

**VAEs（變分自動編碼器）** 是一種概率模型，通過壓縮數據並學習其潛在結構來生成新數據。與 GANs 不同，VAEs 更關注生成數據的多樣性，而不是僅僅創建逼真的數據。VAEs 通過編碼器（Encoder）將數據壓縮到潛在空間，然後通過解碼器（Decoder）來重建數據，並在這一過程中生成新的變異數據。VAEs 特別適合用於需要保證數據結構一致性和多樣性的應用場景，例如生成具有不同風格的產品設計。

---

### 生成式AI如何改變產品設計流程的潛力

生成式AI在產品設計中帶來的革命性改變包括：

1. **加速設計流程**：傳統設計需要設計師耗費大量時間進行手繪、建模和調整，而生成式AI可以根據設計需求快速生成設計草圖和初步模型，極大縮短設計週期。
2. **提高設計的多樣性**：生成式AI可以輕鬆生成多種不同風格的設計選項，設計師只需提供關鍵詞或基本參數，AI就能生成多樣化的設計方案，為創意提供更多靈感。
3. **自動化細節優化**：AI能夠通過學習大量優秀設計作品中的細節，自動優化設計，確保生成的產品既具備功能性又具美觀性。
4. **大規模自定化設計**：生成式AI允許大規模定制設計，根據不同的需求自動生成符合特定規範的產品模型，尤其適合於服裝、家具、汽車零件等需要高度個性化的領域。
5. **降低成本**：通過減少手工設計的工作量和設計周期，生成式AI可以顯著降低產品設計和開發的成本。

---

### 生成式AI在3D設計中的應用

在3D設計中，生成式AI可以應用於以下幾個重要階段：

1. **產品初步構想**：
- AI根據關鍵字生成早期概念圖，幫助設計師快速探索設計方向，無需從零開始構思設計。
2. **雛形設計**：
- 利用GANs或VAEs，設計師可以生成產品的3D雛形，初步模型可以在生成後進行調整和優化，以符合具體設計需求。
- 這種自動生成模型的方式大大提高了設計效率，並且減少了繁瑣的手工建模過程。
3. **細節優化**：
- AI能夠自動分析產品模型中的細節，並進行細節上的優化，如增加紋理、提高模型的真實感等。
- 通過分析多個現實世界的數據集，AI可以將材料質感、光影效果等自動應用到3D模型中，讓設計更加逼真。

生成式AI的應用已經遍及家具設計、建築建模、工業設計等多個領域。未來，隨著技術的不斷進步，生成式AI在3D設計中的應用前景無限，特別是在與虛擬現實（VR）和增強現實（AR）相結合時，能夠進一步提高設計的互動性和沉浸感。

<br/>

## 關鍵字撰寫和 AI 生成模型流程
### 1. **有效的關鍵字撰寫技巧**
生成式AI在2D和3D模型創建中的關鍵在於如何提供有效的輸入。關鍵字撰寫技巧決定了AI生成內容的品質，因此，理解如何設計精確且具體的關鍵字組合至關重要。

### 2. **闡述如何使用具體和清晰的關鍵字來提高生成圖片的品質**

生成式AI工具（如DALL-E、MidJourney等）依賴於提供的文字輸入來生成圖像或模型。以下幾點有助於提高生成模型的品質：

- **具體性**：提供具體的描述，避免過於模糊或廣泛的詞彙。比如，對於家具設計，不僅描述為“椅子”，而是“現代風格、木製、帶靠背、淺棕色的餐椅”。
- **層次性**：關鍵字可以有層次，從大範疇開始逐漸到具體屬性。例如：材質、風格、顏色、功能等。
- **清晰性**：語句要簡潔且易於AI理解，避免過多的修飾詞或無關信息。應直接描述你想要生成的對象。

### 3. **形容詞、風格詞和技術細節詞彙對生成結果的影響**

- **形容詞**：形容詞直接影響AI生成的風格和質感。例如，“光滑的表面”會導致生成的物體具有較少的紋理和反光效果，而“粗糙的質感”會生成更多顆粒狀的細節。
- **風格詞**：使用“現代風格”、“復古風格”、“工業風”等描述詞能引導AI生成特定時代或文化背景的設計。這在產品設計中非常關鍵，因為風格決定了產品的整體視覺語言。
- **技術細節詞彙**：技術細節詞如“3D渲染”、“低多邊形”、“高細節”等能幫助AI理解圖像的細緻程度。例如，生成“低多邊形”的物體會讓AI輸出簡化的幾何形狀，而“高細節”會強調細節的精度。

### 4. **示範如何撰寫適合產品設計的關鍵字**

- **案例：家具設計**
- 壞例子：“一把椅子”
- 好例子：“現代風格、木製的椅子，帶有靠背，淺棕色，帶有圓滑邊角的結構，適合餐廳使用。”
- **案例：汽車零件設計**
- 壞例子：“一個輪子”
- 好例子：“高性能運動汽車用的合金輪圈，黑色，五輻設計，啞光表面，直徑19英吋，現代且具工業風的外形。”

在這些示範中，我們可以看到具體的材質、用途、風格和細節描述如何改變最終生成的結果。

### 5. **從關鍵字到2D圖像生成**

- **生成概念圖**
使用現有AI工具如DALL-E和MidJourney等，關鍵字撰寫後，AI會生成產品的二維概念圖。這些圖像雖然初步，但可以幫助設計師快速構想出產品的整體輪廓。

- **操作示範**：
1. 輸入關鍵字：「現代風格的木製書桌，帶有三個抽屜，深棕色，簡約線條，配有銀色把手，桌面光滑」。
2. AI 生成圖片後，展示結果，並討論如何調整關鍵字進一步優化設計。

**步驟逐步優化**：
- 若生成的結果不夠滿意，可以通過增加細節詞彙或改變風格詞來進行調整。例如，從“光滑表面”改為“有紋理的桌面”，或將“簡約風格”改為“工業風格”，來觀察生成效果的變化。

#### 使用 dzine 產出圖片
https://www.dzine.ai/

|  |  |
| --------------------------------------------------------- | -------- |
|  |  |

### 6. **示範如何逐步從概念圖過渡到更具體的設計方向**

一旦生成了概念圖，設計師可以通過進一步調整關鍵字來修改設計方向。例如，在家具設計中，你可以進一步細化設計：

- **調整風格**：從“現代風格”改為“北歐風格”，生成更加符合具體市場需求的設計。
- **細節添加**：增加如“抽屜把手材質：黃銅，光澤度高”等具體的細節描述，讓生成的模型更接近最終產品。

最終，這樣的關鍵字調整過程會幫助設計師從AI生成的二維概念圖轉向更具體、完整的產品設計雛形，並提供進一步手工調整的基礎。

---

### 小結

這一部分的核心是學會如何通過撰寫具體、清晰的關鍵字來引導AI生成所需的設計內容。關鍵詞的使用不僅可以節省設計師的時間，還能拓展創作思維，快速生成多樣的設計選項。這種方法能夠幫助產品設計師以最少的投入獲得靈感並開發出符合市場需求的產品。

#### 舉例：使用 GPT 請他提供清晰的說明文字
:::success
你是一個專業的產品專案經理，要設計一個 3D 的產品物件，產品的設計思想為 「.....」，要根據以下結構給予我合適生成式AI工具（如DALL-E、MidJourney等）產的圖片的關鍵字，並且要有中英對照，並同時產生六種不同方向與風格的範例。

具體性：提供具體的描述，避免過於模糊或廣泛的詞彙。比如，對於家具設計，不僅描述為“椅子”，而是“現代風格、木製、帶靠背、淺棕色的餐椅”。
層次性：關鍵字可以有層次，從大範疇開始逐漸到具體屬性。例如：材質、風格、顏色、功能等。
清晰性：語句要簡潔且易於AI理解，避免過多的修飾詞或無關信息。應直接描述你想要生成的對象。
:::

:::info
你是一個專業的產品專案經理，要設計一個 3D 的產品物件，產品的設計思想為 「啟發學生思維訓練的桌上型遊戲，搭配簡單的邏輯判斷與迴圈等，並且以俏皮的風格製作」，要根據以下結構給予我合適生成式AI工具（如DALL-E、MidJourney等）產的圖片的關鍵字，並且要有中英對照，並同時產生六種不同方向與風格的範例。

具體性：提供具體的描述，避免過於模糊或廣泛的詞彙。比如，對於家具設計，不僅描述為“椅子”，而是“現代風格、木製、帶靠背、淺棕色的餐椅”。
層次性：關鍵字可以有層次，從大範疇開始逐漸到具體屬性。例如：材質、風格、顏色、功能等。
清晰性：語句要簡潔且易於AI理解，避免過多的修飾詞或無關信息。應直接描述你想要生成的對象。

---

回答：
這裡是為設計「啟發學生思維訓練的桌上型遊戲」提供的六種不同方向與風格的圖片生成關鍵字，並附有中英對照。這些關鍵字將有助於生成適合此產品的 3D 圖像，具有俏皮風格並結合邏輯判斷與迴圈的特點。

##### 方向1：**可愛卡通風格**
- **中**：卡通風格桌上遊戲，色彩繽紛，帶有可愛的動物形象，遊戲設計鼓勵邏輯思考和簡單的判斷，適合小學生
- **英**：Cartoon-style tabletop game, colorful, featuring cute animal characters, designed to encourage logical thinking and simple judgment, suitable for young students

##### 方向2：**現代極簡風**
- **中**：極簡風格桌上遊戲，使用幾何形狀，簡單線條，整潔的配色，遊戲內容專注於邏輯迴圈與思維訓練
- **英**：Minimalist tabletop game, using geometric shapes, simple lines, clean color schemes, focusing on logic loops and thought training

##### 方向3：**科技未來風**
- **中**：科幻風桌上遊戲，帶有LED燈光效果和數字界面，遊戲設計包含迴圈和邏輯挑戰，具有未來感
- **英**：Futuristic tabletop game with LED lighting effects and digital interface, featuring loops and logic challenges, with a sci-fi aesthetic

##### 方向4：**童趣夢幻風**
- **中**：童趣風桌上遊戲，夢幻風格，柔和的粉彩色彩，俏皮的遊戲物件，鼓勵學生進行簡單的邏輯判斷和推理
- **英**：Playful tabletop game with a dreamy, whimsical style, soft pastel colors, featuring playful game objects that encourage simple logical reasoning and deduction

##### 方向5：**經典木質風**
- **中**：木質材質桌上遊戲，具傳統手工遊戲設計感，搭配簡單的邏輯遊戲和判斷環節，適合家庭使用
- **英**：Wooden tabletop game with a traditional handcrafted design, featuring simple logic games and judgment phases, suitable for family use

##### 方向6：**創意拼圖風**
- **中**：拼圖設計風格桌上遊戲，包含多層次邏輯判斷和迴圈挑戰，遊戲物件色彩鮮豔，充滿創意和趣味
- **英**：Puzzle-design tabletop game featuring multi-layered logic judgment and loop challenges, with vibrant game objects full of creativity and fun

這些關鍵字範例涵蓋了不同風格和材料，並具體描述了產品的設計特徵，讓生成式AI工具能更好地創建符合您需求的3D產品物件圖像。
:::

:::warning
https://www.dzine.ai/

使用以下關鍵字進行圖片生成：
Puzzle-design tabletop game featuring multi-layered logic judgment and loop challenges, with vibrant game objects full of creativity and fun

:::

:::warning
#### 已用這張圖片詢問 ChatGPT 以下問題
請將這張圖片上的關鍵字擷取出來，並規劃這種拼圖式邏輯遊戲和判斷環節的遊戲方式

#### GPT 回答

根據圖片中的內容，以下是擷取出的關鍵字，適用於描述這類拼圖式邏輯遊戲的生成式AI工具：

##### 關鍵字：
1. **拼圖式桌上遊戲** / Puzzle-style tabletop game
2. **多色彩的幾何圖形** / Multicolored geometric shapes
3. **木框設計** / Wooden frame design
4. **數學與邏輯判斷** / Math and logic judgment
5. **多層次解謎元素** / Multi-layered puzzle elements
6. **遊戲板** / Game board
7. **組合拼圖塊** / Puzzle piece combination
8. **俏皮卡通風格** / Playful cartoon style
9. **數字和符號** / Numbers and symbols
10. **教育思維訓練** / Educational thinking training

##### 遊戲方式規劃：
這類拼圖式邏輯遊戲可以設計成訓練學生邏輯判斷與思維能力的桌上遊戲，具體遊戲方式如下：

1. **遊戲目標：**
玩家需要使用拼圖塊完成不同的邏輯挑戰，將拼圖塊正確組合在遊戲板上，根據數字、符號、顏色等提示來進行解謎。
2. **遊戲過程：**
- **挑戰卡片：** 每位玩家隨機抽取一張挑戰卡片，上面顯示需完成的數學或邏輯挑戰。例如：根據提供的數字公式完成拼圖。
- **拼圖塊：** 玩家需要選擇合適的拼圖塊來填補遊戲板上的空位，拼圖塊可能根據顏色、數字或符號進行組合，每個挑戰可能有多種解法。
- **多層挑戰：** 玩家在完成一個挑戰後，可以進入更高難度的關卡，涉及更多數學運算或邏輯推理（如迴圈、判斷等）。
3. **獲勝條件：**
玩家在時間內正確完成指定數量的挑戰即可獲勝。根據不同挑戰的難度，玩家可以獲得不同分數，最高分者獲勝。
4. **遊戲特點：**
- **邏輯推理：** 根據顏色、形狀或數字規則來選擇合適的拼圖塊。
- **數學運算：** 拼圖塊上顯示不同的數字和運算符號，玩家需要根據挑戰題進行數學運算。
- **迴圈挑戰：** 進入進階關卡時，遊戲中可能包含邏輯迴圈的推理，增加挑戰難度。

這樣的遊戲設計不僅有助於學生培養數學和邏輯思維，還能通過拼圖的方式激發創造力和問題解決能力。
:::

<br/>

## 案例分析：生成式AI的實際應用

### 1. **3D模型的自定化**

生成式AI可以快速生成產品的3D模型，但這些模型通常需要進一步的修改才能符合特定的設計需求。自定化是3D產品設計中不可或缺的步驟，因為不同產品對細節、功能性和視覺效果有著不同要求。

### 2. **如何修改AI生成的模型以符合具體需求**

當AI生成的3D模型與具體需求不完全匹配時，設計師可以使用3D建模軟件（如Blender、Maya等）進行自定化修改。具體步驟如下：

1. **載入AI生成的模型**：將AI生成的初步3D模型導入Blender或其他軟件，通常這些模型格式為OBJ、FBX等。

2. **局部調整**：
- **幾何形狀的微調**：針對家具或汽車零件等產品，設計師可能需要調整模型的比例、曲線或結構。例如，修改椅子的靠背高度或輪圈的寬度。
- **增加細節**：AI生成的模型通常具有簡化的形狀，設計師可以通過增加小的細節來提升真實感，如家具表面的裝飾線條或汽車零件上的螺栓位置。

3. **功能性調整**：
- 根據實際使用場景，設計師需要進行功能性的自定化。例如，在家具設計中，調整抽屜的大小和滑軌位置；在汽車零件設計中，修改零件的連接點和尺寸以滿足裝配需求。

### 3. **利用Blender等軟件修改AI生成的家具、汽車零件設計**

- **家具設計**：
- 將AI生成的木製椅子模型導入Blender後，設計師可以進行如下修改：
1. 調整椅子的靠背弧度，使其更符合人體工學。
2. 增加椅腿的裝飾線條，提升設計的美感。
3. 更改椅子材質，使其看起來更具質感，並加強表面的木紋效果。

- **汽車零件設計**：
- 將AI生成的合金輪圈導入後，可以進行如下修改：
1. 調整輪輻的厚度，確保其強度足夠。
2. 修改輪圈的直徑以符合特定車型的規格。
3. 加入更多細節，如螺栓孔的位置，讓模型更貼近實際應用場景。

### 4. **貼圖和紋理應用**

**貼圖和紋理**是3D模型的重要組成部分，它們決定了產品的外觀真實感。透過貼圖處理，設計師能夠為模型添加具體的材質效果，如金屬光澤、木紋紋理、布料的柔軟感等。

- **貼圖的種類**：
- **Diffuse Map**：用於設定模型的基礎顏色和紋理，如木材的顏色和紋理、金屬的表面光澤等。
- **Normal Map**：模擬表面的細微起伏，讓模型看起來更具深度和細節，而不增加多邊形數量。
- **Specular Map**：控制物體表面反光的程度，用於決定材料的光澤感，例如金屬和玻璃表面的光反射效果。

### 5. **3D模型的材質和貼圖處理，增加產品的真實感**

貼圖的應用直接影響模型的視覺效果。對於產品設計來說，貼圖能夠幫助設計師模擬真實材料的質感，這對於展示和宣傳非常重要。設計師可以根據以下步驟應用貼圖：

1. **選擇合適的材質貼圖**：根據產品的設計需求，選擇與實際材料匹配的貼圖。如木製家具需要使用帶有木紋的貼圖，而汽車零件則需選擇金屬材質的貼圖。
2. **應用貼圖和紋理**：使用Blender等軟件，將Diffuse、Normal和Specular貼圖應用到模型的不同部分。這可以顯著提高產品的真實感，使模型看起來更具層次感。
3. **調整貼圖參數**：為了達到最佳效果，設計師需要根據模型的需求調整貼圖的大小、位置和強度。例如，調整金屬貼圖的反光強度，使輪圈表面看起來更具光澤感，或將木紋貼圖適當縮放以符合椅子表面的紋理。

### 小結

細節優化和貼圖處理是產品設計中不可或缺的步驟，它能夠讓AI生成的模型更加精緻和真實。設計師不僅能通過3D建模軟件對AI生成的模型進行自定化調整，還可以通過貼圖和材質的應用，將模型提升到更高的視覺水平，適合展示、宣傳甚至3D打印製作。

[線上範例](https://sketchfab.com/3d-models/office--desk-with--leapt-06dd8008fff942b088f04cb08a2513c7)

## 未來展望：生成式AI與虛擬現實結合

### 1. **生成式AI在虛擬現實 (VR) 和增強現實 (AR) 中的應用**

生成式AI在VR和AR中有巨大的潛力，特別是在3D產品設計和虛擬體驗的創建方面。這些技術不僅能夠幫助設計師快速生成產品模型，還能通過虛擬和增強現實的展示方式讓設計成果更直觀和交互性更強。

- **在VR中的應用**：
- **沉浸式產品設計與體驗**：設計師可以將AI生成的3D模型導入到虛擬現實中，讓使用者在虛擬環境中進行沉浸式產品展示。這不僅能提升產品展示效果，還能讓設計師模擬不同環境下的產品使用情況。例如，將家具放入虛擬的家居空間中，或讓汽車零件在虛擬的車輛組裝場景中進行展示。
- **協作式設計**：虛擬現實還允許設計師和客戶或團隊成員在虛擬空間中進行協作設計，直接對3D模型進行討論和修改，提升溝通效率。
- **在AR中的應用**：
- **實時產品展示與設置**：增強現實技術可以將AI生成的3D產品模型投影到真實世界中，讓使用者在真實環境中預覽產品的外觀和尺寸。例如，消費者可以使用手機或平板看到虛擬家具如何適應自己的房間，或將汽車零件放入實際車輛中進行虛擬試裝。
- **虛擬試穿與產品試用**：對於消費品，如服裝、家具或電子設備，增強現實可以提供虛擬試穿或產品使用體驗，讓消費者在購買前了解產品的實際效果。

### 2. **展望生成式AI技術在VR/AR中的潛力，如何進一步改進3D產品設計**

- **個性化設計的實現**：生成式AI結合VR和AR技術，可以幫助設計師快速生成定制化的產品設計，並立即在虛擬或增強現實中進行測試和優化。這種技術可以縮短產品設計週期，並使設計更貼近市場需求。
- **虛擬樣品的展示**：隨著AI技術和AR/VR技術的發展，設計師將能夠在不製作實物樣品的情況下，通過虛擬樣品展示來測試和評估產品設計的可行性，從而節省生產成本。
- **更高的精細度與真實感**：AI生成的3D模型將越來越精細，並在VR/AR環境中呈現出更接近實物的質感和功能性。這可以讓設計師在虛擬環境中進行更準確的產品測試，例如驗證產品的強度、材質和用戶交互感受等。
- **互動式設計流程**：設計師和用戶可以通過虛擬和增強現實技術進行互動式設計，AI生成的模型不僅是靜態的，還能具備功能性的互動，例如讓用戶在虛擬世界中操作產品，測試其使用感。

## 總結
:::info
• 關鍵字的重要性及其對生成結果的影響。
• 生成式AI的技術原理和實際應用。
• 如何在設計過程中結合生成式AI和人類創意，創造出更加優質的產品設計。
:::

## 3D 輔助應用
### 去背功能
[remove.bg](https://www.remove.bg/zh-tw)

### 3D 模型產生應用
[meshy](https://www.meshy.ai/discover)
[tripo3d](https://www.tripo3d.ai/)
[InstantMesh](https://huggingface.co/spaces/TencentARC/InstantMesh)

### 線上模型查看平台
[sketchfab](https://sketchfab.com/feed)

## 產生 3D 商品範例

### 3D 產品提示詞設計
使用 [Microsoft Bing](https://www.bing.com/images/create?toWww=1&redig=47021126F17648DEA82CB9902D8FF671) 進行圖片生成
:::info
產生產品設計的英文提示詞，字數在 400 字以內
必須包含 3D rendering, full body.multiple views , no background and no text , center, 8k, high quality 等關鍵字用詞，目標為產生「產品」六視圖或三視圖
`-----------`
產品設計需求：產品名稱為旅行音樂小矮人，商品設計為一個簡單的音樂矮人，玩家可以跟換小矮人身上的配件，讓小矮人可以進行不同的音樂與移動，這邊需要先繪製一個音樂小矮人作為基底，並在設計上方便拆解樂器
`-----------`
請你仔細思考一下，在回答我
提示詞：
:::


:::info
產品設計大師，請產生產品設計的 DALL-E 3 Model 英文提示詞，字數在 400 字以內必須包含 3D rendering, full body, no background and no text , center, 8k, high quality, single object 等關鍵字用詞，目標為產生「產品」3D 展示圖
`-----------`
產品設計需求：產品名稱為旅行音樂小矮人，商品設計為一個簡單的音樂矮人，玩家可以跟換小矮人身上的配件，讓小矮人可以進行不同的音樂與移動，這邊需要先繪製一個音樂小矮人作為基底，並在設計上方便拆解樂器
`-----------`
請你仔細思考一下，在回答我
提示詞：
:::

[線上去背工具 remove bg](https://www.remove.bg/zh-tw/upload)


[線上 2D 轉 3D 服務](https://huggingface.co/spaces/TencentARC/InstantMesh)


<br/>

# 關鍵字平台介紹
在設計和製作虛擬網紅的過程中,使用合適的關鍵字可以幫助我們更好地定位角色,並生成符合預期的內容。以下是一些提供關鍵字庫和學習資源的平台:

1. [PromptHero](https://prompthero.com/)
PromptHero是一個提供AI生成內容的關鍵字庫的平台。它收錄了大量針對不同場景和需求的關鍵字範例,如圖像生成、文本生成、語音合成等。使用者可以直接使用這些關鍵字,也可以在此基礎上進行修改和優化,以生成更加符合需求的內容。
2. [AI for Education](https://www.aiforeducation.io/prompt-library)
AI for Education是一個專注於教育領域的AI應用平台。它提供了一個豐富的關鍵字庫,主要用於生成教學內容、學習資料和互動練習等。這些關鍵字可以幫助教師和教育工作者快速建立個性化的教學內容,提高教學效率和品質。對於虛擬網紅在教育領域的應用,這個平台提供了很好的參考和啟發。
3. [Prompt Library](https://promptlibrary.org/)
Prompt Library是一個開源的關鍵字庫,由社群成員共同維護和更新。它涵蓋了多個領域和應用場景,如創意寫作、代碼生成、圖像處理等。使用者可以瀏覽和搜尋現有的關鍵字,也可以貢獻自己的關鍵字到庫中,與其他使用者分享。對於虛擬網紅的設計和製作,這個平台提供了豐富多樣的關鍵字參考,可以激發更多創意和靈感。
4. [NovelAITag](https://thereisnospon.github.io/NovelAiTag/)
NovelAI Tag是一個專門為NovelAI平台設計的關鍵字庫。NovelAI是一個流行的AI圖像生成平台,使用者可以通過輸入關鍵字來生成各種風格的圖像。NovelAI Tag收錄了大量針對NovelAI的關鍵字,涵蓋了人物、場景、風格等多個次元。對於使用NovelAI進行虛擬網紅設計的創作者來說,這個關鍵字庫提供了豐富的參考和靈感,可以幫助他們更快、更準確地生成符合預期的虛擬形象。
5. [Learn Prompting](https://learnprompting.org/)
Learn Prompting是一個專門學習如何設計和優化AI生成內容關鍵字的網站。它提供了一系列的教程、指南和最佳實踐,幫助使用者掌握關鍵字設計的技巧和方法。此外,網站還有一個社群論壇,使用者可以在這裡分享自己的經驗,討論問題,互相學習。對於虛擬網紅的建立者來說,這個網站是一個很好的學習資源,可以幫助他們提高關鍵字設計的能力,創造出更加出色的虛擬網紅。

# AI 繪圖平台介紹

https://leonardo.ai/
https://designs.ai/tw
https://www.bing.com/images/create?FORM=GENILP
https://tensor.art/
https://www.krea.ai/home
https://llamagen.ai/zh-TW
https://www.dzine.ai/