企業形象網站設計
企業形象網站設計
透過重新設計為企業打造全新形象，提升品牌識別度
透過重新設計為企業打造全新形象，提升品牌識別度
視覺介面設計 & 操作流程規劃
視覺介面設計 & 操作流程規劃
企業形象網站設計
透過重新設計為企業打造全新形象，提升品牌識別度
視覺介面設計 & 操作流程規劃
專案概覽
專案概覽
專案概覽
企業介紹
企業介紹
產業別為科技業公司，目標是專注於物聯網解決方案，協助客戶實現數位轉型，公司致力於打造靈活的物聯網與雲端應用，開發IoT模組及工具來實現客戶在智慧製造、智慧建築、智慧家庭等領域的應用，在市場中建立創新商業價值。
產業別為科技業公司，目標是專注於物聯網解決方案，協助客戶實現數位轉型，公司致力於打造靈活的物聯網與雲端應用，開發IoT模組及工具來實現客戶在智慧製造、智慧建築、智慧家庭等領域的應用，在市場中建立創新商業價值。
團隊成員
團隊成員
專案經理、行銷企劃、UIUX設計師
專案經理、行銷企劃、UIUX設計師
我的角色與職責
我的角色與職責
擔任 UIUX設計師，負責設計網站視覺與流程規劃
擔任 UIUX設計師，負責設計網站視覺與流程規劃
當前問題與目標
當前問題
當前問題
公司作為專注於物聯網解決方案的科技新創公司，然而現有的網站在品牌形象與體驗上，未能有效傳達企業專業與核心價值。
公司作為專注於物聯網解決方案的科技新創公司，然而現有的網站在品牌形象與體驗上，未能有效傳達企業專業與核心價值。
🤔 品牌網站調性模糊
🤔 品牌網站調性模糊
．整體風格過於單調，無法傳遞公司作為「物聯網技術供應商」專業與創新感。
．品牌辨識度不夠強烈，圖案彼此之間的風格也有所落差。
．過多留白缺乏視覺焦點，使畫面顯得空曠抓不到重點
．整體風格過於單調，無法傳遞公司作為「物聯網技術供應商」專業與創新感。
．品牌辨識度不夠強烈，圖案彼此之間的風格也有所落差。
．過多留白缺乏視覺焦點，使畫面顯得空曠抓不到重點
🥺 資訊架構薄弱
🥺 資訊架構薄弱
．首頁資訊較為平面，難以快速理解公司的理念與產品
．首頁資訊較為平面，難以快速理解公司的理念與產品
問題定義與任務目標
改版目標
改版目標
．建立科技感與專業的品牌視覺風格：重新定義色彩與圖像風格，搭配流動線條與動態元素，營造科技專業的企業形象。
．建立明確的層級關係：重新規劃首頁與內頁資訊，引導使用者更好的接收資訊。
．建立科技感與專業的品牌視覺風格：重新定義色彩與圖像風格，搭配流動線條與動態元素，營造科技專業的企業形象。
．建立明確的層級關係：重新規劃首頁與內頁資訊，引導使用者更好的接收資訊。
問題定義與任務目標
設計流程
設計流程
設計理念｜視覺展示
設計理念｜視覺展示
設計理念｜視覺展示
重新設計層級架構｜優化瀏覽流程
重新設計層級架構｜優化瀏覽流程
在首頁架構上，內容從
「品牌展現 → 技術實力 → 應用價值 → 產品展示 → 聯繫我們」形成完整架構，讓訪客能逐步理解公司的核心優勢與解決方案。設計上透過動態元素與層次分明的架構，營造專業而沉浸的瀏覽體驗。整體視覺風格以企業LOGO的顏色-藍色作為主色並加入各種深淺變化，運用漸層顏色的組合搭配光流、粒子線條成功營造出 科技、未來的氛圍。
在首頁架構上，內容從
「品牌展現 → 技術實力 → 應用價值 → 產品展示 → 聯繫我們」形成完整架構，讓訪客能逐步理解公司的核心優勢與解決方案。設計上透過動態元素與層次分明的架構，營造專業而沉浸的瀏覽體驗。整體視覺風格以企業LOGO的顏色-藍色作為主色並加入各種深淺變化，運用漸層顏色的組合搭配光流、粒子線條成功營造出 科技、未來的氛圍。
運用動態效果加強視覺體驗
運用動態效果加強視覺體驗
擁有良好的動態設計有助於提升用戶體驗，加強網站的豐富性，也能輔助訪客接收資訊。
擁有良好的動態設計有助於提升用戶體驗，加強網站的豐富性，也能輔助訪客接收資訊。
AI 輔助互動驗證｜加速設計落地
AI 輔助互動驗證｜加速設計落地
在完成視覺設計後，我嘗試將想要的動態效果與互動邏輯描述給 AI，讓它根據設計稿直接生成可在瀏覽器運行的靜態網站。
這個流程讓我能在短時間內，把想要呈現的效果轉化為真實可互動的版本，在開發發介入之前，可以快速驗證互動流程與操作是否順暢，降低與PM，RD之間的溝通落差。
在完成視覺設計後，我嘗試將想要的動態效果與互動邏輯描述給 AI，讓它根據設計稿直接生成可在瀏覽器運行的靜態網站。
這個流程讓我能在短時間內，把想要呈現的效果轉化為真實可互動的版本，在開發發介入之前，可以快速驗證互動流程與操作是否順暢，降低與PM，RD之間的溝通落差。
瀏覽互動網站
響應式設計
響應式設計
