趨勢科技 UI 設計實習經驗分享
本文將以一個曾擔任一人設計、一路自學 UI/UX 的新手設計師的視角，分享在趨勢擔任 UID （User Interface Design）實習生的觀察學習，希望能提供未來想進入趨勢實習或對 UI/UX 設計有興趣的朋友參考。
本文架構1.趨勢科技簡介
2.實習計劃簡介
3.趨勢使用者體驗設計團隊—HIE部門簡介
4.專案簡介與心得
5.結語
1. 趨勢科技簡介
趨勢主要提供個人與企業的資安解決方案，常見的防毒軟體就是其中一類。雖然由於產品性質關係，相較於 Line、Yahoo 這類產品生活化的公司較不為人熟悉，但趨勢在 UI/UX 業界其實相當有份量。除了是亞洲最大的純軟公司外，也是少數將研發總部設立於台灣的跨國企業。因此我認為是在台灣從事 UI/UX 設計數一數二的優質環境。
詳細介紹可以參考 UX 四神湯 Sabrina 寫的文章：
2. 實習計畫簡介
為兩個月左右的暑期實習，計劃內容可分為以下三類：
- 專案：基本上每位實習生的最終目標都是完成一至兩個專案。以 UID 來說，專案性質可能是提出一個 Design concept 或是執行 Real project，這次被分配到是屬於 Real project。
- Mentor制度：每位實習生都有一名 Mentor，會在專案執行時給予指導與建議。像我的 Mentor 每天至少會跟我 Review 一次（雖然她真的超級忙，超感謝她🥺🥺），這也是我認為在實習計劃幫助我成長最多的部分。
- 訓練課程：少部分的時間會參與訓練課程，如敏捷式（Agile）開發流程介紹、DISC 人格測驗、職涯規劃分享等等。也有部分偏技術的課程，有興趣也可以挑戰去聽一下XD。
3. HIE部門簡介
HIE（Human Interface Engineering）是趨勢負責打造使用者體驗的部門，其中又依使用者類型分為大型企業、中小型企業、一般消費者三個 Team，而每個 Team 的成員依照職能則可劃分為以下五種職位：
以上是我依照對於所在的中小企業team各個角色職能了解的粗略分類。趨勢在使用者體驗相關職位相較於多數台灣公司分工較細。例如某些公司會將UID（User Interface Designer）與 VD（Visual Designer）的工作綁為一個職位，一人設計（除上圖 Front-end 以外全包）的情況也不在少數。
也由於多數人熟悉的 UI/UX 相關職缺都是 UID 加上 VD，申請實習時千萬不要把兩個職位搞混（敝人我就是😅），這兩者主要的差異在於 UID 比較偏向使用流程與頁面架構的整體規劃，VD 則較偏向頁面元件視覺上的調整，視情況也會需要製作插圖等。
當然，這部分不是這麼的絕對，也會依照當前專案需求以及實習生的學習目標等所調整。
4. 專案簡介與心得
專案簡介
我在實習期間負責的是兩階段驗證（2-step Verification）的使用體驗優化。設計範圍包括兩階段驗證申請與登入流程，以及管理介面。
而在向利害關係人正式提案前，所經過的專案流程大略如下：
在背景研究階段，包含釐清目前趨勢提供的兩階段驗證解決方案的現況及針對有兩階段驗證的各家服務進行桌面研究。
設計階段，如上圖所示會歷經多次版本迭代，主要是以設計會議（Peer review）中收集到的反饋進行迭代。每次設計會議的參與者皆有所不同，如UX Researcher、Technical Writer、及其他 UID。
接下來會就各階段所學習到的設計心法逐一與大家分享。
背景研究階段
對現況夠了解 才能提出可行的解決方案
相信大家在動手設計前都會先了解現況，但怎樣才算「了解現況」呢？
我自己原先的做法是先把兩階段驗證的使用流程都走過一遍，然後把自己認為可以優化的點記錄下來。但後來我的 Mentor 提醒我，了解目前解決方案過往的設計歷程也很重要。
設計師可以藉此了解過去曾做過什麼考量以及會有什麼設計限制，避免提出的方案不適用而做白工。當然，這些資訊不一定在一開始交代專案背景時被提到，建議可在有初步想法時就主動向利害關係人提問。可能的情境如下：
設計師：我在做桌面研究的時候發現大部分服務都有XXX功能，我也認為我們應該採用，請問過去有考慮過嗎？
利害關係人：其實過去也有考慮過，但討論之後覺得成本太高就放棄了。
設計師：好的，那看來這個功能目前實作上是不太可行。先定義好研究範圍 再進行桌面研究
一開始進行桌面研究時，我的策略是搜尋「兩階段驗證、雙因子驗證」等關鍵字看會找到什麼，但大部分的資料對於發想解法都沒什麼幫助。當時 Mentor 給我的建議是，讓自己的研究結果能試圖回答下列的問題：
1.有哪幾種主流的做法？
2.這些做法各自的優缺點為何？
3.最後可能會採用哪種做法，原因為何？像這樣高層次的研究問題，基本上應該能夠應用在有許多既有範例可考的設計上。但無論是針對哪種設計問題進行的桌面研究，先定義好研究範圍，才能有效率地取得有用的資料。
設計階段
設計介面前 先善用 Use case 與 Flow Chart 進行規劃
在進入趨勢實習前，我原先的設計流程是畫完 Sitemap 後就直接進入設計階段。在 Behance、Dribble 等平台找設計範例後，把自己認為不錯的概念拼拼湊湊放進介面設計中。
如果有人跟我的作法雷同的話應該會遇到類似的狀況：
設計師：在這個 App 裡加入送好友禮物的功能好了...這樣的話要再補一個好友管理頁面（設計完稿後進入開發階段）工程師：我看了你設計的好友管理頁面，找不到刪好友的功能。
設計師：我不小心漏掉了，抱歉！
而為何會發生這樣的狀況，我個人推測是因為這樣的設計流程是看了範例後不斷的嘗試，覺得看起來滿意就完稿。但每個範例背後的整套設計邏輯都不同，東拼西湊的話就不免會漏功能。
針對設計流程的改善，我學習到的作法是列出 Use case 盤點功能，並透過 Flow chart 規劃使用流程，之後才進入介面設計。
首先 Use case 的部分，主要是以使用者的角度將需要囊括的功能列出，至於如何整理這些 Use case 並沒有一定標準，我個人是使用 Excel，範例如下：
我會把先想到的功能列出來（如加好友），之後再延伸發想其他對應的功能（如刪好友與搜尋好友），就這樣一直列到認為所有功能都被囊括為止。後期在設計介面時，就能夠以此檢查是否有漏功能。
列出的項目部份，我並沒有完全依照既有的 Use case 作法，主要是因應我個人工作習慣調整，例如加上分類就能幫助我在後期把不同功能對應到所屬頁面上，User story 則可以幫助我想起為什麼需要這個功能。
至於 Flow Chart 的部分，下文有非常詳細的使用情境與作法分享，有興趣的讀者可以參考：
以使用情境為基礎 定義元素層級
實習期間我在設計兩階段驗證的管理介面時遇到很大的困難，主要是因為頁面上有許多的設定項導致畫面過於雜亂，當時得到的建議是：「先釐清這裡主要的使用情境是什麼，再依此決定哪些功能要收斂或是調整視覺層級。」
以 Wordpress 的編輯器為例，舊版的畫面是將所有功能攤平在頁面上，如文字格式設定及文章發佈設定等。這樣的設計除了造成頁面雜亂以外，也會導致內容編輯區塊過小，使用者常需來回滾動編輯視窗等的易用性問題。
相較於舊版，新版頁面有滿版的編輯空間，文字工具列等也如同 Medium 一般，只有在使用者需要時展開。這樣他們就能專注在使用情境下最主要的任務，也就是編修內容本身。
通常一個頁面會有多個使用情境，在設計上必須以主要的使用情境為主。使用情境基本上都是設計師的假設，而這些假設可能是基於使用者研究、桌面研究、或是常理推斷。
當然，假設本身的對錯與否必須要靠後續蒐集使用者回饋才能得知。但必須先有假設才能夠決定介面元素的視覺層級以及收斂與否，此外，也要確認在所有使用流程中的使用情境都能連貫，否則會造成體驗上的斷點。
5. 結語
在趨勢的這段時間是我學設計成長最多的一段時間。由於過往都是一人設計或自學，不太有機會讓人仔細的審視我的設計。在趨勢許多的設計師都是資歷 5 年以上甚至超過 10 年的前輩，從他們的建議中我看到自己設計中的盲點，也找到未來在進行設計時一套更好的工作模式。
除了專案本身，實習計畫提供的訓練課程也十分紮實有趣，也讓我有機會認識來自不同領域許多厲害的實習生們。學習以外，由於公司十分國際化，跟來自國外的夥伴共事也是很新奇的體驗，每次開會都有種在上英語會話課的感覺XD。
最後我想感謝一路以來都很用心指導我的 Mentor、在設計上給我很多回饋的正職們、以及一起認真一起耍ㄎㄧㄤ的 HIE 實習生們❤️
以上就是我在實習階段的觀察與學習，希望對各位有幫助，關於一些 Design practice 的部份，如果各位有一些不錯的作法也歡迎拋出來分享😊
