FINDING 川竹 敏晴 2016.02.02

來自網站技術總監(TD)的手繪圖解!CMS篇

來自網站技術總監(TD)的手繪圖解!CMS篇(Movable Type、WordPress、concrete5、NOREN)

大家好,我是擔任網站技術總監的川竹。
說到網站技術總監的主要工作,就是在架設網站時提供內容管理系統(Content Management System, CMS)相關的技術支援。

Loftwork的網站技術總監團隊,提供專案各項技術協助。(筆者是從右邊數來第二個)

除此之外,在Loftwork,我們為了要從為數眾多的CMS中挑選出最符合網站需求的類型,會和創意總監、客戶進行很多討論。這時如何用簡單易懂的方式說明,讓專案的溝通能順暢進行,也是網站技術總監的工作之一。

一談到專業術語,就會被說「完全聽不懂你在說什麼」……(TдT)

由於專案小組中每個人的理解能力不同,我在說明時會特別注意以下幾點。

  • 不要使用太難的詞彙或外語
  • 以其他容易想像的方式舉例說明
  • 畫圖說明

舉例來說,我會把CMS換個方式說明,解釋成「即便沒有專業知識的人也能自己更新網頁的機制」,但提到CMS的特色或機能時,還是會因為太複雜或訊息量太多而被說「完全聽不懂你在說什麼」……(TдT)

某天突然靈光乍現。對了,用圖解的方式來說明吧!

這是發生在某天的事,那是一個架構相當複雜的網站修改專案,擔當創意總監的人因為擅長手繪,便提議「不然把這個架構話出來看看吧?」,並花了一個小時左右畫出了專案概要圖。(約A3大小)這張圖在接下來的內部會議、與客戶和開發人員的討論中都發揮了很大的功能。有了圖之後,連客戶都能邊用手指邊說明「這個內容要在這裡呈現……」。因此我發現,使用圖解可以讓所有人有共同的想像畫面,對想要以淺顯易懂的方式讓客戶、設計團隊等不同立場的人了解狀況來說能起很大的作用。

製作CMS的架構圖解,並依照創用CC授權條款公開發表!

有鑑於此,我們立刻請來擅長繪圖的夥伴協助,繪製了各種CMS的特色說明圖解。(本來是想把目前所有專案在用的CMS都介紹出來,但作為嘗試先選了4種CMS試畫)

Movable Type

點擊從Flickr下載圖像

WordPress

點擊從Flickr下載圖像

concrete5

點擊從Flickr下載圖像

NOREN

點擊從Flickr下載圖像

到目前為止覺得如何呢?是不是比較能想像得到了?
自從開始在會議上使用圖解說明後,還遇過客戶說「因為我想多學習一點相關知識,這張圖可以給我嗎?」。過去只用口頭說明時,常會被說「完全聽不懂」,但現在有了圖面之後,客戶變得願意先研究看看再說,讓人覺得十分欣慰。所以為了能讓更多人使用,以上這些圖片將會依照創用CC條款(姓名標示-非商業性使用-禁止改作)公開發表。歡迎各位使用!(本篇依據2015年1月的情報撰寫而成,如有任何批評指教隨時歡迎連絡我。)
下回想和大家分享的是「主網域/子網域圖解說明篇」,敬請期待!

川竹 敏晴

Author川竹 敏晴(技術、總監)

大學畢業後,進入以系統開發為主的企業擔任工程師。使用Java等工具進行各式各樣網頁系統開發。 之後於網站製作公司中,經常擔任導入CMS系統的專案開發負責人。於2011年進入Loftwork,主要負責CMS導入相關案件的專業技術支援。對於CMS的熱情眾人皆知,每日致力研究CMS的各種運用。

Profile

Next Contents

深入探究「素材」的訪談
連載「Dive into Material」

Loftwork magazine 每月發送的電子報,提供Loftwork活動情報、最新案例