填寫完資料準備上傳身分驗證的照片，畫面跳出一行字：「檔案上傳失敗，請稍後再試」。我們通常不確定是檔案太大、格式不對，還是單純網路訊號不好。順手重新整理頁面再試一...
買機票或規劃旅遊行程的頁面，放滿了精美的景點照片、飯店推薦、租車優惠跟免稅品目錄，整個畫面看起來超級豐富。我們一路滑到底部按下確認付款。事後看明細時，剛好發現角...
大家中午點外送的時候，通常會有自己特別喜歡的固定餐點。像是點一份夏威夷拌飯，習慣挑選藜麥、生菜、鮭魚跟蝦卵，淋上橘醋醬，最後還要特別備註不加芹菜跟香菜。 有時候...
幾天前在滑社群的時候，看到一家看起來超好吃的餐廳，順手就按了收藏。今天剛好想找出來貼給朋友，打開 App 點進個人主頁，再點開右上角那三條線。 跳出來的選單裡有...
大家逛網購的時候，商品頁面上的「加入購物車」跟「立即購買」兩個按鈕通常靠得很近。有時候我們只是想先加進購物車，等一下再慢慢挑，手指稍微偏了一點點到「立即購買」，...
多數 App 裡，紅色通常帶著警示的意味，綠色則給人一種可以放心前進的安全感。在某些訂閱制服務的取消頁面中，設計團隊把顏色的配置稍微做了轉換。「確定取消」用上了...
註冊帳號時，整個過程通常會被拆成好幾個步驟。走到第四步時，我們有時會發現第二步的方案類型選錯了。想點上一步修改，這時畫面上剛好沒有返回按鈕。 按下瀏覽器內建的上...
大家網購結帳時，應該都有過類似的經驗。在結帳頁面按下「確認付款」後，畫面剛好沒有跳出轉圈圖示，也沒有顯示「處理中」。 這時候我們通常會以為自己沒按好，很自然地又...
大家打開手機遊戲，想買一點鑽石解鎖新角色時，儲值頁面通常會列出三個選項：「60 鑽 NT$30」、「300 鑽 NT$150」、「680 鑽 NT$299」。我...
大家逛網購或使用 App 時，應該都遇過這種彈出視窗。畫面問你想不想領取專屬折扣碼，底下的按鈕一個寫著「開心領取」，另一個拒絕選項則是寫著「忍痛放棄」或是「狠心...
大家回想一下，逛網購時把稍微高單價的商品（像是猶豫了很久的相機或電子產品）先放進收藏清單的經驗。 過了幾天，下班通勤正在滑手機時，畫面上突然跳出一則推播通知：「...
前言：從設計稿到程式碼 Day 04 討論過設計系統，但一直停在概念階段。 今天要動手了。 「設計系統建立了，但怎麼轉成程式碼？」我看著之前的筆記發愁。 Des...
前兩天我完成了 App 的 UI 初稿，今天想試著將這些設計系統化。這個過程有助於建立一套完整的設計規範，讓後續的設計和開發更有效率，也能確保 App 整體視覺...
在 Day 1，構思了 App 的三大核心功能。有了藍圖，今天的任務就是把它化為實際：和 Gemini 討論出一份具體的規格，再運用 Stitch Design...
隨著科技的進步，虛擬現實（Virtual Reality, VR）與增強現實（Augmented Reality, AR）技術逐漸成為現代科技的前沿技術之一。這...
隨著人工智慧（AI）技術的日新月異，特別是機器學習與深度學習的快速發展，UI設計領域正經歷著一場深刻的革命。AI的引入，不僅僅是對傳統UI設計的補充，更是對其的...
第3章: 設計App介面 認識UI設計工具 在行動應用程式開發中，用戶介面 (UI) 的設計至關重要。它直接影響用戶的操作體驗和對應用程式的第一印象。B4X 提...
客戶：我的需求不多，就一點點...設計師：（已預知接下來無窮盡的...浩瀚宇宙） 多人可同時協同設計的好處？ 讓設計的流程透過協作的方式變得更透明容易，及時性...
進行六角學院開設的 UI 設計入門學習第 25 天，稍微從 wireframe 下一個階段開始來做一些回顧。 【Day 07】設計流程：繪製 Mockup 設計...
本篇重點 原型設計 ( Prototype ) 種類與技巧 原型設計 ( Prototype ) 原型設計是對產品會如何運作的模擬，能在產品正式...
本篇重點： 設計規範製作 切圖 ( Slice ) 的格式與命名 設計標註檔 1、設計規範製作 依內容詳細程度，從精簡到完整分為三種類別：介...
Atomic Design 五大階段：原子 ( Atom ) -> 分子 ( Molecules ) -> 組織 ( Organisms ) -&g...
Atomic Design 五大階段：原子 ( Atom ) -> 分子 ( Molecules ) -> 組織 ( Organisms ) -&g...
Atomic Design 五大階段：原子 ( Atom ) -> 分子 ( Molecules ) -> 組織 ( Organisms ) -&g...
Atomic Design 五大階段：原子 ( Atom ) -> 分子 ( Molecules ) -> 組織 ( Organisms ) -&g...
Atomic Design 五大階段：原子 ( Atom ) -> 分子 ( Molecules ) -> 組織 ( Organisms ) -&g...
Atomic Design 五大階段：原子 ( Atom ) -> 分子 ( Molecules ) -> 組織 ( Organisms ) -&g...
Atomic Design 五大階段：原子 ( Atom ) -> 分子 ( Molecules ) -> 組織 ( Organisms ) -&g...
進行 UI 設計入門學習第 15 天，慢慢的可以透過結構性思維去觀察事情。以下重點回顧感受較深刻的章節： 【Day 01】什麼是 UI 設計 使用者介面，目的...
Atomic Design 五大階段：原子 ( Atom ) -> 分子 ( Molecules ) -> 組織 ( Organisms ) -&g...
Hailey
尚禮
yenyen0318
因田木
Shiva虛碼
tedkuo
iThome鐵人賽
看影片追技術