情境網頁遊戲框架

編輯歷史

時間 作者 版本
2017-07-03 06:27 (unknown) r2
顯示 diff
- 情境網頁遊戲框架
+ 情境網頁遊戲框架
這是一個情境式網頁遊戲的框架,只要把圖片放置好、把遊戲架構json寫好,放到網頁裡,就可以成為一個全新的情境式遊戲,或是心理測驗!
(333 行未修改)
2017-07-01 15:01 – 15:01 (unknown) r0 – r1
顯示 diff
+ 情境網頁遊戲框架
+
+ 這是一個情境式網頁遊戲的框架,只要把圖片放置好、把遊戲架構json寫好,放到網頁裡,就可以成為一個全新的情境式遊戲,或是心理測驗!
+
+ *看起來很適合用 http://twinery.org/ 做,想要的功能都有
+ *http://renpy.org/
+ *http://www.nvlmaker.net/
+ *有企劃的話可以幫忙填 code 的部份 (一個留名佔坑的概念)
+
+
+ *設定檔格式
+
+ *steps:
+ *過程,其中的"start"項目為第一張
+ *bg:
+ *背景圖片
+ *範例:"images/xxx.jpg"
+ *如果settings的bg有指定,這裡可省略,將會使用settings的bg作為背景圖片
+ *characters
+ *角色圖片
+ *範例:["images/xxx.png", "images/yyy.png"]
+ *place:
+ *地點(可省略)
+ *"高雄市美麗島站"
+ *datetime:
+ *時間(可省略)
+ *2015年8月17日 10:30
+ *animate:
+ *轉場動畫
+ *"fading" or "fliping"....
+ *next:
+ *下一張
+ *["steps", "1"]
+ *如果沒有question,就跳next,沒有next,就跳results進行計算
+ *如果有多個內容,則亂數選一個。
+ *talks:
+ *說的話
+ *["first sentent", "second"]
+ *question:
+ *要問的問題
+ *["你要去哪裡?"]
+ *answer_type:
+ *答案格式
+ *"radio" or "checkbox"
+ *答案格式是radio的時候,點答案就直接進去了;
+ *如果答案格式是checkbox,要多一個確認的對話框給玩家點擊
+ *answers:
+ *答案選項,下面還會拆分
+ * [answer: "", score: ["a": [3, "plus"], "b": [5, "times"]], next: ["steps", "1"]]
+ *answer
+ *答案內容
+ *"我要去黑客松"
+ *score
+ *計分方式
+ *[["a", "+", 3], ["b" "*", 5]]
+ *以這邊為例,a + 3, b * 5
+ *這邊分數可以有多個,分開計算,計算模式看後面的plus、times
+ *next
+ *下一個要跳哪個選項
+ * ["steps", "1"]
+ *意思是跳到 steps 的第"1"項
+ *next如果只有["results"],則透過計算決定要顯示哪個結果。
+ *如果有指定,如["results", "1"],不計算直接顯示該結果。
+
+ *results:
+ *結果群組的呈現
+ *calculate:
+ *計算方法,符合的才呈現
+ *[[ "a", ">", 3 , "and" ], [ "b", ">", 5 , "or" ]]
+ *必須符合 a > 3 或 b > 5才會呈現此結果
+ *根據計算結果來呈現答案。如果是在next中直接指定,則不用計算。
+ *title
+ *標題
+ *"要去黑客松"
+ *contents:
+ *呈現內容
+ *["result string", "result string"]
+ *可以有多個
+ *next:
+ *如果結果呈現後還要繼續問,可以放入next
+ *["steps", "1"]
+
+ *settings
+ *遊戲的設定
+ *cover
+ *一開始畫面的封面
+ *bg
+ *遊戲預設場景的圖片
+ *website
+ *遊戲相關網站
+ *version
+ *本遊戲版本
+ *code
+ *程式碼放哪裡
+ *license
+ *網站授權
+ *score
+ *設定預設分數
+
+ *網頁格式與設定檔對照
+
+ 遊戲進入的樣式
+ *
+
+
+ 對話狀況
+
+ *
+
+
+ *
+
+
+ *
+
+
+ 提出問題
+
+ *
+
+
+ 結果
+
+ *
+
+
+ *設定檔範例
+
+ 這個設定檔,以CC授權小幫手為基底製作
+
+ *{
+ * "settings": {
+ * "bg": "images/123.jpg",
+ * "website": "http://g0v.tw",
+ * "cover": "images/123.jpg",
+ * "code": "http://github.com/g0v.tw/1234.jpg",
+ * "license": "MIT"
+ * "score": [
+ * ["by", "=", 0],
+ * ["sa", "=", 0],
+ * ["nc", "=", 0],
+ * ["nd", "=", 0],
+ * ],
+ * "version": "0.01"
+ * }
+ * "steps": {
+ * "start": {
+ * "characters": ["images/aaa.png", "images/bbb.png"],
+ * "talks": [
+ * "不知道該如何選擇CC授權嗎?",
+ * "來選擇你的想像,再來看看要用哪個授權吧!"
+ * ],
+ * "next": ["steps", "by"]
+ * },
+ * "by": {
+ * "questions": [
+ * "需要標示姓名嗎?"
+ * ],
+ * "answers": [{
+ * "answer": "我要標示姓名",
+ * "score": [
+ * ["sa", "=", 1]
+ * ],
+ * "next": ["steps", "nd"]
+ * }, {
+ * "answer": "不用標示姓名",
+ * "score": [
+ * ["sa", "=", 0]
+ * ],
+ * "next": ["results"]
+ * }]
+ * },
+ * "nd": {
+ * "questions": [
+ * "別人可以改作嗎?"
+ * ],
+ * "answers": [{
+ * "answer": "可以改作",
+ * "score": [
+ * ["nd", "=", 1]
+ * ],
+ * "next": ["steps", "sa"]
+ * }, {
+ * "answer": "不能改作",
+ * "score": [
+ * ["nd", "=", 0]
+ * ],
+ * "next": ["steps", "sa"]
+ * }]
+ * },
+ * "sa": {
+ * "questions": [
+ * "分享後要用同樣授權嗎?"
+ * ],
+ * "answers": [{
+ * "answer": "要用同樣授權",
+ * "score": [
+ * ["sa", "=", 1]
+ * ],
+ * "next": ["steps", "nc"]
+ * }, {
+ * "answer": "不用使用相同授權",
+ * "score": [
+ * ["sa", "=", 0]
+ * ],
+ * "next": ["steps", "nc"]
+ * }]
+ * },
+ * "nc": {
+ * "questions": [
+ * "是否可以商業使用?"
+ * ],
+ * "answers": [{
+ * "answer": "可以商業使用",
+ * "score": [
+ * ["nc", "=", 1]
+ * ],
+ * "next": ["results"]
+ * }, {
+ * "answer": "不能商業使用",
+ * "score": [
+ * ["nc", "=", 0]
+ * ],
+ * "next": ["results"]
+ * }]
+ * }
+ * },
+ * "results": {
+ * "no-cc": {
+ * "calculate": [
+ * ["sa", "!=", 1, "and"]
+ * ],
+ * "title": "你不適用CC授權",
+ * "contents": [
+ * "您選擇了不做姓名標示。",
+ * "所以CC授權不適合你喔!"
+ * ]
+ * },
+ * "cc-by": {
+ * "calculate": [
+ * ["by", "==", 1, "and"],
+ * ["nc", "==", 0, "and"],
+ * ["nd", "==", 0, "and"],
+ * ["sa", "==", 0, "and"]
+ * ],
+ * "title": "CC-BY適合你!",
+ * "contents": [
+ * "因為你沒有做太多限制。",
+ * "CC-BY授權適合你喔!"
+ * ]
+ * },
+ * "cc-by-nc": {
+ * "calculate": [
+ * ["by", "==", 1, "and"],
+ * ["nc", "==", 1, "and"],
+ * ["nd", "==", 0, "and"],
+ * ["sa", "==", 0, "and"]
+ * ],
+ * "title": "CC-BY-NC適合你!",
+ * "contents": [
+ * "因為你只有加上商業限制。",
+ * "CC-BY-NC授權適合你喔!"
+ * ]
+ * },
+ * "cc-by-nc-sa": {
+ * "calculate": [
+ * ["by", "==", 1, "and"],
+ * ["nc", "==", 1, "and"],
+ * ["nd", "==", 0, "and"],
+ * ["sa", "==", 1, "and"]
+ * ],
+ * "title": "CC-BY-NC-SA適合你!",
+ * "contents": [
+ * "因為你限制商業使用,又要求修改後要以相同授權釋出。",
+ * "CC-BY-NC-SA授權適合你喔!"
+ * ]
+ * },
+ * "cc-by-nd": {
+ * "calculate": [
+ * ["by", "==", 1, "and"],
+ * ["nc", "==", 0, "and"],
+ * ["nd", "==", 1, "and"],
+ * ["sa", "==", 0, "and"]
+ * ],
+ * "title": "CC-BY適合你!",
+ * "contents": [
+ * "因為你禁止別人改作。",
+ * "所以CC-BY-ND授權適合你喔!"
+ * ]
+ * },
+ * "cc-by-nc-nd": {
+ * "calculate": [
+ * ["by", "==", 1, "and"],
+ * ["nc", "==", 1, "and"],
+ * ["nd", "==", 1, "and"],
+ * ["sa", "==", 0, "and"]
+ * ],
+ * "title": "CC-BY-NC-ND適合你!",
+ * "contents": [
+ * "你限制了商業授權,也禁止改作。",
+ * "所以CC-BY-NC-ND授權適合你喔!"
+ * ]
+ * },
+ * "cc-by-sa": {
+ * "calculate": [
+ * ["by", "==", 1, "and"],
+ * ["nc", "==", 0, "and"],
+ * ["nd", "==", 0, "and"],
+ * ["sa", "==", 1, "and"]
+ * ],
+ * "title": "CC-BY-SA適合你!",
+ * "contents": [
+ * "因為你只要求要用相同方式分享",
+ * "所以CC-BY-SA授權適合你喔!"
+ * ]
+ * }
+ * }
+ *}
+
+
+ *操作方法
+
+ 可以用滑鼠點擊,也可以用右、Enter、空白選下一步;
+ 上下左右可以在選項中跳躍,enter、空白選擇
+
+ *適用場合
+ 憲動盟議題推廣
+ CC授權選擇
+ 各種議題介紹
+
+ *這個坑需要
+ *網頁設計師
+ *UI設計師
+ *對議題有興趣、有劇本的朋友
+ * 請問可以環境議題加入嗎?