{"id":1635,"date":"2025-11-10T00:09:16","date_gmt":"2025-11-10T00:09:16","guid":{"rendered":"https:\/\/sites.wsagames.com\/sl1c22\/?p=1635"},"modified":"2026-01-12T07:32:21","modified_gmt":"2026-01-12T07:32:21","slug":"block-fill-and-maze","status":"publish","type":"post","link":"https:\/\/sites.wsagames.com\/sl1c22\/2025\/11\/10\/block-fill-and-maze\/","title":{"rendered":"Block Fill and Maze"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">The inspiration for this game mechanic came from an offline mini-game collection I had downloaded on my phone. Whenever my phone was without internet, I would open this collection, and among the many games, I played the Block Fill game the most.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">By contrast, other games like <em>Water Sort<\/em> quickly became boring after a few plays, while some puzzle games, such as <em>Cross Sums<\/em> and <em>Sudoku<\/em>, makes me feel mentally exhausting.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><em>lock Fill<\/em> stands out because I can play it repeatedly without losing interest. Its simple, repetitive mechanic is balanced by varied block layouts for each level, along with rewarding sound effects and satisfying level completion animations.<\/p>\n\n\n\n<div class=\"wp-block-media-text is-stacked-on-mobile\" style=\"grid-template-columns:39% auto\"><figure class=\"wp-block-media-text__media\"><video controls src=\"https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/RPReplay_Final1768006702.mp4\"><\/video><\/figure><div class=\"wp-block-media-text__content\">\n<p class=\"wp-block-paragraph\">Block fill game example in my phone.<\/p>\n<\/div><\/div>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"Single Line Block Fill Puzzle All Levels 21-35 Game Walkthrough\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/3TLzHt4gy3Y?list=PLVkrZ2DsdwYuLs4KHol04VyzbHm3yeyjn\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Moreover, the gameplay of <em>Block Fill<\/em> reminds me of maze games. The blocks can be seen as a maze, where the player must trace a continuous, non-repeating line to escape. This is conceptually similar to escaping a fairy ring, which also requires a specific method to get out. For this reason, it would be a suitable gameplay element to combine with the fairy ring concept.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Based on this game mechanic, I designed several levels. However, after testing with classmates, I realized that the difficulty might be a bit too high. I will adjust the difficulty in future updates.<\/p>\n\n\n\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-49329d62 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"Single Line Block Fill Puzzle All Levels 21-35 Game Walkthrough\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/3TLzHt4gy3Y?list=PLVkrZ2DsdwYuLs4KHol04VyzbHm3yeyjn\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<figure class=\"wp-block-gallery has-nested-images columns-default is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-full\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1454\" height=\"2560\" data-id=\"1639\" src=\"https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-1-scaled.jpg\" alt=\"\" class=\"wp-image-1639\" srcset=\"https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-1-scaled.jpg 1454w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-1-170x300.jpg 170w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-1-582x1024.jpg 582w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-1-768x1352.jpg 768w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-1-873x1536.jpg 873w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-1-1163x2048.jpg 1163w\" sizes=\"(max-width: 1454px) 100vw, 1454px\" \/><\/figure>\n<\/figure>\n<\/div>\n\n\n\n<h4 class=\"wp-block-heading\">Mechanics prototype<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Building on the <strong>block fill<\/strong> concept, I explored two interaction approaches: movement achieved through <strong>dragging objects <\/strong>with the Fungus plugin, and movement controlled via <strong>WASD keyboard input<\/strong>.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Using Fungus<\/h5>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"Example1 (Block Fill and Maze)\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/Y6kTpaSENLk?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">For the Fungus plugin, implementing drag-and-drop interactions is relatively straightforward. By attaching Fungus\u2019s built-in scripts to an object and selecting the desired actions in the Flowchart, basic dragging behaviour can be achieved. However, the main challenge lies in handling feedback after the drag interaction.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In the prototype level, I used 36 individual blocks. If each block is meant to trigger a change when entered, a separate Fungus Block would need to be created for every single one. Additionally, resetting all blocks to their original state after the mouse is released would require toggling 36 separate variables within the mouse-release Fungus Block.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"637\" src=\"https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-40-1024x637.png\" alt=\"\" class=\"wp-image-2126\" srcset=\"https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-40-1024x637.png 1024w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-40-300x187.png 300w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-40-768x478.png 768w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-40.png 1072w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<div class=\"wp-block-media-text is-stacked-on-mobile\"><figure class=\"wp-block-media-text__media\"><img decoding=\"async\" width=\"240\" height=\"426\" src=\"https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/\u65e0\u6807\u9898\u89c6\u9891\u2014\u2014\u4f7f\u7528Clipchamp\u5236\u4f5c.gif\" alt=\"\" class=\"wp-image-2125 size-full\" \/><\/figure><div class=\"wp-block-media-text__content\">\n<p class=\"wp-block-paragraph\">When the drag interaction ends and the logic is executed, the length of the command is kind of terrifying. Each variable needs to be manually specified, resulting in a highly repetitive and inefficient workflow.<\/p>\n<\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Reducing the number of tiles in later levels could help lower the workload to some extent. However, a more fundamental issue still remains.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In the video, I deliberately constrained the dragging direction. In practice, the drag direction can be changed freely, meaning that players can move diagonally. This breaks the core rule of having a single, non-repeating path.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">At present, I have not identified an effective solution. Nevertheless, the strength of Fungus as a tool is evident. For a designer without programming experience, it offers valuable support and lowers the technical barrier significantly.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">If I choose to continue using Fungus, further exploration will be necessary in order to address the issues mentioned above and find a workable approach.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Keyboard input<\/h5>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"Example 2 (Block Fill and Maze)\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/1DUxGHmO55Y?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">After discovering the limitations of the Fungus plugin, I started to investigate other possible solutions. Through a tutorial video I found on YouTube, I managed to implement directional constraints, allowing the player to move only along horizontal and vertical axes.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"Grid Based Movement in Unity\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/mbzXIOKZurA?start=64&#038;feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1599\" src=\"https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-38.png\" alt=\"\" class=\"has-border-color has-primary-border-color wp-image-2122\" style=\"border-width:5px\" srcset=\"https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-38.png 2560w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-38-300x187.png 300w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-38-1024x640.png 1024w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-38-768x480.png 768w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-38-1536x959.png 1536w, https:\/\/sites.wsagames.com\/sl1c22\/wp-content\/uploads\/sites\/14\/2025\/11\/image-38-2048x1279.png 2048w\" sizes=\"(max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Although this solution addressed one issue, it also introduced new problems. Character movement driven by code could not be triggered through Fungus commands, and achieving similar feedback would require traditional coding, which I found extremely challenging.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Although I could ask my tutor for help, I have almost no programming background and was unable to find similar tutorials. As a result, I lacked a clear starting point for seeking guidance, which became a serious issue for the project.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Based on these results, if I want to continue developing this mechanic, I will need to conduct further in-depth exploration within Fungus.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">More Information: <\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/sites.wsagames.com\/sl1c22\/2025\/11\/30\/week-9-presentation\/\" data-type=\"link\" data-id=\"https:\/\/sites.wsagames.com\/sl1c22\/2025\/11\/30\/week-9-presentation\/\">Week 9 Presentation<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/sites.wsagames.com\/sl1c22\/2026\/01\/08\/phase-4-feedback\/\">Phase 4: Feedback &amp; Reflection<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>The inspiration for this game mechanic came from an offline mini-game collection I had downloaded on my phone. Whenever my phone was without internet, I would open this collection, and among the many games, I played the Block Fill game the most. By contrast, other games like Water Sort quickly became boring after a few [&hellip;]<\/p>\n","protected":false},"author":15,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[74,77],"tags":[],"class_list":["post-1635","post","type-post","status-publish","format-standard","hentry","category-game-ideas","category-research-phase-4"],"_links":{"self":[{"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/posts\/1635","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/users\/15"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/comments?post=1635"}],"version-history":[{"count":13,"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/posts\/1635\/revisions"}],"predecessor-version":[{"id":2292,"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/posts\/1635\/revisions\/2292"}],"wp:attachment":[{"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/media?parent=1635"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/categories?post=1635"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sites.wsagames.com\/sl1c22\/wp-json\/wp\/v2\/tags?post=1635"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}