diff --git a/src/diary/entries/200806 b/src/diary/entries/200806 index e419d37..bba6692 100644 --- a/src/diary/entries/200806 +++ b/src/diary/entries/200806 @@ -5,6 +5,10 @@ august 6, 2020

Blessfrey is a 2D action RPG developed for PC by me, chimchooree.

+ + (image: Lots of Angels and other characters at a shopping center) +
+
The game is designed to pit your skill + creativity against a series of combat + puzzle challenges while exploring the depths of the downtown dungeon.

Class progression is freeform, and virtually no decision is permanent. At character creation, you will choose a permanent First Class, but you can unlock several new classes for multiclassing through gameplay. Through swapping out Second Classes, you can find a combination to express your playstyle.
diff --git a/src/diary/entries/200820 b/src/diary/entries/200820 index b801000..6fe6ead 100644 --- a/src/diary/entries/200820 +++ b/src/diary/entries/200820 @@ -5,7 +5,7 @@ august 20, 2020

pixel joy is a small, round sans-serif pixel font, made using fontstruct's FontStructor for an old version of blessfrey. Freely use and edit for your personal and commercial projects. No credit needed.

-Download it from fontstruct @ https://fontstruct.com/fontstructions/show/1596262/pixel-joy.
+Download it from FontStruct.

image: pixel joy font preview


diff --git a/src/diary/entries/200831 b/src/diary/entries/200831 index 3455476..8442d47 100644 --- a/src/diary/entries/200831 +++ b/src/diary/entries/200831 @@ -5,7 +5,7 @@ august 31, 2020

tuesday, august 4


wednesday, august 5

@@ -24,18 +24,16 @@ august 31, 2020

saturday, august 8


sunday, august 9


@@ -52,13 +50,13 @@ august 31, 2020

monday, august 17


august 18 - august 21


@@ -69,7 +67,7 @@ august 31, 2020

sunday, august 23


monday, august 24

@@ -79,7 +77,7 @@ august 31, 2020

tuesday, august 25


wednesday, august 26

diff --git a/src/diary/entries/200903 b/src/diary/entries/200903 index d5b5fac..ad5f219 100644 --- a/src/diary/entries/200903 +++ b/src/diary/entries/200903 @@ -3,14 +3,14 @@ september 3, 2020
#gamejam

-WeeklyGameJam is weekly theme-based game jam hosted through itch.io. It's fairly laid-back for a jam, giving you a full week's time, allowing for pre-made/stock assets and code, and being understanding of late submissions. Most people make videogames, but any kind of game is allowed. At the end of the week, streamers will play and critique the submissions while the devs hang out in their chat.
+WeeklyGameJam is a weekly theme-based game jam hosted through itch.io. It's fairly laid-back for a jam, giving you a full week's time, allowing for pre-made/stock assets and code, and being understanding towards late submissions. Most people make videogames, but any kind of game is allowed. At the end of the week, streamers will play and critique the submissions while the devs hang out in their chatrooms.

(image: Key art of Elwell and Small Thing, buried in dogs)



small thing that makes things


-I participated in Week 85 under the theme Offspring, submitting my game on February 27, 2019. My game was Small Thing That Makes Things, an adventure platformer. You can play it on itch.io @ https://chimchooree.itch.io/small-thing-that-makes-things.
+I participated in Week 85 under the theme Offspring, submitting my game on February 27, 2019. My game was Small Thing That Makes Things, an adventure platformer. You can play it on itch.io.

You play as Hamish T. Elwell, the hero accountant of an overcrowded animal shelter, investigating the recent explosion of the local stray population. You can walk, jump on platforms, collect items, and chat with NPCs. There's multiple endings, depending on your choices.

@@ -19,21 +19,21 @@ You play as Hamish T. Elwell, the hero accountant of an overcrowded animal shelt
For a week-made game, I think STTMT is pretty cute, and I'm pretty happy with it.:)

-I actually finished a game, and someone actually finished playing it on a stream. That's really cool, even if STTMT isn't all that good. The deadline forced me to make final decisions, complete features, and move on, and there's a lot of value in actually finishing instead of forever polishing ideas and assets.
+I actually finished a game, and someone actually finished playing it on a stream. That's really cool, even if STTMT isn't all that good. The deadline forced me to make final decisions, complete features, and move on, and there's a lot of value in that.

-The short time-frame forced me to get around to every aspect of game development, many of which I had never done before. I had to learn how to export my Godot project, upload an HTML5 game, and make sure the exported game was complete and playable. Lots of the features were first-times for me, too. I've never written code for platformer movements or moving cameras. This also was the first time I've really gotten branching and conditional dialog working in Godot.
+The short time-frame forced me to get around to every aspect of game development, many of which I had never done before. I had to learn how to export a Godot project, upload an HTML5 game to itch, and make sure the exported game was complete and playable. Lots of the features were first-times for me, too. I've never written code for platformer movements or moving cameras. This also was the first time I've really gotten branching and conditional dialog working in Godot, which was a skill I immediately applied to blessfrey.


mistakes


-I recolored OPP's pixel art and lost the high contrast for the rock ledges. They blend into the rocky background, so you can't tell you can jump on them. Joshua McLean pointed this out during his stream, and I didn't even noticed until then. Having more eyes on your game is so important.
+I recolored OPP's pixel art and lost the high contrast for the rock ledges. They blend into the rocky background, so you can't tell you can jump on them. I didn't even notice until Joshua McLean pointed this out during his stream. Having more eyes on your game is so important.

-Also the level design is just not interesting. I spent lots of time on the choices and adventure game aspects, while the platforming as an extreme afterthought. It's a game jam, though, what do you expect lol?
+Also the level design is just not interesting. I spent lots of time on the choices and adventure game aspects, while the platforming as an extreme afterthought. It's a game jam, though, what do you expect?

I took the easy way out with animation. I might have learned more working from scratch, but modifying OPP's sprites to suit my character designs was way faster when I was already struggling to finish on time.


-

screenshots

+

screenshots + progression

(image: Elwell and Small Thing in a jumble of dogs) diff --git a/src/diary/entries/200917 b/src/diary/entries/200917 index a5caee9..d0b984a 100644 --- a/src/diary/entries/200917 +++ b/src/diary/entries/200917 @@ -3,20 +3,18 @@ september 17, 2020
#programming

-Coroutines are functions that, instead of running to completion, can yield until certain criteria is met. Godot Engine supports coroutines through yield ( Object object=null, String signal=""), resume, and the GDScriptFunctionState object.
+Coroutines are functions that, instead of running to completion, can yield until certain criteria are met. Godot Engine supports coroutines through yield ( Object object=null, String signal=""), resume, and the GDScriptFunctionState object.

why use a coroutine?


-Coroutines allow for scripted game scenarios that respond dynamically to the player and the changing game world. They let you bounce between functions, step-by-step, and respond to interruptions.
-
-They allow for functions to be called at the completion of other functions, animations, player actions, in-game events, or timers. Add in interruptions and conditionals, and you have a tool for building a responsive game world.
+Coroutines allow for scripted game scenarios that respond dynamically to the player and the changing game world. They let you bounce between functions, step-by-step, and respond to interruptions. This means functions can be automatically called at the completion of other functions, animations, player actions, in-game events, or timers. Add in interruptions and conditionals, and you have a tool for building a responsive game world.


stoplight example


As a basic example of coroutines in Godot Engine, I made a stoplight. Follow along with my code on GitLab.

-In my example, the light changes every few seconds, going from green, yellow, then finally red. The light changes immediately if the Walk Button is pressed. This project demonstates methods that wait + resume, and also demonstrates the player affecting the timing of events through his actions.
+In my example, the light changes every few seconds, going from green, yellow, then finally red. The light changes immediately if the Walk Button is pressed. This project demonstates methods that can wait, resume, and be affected through player action.

@@ -39,9 +37,9 @@ I have a TextureRect background, an AnimatedSprite stoplight, a Sprite walk butt

animation


-(image: the AnimatedSprite Stoplight has 4 animations - default (which is no light), green, red, and yellow.)
+(image: the AnimatedSprite Stoplight has 4 animations - default (which is no light), green, red, and yellow.)

-The light is changed by setting its animation to one of these options. Each is one-frame - just the stoplight with the one of the lights colored in.
+The light is changed by setting its animation to one of these options. Each is one-frame - just the stoplight with the one or none of the lights colored in.


the code

@@ -61,23 +59,23 @@ This project has two scripts: Main.gd, which is attached to the root node, and L

how the code works


-At _ready(), wait() is assigned to the GDScriptFunctionState 'result' and is called for the first color, green. _ready() yields until the given function (wait) is completed.
+At _ready(), wait() is assigned to the GDScriptFunctionState result and is called for the first color, green. _ready() yields until the given function wait() is completed.

The wait method yields for the given amount of seconds then sets the stoplight to the given color.

-At wait's completion, _ready() calls wait() for yellow, then red. Each is called one at a time, waiting for the color to complete before moving on.
+At wait()'s completion, _ready() calls wait() for yellow, then red. Each is called one at a time, waiting for the color to complete before moving on.


interrupting the stoplight


-The Wait Button interrupts the wait times between colors. Before _ready() yields, it connects the 'pressed' signal on the Wait Button.
+The Wait Button interrupts the wait times between colors. Before _ready() yields, it connects the 'pressed' signal on the Wait Button.

-If the Wait Button is clicked during wait()'s yield, the GDScriptFunctionState 'result' resumes immediately, ignoring wait()'s yield timer. This time, 'result' has a string arg 'interrupted on green,' so it will print the result, change the stoplight's color, then print 'done: green.' The wait method is complete, so _ready() resumes and calls wait() for the next color.
+If the Wait Button is clicked during wait()'s yield, the GDScriptFunctionState result resumes immediately, ignoring wait()'s yield timer. This time, result has a string arg 'interrupted on green', so it will print the result, change the stoplight's color, then print 'done: green'. The wait method is complete, so _ready() resumes and calls wait() for the next color.


applications


-Here, I supplied a string to be printed at a button press, but the actual logic can be swapped out for anything. I use coroutines in blessfrey's skills to manage the flow of phases from activation, different phases of effects, cooldown, and interactions with any counters. I also use it in the basic weapon attack so the character continuously swings at the rate of his attack speed until he cancels, uses a skill, or moves. It could also be used for something like cars that stop and honk when the player steps in front of them and drive off once the path is clear.
+The outcomes in this example be swapped out for anything. I use coroutines in blessfrey's skills to manage the flow of phases from activation, different phases of effects, cooldown, and interactions with any counters. I also use it in the basic weapon attack so the character continuously swings at the rate of his attack speed until he cancels, uses a skill, or moves. It could also be used for something like cars that stop and honk when the player walks in front of them and drive off once the path is clear.

Coroutines enable lots of practical ways to improve the flow and interactivity of your game, so just keep experimenting.

diff --git a/src/diary/entries/200930 b/src/diary/entries/200930 index 400958f..a955ccc 100644 --- a/src/diary/entries/200930 +++ b/src/diary/entries/200930 @@ -1,25 +1,22 @@

september 2020: bye php, hello bottle

-september 30, 2020 -#bottle #css #git #html #regex #regularexpressions #website

+september 30, 2020
+#bottle #css #git #html #regex #regularexpressions #website

-

tuesday, september 1

+

wednesday, september 2

    -
  • sick day
    • +
  • Study examples of my favorite blogs, popular blogs, and just any blogs I can find from modern gaming, retro gaming, tech, cooking, beauty, and any genre
    • +
  • Determine essential features for my blog
    • +
  • Plan design of blog

-

wednesday, september 2

+

friday, september 18

    -
  • Look at examples of my favorite blogs, popular blogs, and just any blogs I can find from modern game, retro game, tech, cooking, any genre.
    • -
-
-

friday, september 18

-
    -
  • switched from PHP to Bottle
    • -
  • hello world in Bottle
    • -
  • created templates for main pages
    • -
  • Used Bottle to fill values in a template using variables
    • -
  • Used Bottle to avoid repeating html code in navigation pane, header, and footer
    • +
  • decided to switch from PHP to Bottle
    • +
  • hello world in Bottle
    • +
  • created templates for main pages
    • +
  • Used Bottle to fill values in a template using variables
    • +
  • Used Bottle to avoid repeating html code in navigation pane, header, and footer

friday, september 25

@@ -34,7 +31,7 @@ september 30, 2020

wednesday, september 30

 +
diff --git a/src/diary/entries/201001 b/src/diary/entries/201001 index 54a3fe5..a231949 100644 --- a/src/diary/entries/201001 +++ b/src/diary/entries/201001 @@ -3,33 +3,38 @@ october 1, 2020
#systemdiagram #gamemechanics

-System diagrams illustrate how components interact within a system. It saves so much headache to step back and plan a system out like this before jumping into the code.
+System diagrams illustrate how components interact within a system. It saves so much headache to step back and plan with a system diagram before jumping into code.

-
(image: system diagram for inventory)


+

stop + plan before coding


+I want to move blessfrey's inventory into an app on the player character's smartphone. Before, it was displayed in a random pop-up window. It was poorly planned, so the programmatic inventory and the UI were too tightly coupled to easily pop into the phone screen. Instead of wrestling, it's easier to start over and actually plan before I code this time.

-

stop + plan before coding

-I want to move blessfrey's inventory into an app on the player character's smartphone. Before, it was displayed in a random pop-up window. It was poorly planned, so the programmatic inventory and the UI were tightly coupled so I couldn't just pop it into the phone. Instead of wrestling, it's easier to start over and actually plan before I code this time.

+

list out your nouns


+A simple way to start thinking about a system is to list out its nouns + verbs. Jot down the entities that interact with your system.

-

list out your nouns

-A simple way to start thinking about a system is to list out its nouns and verbs. Jot down the entities that interact with your system.
+
(image: system diagram for inventory)


For blessfrey's inventory, that's the inventory (programmatic), the player character, the inventory app (UI), and base items. The inventory app is related to the smartphone and inventory items. Items are related to floor items, which are related to rooms.

-(blessfrey has three different kinds of items. Base Items are the code, which hold all the data relevent for the item no matter how it's expressed. Floor Items are the version that sit on the ground and get picked up by characters. Inventory Items are the version that are displayed in inventories, store windows, containers, etc. Floor and Inventory Items hold a base item inside them, that gets popped out and traded around as the item needs to be expressed in different forms.)
-
+(blessfrey has three different kinds of items.
+

+Floor + Inventory Items hold a base item inside them that gets popped out and traded around as the item gets expressed in different forms.)

-

connect your nouns with verbs

+

connect your nouns with verbs


I wrote the entities in pink and moved them around until the placement was decently readable. Then I connected the concepts with arrows. These arrows represent the verbs, which I explicitly labeled in yellow.

-The flow of these arrows can be very important. If you are modeling AI, for instance, no matter what path the program takes, there shouldn't be dead-ends. Seeing mistakes like that is easier with a diagram than lines of code. Otherwise, the flow is generally useful for figuring out which methods are needed for each class and how they connect.
+The flow of these arrows can be very important. If you are modeling AI, for instance, no matter what path the program takes, there shouldn't be dead-ends. Seeing mistakes like that is easier with a diagram than lines of code. Otherwise, the flow is always generally useful for figuring out which methods are needed for each class and how they connect.


-

write the code

-At this point, coding is a bit easier, now that it's in some ways a transcription of the diagram. The entities are data (classes or objects) and the arrows are logic (methods).
+

write the code


+At this point, coding is a bit easier now that it's in some ways a transcription of the diagram. The entities are data (classes or objects), and the arrows are logic (methods).


-

conclusion

-Your diagram doesn't have to be too fancy or formal to get the point across to yourself, and it just takes a minute to save all the headache later. Don't skip this step or you'll have to rewrite the inventory system just to display it in a different window.
+

conclusion


+Your diagram doesn't have to be fancy or formal to get the point across to yourself, and it just takes a minute to save all the headache later. Don't skip this step or you'll have to rewrite the inventory system just to display it in a different window.

diff --git a/src/diary/entries/201015 b/src/diary/entries/201015 index 8cbfb1c..622ad94 100644 --- a/src/diary/entries/201015 +++ b/src/diary/entries/201015 @@ -1,13 +1,68 @@ -

web development resources

+

making of blessfrey.me

october 15, 2020
-#accessibility #color #css #html #webdesign
+#bottle #css #html #simpletemplate #webdesign #webdev

-I'll collect frequently used resources for web design here.
+blessfrey.me is a personal website I use to showcase projects + blog my process. I originally wrote it in PHP, but now it's written in Bottle, a Python web framework.
+
+
+

why not use a pre-made blogging platform like WordPress?


+blessfrey.me's needs are fairly simple - just some static pages and a blog page. Generalized blogging platforms are overkill. I don't need support for multiple users, localization, e-commerce, and so on. Unused features only bog down the website, potentially contributing to poor performance + security vulnerabilities.
+
+Also, it's just fun to write my own. I'm learning a lot as I take my website from initial sketches, to Hello World, to various prototypes, to something polished enough to show my friends. Also, since it can be considered a programming portfolio, it just makes sense that it itself should be something I programmed.
+
+
+

why Bottle?


+I originally wrote blessfrey.me in PHP. I switched to Bottle after looking for a templating engine. Bottle comes with SimpleTemplate and can do everything PHP can do but faster + with less verbosity. Plus, you get to write in Python, which is always fun.
+
+
+

how does blessfrey.me work?


+

SimpleTemplate


+Instead of a static collection of HTML pages on my server, blessfrey.me's pages are constructed from SimpleTemplate templates and filled in using a Bottle script upon request.
+
+Every page uses the frame template below, so the basic skeleton is consistent and code for repetitive elements only has to exist in one place. Each page's content is made unique by bringing in a different template as {{!base}}. (Double curly brackets refer to variables, and exclamation marks disable escaping.)
+
+(image: basic template code.)
+
+(The code can be found on Pastebin.)
+
+The header template below (brought in at % include('header.tpl')) has some variables, too, which are supplied by the Bottle script. If Bottle doesn't provide a title, it defaults to 'blessfrey.me.' Variables can also be used in paths and URLs.
+
+(image: header template code.)
+
+(The code can be found on Pastebin.)
+
+You can insert Python code into the templates for dynamic pages. Below is an excerpt of the template for the diary page. This code fills the page with diary entry previews using a for loop. Not shown is the first line % rebase('frame.tpl'), which tells SimpleTemplate to insert this content at the {{!base}} variable in the frame template.
+
+(image: diary snippet code from diary template.)
+
+(The code can be found on Pastebin.)
+
+The Bottle script sends the max number of snippets per page (the limit) and a list of lists containing all the diary snippets. It receives the page number from the URL. For the snippets that will appear on the given page, it converts the list data into HTML code to be displayed in the browser.
+
+
+

Bottle


+Bottle takes URLs and generates the corresponding webpage upon request. Each URL is tied to a method, which returns a template and a dictionary of data to be used in the template. Since Bottle is a Python framework, you have access to all the Python libraries you need.
+
+(image: Bottle script excerpt for diary routes.)
+
+(The code can be found on Pastebin.)
+
+This is what the methods for specific routes look like. So every time you go to blessfrey.me/diary, one of the above methods is called, depending on whether also you supplied an integer. To generate the page content, it calls a lot of Python functions to find my diary entries, convert them into previews for the snippets section + headlines for the sidebar, and get the current time for the footer.
+
+
+
+

CSS


+The website is styled using CSS, heavily relying on the CSS Grid and a bit of Flexbox. CSS grids can be used inside CSS grids, so my pages are generally blocked out, with smaller internal grids managing specific content.
+
+(image: css grid traced over screenshot of projects page.)
+
+
+The projects page is an example of nested grids. Almost every page uses the yellow general layout. The content unique to the projects page is mapped out in green, with a section for the header, featured content, and unfeatured content. The unfeatured content uses a 2-column grid in blue to evenly space out all the little thumbnails.
+
+The CSS code for project's general grid + the nested unfeatured grid are shown below.
+
+(image: projects css code.)
+
+(The code can be found on Pastebin, but you can always see a webpage's CSS by right-clicking and viewing the source.)

- diff --git a/src/diary/entries/201029 b/src/diary/entries/201029 index 288c453..17318df 100644 --- a/src/diary/entries/201029 +++ b/src/diary/entries/201029 @@ -40,7 +40,7 @@ From Godot's top menu, go to Project>Project Settings...>Localization>Translatio (image: example of an id used in a script)

-It's really simple stuff. Anywhere you would have written a string, like "quit game," you instead use its id wrapped in tr(). So instead of label.set_text("quit"), you'd write label.set_text(tr("quit_game")). In this example, the id is "quit_game" and its corresponding text in English is "quit." +It's really simple stuff. Anywhere you would have written a string, like "quit", you instead use its id wrapped in tr(). So instead of label.set_text("quit"), you'd write label.set_text(tr("quit_game")). In this example, the id is "quit_game" and its corresponding text in English is "quit."

step 4 - set the game's language

@@ -54,7 +54,7 @@ Set the locale in your script, somewhere like _ready() or on a 'change language'

step 5 - continue adding to your spreadsheet


-Now that everything's in place, you can keep adding new ids and translations, and Godot will automatically update your changes.
+Now that everything's in place, you can keep adding new ids + translations, and Godot will automatically use your changes in-game.

that's the basics

diff --git a/src/diary/entries/201031 b/src/diary/entries/201031 index 6a59470..7efae42 100644 --- a/src/diary/entries/201031 +++ b/src/diary/entries/201031 @@ -4,31 +4,31 @@ october 31, 2020
#css #html #python #webdev #website

week 1


-bottle, python, regular expressions, website
+#bottle #python #regularexpressions #website
+

thursday, october 1



friday, october 2



saturday, october 3



week 2


-bottle, python, website
+#bottle #python #website
+

sunday, october 4