Category: Front-End

設計時常聽、看到的「親密性」、「對比」、「視覺層級」、「字體排印」，其實不在同一個層次。有些是講人眼的運作方式，有些則是設計師歸納出的經驗，也有的是要達成的結果或專門學科。這篇內容，我把它們分成三層來討論： 一、知覺定律：格式塔原則（Gestalt Principles） 格式塔原則（Gestalt Principles）（又譯完形原則、格式塔心理學），為 20 世紀初由德國心理學家韋特海默（Max Wertheimer）、考夫卡（Kurt Koffka）、柯勒（Wolfgang Köhler）提出，研究「人怎麼把零散的東西看成一個整體」。它描述的是大腦的運作方式，設計師無法違反，只能利用。…

點我前往 Figma 一、導覽與結構類 二、彈出與覆蓋類 三、內容展示類 四、操作與輸入類 五、狀態與標示類

黑暗模式（Dark Patterns，近年也稱 Deceptive Patterns）是指故意設計來誘導使用者做出對自己不利的決定的介面，例如不小心訂閱、多付錢、分享了不想分享的個資。這個詞由 UX 設計師 Harry Brignull 在 2010…

這篇接續 UIUX – UX法則，再補充八條也很常被引用的法則。它們大多來自認知心理學與行為經濟學，重點不在「介面長怎樣」，而在「人怎麼感受、怎麼記憶、為什麼想完成」。 一、時間與回應 杜赫提門檻（Doherty Threshold） 使用者會維持專注、願意一直操作下去的時間只能維持在 400 毫秒內；只要超過這個時間，注意力就會開始飄走。這是…

點我前往 Figma UI 策略（UI Strategies）談的是：畫面在「等資料、寫入、失敗、衝突」時要怎麼表現。跟元件名稱（Button、Modal）不同，這篇文章主要着重在「行為與時機」。 一、寫入回饋策略（Optimistic / Pessimistic UI） Optimistic…

UX 法則（UX Laws / Principles）是根據人類心理學與行為習慣歸納出的設計規律，幫助設計師在開發數位產品時，提供合乎邏輯的判斷依據，而不只是主觀討論「好不好看」。 以下為最核心的 UX 常見法則與設計原則： 核心 UX…

一個專案要寫 API 端點有非常多種方式，而商智中心前端群使用的是 Axios ，一個基於 Promise 的 JavaScript 網路請求庫（HTTP Client），可以用在瀏覽器和…

前端 將以下程式碼貼上 app/ai-chat/page.tsx 後端 使用server action 架構，將以下程式碼貼上app/actions/aiChatActions.ts 環境變數設定 將 NVIDIA…

點我前往 Figma 一、導覽與結構類 (Navigation & Layout) Navbar（導覽列） 位於頁面頂端或側邊，包含網站主要連結（Logo、選單、搜尋、登入）。是使用者定位與跳轉的核心。 Sidebar（側邊欄） 垂直排列於畫面左側或右側的導覽區塊，常見於後台管理系統與文件網站。…

寫一個文件關於，useState 和UseEffect，不管是教學這兩個hook如何使用又或者是用這兩個hook寫了個小專題的專題文件都可以! (建議以Hack MD完成，練習Markdown語法) 方案 A：教學文件 不要只是說明和解釋，要能「用自己的話把複雜觀念講清楚」。 【作業目標】 請撰寫一篇技術教學文件（格式可為 Markdown,…