遊戲設計流程混亂?使用流程圖整理你的遊戲設計邏輯!|遊戲企劃入門 - 吉橙數位學院 DelightCollab
項目 divider 尚未註冊或是沒有一個 view.php 檔案.

遊戲設計流程混亂?使用流程圖整理你的遊戲設計邏輯!|遊戲企劃入門

早安,我是班班班。

新的一年到了,大家有什麼新期許或新計劃嗎?

這次一樣是遊戲企劃入門系列,主題是關於「計劃」。

如果想查看之前的企劃入門文章,這次筆者幫統整了之前的回顧,想查看所有關於企劃入門系列文章的冒險者們可以點擊這邊的傳送門:
👉《所謂遊戲企劃,遊戲企劃的工作內容與想像中的有什麼差異?》
👉《從心學習,遊戲企劃需要培養的4種企劃能力。》
👉《想設計遊戲卻無從下手?使用心智圖協助你有效思考遊戲設計提案|遊戲企劃入門》
👉《只有文字難以表達想法?使用Storyboard將你的遊戲設計圖像化!|遊戲企劃入門》

冒險者們有沒有過為了計劃一件事,不管是旅遊、活動、讀書……等,研究了很多、安排了很多行程的經驗?

通常計劃想的越詳細,要記住資訊就會越多。

這時候冒險者們會怎麼把計劃記下來呢?用表格紀錄?寫在記事本?直接記在腦袋裡?

當然!每一種方法都沒有問題,畢竟所有的方法都是為了讓計劃順利進展服務。

不過,當計劃步驟開始複雜,或是要建立一個固定的模式時,就很難只靠寫或背的方式。

這時候,我們就可以使用「流程圖」幫助我們計劃事情,判斷事情的發展。

流程圖是什麼?

流程圖概述

流程圖是一種圖表工具,能幫助設計程序、物件製作過程、事件的處理步驟或是工作流程視覺化,更容易地建立秩序以及被人理解。

流程圖可以在許多情境下使用,因此流程圖在各領域、行業或是團隊中都廣泛的被應用。流程圖可以是製作生產的設計工具,能幫助設計者預知問題、檢視流程、優化步驟,同時,流程圖也可以是助於管理的專案工具,成為設計者與開發者之間溝通的橋樑。

雖然流程圖是現代許多人都會搭配專案輔助使用的圖表工具,但實際上流程圖的歷史可以追溯到百年以前,甚至更久。

流程圖實際的發明者、由來目前沒有明確的證據,不過Frank Gilbreth和他的妻子Lillian Gilbreth在1921年,以主題為「流程圖——尋找最佳工作方式的第一步 (Process Charts — First steps in finding the one best way to do work) 」的演講中,向美國機械工程師學會(American Society of Mechanical Engineers,ASME)介紹了第一個系統化的流程圖。

1930年初,Mogensen加入Gilbreth夫婦,以流程圖培訓商務人士簡化工作流程的方式,這項培訓影響了許多專業人士並為他們帶來助益,同時也將流程圖推廣到各領域中。

流程圖的發展經過許多變革與發展,在這之間,流程圖的符號有了既定格式與認定標準,也出現了為各種目的、類型服務的流程圖。

流程圖符號意義

流程圖使用形狀簡單、易於辨識的幾何圖形、線條以及箭頭,用以表示流程中的每個步驟以及次序,從形狀本身就能看出步驟代表意義以及流程的程序、處理方法、決策、產出資料數量等。

流程圖中較常見、基本的圖形:

起始/終止
Terminator
流程線
Flowline
過程/步驟
Process
決策
Decision
輸入/輸出
Input/Output
TerminatorFlowline 流程線Process 一般步驟符號Decision 決策符號In/Output 輸入/輸出符號
膠囊方向鍵頭矩形菱形平行四邊形
事件開始或結束的符號有方向性的流程線,用以引導流程順序流程中的要執行或處理的事件對事件、問題做出決斷輸入或輸出外部資料
代表流程或子流程的開始與結束。流程圖的閱讀順序以「由上至下、由左至右」,
因此鍵頭大多是朝下或朝右。
流程圖中最常見的符號。通常會是「是或否」的答案導向,決策會出現>=2種分支。讀取或產出數據
流程圖最常見的符號介紹

符號以及順序編排是流程圖最主要的表達重點,挑選的符號以及順序的編排都會影響流程圖的架構、事件結果以及傳達資訊,因此在製作時需要注意該步驟選擇的符號是否合乎符號意義以及事件流程是否完整、方向與架構清晰。

流程圖類型

前面說過,流程圖發展到現今出現了多種不同的應用方式,目前常見的流程圖有:

  1. 基本流程圖:涉及一個專案、流程的完成程序,通常會經過一系列步驟、決策,從流程圖可以看出對該事件的計劃過程。
    • 創建專案
    • 釐清工作職責
    • 描述製造產品的過程
    • 記錄過程
  2. 工作流程圖:以邏輯說明既有事件的運作過程,例如部門的員工培訓流程、工作指南等。此流程圖可以建立標準化、高效率的流程,並且檢視流程中是否存在漏洞或邏輯缺失。
    • 培訓員工
    • 產品生產
    • 流程模擬
    • 模擬顧客購買產品的過程
  3. 泳道流程圖:視覺化傳達多部門間的工作運作情形,並排顯示跨團隊的協作情況。例如在企業中常有需多個部門合作生產產品的情況,這時泳道流程圖就能標明每個部門運作的流程以及什麼時候部門間需要進行交接、資訊傳遞。
  4. 決策流程圖:預覽決策後可能產生的結果,在進行決策前考慮所有可能發生的問題。

當然,流程圖的形式不僅止於上述提到的這4種,以不同角度(教育、商業、工程設計等),還可能出現更多類型的流程圖,不過礙於篇幅這邊點到為止。

流程圖應用於遊戲設計的功用

既然說流程圖在多個領域都能應用,那遊戲設計當然也不例外。

流程圖是遊戲企劃在遊戲設計、專案管理上都非常有效的工具,不管是在檢視遊戲的設計流程、團隊成員的工作分配還是與團隊成員溝通時,流程圖都能發揮許多作用。

(這邊說明的關於流程圖在遊戲設計的應用,大多是筆者個人經驗以及想法整合後的分享,若讀者有更多想法也可以在留言區與我們討論~)

遊戲設計

流程圖能幫助遊戲企劃在遊戲正式開發前,更全面的檢視遊戲的設計流程:過程是否存在漏洞、玩家的體驗是否流暢,以及步驟與步驟的銜接是否直覺等。

遊戲流程圖用設計目的來分的話,可以分成「遊戲核心體驗」以及「完整遊戲過程」兩種。

遊戲核心體驗

以遊戲核心玩法來說,流程圖的製作重點在於模擬玩家完整體驗一次核心玩法迴圈,一共需要經過多少步驟。以該流程圖來說,目的是檢視核心玩法的設計邏輯,優化玩家體驗流程(簡潔快速的帶給玩家體驗)。

以遊戲《黑帝斯》為例,《黑帝斯》是一款Roguelike角色扮演遊戲,遊戲以逃離冥府作為目標,核心玩法迴圈就是使用有限的生命值消滅房間中的敵人,清除完畢後可獲得該房間獎勵,之後再進入新的房間繼續挑戰。若是玩家在途中死亡,此次挑戰就會直接結束。這時流程圖就可以下圖方式呈現:

核心玩法迴圈流程圖
使用流程圖說明遊戲《黑帝斯》的核心玩法迴圈

完整遊戲過程

以完整遊戲過程來說,流程圖的製作重點在於說明遊戲的所有設計,從開始介面、設計系統、玩法等玩家在遊戲中能體驗到的所有流程。以該流程圖來說,目的是檢視遊戲規模以及整理系統架構。

同樣以《黑帝斯》為例,遊戲除了核心玩法迴圈外,玩家還可以在回到大廳(冥府)時與NPC互動、使用在挑戰中獲得的資源提升技能、裝飾大廳、贈送NPC禮物等行為。

遊戲整體系統流程與架構圖
以流程圖描述遊戲《黑帝斯》的整體遊戲架構與流程

專案管理

在專案管理的範疇中,流程圖可以幫助遊戲企劃更有秩序的建立團隊成員的工作職責、各角色的交接情況,這邊提到的用法就相當上面提到的泳道流程圖。除此之外,使用流程圖還能幫助我們與程式之間的溝通。

流程圖分析團隊協作

使用流程圖可以幫我們明確分配每個工作職位的工作流程、交接步驟,除此之外,還能使用流程圖確保成員間的工作進度,維持產品品質。除此之外,使用流程圖能幫助我們檢視團隊之間的協作流程是否有交接不順、流程繁瑣等問題。

下圖為假設一遊戲團隊企劃與美術之間的工作交接過程以及美術素材從設計到產出的流程。

遊戲美術繪製與工作交接流程圖
以泳道流程圖說明美術素材的產出過程以及遊戲企劃與遊戲美術的工作交接情形

流程圖協助溝通達成共識

遊戲企劃能使用流程圖描述遊戲中設計的系統運作情形、數值流動方式等,這樣一來,就能將複雜的程序視覺化,用更清晰、程序的方式呈現給團隊成員檢視。同時,使用流程圖說明遊戲的系統設計,遊戲程式能更清楚該系統的作用、功能、架構,以及每道步驟的判斷方法、導向結果等,也能相對減少程式與企劃之間的代溝。

以設計一個抽卡系統為例子,玩家可以透過鑽石進行抽卡,鑽石不足需要透過現實貨幣購買,卡片分成稀有與普通,若抽卡結果包含稀有卡片,播放的抽卡動畫會有所不同。並且獲得尚未持有的卡片會出現new字樣提示,以流程圖說明步驟就會如下圖。

使用流程圖表示抽卡系統的設計與流程
使用流程圖表示抽卡系統的設計與流程

製作流程圖的注意事項

流程圖的製作看似不難,實際上有很多設計上的細節需要注意。以下幾點是筆者在教學流程圖時總結的幾個新手需要多加注意的地方:

符號代表意義

在剛開始製作流程圖時,可能難以記住每個符號代表的意義,因此從頭到尾都使用矩形進行製作。不過記住符號的意義是必要的,前面也說過,符號意義可以綜觀該流程圖的資訊,也能幫助我們快速了解每個步驟。

流程符號意義
流程符號個別代表的意義

善用決策

使用決策將遊戲設計中玩家的行為分類,並且設計每個決策後玩家要執行的動作。

一來決策可以整理遊戲中出現的判斷式,提前預測遊戲中玩家的每個行為模式;二來使用決策可以幫助遊戲企劃整理遊戲設計內容,缺少決策的流程圖容易遺漏玩家的行動,讓玩家實際體驗和預期的出現落差。

另外,決策在使用時需要注意,決策會導向2種結果,結果的導向原因通常會是「是」或「否」、「真」或「假」,接續決策步驟的流程線上需要標註導向該線段的原因。

決策示意圖
決策流程線的答案通常會以「是」或「否」引導

架構與易讀性

最後,是剛開始製作流程圖時很常遇到的情況,流程圖要表達的步驟太多,導致流程圖看起來混亂。

這時候就要注意是否是步驟太過繁瑣,還是單純的架構沒安排好造成的問題。

流程圖要遵守從上到下、從左到右的製作順序,流程圖過長時可以使用接續、跨頁接續符號解決該問題。

如果是步驟太過繁瑣,那麼就需要再三檢視該流程圖的設計,並且優化流程步驟。

結論

以上是關於流程圖的介紹,以及在遊戲設計時的應用。

不知道各位冒險者是否有獲得任何收穫呢?

流程圖是遊戲企劃在設計遊戲時的一大利器,希望大家也可以試著使用流程圖,不管是在你的專案團隊,還是遊戲設計中。

關於如何製作流程圖這件事,除了使用紙筆進行繪製外,我們當然也可以借助科技的力量,使用網路上其他人提供的流程圖製作網站進行製作。

流程圖的使用以及詳細介紹筆者僅是輕輕帶過,網路上關於流程圖的介紹其實非常齊全,想了解更多的冒險者也可以試著去找找看相關文章介紹。

最後,這邊提供幾個筆者自己常用的製圖網站。|製作流程圖的線上工具:👉 Draw.io  👉GitMind

那麼這次的分享就到這邊,謝謝你看到這裡!

那麼,我是班班班

我們下次再見~

參考資料

ACADECK(2023)。流程圖。http://acadeck.com/?p=503
Asana(2022)。什麼是流程圖?(符號、類型,以及如何閱讀)。 https://asana.com/zh-tw/resources/what-is-a-flowchart
Gilbreth, F. B., & Gilbreth, L. M.(1921 December 5-9). Process Charts — First steps in finding the one best way to do work. New York: American Society of Mechanical Engineers.
Mancha, S. S. (2016). A Century of Flowcharts. https://ssmancha.medium.com/a-century-of-flowcharts-f425d38fef72

封面圖片來源

Image by rawpixel.com on Freepik

班班班
班班班

玩遊戲的同時,尋找開發者的軌跡。

吉橙數位學院DelightCollab

吉橙是新創的遊戲教學團隊,擁有程式、企劃、美術的專業講師。每位講師都有豐富的教學經驗,並以「學中做、做中學」為教學宗旨,帶你逐步且扎實的「了解知識、應用知識」。