心智圖簡易教學

昨天群裡聊到各種沒有設計流程又趕得要死的公司現況,我就在想,有沒有什麼辦法能在短時間內產出一份還像樣又不用教 PM 或企劃怎麼看的文件,且門坎低、人人好上手,又能當成開發依據。想來想去,大概是心智圖吧。

心智圖我覺得是整理和記錄腦中思考和推理邏輯的好方法,一層層演進的關係讓閱者可以快速理解為什麼會這樣分類歸納。就以設計來說,分析、歸納、找出秩序是最重要的事。


上圖是群裡設計師分享電量圖表,已徵得他的同意,放出來當範例。

這張圖一看就知道沒有事前做過規劃,直接從 Wireframe 或 Mockup 就下手了。漏了很多可以加強深入、能更完善的部份,也多了幾個不合理的地方。

繪製圖表的心智圖

為什麼要做張電量圖表?這張圖表想呈現什麼內容?

不管什麼圖表,這是一定要先被弄懂的兩大題目,設計師不知道要這圖表幹嘛、不知道圖表有哪些內容要呈現,畫個屁…不被修改到死才奇怪吧?中午不知道吃什麼還可以丟銅板抽個籤,不知道畫圖表幹嘛只能求神拜佛抱 PM 大腿了。

所以第一步要先思考這個圖表的目標,必需有哪些資訊。初步整理如下:

在畫心智圖的時候請把所有和「視覺」有關的部份全部捨棄。什麼標題加租、紅色突顯電量這種形容圖表外觀的敘述通通拔掉。心智圖整理的是內容,不是視覺條件。只有在非常特例的情況下才能把視覺條件放進考量點。

心智圖不可能一次到位,通常也會重畫個 3 次左右。手寫版大概訂出方向、大分類;進電腦做電子版時繼續細化;電子版寫得差不多時重新檢視所有文字內容,找出共通點規納分類。

這是經過整理的心智圖(八成還是有漏),可以看到分 3 大類顏色,目標、資訊、功能。

目標:製作這個圖表的目的。
資訊:這個圖表要呈現哪些內容,一堆 Data。
功能:怎麼把 Data 拿出來用。

資訊和功能有點不太一樣,資訊就是一堆的數據資料,功能指的是要用什麼方式把資料拿出來用。雖然心智圖上資訊和功能的內容看起來似乎是一樣的,但就以 RD 的角度來講是不同的兩回事。

不知道怎麼劃分功能和資訊沒關係,反正圖畫完拿給 RD 看,他們會教你。(不教你就是等案子進度到了他們要接手的時候會叫苦連天了。)

漏洞

自己一個人在畫心智圖的時候往往寫得很順,長分岔長得很開心,表面上邏輯是通的,但仔細一想就會有問題。

上圖其實就有個大漏洞:單日用電時間總計

誰家冰箱會為了省電所以定時拔插頭?又不是上節目黃金傳說啊!那電量誰家不是 24H 在消耗?這個圖表的面向若是一般大眾家庭,單日用電時間總計這數值就變的很可有可無、甚至不應該存在。

所以心智圖畫完記得拿給其他人看看啊!不要畫完就直接開工了,起碼也給專案相關人士瞧瞧,同步下對產品的看法。

文件

到這裡你發現了嗎,這份心智圖包了一點點的企劃書部份、也包了一點點規格書的部份,如果你身處小公司、沒流程、上至老闆下只同事都不懂設計、PM 和企劃只會叫你改的工作環境,被交辦任務後還是先快速畫一張心智圖,把該列的資訊列一列,請他們確認。

很多時候修改是因為雙方溝通落差,PM 沒什麼想法就叫設計先開工,設計自己有想法也沒和 PM 講。等做下去後 PM 想的和設計想的又不同,這落差就是改到死的原因之一。

不過拿心智圖當文件這個作法只適用於公司內部,給 PM、企劃、RD 同事看看確認無誤可以,開明一點的主管或老闆可以,傳統些的主管、老闆或是拿給對外的客戶看就不夠正式。既然都能畫出完整心智圖了,再花點力氣修改成一份有標題分段落的文件給客戶確認吧。

SimpleMind Free

通常我都用 XMind,不過心智圖不需要把每個格子都對得整整齊齊,就會用 SimpleMind Free。

App Store https://itunes.apple.com/tw/app/simplemind-free/id439654198?l=zh&mt=12

Akane Lee

Akane Lee

如果設計師能和工程師順利合作,那麼老公也就能準時下班了吧!因此努力分享 UI 和 UX 方面的知識、技術、各種踩過的坑與心得。

Comments

wave
comments powered by Disqus

Press ESC to close