
開發手機APP,UI介面設計也是非常重要的一環
生活在 21 世紀的我們,數位科技已經是我們日常生活不可分割的一部分。最能代表 2022 人類日常的描述就是人手一隻市佔率高達九成的智慧型手機了。在這個時代要傳達你產品與服務的精神,就不能不想到手機這個媒介,而在手機上可以做到最好體驗的,就是 App(手機應用程式),而 App 第一眼會讓人看見的,就是App操作介面的 UI 設計。 常見的開發 App 的流程 製作一款 App 的開發流程可以簡易的濃縮成以下的九步驟: 產品概念 → 2. 市場調研 → 3. 體驗及設計規劃 → 4. 介面製作 → 5. 技術開發 → 6. QA(產品測試)→ 7. 修改與調整 → 8. 產品上架 → 9. 持續的維護與更新產品 而這次要提及的是第四步驟的「介面設計」,也就是 UI(User Interface)。 App開發中的UI介面設計是什麼? 廣義的介面設計(User Interface, UI)指的是用來互動的產品介面, 包含了所有你在操作流程中會互動的實際畫面、Logo、Layout、色彩、文字、icon、插圖、動畫以及 Prototype(可操作模型) 等,以及綜合這些元件所傳達出的產品調性。就像平面包裝與廣告業會有視覺傳達設計,UI 就是在數位載體服務上傳達公司形象,創造感受性的重要角色與階段。 那麼App中的UI設計是怎麼工作的? 開發App的UI設計上,設計師通常會根據產品想要傳達的感受以及形象,建立一套 UI Guideline 系統,包括 Logo 使用的情境與方式、畫面元件以及元件應用畫面的方式、動畫細節等。然後將 UX 設計師做出的 Wireframe 作轉換,把邏輯性的元件們結合 Guideline,變成完整的體系,延伸在 App 中的每個角落,變成使用者打開 App 時看見的每個畫面跟細節。 更細節的 UI 會把偏向視覺性的 Logo、插圖、動畫切分成視覺設計,而操作畫面、Layout、色彩、文字、icon 則分在介面設計的範疇。實務上這些工作可以由一位設計師全權執行,也可以由團隊執行。在有限時間的情形下,後者可以做到相對精緻的呈現效果,在執行時可以針對自己的資源與需求去做安排考慮。 在設計App介面時需要注意的小地方 在製作 UI 時,務必要定義好 UI Guideline,才能好好確保每個畫面都像是同一個產品,不少市面上的產品會讓人在操作時覺得每