我們一起看過了在正式進入繪製之前的四個階段 ( IA 資訊架構 / Functional Map 功能地圖 / Logic Flow 邏輯流程 / Wireframe 線框圖稿 )，每個環節都有很多可以討論、加深的議題，以下是目前注意到的議題部分。

本篇重點

1. 資訊架構的三大要素和三大觀點如何使用 ?
2. IA 中，UI 設計師參與歸納 User Story 的時機點是 ?
3. 內容面相要考量的點是什麼 ?
4. IA 四大系統如何想像 ?
5. 功能地圖與 UI Flow 的差別是什麼 ?
6. 使用線框稿跟利害關係人溝通要注意 ?

資訊架構 ( IA ) 相關

( 【Day 02】設計流程 (一)：IA 資訊架構 )

Q1. 資訊架構的三大要素和三大觀點如何使用 ?

在思考 "使用者"、"內容"、"情境" 三大要素時，我們可以將自己帶入三種角色，"使用者"、"資訊提供者" 和 "資訊系統"，去分類資訊，討論考量的點是什麼。
情境的部分，可以說是建構系統時的背景脈絡，通常在資訊架構的前置作業中，就要去發掘與釐清，避免迷失搞錯方向，例如：

• 環境問題 ( 市場環境、競爭對手；商業目標、產品策略、營運資源、用戶行為；利害關係人、技術限制、流量策略等 )

Q2. IA 中，UI 設計師使用歸納 User Story 的時機點是為何 ?

釐清眾多環境問題後，進行 IA 設計時，會探求要解決的問題，接著分析解決問題的流程和思考相對應會產生的資訊流。
舉例：

• 幫速食業者規劃排隊預約 ( 使用者行為 ) 的自助服務機方案，可能會先分析、拆解速食業者處理客戶排隊預約的流程 ( 此時就會用上用戶旅程地圖、使用者故事對照等 )
• 假設經分析，流程有四個步驟，再根據每個步驟具體要完成的任務 ( 使用者任務 )，如第三個步驟，消費者想要被簡訊通知提醒 ( 使用者故事 )。

Q3. 內容面相要考量的點是什麼 ?

• 釐清內容提供的形式、來源
• 如何維持內容的品質
  思考系統中資訊提供的形式，建立好規範與格式，才能在互動介面上提供給使用者良好的呈現，以及內容品質。

Q4. IA 四大系統，可以再多說明點嗎 ?

核心概念有分類、標籤命名、安排關聯

• 組織系統：當內容量龐大時，善用多面向的分類方式，讓內容更容易被取得。
• 標示系統：透過使用者研究了解消費者會用的語言，進而命名標籤，可以協助使用者在查找內容時更有效率。
• 搜尋系統：關聯設計，有階層性，讓使用者得以選擇不同面向的內容，再依據面向 (條件) 搜尋內容。比如一般仲介服務的介面，可以選擇從類型、日期、熱門度等去排序或搜尋，讓使用者找尋自己想要的資訊。
• 導航系統：作為資訊空間的指引，可以問自己以下問題
  • 現在在哪 ?
  • 我的目標在哪 ?
  • 該怎麼移動 ?
  • 附近有什麼相關的或有趣的 ?

功能地圖 ( Functional Map ) 與介面流程圖 ( UI Flow ) 相關

( 【Day 03】設計流程 (二)：Functional Map 功能地圖 )
( 【Day 04】設計流程 (三)：Logic Flow 操作邏輯流程 )

Q5. 功能地圖與 UI Flow 的差別是什麼 ?

• 功能地圖主要是將使用者需求，轉變成你的規格與功能 !
• UI Flow 則是重視操作動線，頁面的數量與頁面之間的關係

線框圖稿 ( Wireframe ) 相關

( 【Day 05】設計流程 (四)：Wireframe 線框圖稿 )

Q6. 使用線框稿跟利害關係人溝通要注意 ?

專案中涉入程度不高的利害關係人 ( 如客戶或非技術領域的主管等 )，在觀看線框稿的時候，可能在心中會產生疑問或混淆，例如：這是最終設計嗎 ? 看起來很醜 ? 有需要做這個嗎 ? 我希望顏色和邊框識別的樣子 ? ...等。
處理這樣的情況時，更需要自己釐清線框稿的目的與概念，才能建立有效的溝通。
記得! Wireframe 的作用是技術規格的溝通，花時間在挑選情境圖片或處理視覺元素，都是浪費時間!

好! 下一篇繼續前進，一起瞭解設計流程吧 : )