本文件探讨了从规划到开发维护的Drupal项目经验，以新竹社服中心网站为案例，介绍了项目流程、使用者中心设计及信息架构的构建。文中强调与客户的沟通及共识建立是成功的关键，并讨论了使用DrupalCMS的优势与挑战。最后，还提供了其他相关资源以帮助理解网站计划和设计。

1. 從企劃到開發維護的 Drupal 專案經驗 - 以 新竹社服中心網站為例 蔡明哲 悠識數位顧問有限公司 UserXper.com

2. 蔡明哲 Richard Tsai 悠識數位 首席資訊架構師 Chief Information Architect 專長 網站企劃，網路行銷 , 專案管理 , 系統分析 , 資料庫行銷 過去 企劃顧問，專案總監，客服總監，技術總監，行銷企畫經理，知識研究部經理，軟體工程師，專案經理，產品經理，廣告 AE.. 幫助客戶 找出網站設計或企劃的問題 提供網站 Usability 的建議 提供網站企劃及 Prototype Design 的服務 提供網站企劃的內功心法 / 秘笈 / 工具

3. 網站企劃學習的三個大方向 MS Office, Axure RP , Freemind/XMind, Google Analytics, … 資訊架構 , 使用者經驗 , 介面設計 , 資訊設計 , 互動設計 , 品牌與視覺傳達 , 資訊技術應用 . … Tools Concepts 專案管理 工作流程 / 溝通方法 - 使用者研究 - 製作開發技術 HTML, Flash, PSD.. - 行銷文案 SEO 搜尋引擎最佳化 … Workflow/Skills 心法 秘笈 武器

4. 把網站當做軟體開發 ( 10 多年前 ) Richard as a Programmer, SA ( 系統分析師 ) 首先詢問需求 , 分析需求 , 然後 開規格 撰寫程式 請 美工 提供 UI 設計 再套一次介面 客戶測試

5. 我們的專案流程 ( 採用 UCD) 需求訪談分析 , 目標使用者分析 然後分析競業 , 業主偏好網站 , 品牌訴求 提供網站定位與發展策略並確認 Mindmap 蒐集腦力激盪的結果 Card Sorting/ Mental Model 發展網站資訊架構 製作網站 Sitemap, Wireframe, Prototype by Axure RP Content Auditing 網站風格設計並確認 適時做 User Test 程式開發 , 內容蒐集 測試 (Functional Test) Usability Test 上線 績效評估與分析 User-Centered Design 企 劃 階 段 設 計 開 發 階 段

6. 我們目前的「網站企劃」流程 Strategy 策略規劃 Strategy planning phase Scope 需求範疇 ----------- ----------- ----------- ----------- ----------- Requirement Definition Phase Prototype Design Phase 網頁 設計 視覺設計 系統開發 Implementation Phase Visual & Page Design Phase Skeleton 介面設計 Structure 架構定義 策略企劃 執行企劃 context content users

7. 現在的流程 Card Sorting Mindmap Mental Model User Behavior Content Auditing Information Architecture Stakeholder interview Wireframe HTML Prototype Specification Traffic Analysis

8. Card Sorting 卡片排序法

9. Usability Test

10. 新竹社服中心 CSSC 專案背景 人 : 朋友介紹 , 找人幫忙 事 : 將手動維護 HTML 改成上稿管理 時 : 2009/9 月 ~2010/1 月完成 ~2010/3 月上線 地 : 台北 , 新竹 物 : http://www.cssc.org.tw, Drupal

11. 新竹社服中心網站改版緣由 鄒大哥 許老師 1 負責窗口 3 4 NPO CMS 改造競賽 5 6 Richard 我 2 企劃 PM Drupal 7 8 設計師 技術 設計

12. 新竹社服中心網站 ( 改版前 )

13. 拜訪新竹社服中心

14. 新竹社服中心 - 杜華神父石

15. 新竹社服中心網站 ( 改版前 ) 維護方式 純靜態 HTML 網站 用 FrontPage 維護網頁 手動維護連結 網站的問題 缺少好的視覺設計 網站導覽混亂，不容易了解這個機構 資訊呈現混亂，重點無法凸顯 人員素質的問題 只有一個人會 FrontPage ( 兼 ) 只會收發 Email ，最多會貼 BLOG 文章

16. 當時思考的問題 做好案子 = 大家 都滿意 網站訪客 ( 外部使用者 ) 容易理解的命名與架構 容易找到重要資訊 網站維護人員 ( 內部使用者 ) 可以輕易新增網頁 / 單元 可以自行編輯內容 可以自動收到民眾的資訊 ( 捐贈或服務需求 ) 我們自己 ( 開發團隊 ) 可以快速找到共識

17. 還有 祂

18. 做了某些決定 不使用 WordPress ( 無法滿足需求 ) 不全部重新寫 code ( 成本太高 ) 採用 Drupal ( 彈性的 CMS, 據說很厲害 ) 避免開發後的大幅修改 因為工程師 / 設計師都是被ㄠ的 因為台北新竹還是有段距離 採用 HTML Prototype (Axure RP) 讓 CSSC 接受網站資訊架構 / 單元命名的作法 (UCD)

19. 多數專案失敗的根源是 溝通過程產生「 落差 」 對於結論缺少「 共識 」

20. 專案三大成功關鍵因素 共識的建立 資源的掌握 專業程度的高低

21. 請預測以下專案品質 對牛彈琴 牛 0% 書生 100%

22. 秀才遇到兵 秀才 100% 兵 60% 請預測以下專案品質

23. 做了某些決定 不使用 WordPress ( 無法滿足需求 ) 不全部重新寫 code ( 成本太高 ) 採用 Drupal ( 彈性的 CMS, 據說很厲害 ) 必須避免開發後的大幅修改 因為工程師 / 設計師都是被ㄠ的 因為台北新竹還是有段距離 採用 HTML Prototype (Axure RP) 讓 CSSC 接受網站資訊架構 / 單元命名的作法 (UCD) 教導客戶如何一起合作完成專案

24. 教導客戶如何一起合作完成專案 教 CSSC 關於使用者行為的正確認識 關於技術方案選擇的考慮 講清楚我們建議的規劃 專案進行的程序 雙方應負的責任 如何蒐集資料 如何操作維護網站內容 (Drupal CMS)

25. 關於使用者行為的正確認識

26. 關於技術方案選擇的考慮

27. 講清楚我們建議的規劃 Axure RP HTML Prototype

28. 講清楚我們建議的規劃 Axure RP Wireframe (doc)

29. 專案進行的程序 / 雙方應負的責任

30. 如何蒐集資料 整理文字 / 圖片內容 按照 excel 整理資料 檔案命名方式 1 項 1 個 Word 檔案

31. 如何操作維護網站內容 (Drupal CMS) 測試階段及資料輸入的 training ( 效果不好 ) 遇到問題，隨時補充操作教學

32. 採用 Drupal 對專案的影響

33. 個人心得，僅供參考 採用 Drupal 是否會對專案造成任何限制 ? 視覺設計，不受限制 程式開發，可進行少量 ~ 大量客製化 Drupal CMS 擴充性的彈性很強大 採用 Drupal 等於採用 較佳的 CSS 套版 ( 被迫 ) 有 Drupal 的熟手 ( 高手 ) 的幫忙是很重要的 否則就要自己練成 Drupal CMS 介面還算友善 必須熟悉 Drupal 的系統觀念跟結構 學習 Drupal 難的不是 Drupal CMS 介面， 而是你得知道找到什麼模組或功能去做什麼事情。

34. 另一個案例 時代基金會 YEF 網站 http://yef.into.webhop.net/

35. 如何追蹤我們的訊息 ? 悠識數位 http://userxper.com 請上網搜尋 “網站企劃” 網站企劃 (facebook) http://facebook.com/web.plan Axure RP User’s Club (facebook) http://facebook.com/axure.club HPX 網站企劃輕鬆聚 ( 聚會活動 ) http://userxper.com/HPX-fb-group/