Flutter 遊戲開發,不只是程式:如何從有想法到實現一款遊戲(一)

更新於 發佈於 閱讀時間約 4 分鐘

前言

當今時代,遊戲已經不再只是單純的娛樂,更成為人們生活中不可或缺的一部分。隨著技術的發展,遊戲也從單機遊戲轉變成網路遊戲、手機遊戲、虛擬實境(VR)遊戲等多種形式。Flutter 作為一種跨平台的開發框架,正逐漸成為開發遊戲的一個重要工具。本系列文章將以「輕鬆入門 Flutter 遊戲開發」為題,從最基礎的開始,帶領讀者一步步學習如何使用 Flutter 開發遊戲。不需要太多的程式基礎,只需要一份對遊戲的熱愛,就可以在本系列文章中學習到足夠的知識,讓自己打造出自己的第一款遊戲。讓我們一起開始這段有趣的學習之旅吧!

我的背景

我是一個熱愛玩遊戲想一些鬼點子的人,目前擔任前端工程師,負責網頁的製作與設計,在上班的閒暇時間時不時會腦動大開,把想到的遊戲點子寫在手機記事本上,遊戲發想來源都來自於生活上,例如,走在路上看到路上的車子呼嘯而過時,我就在想要不要來寫個動態視力大挑戰的遊戲XD,看到新聞說台灣是一個行人地獄時,就來寫個扮演台灣行人並走在路上去指定地點的遊戲等等,雖然想了一堆但都還沒去實現,在決定寫 flutter 之前,我開發了一個線上桌遊多人連線網站,寫完並上線後,推薦給我的同事或朋友們玩玩,他們都有一致的想法「怎麼手機版體驗這麼差,畫面這麼醜XD,bug 一堆」,這時候我才領悟到現在大家比較少會去玩網頁遊戲了,以前的 Flash 和 Facebook 小遊戲的時代已經過了QQ。
之後我開始想要寫手機遊戲,買了 Unity 課程看了一遍又一遍,本身的技能樹都點在了前端,跳去寫 C#(Unity 用的開發語言) 真的是不習慣,開發成本太高了,在某天偶然聽到同事的朋友在用 flutter 寫專題,看了他的語法覺得很新鮮,又是 google 爸爸開發維護,又是跨平台,寫一套上架到兩個平台,又跟 React 有點像(排除 React Native 想學學新東西XD) 就決定是你了,之後就開啟了學習 flutter 之旅。

啟航準備

進入正題,工欲善其事,必先利其器,首先需要準備開發工具以及開發環境:
  1. 下載 flutter
  2. 下載 VScode / Android Studio 也可以,看個人喜好
  3. 測試你的模擬器跑不跑得起來
  4. 開啟一個專案改改看字,看有沒有 hot reload
  5. 詳細環境設定流程可以看官方教學

遊戲模板

這是官方提供的遊戲開發模板,他提供了基礎的功能:
  1. sound - 音效模組
  2. music - 音樂模組
  3. main menu screen - 主畫面有先寫好
  4. settings - 遊戲設定的頁面
  5. ads (AdMob) - 遊戲廣告模組
  6. in-app purchases - 在 app 裡購買商品的模組
  7. games services - Game Center & Google Play Games Services
  8. crash reporting - Firebase Crashlytics
這個範例可以載下來後跑起來試試看,他是一個簡單的遊戲,提供一個完整的專案架構及功能,包含轉場動畫、Landing Page、關卡設計,讓你專心在遊戲開發邏輯上,是個很方便的腳手架。

結語

開發遊戲是一個需要極大的熱誠的事情,你會常常刪了又改,改了又刪,怎麼樣都不滿意,非常容易會放棄,不過我很享受開發中了樂趣,有時候一個小邏輯 bug 就可以卡了我一個晚上,當你到了該睡覺的時間卻還沒解出來,那一晚絕對是難以入眠,又或是你躺在床上正要睡著的那一刻,突然想到了新點子,又爬起來拿著筆記本記下來,有太多太多好玩的事可以分享。
謝謝你看到最後,未來會慢慢地更新我開發遊戲的辛酸血淚過程並把它紀錄下來,對了這是我上架的桌遊網站(不是可疑網站哈哈),非常的陽春XD 目前電腦版的體驗會最好,這可是歷時兩年的開發呢,可以到上面玩玩 ^^
以下為專案連結:
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
你可能也想看
Google News 追蹤
Thumbnail
大家好,我是woody,是一名料理創作者,非常努力地在嘗試將複雜的料理簡單化,讓大家也可以體驗到料理的樂趣而我也非常享受料理的過程,今天想跟大家聊聊,除了料理本身,料理創作背後的成本。
Thumbnail
哈囉~很久沒跟各位自我介紹一下了~ 大家好~我是爺恩 我是一名圖文插畫家,有追蹤我一段時間的應該有發現爺恩這個品牌經營了好像.....快五年了(汗)時間過得真快!隨著時間過去,創作這件事好像變得更忙碌了,也很開心跟很多厲害的創作者以及廠商互相合作幫忙,還有最重要的是大家的支持與陪伴🥹。  
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
本文介紹建立第一個 Flutter 應用程式的方法。包括打開 Visual Studio Code 建立專案,在 iOS、Android 模擬器及真實設備、Web 和桌面環境運行的步驟。成功建立是重要里程碑,可探索更多功能,持續練習提升技能。
Thumbnail
本文介紹如何建立第一個 Flutter 應用程式。如何在 Visual Studio Code 中建立專案,包括專案類型選擇、存放位置設定等。還介紹了在 iOS、Android 模擬器、真實設備及建立 Web、桌面應用程式執行的方法
Thumbnail
一個獨立開發者,立志打造顛覆性的遊戲體驗,在開拓全新玩法的道路上,砥礪前行。 大家好,我正在開發一款獨立遊戲,以魔法戰鬥為主題,如果想要嘗試遊戲的demo,歡迎到下方連結處,加入我的Discord群組。 魔法與戰鬥的世界---開發中的遊戲   這款遊戲發生在一個飄浮於雲端之上的世界,
Thumbnail
這篇內容,簡單介紹了GameMaker的遊戲製作原理。包括Object、參數、程式碼等概念。同時也簡單介紹了GameMaker的適用範圍和特色。
Thumbnail
Instrumect 是我從2022年10月開始製作的遊戲。 在那之前,其實嘗試過各種大大小小的遊戲開發,包括RPG、橫向射擊、2D平台遊戲等,但最後都熱情耗盡,所有項目皆斷尾(ゝ∀・)⌒☆ 當初會選擇開發那些類型,不外乎考慮市場熱門程度和製作難易度。而最後會沒了熱情,是因為我對那類遊戲興趣沒很
Thumbnail
# 簡介 身為一位專注於 Vue.js 的前端開發者,這是我第一次嘗試構建 Flutter 網頁應用。讓我們開始吧! ## 第一次嘗試 ### 第一步:創建一個 Flutter 應用 首先,通過運行以下命令來創建一個新的 Flutter 項目: ```sh flutter
Thumbnail
本篇文章將分享手機App設計教學,並往後介紹使用Flutter開發App的相關知識和技巧。透過這系列的分享,讀者將能夠學習如何利用設計和程式開發技能來製作一個App。文章中也提供了一些靈感來源和教學資源,幫助讀者進行設計和開發的思考和學習。
專欄簡介 你是否跟我一樣想做出屬於自己的遊戲? 不會代碼, 沒有經驗, 不會任何遊戲引擎也想進入製作遊戲的世界嗎? 此專欄會包跨 Renpy 的基礎入學教學到獨立製作出完整視覺小說 / 文字冒險遊戲也包跨自訂遊戲的外觀 UI。 除此之外也會時不時分享一些各位在遊戲創作上可以用到的資源 自我介紹 你好
Thumbnail
有沒有想過,即使沒有任何編程背景,你的創意也能在六個月內轉化成真實的App?我可以以自身經歷跟你說有了 No-Code Tool (無代碼工具) 和 AI 的幫助,這一切都是可能的!你一行 code 都不需要打,甚至也無須學習任何編程語言!沒有什麼比實踐一個自小認為不可能的任務還振奮人心的事了!
Thumbnail
大家好,我是woody,是一名料理創作者,非常努力地在嘗試將複雜的料理簡單化,讓大家也可以體驗到料理的樂趣而我也非常享受料理的過程,今天想跟大家聊聊,除了料理本身,料理創作背後的成本。
Thumbnail
哈囉~很久沒跟各位自我介紹一下了~ 大家好~我是爺恩 我是一名圖文插畫家,有追蹤我一段時間的應該有發現爺恩這個品牌經營了好像.....快五年了(汗)時間過得真快!隨著時間過去,創作這件事好像變得更忙碌了,也很開心跟很多厲害的創作者以及廠商互相合作幫忙,還有最重要的是大家的支持與陪伴🥹。  
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
本文介紹建立第一個 Flutter 應用程式的方法。包括打開 Visual Studio Code 建立專案,在 iOS、Android 模擬器及真實設備、Web 和桌面環境運行的步驟。成功建立是重要里程碑,可探索更多功能,持續練習提升技能。
Thumbnail
本文介紹如何建立第一個 Flutter 應用程式。如何在 Visual Studio Code 中建立專案,包括專案類型選擇、存放位置設定等。還介紹了在 iOS、Android 模擬器、真實設備及建立 Web、桌面應用程式執行的方法
Thumbnail
一個獨立開發者,立志打造顛覆性的遊戲體驗,在開拓全新玩法的道路上,砥礪前行。 大家好,我正在開發一款獨立遊戲,以魔法戰鬥為主題,如果想要嘗試遊戲的demo,歡迎到下方連結處,加入我的Discord群組。 魔法與戰鬥的世界---開發中的遊戲   這款遊戲發生在一個飄浮於雲端之上的世界,
Thumbnail
這篇內容,簡單介紹了GameMaker的遊戲製作原理。包括Object、參數、程式碼等概念。同時也簡單介紹了GameMaker的適用範圍和特色。
Thumbnail
Instrumect 是我從2022年10月開始製作的遊戲。 在那之前,其實嘗試過各種大大小小的遊戲開發,包括RPG、橫向射擊、2D平台遊戲等,但最後都熱情耗盡,所有項目皆斷尾(ゝ∀・)⌒☆ 當初會選擇開發那些類型,不外乎考慮市場熱門程度和製作難易度。而最後會沒了熱情,是因為我對那類遊戲興趣沒很
Thumbnail
# 簡介 身為一位專注於 Vue.js 的前端開發者,這是我第一次嘗試構建 Flutter 網頁應用。讓我們開始吧! ## 第一次嘗試 ### 第一步:創建一個 Flutter 應用 首先,通過運行以下命令來創建一個新的 Flutter 項目: ```sh flutter
Thumbnail
本篇文章將分享手機App設計教學,並往後介紹使用Flutter開發App的相關知識和技巧。透過這系列的分享,讀者將能夠學習如何利用設計和程式開發技能來製作一個App。文章中也提供了一些靈感來源和教學資源,幫助讀者進行設計和開發的思考和學習。
專欄簡介 你是否跟我一樣想做出屬於自己的遊戲? 不會代碼, 沒有經驗, 不會任何遊戲引擎也想進入製作遊戲的世界嗎? 此專欄會包跨 Renpy 的基礎入學教學到獨立製作出完整視覺小說 / 文字冒險遊戲也包跨自訂遊戲的外觀 UI。 除此之外也會時不時分享一些各位在遊戲創作上可以用到的資源 自我介紹 你好
Thumbnail
有沒有想過,即使沒有任何編程背景,你的創意也能在六個月內轉化成真實的App?我可以以自身經歷跟你說有了 No-Code Tool (無代碼工具) 和 AI 的幫助,這一切都是可能的!你一行 code 都不需要打,甚至也無須學習任何編程語言!沒有什麼比實踐一個自小認為不可能的任務還振奮人心的事了!