管理 Management > 產品與專案
feature picture
ThisisEngineering RAEng on Unsplash

專案管理工具推薦!善用「視覺化」溝通,跟客戶、團隊不再雞同鴨講

2021-03-24 大震

讓對方能同理甚至同意你的概念,是專案中常被忽略的風險,很多設計師也常因為這個業障過不去而轉職賣雞排……在特別重視溝通與團隊合作的 UX 產業中更是如此!

「未知」一直以來都是人類最害怕的事物,也因對未知的恐懼,所以我們創造工具,以在野蠻的遠古時代中存活下來並開拓未來。在 UX 顧問行業裡,我們常利用不同類型的視覺化工具,來建立成員、夥伴對專案資訊的認知,同時也作為彼此共識的確認和結果的紀錄。

我將分別透過前期探索、概念發展、設計交付的 3 大階段與 5 大常見問題,與大家分享如何在專案中透過視覺化工具來推展你的設計想法。

此篇文章獻給新手 PM 新之助、有志難伸設計師志男、產品企劃窗口小白,還有最近一直被打搶所以找到這篇文章的你。

前期探索

1. 如何讓團隊清楚專案目標與限制?

身為專案經理,常擔任資訊的匯集與輸出者,如何在最短時間內梳理需求並傳達給團隊是非常重要的技能。如果你常忙起來就腦袋打結,那你一定要試試 Trello

在 Trello中,你可以透過單元主題的方式將各類型的需求或資訊,以列表、卡片方式管理,如常見的「待辦」、「進行中」、「完成」。個別卡片可用標籤顏色(labels)和排序來區別重要性,更可指名負責的團隊成員。此外,善用 Power-Ups 功能來內嵌各種生產力平台,如常用 google drive、Miro、Invision、Zeplin 等,也可讓資訊在同步、維護上更便利。

Project Management Board from Trello Templates.jpg
Project Management Board from Trello Templates

Tips:善用圖片預覽功能,除了能吸引成員的注意,也能讓你的卡片不需要點擊展開就能快速看到重點。

Agile Board from Trello Templates.jpg
Agile Board from Trello Templates

2. 如何說服客戶刪減需求?

你是否也有相同的經驗?因為不斷變更的需求,手中的甘特圖已經不知道是第幾版了……在實際專案中,時程與交付目標常會受到人力資源、技術限制、部門政策等因素千變萬化。當你為了緊急的時程調整資源或刪減交付項目時,就容易忘記專案的初心,導致目標最後失焦,落得設計「爹不疼、娘不愛」。

此時具備高度調整彈性的項目與時程管理工具就顯得特別重要!讓你可以更專注於檢視項目彼此間的影響,而非浪費時間在文件整理上。

因此我推薦 teamgantt 除了一般甘特圖工具都有的功能外,透過圖中的 Avaiability 矩陣 可以明確知道每位團隊成員的工作負荷,再搭配項目間的相依性,可以清楚向長官或客戶說明:「你看!設計師 Deana 快死掉了拉……這 2 天都是一個人當 4 個人用,這功能看來也不是用戶目前最在意的,先別加了吧!」

如果還是想加,那就先加錢吧!如果沒人、又沒錢……那只好有緣再相見吧!

Availability Feature in teamgantt.jpg
Availability Feature in teamgantt
螢幕截圖

概念發展

當專案經理終於搞定預算、時程以及人力時,這時候就是展現設計團隊專業的時候了。

3. 如何讓你辛苦畫出的介面流程更有感?

先講結論:如果溝通重點在於展現頁面流程、狀態檢核、基本互動的確認,
那我會推薦:Overflow > Axure RP > Invision

根據專案經驗,客戶或長官「無感」一直是一個最恐怖的議題……身為設計師的我們,理所當然能理解 Wireframe(線框稿)、GUI(視覺稿)的溝通重點,但客戶或長官卻常秉持著 Seeing is believing 的原則來批判(提供反饋)。常畫完 GUI 又來要求我們調整原本 Wireframe 就應該定義的基本互動。由於長官們都是看大方向且有黑白色盲,所以很難理解 Wireframe 的大大小小灰色方框未來會長成什麼樣子……

這時你就需要 Overflow ,它你能讓一路從資訊架構、Flowchart、Wireframe、GUI 用到 Prototype Testing 。內建不同尺寸模板讓你能直接預覽裝置效果,不用再去找 Mockup。同時支援連結分享,讓你可以快速分享內容給團隊或長官,手機瀏覽的穩定度也滿高的,只要重新整理就能取得最新版本。

更重要的是它能同步Sketch! 光是這點就完勝 Axure,還在 Copy Selection?當你要要將 Wireframe 替換成 GUI 結果時,只要一鍵就能同步,有效降低頁面修改後不必要的文件整理時間。另外也能透過 Share 在雲端上管理版本,再也不用擔心當檔案不見,或被同事暴力覆蓋。另外,雲端上也支援文件頁面標註、討論,就算你把頁面刪掉了,留言還是在!直到你 Resloved的那天……

4. 如何向 UX 小白有效解釋「某種類型」的互動設計?

這個問題,我想應該是設計發展階段中最常遇到的問題!由於在顧問行業中常需要與不同產業背景的夥伴協作,常因對特定體驗存在經驗上的落差,而無法具體理解對方想描述的概念。這時候你們就需要一些公正的第三方平台,來定義到底什麼是 App bar、Bottom navigation、Tab Bar 間的差異……

當面臨解釋需求時,你就必須拿出 UX 設計師的基本字典:
- Google Material Design
- Apple Human Interface Guideline

Google Material Design Guideline Components page.j
Google Material Design Guideline Components page

在 2 個網頁中,你可以找到基本的互動元件定義與使用情境,同時也能透過裡面提供的 Do and Don’t 來教育客戶,互動元件的設計需要考量頁面的使用脈絡,不能勉強他們在一起,這樣是不會得到幸福的。

avxko-823ka.jpg
螢幕截圖

Tips:如果還是找不到理想的說明素材?建議可以上 MobbinUISOURCES 找找,上面提供許多真實產品完整的關鍵畫面。

設計交付

5. 如何同步設計結果?

你以為當設計師將 GUI 上傳 Zeplin 就結束了嗎?別傻了,上傳圖檔後才是真正設計的開始。

為了有效落實概念,建議在開發前可先透過共編文件,如 Google Sheet 將交付項目整理成表格形式。透過圖文對照,讓所有團隊成員都能輕易、快速理解:我們現在要實現哪些頁面?預估花費時間?開發的重點又是什麼?更可以根據頁面附上相關動效參考連結。

aw6xl-i6ywq.jpg
螢幕截圖

Tips:當需要向開發團隊說明動效時,如果你是設計師,可以透過 AE、Principle 或 Protopie 等平台來展示你的互動設計,可以輸出 SVG 檔會更好。如果你只是一般人,那你可以去 CodePen 找找,除了能讓你把玩體驗外,更可直接提供工程師在 HTML、CSS、Java Script 等編碼上的參考,你說他們能不愛你嗎?

Social media hover icons with pop-up titles from CodePen
Social media hover icons with pop-up titles from CodePen

最後

這次提到的工具、平台都是我在專案中較常用的,當然還有許多替代性或更好的方案,也歡迎大家推薦更好的工具,但還是老話一句:

工具只能協助你展開或推進對話,保持同理心與開放的態度,才能讓專案趨向成功。溝通!溝通!再溝通!

Take Away

(本文出自 UI Insight

繼續閱讀 專案管理
相關文章
會員專區

使用會員功能前,請先登入

  • 台灣首款對話式 AI 職場教練,一次提升領導力
  • 會員專享每日運勢、名人金句抽籤
  • 收藏文章、追蹤作者,享受個人化學習頁面
  • 定向學習!20 大關鍵字,開放自選、訂閱
  • 解鎖下載專區!10+ 會員專刊一次載
追蹤我們