jonas.gaden

I am currently working on improving the UI, and including more modals. This is a process, as a lot of how the UI works needs to be completly redone, after i implemented how I want modals to behave, which again, is very, very helpful for adding new stuff.
This rework focuses mainly on replacing the former rows with the new Card based layout, to account for now layout based variables and dynamic modal generation. The UI is not final and a lot of buttons will be replaced by material icons, Google Icons, which is my favourite choice for adding icons fast to a web project.

I implemented the first modal, which can be accessed under File>Page Setup, which is used to edit what was previously on the document tab. The new Modal unifies this and makes the UI feel less bloated.
In addition, I added the small indicator below the Card Designer title which now shows the Project/Card Deck name and the specifications of the card.

In order to move on, i built a modular and easy-to-use Modal class, which allows me to minimize the amount of code and work needed to spawn a modal with data input. As i am building an editor, this will become very useful soon, as I currently need to hardcode every single one of the Modal which i have.
To provide an example, this can be used to create a new Modal for Card Deck creation.

I am currently migrating to a Material Design like user interface, but got a lot of work still to do. I implemented the first viable version of the card generator based upon a project i did a few months ago. The generator itself works now, but is currently quite unintuitive. I am doing my best to change that

The very first step was to build a simple data driven card generator. I did this using typescript classes to ensure they can be extended later. With that the card would be very customizable, which would lead to more boilerplate but that’s a cost to take.

I implemented the first version of the mayor system, which gives players the ability to run for mayor and encourages them to serve multiple cities, as they will receive a Kontor in every city where they are mayor. Also, they can fund more citizens and additional productions to improve the cities output. This should make city management feel more rewarding and give players stronger long-term goals.
I also added new tutorial steps, including one about scarce goods, to better introduce players into the game. These steps should help new players understand key mechanics earlier and reduce confusion. The tutorial now covers more of the core gameplay loop in a clearer way.

I added a new Scarce Good function, which now can easily render icons of the most scarce good. I implemented this in the Satisfaction algorithm, and added the field in the Market component. All in all, a quite simple update, thanks to my modular architecture.

This is a major overhaul of the GUI, i removed the previous Input and Output area to introduce the new Modifier Settings. Within this panel, users can view and adjust active toggles, modify production rates, and apply modifiers directly. These controls allow users to customize the calculator’s behavior and adjust production parameters. Tooltips and metadata containers provide contextual information, enhancing the user experience by explaining settings and options as needed.
With the items now fully implemented, it was time to give the design a updated look. I did other minor changes to the style, but only small details

I lost my mind on extracting the items from the game files using the help of the assets-extractor tool, which provides an XML Schema as a python notebook. Note that the XML data is very well structured, but no suited for extracting and merging data as an JSON file. Essentially I queried up to 30 XML files in order to create one useful JSON file. Building the notebook took way to long, but as i am not familiar with Python, i had no choice.

I even realized there was an Developer Mode item, which boosts production chains by 999%.

I successfully implemented the abstract Production Modifiers. This helps enormously with the future implementation of effects other than the Aqueducts. I have still to figure somethings out, but i will get there eventually.

I fully merged the old javascript logic into the new typescript logic. Now i will move over to make the system more modular, to add item support for example. Currently i am still facing an issue, where the inputs would use their ID and not their display name in the graph. I also further improved my devtools, where the dev server would now generate a simple DIR overview if a dictionary is requested instead of 404

Before getting started on the actual revamp, i chose to improve my devtools. I merged all previous devtools into a single TS file, which now triggers using flags “–dev” and “–build”. If none of those flags is provided , just the recipe list is rebuilt. This update lays the ground for quick and efficient debugging and building. Using pre-commit, a build is now created automatically when commiting to the repo.

Whats the current state?

The calculator has been first developed with the release of Anno 117: Pax Romana on November 11, 2025.
It helps users to plan and layout their production chains for the game which can get crazy and complex pretty fast.

On November 28, 2025 the calculator was featured by Ubisoft in their offical blogbost on Anno Union, the offical homepage for the anno series. => https://www.anno-union.com/union-update-useful-community-tools/

To making the game more interesting, i knew the next step would be to add ship building and fleet control. Thanks to my modular approach for this game (Entity Component System), it was fairly easy to add multiple ships, essentially just adding the keybinds and logic to switch the active ship. However, adding the shipyard meant the introduction of a new component called “ShipBuildOrder” as I decided, that the ships would need resources as well as time to be built. In combination with a new System this task was fairly easy once again thanks to my modular approach for this game.
The UI is not final, i will probably have a new approach on it in the next major devlog.

Economy Devlog

I heavily edited the parameters of the economy calculations and therefore adjusted the entire system. This includes changes to the algorithms, such as a price stabilisation if the city demand is zero (because it’s only produced but not demanded, which previously resulted in prices stuck on the base price, due to a missing NaN check in the algorithm). On the otherhand all productions have been lowered to 1/7 of the previous values.

Following a productive testing session in Slack, it became clear that a dedicated tutorial system was essential for helping players grasp the core mechanics and objectives. I have integrated this educational component alongside several key polish updates to ensure the game is ready for shipping, such as refining the ship’s texture and optimizing the visual rendering of ship names. To enhance the overall user experience, I also implemented a dedicated fullscreen button that allows players to toggle between display modes seamlessly. The new tutorial itself can be accessed at any moment via a question mark icon located conveniently next to the fullscreen control, providing comprehensive guidance that covers both the technical input schemes and the nuances of the gameplay strategy.

I tried to balance the game as much as possible, as the algorithms have become quite complex. In addition the gametime system was updated and is now shown to the HUD.
As it turned out, there were cities filling bankruptcy within 2 weeks game time, caused by the shadow market algorithm, which bought the overflow way to cheap and then sold it to profit.
The system is still not perfect but it has been approved a lot. Future steps are the addition of multiple ship (naturally) and the ability to actually build kontors in other cities. And a new tutorial will be the very first next step.

I am currently implementing a few new algorithms to control the economy, which is very tedious and will take atleast 3-5 hours from now. There are four central algorithms, which i will implement:

• PriceAlgorithm (Done)
• DemandAlgorithm (In testing)
• ShadowMarketAlgorithm (Next devlog, in testing)
• SatisfactionAlgorithm (TODO)

Also updated tutorial sequence design, to fit better in the with the new design.

I did an major overhaul of the GUI including a new trade interface, which will be the central instrument for my game. I was inspired by the slide functionality which is used by the awesome inspiration for this project, Patrician IV. It took a few minutes to figure out a good UI. The GUI is reactive, meaning it instantly updates when important values change here. If the player can buy or sell a good, it is indicated by the green or red gradient. Trading is as simple as dragging the handle, the slider uses log scale, so the user can buy a wide range of quantities.

I sucessfully implemented the pathfinding, in this code it works by letting the player select a destination city on the map, usually by shift-clicking on it. When this happens, the system first finds which city was clicked by checking which city is closest to the click position within a certain radius. It then finds the player’s ship and determines the ship’s current position. Using the navigation graph, it looks up the nearest node to the ship and the node for the destination city. If the ship is not already at the destination, it uses the graph’s findShortestPath method to calculate the shortest route between these two points. The resulting path is a list of node IDs, which are then converted into world positions. To make the route look smooth and natural, the code applies a smoothing function to these positions, creating a curved path instead of a jagged line. Finally, the ship’s navigation components are updated so that it follows this new path, moving from its current location to the selected city along the calculated route.

I implemented the basics of an Entity-Component-System, including a render system. Using the graph data (=> Devlog 1), I was able to load the harbors/cities from a json file, making the game data-driven. This update lays the groundwork for further advancements. Moving on from this, I will implement a pathfinding algorithm, make the HUD actually work and implement a trading system

I implemented the intro which launches on first game start. I spend like 20 minutes finetuning the background until I was happy and i believe it conveys the medieval vibe quite well. I also tried music generation via Gemini and was quite shocked how good it was. After the intro is finished, I moved on to editing the world map. This is a smaller devlog after all, because i dont want to spoil everything. Just one more thing to say, we are just getting started here and i am looking forward on what comes next.

I just started the project, setup a simple HTML dev tool which I used to map the entire Hanseatic League region. It will be the base for future pathfinding of the merchants ships. It consists of harbors and guidance points, which are the vertices, and edges between those two (Yes, its straight up Graph Theory). Each edge has a cost (currently just the length, maybe i add a few more modifiers) which will be used to determine the quickest path between two harbors and eventually enable AI players (in the future!!!).

Quick and simple update, i added a loading screen to the application, as I got some feedback that the load time for the MP3 files can be quite long. This change should make the loading time more transparent.

Changelog

• feat: implement loading screen for audio assets and update game start sequence

I added another theme: redshift, as well as updating the “tagesschau” design. My personal favourite theme is still the “tech” theme which has the clean, technical look with lime green as accent color.

Alright, so a couple of things happened today that are worth talking about.

First off, the CLI got some love. The interactive prompts are cleaner, the configure flow is smoother, and the overall experience of setting up a site feels a lot smoother. Some code cleanup was done along the way too - nothing glamorous, just the usual “why did I write it like that” moments.
On the more exciting side - Flavortown API integration is now a thing. Drop flavortown.exe into your project directory, punch in your API key, and it’ll pull all your devlogs and serialize them into articles automatically.

In addition, i built a advanced installer for the app, which also registers the newspage command using Inno Setup Compiler

NewsPage is a static blog generator and in-browser editor focused on news-style articles (or flavortown devlogs => Next devlog). Authors write content as Markdown files in articles and look-and-feel is provided by the CSS themes in themes. The CLI (cli.ts) converts bundles the articles into a static website using the templates in src and applies the chosen theme. A local dev server and live editor preview (editor.html) let you iterate quickly while build helpers in lib/ handle image normalization and output generation. The typical workflow is: serve the local server, edit Markdown, click save, click rebuild site in the editor, preview locally, then publish the static output.

I fully implemented the game and added a cosmetic missile indicator. Without spoiling too much, you’re mission is to prevent a nuclear war within a strict time limit of 5 minutes. You need to navigate the phone menu without getting distracted to save the world. To remind you whats on stake here, a clock starts ticking on 2 minutes left and becomes more intense once you reach 60 seconds.
The game feels viable and immersive through the inclusion of sound effects, wherever possible.

I recommend headphones for the best immersive experience of the game.

Changelog

• fix: correct grammar in tutorial text
• Update audio management
• Enabled the tutorial to start correctly in GameEngine.ts by uncommenting the tutorial start line.
• Update README.md with project details, installation instructions, and features
• first commit

Attention spoiler: I sat down and designed the application flow how my app should work. Now, this was the easy part. I needed a way to model a branching phone menu system from a hand-drawn sketch, where the player navigates an automated hotline to ultimately launch an interception missile. The core abstraction i landed on was a directed graph: each GraphNode holds an audio key, a navigation mode, and a map of digit keypresses to successor node IDs. Two input modes drive all interaction — navigation, where a single keypress immediately routes to the next node, and code_entry, where digits buffer up and Space confirms, used for codes. A third mode, passthrough, handles dead-end informational nodes that auto-advance after their audio finishes with no player input required. Every node’s spoken text is defined in phoneGraphNodes.json with a stable audioKey that maps directly to an audio file, making it straightforward to record and swap voice lines independently of the graph logic.

I setup the project by creating my build chain (dyamic dev server via Bun runtime) and outlining a basic idea. Please note that the video below has been shortend in order to don’t spoil the story too much. I already implemented the Tutorial / Intro and title screen, including sound effects and animations for the intro. The game is intended to be fully immersive and lock you in for a couple of minutes. I will share more progress soon

I updated the replay mechanism, you can now press space to play again. In addition, some code clean up was done, and i noticed that the time has been tracked in two different Hackatime project (opsi). Nevertheless, here is a better explanation why I switched to Ncurses (effectivly dropping Windows support):
In the initial C++ version, rendering was a manual battle against screen flicker. You had to calculate terminal dimensions using ioctl, manually position the cursor and manage color states with ANSI codes. To prevent the screen from strobing every frame, the code relied on a custom “line-diffing” algorithm that only updated lines that had actually changed. This worked, but it was brittle. If the terminal resized or if a single character was miscounted, the entire layout would shatter. That is completely gone with the new Ncurses version.

I added the Settings app and a much wanted feature: Finally you are able to load your own background images into QuackOS. Because just pasting an img URL would be way to easy, there is more: I integrated the Pixabay API (after searching for 10 minutes straight where on earth to get the needed api key) to implement a search function which provides useful meta data and has a higher rate limit than e.g. Unsplash. As another small QoL change, I introduced a new layout for the drawing app. Whilst i am not entirely happy how it turned out, its a great improvement compared to before. Especially a few bugs were resolved, such as the app crashing when minimizing or resizing (this was due to missing guardrails allowing the canvas size to go to 0 * 0) and some weird glitches when leaving the drawing area and then coming back in.

In this latest update, I refined the dice roller by improving its layout and expanding its functionality to support up to five dice simultaneously. To enhance the visual navigation of the Games Hub, I integrated icons into the game selection window, creating a more polished experience. The most significant change involves replacing the original About Me window with a Home window, which serves as a information hub. This new interface provides users with a more detailed overview of the project, including direct access to Github and specific documentation/tutorial regarding the desktop, taskbar, and application architecture to ensure a more transparent and informative user experience when trying my project.

A lot of small QoL changes and a few little gimmicks such as a Games Hub, which currently includes classic additions like Blackjack and Tic-tac-toe, alongside a functional dice roller. Beyond the new applications, I improved the core window management system to support maximizing windows and integrated the prefers-color-scheme media query, allowing the entire interface to adapt seamlessly to the user’s system-wide theme. To ensure visual harmony across the desktop, the graphing utility has been updated to be color-sensitive, ensuring its interface and visualizations better align with the overall color schema and maintain the cohesive design language established in previous updates.

I added a new app for graphing functions and unified the icons layout by creating app icons that fit my style guide. The grapher supports basic mathematical functions and provides a clean interface for visualization. Additionally, I standardized all desktop icons to follow consistent design patterns, making the overall UI feel more cohesive. The new icons were created using the Apple Icon Composer and Google Material Icons.

Changelog

• feat: Add Grapher application for plotting mathematical functions

I implemented new apps, such as a new Browser, Google Maps, a Calculator and a Paint app in additon to finishing the taskbar, which now features a smooth, macOS-inspired hover animation. I also built in window management logic so that clicking an app icon toggles the visibility of all associated windows, effectively hiding or showing them with a single action.
Regarding the architecture, while the Rick Roll and Google Maps features function as IframeWindows, the Calculator, Web Browser, and Paint applications are built with their own custom logic and unique internal structures (by extending BasicWindow). To ensure visual consistency, the styling is handled through an internal basic library. This allows the applications to remain fully responsive and look polished immediately, simply by organizing the underlying HTML code without the need for manual CSS overrides for every new feature.

I am building a highly modular system where adding new apps is essentially just a matter of extending the base app class. The core logic is separated into three dedicated managers: DesktopManager, WindowManager, and TaskbarManager.

The DesktopManager is responsible for the desktop surface itself - it handles icon placement, desktop interactions, background rendering, and overall workspace coordination. It manages the representation of available applications and acts as the primary interface for launching and holding new app instances.

The WindowManager controls all window-related behavior, including creation and destruction, focus handling, z-index ordering, dragging, resizing, minimizing, maximizing, and state persistence. Each window represents a running application instance, and the WindowManager ensures correct lifecycle management as well as smooth user interaction.

The TaskbarManager manages the taskbar at the bottom of the screen, displaying running applications, enabling quick switching between them, providing visual feedback for active windows, and handling the dock-style launcher for pinned apps. It effectively serves as the central hub for fast access to both active and favorite applications.

I switched to ncurses for overall better performance and visual layout (at the expense that the app does not longer work on Windows), but accidentally deleted my latest blogpost (no clue what i was doing)

Changelog

• Update README with ncurses installation instructions
• Refine README for build instructions
• Implement Tetris game with enhanced rendering and controls
• initial commit: add README with project description, features, controls, and build instructions
• first commit

I focused this update around rockets and finishing my basic idea of the app.
The game now tracks estimated travel time in minutes, which decrements as real time passes. Rockets can be configured to run automated sell routes, where they repeatedly travel between two locations, transporting goods for sale.
Exploration missions use rockets to establish colonies on new worlds. Once a rocket arrives at an unexplored location, a colony is automatically founded, opening that location for future operations.
Expansion to the Moon, Mars, and space stations unlocks access to location-specific production bonuses (and goods that can only be manufactured in those environments !!planned!!).

I added another flavour (theme) to my Mars Inc. game, in addition to technical additions and improvments.

Notable changes include, but are not limited to:

• When the stock is zero, the “Sell all”-button is now disabled
• The build cost of modules now scales with the amount of the modules: U(n) = 50 * 10^(n/2)
• Additional goods were added (Solar Panels, O2, …)
• The ability to build rockets was added and is requiring a rocket lab module
• A warehouse / storeroom module was added which increases the storage of the colony

I focused this update on quality-of-life improvements, cleaning things up before moving on to the bigger systems. The Sol counter and progress bar are now fully integrated and update automatically as time advances, giving clearer feedback on progression. I also reworked the world market’s visual design to make it feel more distinct, with a layout that better communicates its role in the game.

On the usability side, I rearranged the action buttons and introduced category-specific icons, making it easier to scan and differentiate between goods at a glance. Behind the scenes, I refactored module placement to support infrastructure modules. That change doesn’t do much on the surface yet, but it lays the groundwork for more dynamic colony personalisation and deeper customization options in future updates.

I built the project around small, focused classes that each handle one job. Entities manage colonies and modules, data classes keep track of stats and upgrades, and controller classes (like LevelManager and TickManager) orchestrate everything that happens. I kept the GUI completely separate, giving it its own module with clean, typed builders and formatters so the visual layer stays independent from the game’s brain.
For progression, I made the level system deterministic and data-driven. Each level holds its baseline stats, experience targets, and upgrade rules all in one place. The level manager handles transitions smoothly, applies upgrades to the numbers that matter, and gives the UI read-only snapshots to display. Numbers scale using custom letter notation for those massive late-game values (just like Idle Miner Tycoon [K, M, B, T, aa, ab, ac …]), and upgrade costs flow directly from the level parameters.
The tick system is the heartbeat of everything. It runs a controlled update loop that advances time, processes queued actions, and syncs state changes at a consistent rate. Each tick fires events that managers and the GUI listen to, batching their updates together.

I started by sketching a new layout - one that would make resource management and navigation more intuitive, while also giving the game a sleeker, more “Martian” feel.

I introduced a notification system, so players can see important events at a glance. The new hotbar and modal windows help keep the interface clean, letting players focus on what matters most. I also added crisp Material icons for actions like launching rockets, upgrading, and managing water or solar power, which really brought the UI to life.

Changelog

• Enhance UI with new header, notification, and upgrade sections; update styles for improved layout and responsiveness
• first commit

Today I wrapped up some tweaks to the MiniMessage project:
I standardized the style tags in generateMiniMessage for better consistency. No more little inconsistencies popping up. Over in generatePreviewHTML, I added fallback colors to avoid weird defaults, and used nullish coalescing for smarter color handling. Feels more reliable now. Added a collapse button to toggle between individual lines and the full lore.
CSS got some updates too: scrollbar styling for a cleaner look, button adjustments for better usability. Added a snackbar for notifications with simple fade animations—nothing fancy, but it gets the job done without being intrusive.
In additon, i added the ability to drop a json project and its instantly being opened in a new tab. I added a mobile mode to make the app very good usable on mobile

Changelog

• feat: enhance editor functionality with mobile gradient support and close button
• Refactor minimessage generation and update styles

This is the first major version for my version. Item Creator is my lightweight web application built with Bun and TypeScript, designed to generate MiniMessage-formatted text for Minecraft servers. The architecture is refreshingly simple: no frameworks, just vanilla TypeScript with custom CSS styling.
The core logic resides in app.ts, handling UI interactions and state management for lines and text segments. minimessage.ts contains the formatting engine that converts styled segments into valid MiniMessage syntax, supporting gradients and text decorations. Type definitions in types.ts ensure type safety across the application.

You can try the app right now in this project

I improved a lot, first of all the UI and the web service were improved.

• Added a racer page to view the stats of individual racers
• Added a splash screen page (if used as streaming layout)
• Added a load animation for the leaderboard

In addition, i ported the plugin to 1.21.10 / 1.21.11 which took quite some time. Some minor changes to the plugin were made, such as hidding log messages, if the waypoints are not shown.

a small demo (not from the current version) is attached below

There will be a devlog soon, which further explains how the plugin and server work

I added a GUI (which is experimental) to allow the dynamic mixing of Patterns, to create quite funny results

Version v0.1

• Playable version
• Full ANSI Color support
• Work in progress version

Continued working and adding new shapes and patterns

First version: Using structs i implemented a Pattern type, which holds a boolean map of each pixel (on, off). Then I implemented logic operator overloading and visualised the results. Turned out quite funny

I fixed a few errors, removed the lowercase handler in the Minecraft plugin and fixed some CSS. Small change after all