🎨簡約典雅藝術網頁
指令
依使用者給到的內容做成網頁,網頁風格要求如下:
### 一、視覺風格定位- **藝術化手繪風格**: 採用線條插畫(line art)風格,融合現代數位設計與傳統手繪美學- **配色策略**: 以中性色(米白/淺灰)為基底,搭配深灰色主文,使用橙紅色(accent color)作為視覺焦點色- - ** 品牌調性群體有溫度、精緻、藝術佈局** 。右側: - - 客製化手繪插畫,佔據50%視覺空間- - 插畫風格統一:線條勾勒+局部色彩點綴- - 插畫內容與品牌故事深度契合- - **導航列設計** - - 極化頂部導航,固定定位- - Logo + 2-3個主要選單- - 右側透明圖示, 右側圖集 (22**1) - 微妙內容卡片網格佈局(3-4列響應式) - - 每個卡片包含: - - 標題(Heading 3, 32-40px) - - 描述文案(2-3行,16-18px行高1.6) - - 配套手繪插畫(與主視覺風格一致) - - 淺層背景(#F5F3F12 -p -p000) -p -p-1 - ### 三、配圖系統規格**插畫創作指南** 1. 2. **線條處理**: - - 使用1-2px不規則手繪線條,模擬真實繪畫質感- - 保持線條流暢但帶有人工感,避免過於機械- 3. 4. **色彩運用**: - - 80%灰色背景採用漸變米色(#FDFBF7 → #F5F1EB) - 5. 6. **場景構圖**: - - 城市場景:融合地標建築+日常生活場景- - 俯瞰視角或等距視角(isometric) - - 加入人物小品增加敘事性和親切感- 7. 8. ** 視野密度** -景### 四、字體系統- - **Display Font**(標題): Serif字體,厚重有力(如Freight Display, Tiempos) - - **Body Font**(正文): Sans-serif,易讀性強(如Inter, Manrope) - - **字號比例Regular(400) / Medium(500) / Bold(700) - ### 五、交互細節- - **微動效**: 卡片懸停上浮4-8px,過渡時間300-400ms - - **加載狀態**: 使用骨架屏幕,保持品牌調性- - ** 768-1439px - - Mobile: 375-767px - - ### 六、設計輸出要求每次設計輸出時應包含: 1. 2. 清晰的視覺層級(透過尺寸/顏色/留白實現) 3. 4. prop. 8. 充足的呼吸空間(section間距≥120px) 9. 10. 明確的使用者行動路徑11. --- **設計哲學**: 用藝術化的視覺語言,傳遞品牌的獨特性和溫度感。每一個像素都服務於講述故事,而非單純的功能展示。設計應該讓使用者感受到"這是為懂生活的人準備的",而非冰冷的商業產品。
網頁插圖皆由nano banana pro生成
描述
推薦自
nene@YouMind
為什麼我們推薦這個技能
這項技能能將您的內容轉化為簡約典雅的藝術手繪風格網頁,完美融合現代數位設計與傳統美學。它能根據您的需求,智慧生成客製化插畫,並運用精緻的色彩與字體系統,打造充滿藝術感與品牌溫度的網頁,讓您的產品或服務在視覺上脫穎而出。
將內容轉化為藝術化的手繪風格網頁。精緻的線條插畫與配色,讓你的資訊充滿溫度與品味。
相關技能
查看全部可探索式解說頁面建置器
報告是解釋。頁面讓人們自己去發掘。 YouMind 已經能建立網頁。Explorable Explainer 決定要建立什麼——它把一份研究、一份資料集或一個主題,變成單一互動頁面,承襲新聞圖表與可探索式解說的傳統:捲動驅動的敘事、真實的圖表、可以操作的控件、可以查證的來源。 它先規劃,再寫程式。你首先批准建置計畫:頁面要回答的那一個問題、那個揭示時刻——讀者應該感到「哦!」的瞬間——五到八個區段的捲動主軸、兩到四個互動(每個都說明讀者能從操作中學到什麼),以及一份資料契約,列出每個數字及其來源。 接著它建立一個單一、自包含的 HTML 檔案,無需建置步驟。語意化標記。所有數字集中在檔案頂部一個可編輯的 DATA 常數。捲動揭示在手機上不會出錯。每個控件都是真正可用鍵盤操作的表單元素,並以即時文字描述目前值。 無障礙是內建而非事後添加:4.5:1 對比度、可見的焦點框、處處有替代文字、不單靠顏色傳達意義、尊重減少動畫設定、從 360px 起皆為響應式。 交付之前,它會執行五點自我審查並誠實回報結果:揭示點是否真的奏效、關閉 JavaScript 後頁面是否仍可閱讀、Tab 順序是否合理、每個數字是否可追溯、是否有讀者會想停止的動畫。 它有兩條絕不打破的規則:絕不為了讓圖表好看而編造資料,而且當你的數字與草稿互相矛盾時,它會直接告訴你。 適合研究人員、分析師、記者、教育工作者、獨立創業者與顧問——他們希望自己的作品被探索,而不是被匆匆略過。
網頁柔光日間 浮世風格網頁
柔光日間風格的網頁設計系統:淡天藍畫布(#ebf5ff)、字重固定 500 的超大展示字(響應式最高 148px)、32px 圓角卡片 + 9999px 藥丸、近黑 #181d27 實心 CTA、粉彩色塊與漂浮 3D 黏土質插畫。深度只靠畫布到卡片的色階位移,內容卡片零陰影。適用於「柔光日間風格」「3D 插畫登陸頁」「淡藍畫布」「圓角卡片風」「SaaS 官網」「Linear/Framer 風格」等需求,內建無障礙與響應式約束。
網頁Fashion Creative Design 風格網頁
時尚編輯式海報風格的網頁設計系統:暖奶油紙質畫布(#fffef7)、300 字重超大標題(64–84px)、全出血攝影、零陰影、卡片直角 + 按鈕 1440px 藥丸圓角。 適用於「時尚設計風格」「雜誌排版」「海報風」「藝術畫冊網頁」「工作室作品集」「畫廊頁面」等需求,可將任意內容改寫為高級時裝編輯風頁面。
🎨簡約典雅藝術網頁
指令
依使用者給到的內容做成網頁,網頁風格要求如下:
### 一、視覺風格定位- **藝術化手繪風格**: 採用線條插畫(line art)風格,融合現代數位設計與傳統手繪美學- **配色策略**: 以中性色(米白/淺灰)為基底,搭配深灰色主文,使用橙紅色(accent color)作為視覺焦點色- - ** 品牌調性群體有溫度、精緻、藝術佈局** 。右側: - - 客製化手繪插畫,佔據50%視覺空間- - 插畫風格統一:線條勾勒+局部色彩點綴- - 插畫內容與品牌故事深度契合- - **導航列設計** - - 極化頂部導航,固定定位- - Logo + 2-3個主要選單- - 右側透明圖示, 右側圖集 (22**1) - 微妙內容卡片網格佈局(3-4列響應式) - - 每個卡片包含: - - 標題(Heading 3, 32-40px) - - 描述文案(2-3行,16-18px行高1.6) - - 配套手繪插畫(與主視覺風格一致) - - 淺層背景(#F5F3F12 -p -p000) -p -p-1 - ### 三、配圖系統規格**插畫創作指南** 1. 2. **線條處理**: - - 使用1-2px不規則手繪線條,模擬真實繪畫質感- - 保持線條流暢但帶有人工感,避免過於機械- 3. 4. **色彩運用**: - - 80%灰色背景採用漸變米色(#FDFBF7 → #F5F1EB) - 5. 6. **場景構圖**: - - 城市場景:融合地標建築+日常生活場景- - 俯瞰視角或等距視角(isometric) - - 加入人物小品增加敘事性和親切感- 7. 8. ** 視野密度** -景### 四、字體系統- - **Display Font**(標題): Serif字體,厚重有力(如Freight Display, Tiempos) - - **Body Font**(正文): Sans-serif,易讀性強(如Inter, Manrope) - - **字號比例Regular(400) / Medium(500) / Bold(700) - ### 五、交互細節- - **微動效**: 卡片懸停上浮4-8px,過渡時間300-400ms - - **加載狀態**: 使用骨架屏幕,保持品牌調性- - ** 768-1439px - - Mobile: 375-767px - - ### 六、設計輸出要求每次設計輸出時應包含: 1. 2. 清晰的視覺層級(透過尺寸/顏色/留白實現) 3. 4. prop. 8. 充足的呼吸空間(section間距≥120px) 9. 10. 明確的使用者行動路徑11. --- **設計哲學**: 用藝術化的視覺語言,傳遞品牌的獨特性和溫度感。每一個像素都服務於講述故事,而非單純的功能展示。設計應該讓使用者感受到"這是為懂生活的人準備的",而非冰冷的商業產品。
網頁插圖皆由nano banana pro生成
描述
推薦自
nene@YouMind
為什麼我們推薦這個技能
這項技能能將您的內容轉化為簡約典雅的藝術手繪風格網頁,完美融合現代數位設計與傳統美學。它能根據您的需求,智慧生成客製化插畫,並運用精緻的色彩與字體系統,打造充滿藝術感與品牌溫度的網頁,讓您的產品或服務在視覺上脫穎而出。
將內容轉化為藝術化的手繪風格網頁。精緻的線條插畫與配色,讓你的資訊充滿溫度與品味。
相關技能
查看全部可探索式解說頁面建置器
報告是解釋。頁面讓人們自己去發掘。 YouMind 已經能建立網頁。Explorable Explainer 決定要建立什麼——它把一份研究、一份資料集或一個主題,變成單一互動頁面,承襲新聞圖表與可探索式解說的傳統:捲動驅動的敘事、真實的圖表、可以操作的控件、可以查證的來源。 它先規劃,再寫程式。你首先批准建置計畫:頁面要回答的那一個問題、那個揭示時刻——讀者應該感到「哦!」的瞬間——五到八個區段的捲動主軸、兩到四個互動(每個都說明讀者能從操作中學到什麼),以及一份資料契約,列出每個數字及其來源。 接著它建立一個單一、自包含的 HTML 檔案,無需建置步驟。語意化標記。所有數字集中在檔案頂部一個可編輯的 DATA 常數。捲動揭示在手機上不會出錯。每個控件都是真正可用鍵盤操作的表單元素,並以即時文字描述目前值。 無障礙是內建而非事後添加:4.5:1 對比度、可見的焦點框、處處有替代文字、不單靠顏色傳達意義、尊重減少動畫設定、從 360px 起皆為響應式。 交付之前,它會執行五點自我審查並誠實回報結果:揭示點是否真的奏效、關閉 JavaScript 後頁面是否仍可閱讀、Tab 順序是否合理、每個數字是否可追溯、是否有讀者會想停止的動畫。 它有兩條絕不打破的規則:絕不為了讓圖表好看而編造資料,而且當你的數字與草稿互相矛盾時,它會直接告訴你。 適合研究人員、分析師、記者、教育工作者、獨立創業者與顧問——他們希望自己的作品被探索,而不是被匆匆略過。
網頁柔光日間 浮世風格網頁
柔光日間風格的網頁設計系統:淡天藍畫布(#ebf5ff)、字重固定 500 的超大展示字(響應式最高 148px)、32px 圓角卡片 + 9999px 藥丸、近黑 #181d27 實心 CTA、粉彩色塊與漂浮 3D 黏土質插畫。深度只靠畫布到卡片的色階位移,內容卡片零陰影。適用於「柔光日間風格」「3D 插畫登陸頁」「淡藍畫布」「圓角卡片風」「SaaS 官網」「Linear/Framer 風格」等需求,內建無障礙與響應式約束。
網頁Fashion Creative Design 風格網頁
時尚編輯式海報風格的網頁設計系統:暖奶油紙質畫布(#fffef7)、300 字重超大標題(64–84px)、全出血攝影、零陰影、卡片直角 + 按鈕 1440px 藥丸圓角。 適用於「時尚設計風格」「雜誌排版」「海報風」「藝術畫冊網頁」「工作室作品集」「畫廊頁面」等需求,可將任意內容改寫為高級時裝編輯風頁面。
發現下一個適合你的技能
繼續探索更多精選 AI 技能,用於研究、創作和日常工作。