<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[Welcome to 7kayoh's blog]]></title><description><![CDATA[7kayoh is a very mysterious person! But, she write blogs!!]]></description><link>https://blog.7kayoh.net</link><image><url>https://cdn.hashnode.com/res/hashnode/image/upload/v1646321531315/slpPyDPCr.png</url><title>Welcome to 7kayoh&apos;s blog</title><link>https://blog.7kayoh.net</link></image><generator>RSS for Node</generator><lastBuildDate>Tue, 21 Apr 2026 23:07:43 GMT</lastBuildDate><atom:link href="https://blog.7kayoh.net/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[V5: Recode & Recode & Recode]]></title><description><![CDATA[Last year, we released V5, and then shut it down because of the bugs in it. Everything in development was going well. In fact, we did conduct tests on V5 to test out the performance and the UI, et cetera. Not until when we decided to release V5 –– UI...]]></description><link>https://blog.7kayoh.net/frappe-v5</link><guid isPermaLink="true">https://blog.7kayoh.net/frappe-v5</guid><dc:creator><![CDATA[nanako]]></dc:creator><pubDate>Sat, 05 Mar 2022 19:33:56 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1646511923278/dSb7XD43t.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>Last year, we released V5, and then shut it down because of the bugs in it. Everything in development was going well. In fact, we did conduct tests on V5 to test out the performance and the UI, et cetera. Not until when we decided to release V5 –– UI no longer work for no reason, poor gameplay performance, and even, backdoors.</p>
<p>The whole team (including the leadership team) felt in awkward, not the fact we got backdoor'd in V5, but the fact that we shipped a game that is <strong>really terrible</strong>.</p>
<p>So, what did we learn and what do we plan to do next?</p>
<hr />
<h2 id="heading-background">Background</h2>
<p>I am a Roblox game developer, of course. Just check my articles, they are pretty much all about Roblox development. I happen to work in a group called Frappé, employed as a developer working for the upcoming version V5 at 25/04/2020.</p>
<p>Development of V5 started in around 2017-2018, but it eventually got restarted due to some issues. Enters the re-V5, which is the current V5.</p>
<p>The UI was done, but there are a few missing parts in it. Some critical features were missing because the previous UI designer left. So I was employed to finish those missing parts and as well as finish some part of the backend.</p>
<p>We had a really tight deadline when I was employed to work on it. I think we had only 3-4 months left before shipping it to the public, so we have to rush finishing most of the part (horrible idea). Therefore, this leads to low-quality code and introduces a lot of bugs in the game that still remains unfixed when the game launches. V5 also uses some of the code in previous version, and previous version is a combination of code in older version and new code, which makes it a lot worse because consistency between code is lost.</p>
<p>We tested the game multiple times before actually releasing it, but we did not do any sort of stress-tests, which means the capability of the backend is unmeasured and is likely to be vulnerable to large player base considering it is rushed.</p>
<h2 id="heading-the-problem">The problem</h2>
<p>Okay, it's August in the same year, we released V5 to the general public. It was full of hype. The fact people waited so many years for V5 to come out, makes V5 a trending topic in the group RP category. Which also means that the player base is increased by a lot more than what we were expecting.</p>
<p>Initially, many acknowledged FPS drops while playing the game, most people got an average FPS of 20-30 in V5 –– not something we are expecting to happen. Then, bugs in the backend made a lot of functionalities go malfunction. The gameplay experience is affected <strong>by a lot</strong>, in fact, nothing really works in the game. We were alerted by this issue and we were completely shocked. The problem is so severe that it creates a lot of negative feedback regarding the group, and still is not completely relieved to this day.</p>
<h2 id="heading-what-we-learnt">What we learnt</h2>
<p>We eventually closed down the game and rolled back to V4 and announced that we will be optimising the game and will be rereleased shortly this year. This promise was made but never satisfied, and I believe the reason why is...</p>
<ul>
<li>There are too many bugs, we simply can not afford the time to fix all the bugs completely</li>
<li>The whole codebase structure is flawed</li>
<li>Error handling is improperly done, especially in remotes</li>
<li>Heck, the performance is so bad that we can barely work on it in Studio</li>
<li>Backdoors!!! It's too painful to get rid of them</li>
</ul>
<p>So, what have we done to prevent any of those issues above, for the future?</p>
<ul>
<li><p>Newer projects are coded with a MVC framework called <a target="_blank" href="https://github.com/Sleitnick/Knit">Knit</a></p>
<ul>
<li>We have now established a standard codebase structure for our games' code</li>
<li>Knit is Single-Script Architecture, modules run in sync and conflicts are less likely to occur</li>
<li>Code quality is ensured to be high</li>
<li>It is much intuitive for developers to work with</li>
</ul>
</li>
<li><p>Error-prone code is now wrapped in <code>rpcalls</code> (recursive pcalls), such as code interacting with Http APIs, et cetera</p>
</li>
<li><p>Errors are properly handled with the help of promises</p>
<ul>
<li>An error may not mean that code will be unavailable, we can consider using an alternative solution</li>
</ul>
</li>
<li><p>Errors are logged to our log drain (Self-hosted Sentry)</p>
<ul>
<li>More easier for us to do debugging</li>
</ul>
</li>
<li><p>Newer projects are done with Rojo and done in a Git repository</p>
<ul>
<li>Small patches, UI etc does not require opening Studio to finish, reducing the load time and developers can work on games with a lower-end device or tablets</li>
<li>Established a new developer policy in the coding department<ul>
<li>Developers only have <strong>read</strong> access to projects they are assigned to. To publish their changes, they have to create a new pull request and ask for reviews from the head developers. Reducing the probable chance of backdoors</li>
<li>Only head developers have <strong>maintain</strong> access</li>
<li>2-factor authentication is required</li>
</ul>
</li>
<li>Coding can be done with a code editor, reduces the memory overhead compared to using Roblox Studio</li>
</ul>
</li>
<li><p>UI is now written with a declarative UI library called <a target="_blank" href="https://github.com/Elttob/Fusion">Fusion</a></p>
<ul>
<li>Increases the readability and maintainability of the code</li>
<li>Components reduces duplicated code</li>
<li>States make race conditions less likely to occur</li>
</ul>
</li>
<li><p>And a lot more</p>
</li>
</ul>
<h2 id="heading-what-to-do-next">What to do next</h2>
<p>With all the changes above, we definitely can not work on the current V5 anymore. The current V5 is not done with Knit, nor is in Git, nor its UI written in Fusion either. So, we decided to recode it from scratch, completely. Start with an empty project.</p>
<p>Of course, this means that folks will be waiting a lot more time for a complete rerelease of V5 to come out. But what you are getting is: <strong>high-standard</strong>, <strong>high-quality</strong>, and <strong>performant</strong> code in the game. Juicing every single part of your hardware to give you the most immersive, most stable and smoothest gameplay experience possible.</p>
<p><img src="https://cleanshot-cloud-fra.s3.eu-central-1.amazonaws.com/media/28981/NQSco0KJtxfaWKDKHaTxXDBpJfjAt7C79YySkZFQ.jpeg?X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&amp;X-Amz-Security-Token=IQoJb3JpZ2luX2VjEBMaDGV1LWNlbnRyYWwtMSJHMEUCIFT26%2B9S0JDzPti6JAJWXtCGKfbe434PPgr%2FTideE2NRAiEApL7RzN4C%2FHHh4Kq%2FYtMhlLoww%2BpsGoPKLu%2Foh91wq6oqoQIIfBAAGgw5MTk1MTQ0OTE2NzQiDF1sKz5flQzNYGKT7Sr%2BARyoyHzX1hyFbgkMkaO58fhQJqbSTxrJZkVA%2BXIgkOOtK%2B6PMr%2FO8ioRSdlyK6e1pPhrlTp%2FB1BtQZIJXyMlKMkDeN1VUB%2B1kcJAj84xPBcM7iDHSLlJCyhrg1NwsU2DULf4%2FfIKUB73WVWxIL0gOiMQfHaQEGK27VSlTjUfpm9Unz28Qf7QHS5jvn9uk2s%2F8nYim7tQnsIBaKZj9LM87QW%2BvjWxSA6azDWdXlqQto4R81wwLDg0743SMPXUycLhX0M277sLtYe%2FQpdPxyK7KD%2BWsDJo9RMbtEZlJpQ0Y9d%2Fjfeh%2FL3re5xOfvbNi%2B6LKBZGS7NcfL8VWKWB06YtMPbrjpEGOpoBzTAWxP0NF9z%2FqEfUfWWjTr4uEAIgAV7vs2MrU6FRwDGW8D7PkmlEZ1vK8m6QdESVhvzmRJbQaglrMGPb0O9s4ivYPh2gKyPH3RURh4SHG8o3CSzwu5LdlYdJ4A%2Fbt75iWm1V5RHnpkOWd%2F41dqQ7YeTanmwJHo7zRFipUdw9NE1aQptwVH6TgL4PFnhnmZhpi0AmLzAxUXZnVA%3D%3D&amp;X-Amz-Algorithm=AWS4-HMAC-SHA256&amp;X-Amz-Credential=ASIA5MF2VVMNKYEL6OMY%2F20220305%2Feu-central-1%2Fs3%2Faws4_request&amp;X-Amz-Date=20220305T202412Z&amp;X-Amz-SignedHeaders=host&amp;X-Amz-Expires=300&amp;X-Amz-Signature=e9faf906e8f794f39f5a3a4be482e7f656f308ce1fb4a6467656c03ad8b44759" alt /></p>
<p>We have already began working on it, and it's going really well. Our developers prefer coding in this environment compared to the traditional one in V5 and others.</p>
]]></content:encoded></item><item><title><![CDATA[Roblox games’ servers being attacked!? How?]]></title><description><![CDATA[A few of Roblox games I worked on suffered from an issue where servers randomly gets lagged out. Of course, with no doubts, it’s a vulnerability that exist in their networking infrastructure.
The basics

Roblox uses RakNet –– A network middleware for...]]></description><link>https://blog.7kayoh.net/roblox-games-servers-being-attacked-how-f2f97f0cbbf2</link><guid isPermaLink="true">https://blog.7kayoh.net/roblox-games-servers-being-attacked-how-f2f97f0cbbf2</guid><dc:creator><![CDATA[nanako]]></dc:creator><pubDate>Thu, 24 Feb 2022 18:36:07 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321945371/H96iAff6T.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>A few of Roblox games I worked on suffered from an issue where servers randomly gets lagged out. Of course, with no doubts, it’s a vulnerability that exist in their networking infrastructure.</p>
<h4 id="heading-the-basics">The basics</h4>
<ul>
<li>Roblox uses RakNet –– A network middleware for multiplayer games</li>
<li>RakNet works with both UDP and TCP</li>
<li>It has dropped support in around 2014</li>
<li>At the time of that, RakNet still has quite a plenty of bugs/flaws remaining unsolved</li>
<li>Of course, it is open source under the BSD licence, by Oculus (now Meta? i honestly have no idea about the “renaming”)</li>
</ul>
<h4 id="heading-introduction">Introduction</h4>
<p>A couple of years ago, I’ve took a look at RakNet’s source code and discovered quite a few vulnerabilities. Such as being able to screw RakNet up, by sending a specifically designed packet string.</p>
<p>At first, I didn’t take it as a serious concern in game development as, I wasn’t working on games back then! And this vulnerability was not “on-trend” in the Roblox community.</p>
<p>Until ~2021, where I finally worked on games and this vulnerability being used to launch attacks on specific games. So! I have decided to revisit this middleware again.</p>
<h4 id="heading-case-1-using-raknet">Case 1: Using RakNet</h4>
<p>I was digging into Roblox’s RakNet infrastructure a few days ago, so don’t really expect me to have strong evidences on each points I’ve made, those are really based on my opinions and assumptions (of course, not 100% opinions)</p>
<p>As what I have mentioned earlier, RakNet contains a lot of bugs and flaws in its code, and the author, Kevin Jenkins, stopped working on RakNet for <a target="_blank" href="http://www.jenkinssoftware.com/">a few reasons</a>. Which also means there are no chance of a patch to resolve all of those bugs and flaws being merged into the code.</p>
<p>Considering the source code is open source in GitHub, exploiters were able to find exploitable flaws and try to abuse it in Roblox.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321932993/FueJn63Iz.png" alt /></p>
<p>A reply made by Quenty to a thread in DevForum</p>
<p>In fact! Quenty has made a post to a thread in DevForum in 2015, which exactly talks about a vulnerability in RakNet.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321934963/SRQqjMCAO.png" alt /></p>
<p>Do excuse the vulgar language used in this image</p>
<p>There is also a “crasher” script which abuses the flaw to screw RakNet up.</p>
<h4 id="heading-case-2-using-custom-raknet">Case 2: Using custom RakNet</h4>
<p>RakNet is open source, that is what I said above, which also means that there’s another possibility –– Roblox created a vulnerability, or they tried to patch the vulnerabilities but didn’t get it right.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321936870/8fwhEZGfB.png" alt /></p>
<p>from zeux.io, a personal website of a Roblox software engineer</p>
<p>It’s clear to tell that Roblox have made changes to the networking infrastructure. Of course, this blog post did not mention a single word regarding RakNet, but the network protocol is heavily related to RakNet.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321939145/JHcfdnJDe.png" alt /></p>
<p>The thread, again! But with zeux’s reply</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321940653/70F002SkU.png" alt /></p>
<p>A reply made by a DevRel regarding this issue, but there is no “update” on it…</p>
<p>From those two replies, and with the image excerpt from a blog post, it’s really likely Roblox has a modified version of RakNet.</p>
<p>Whether has the malformed packet vulnerability been patched by Roblox or not, I do not know. I am not an expert in cyber security (obviously), and I do not have the braveness to risk trying the exploit.</p>
<p>If it has been patched, could it be another vulnerability from RakNet? A vulnerability created by Roblox themselves? Or a new vulnerability pops up after the patch? All those can be possible, but it is uncertain.</p>
<h4 id="heading-case-3-a-vulnerability-in-design">Case 3: A vulnerability in design</h4>
<p>Maybe it can be a vulnerability that exists in most networking middleware?</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321942011/xRrQSvfSW.png" alt /></p>
<p>A video in the cloud, name is blurred for multiple good reasons</p>
<p>There is a “DDoS” panel that works for both Roblox and FiveM, and even Tom Clancy’s Rainbow Six Siege.</p>
<p>We know Roblox uses RakNet, but neither FiveM nor R6 does. FiveM uses ENet. And R6 got called out for using a “horribly-made” custom networking library, and got suggested RakNet as well as other libraries, apparently.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321943781/_z70GT68_.png" alt /></p>
<p>Heck, even works for Call of Duty: Modern Warfare</p>
<p>Obviously, this is a really extreme and uncommon case. The panel might have just supported multiple games with different exploits. Which seemed to make more sense, otherwise the whole game industry would be in nightmare already.</p>
<h4 id="heading-other-cases">Other cases</h4>
<ul>
<li>“Your game is backdoor’d/has serversides/etc” –– Unlikely, it’s too hard to believe that, when there are multiple games suffering from the same issue, from small to big, from infamous to famous.</li>
<li><strong>“They are just spamming the server IP” –– Does make sense, but spamming the server IP seemed to be really inefficient, still will consider this as a feasible case</strong></li>
<li>“They are just spamming your remotes” –– Again, not when there are multiple games suffering from the same issue, also there are rate limits on remotes</li>
<li>You name it?</li>
</ul>
<h4 id="heading-conclusion">Conclusion</h4>
<p>We still have no idea about the cause of those attacks, but we can safely assume that its either custom RakNet or actual DDoS/DoS.</p>
<ul>
<li>RakNet is open source, I have huge doubts that Roblox never modified it. A person I know, also claims that Roblox has a modified version of RakNet deployed in their infrastructure.</li>
<li>You can always overload a server by DDoS/DoS, this might be because there are no mitigation policies set for attacks like this, in Roblox’s servers.</li>
</ul>
<p>I do not have a lot experience in cybersec, so I won’t be making bold claims in areas I am not familiar with. Please! If I made a mistake in this article, do let me know.</p>
<p><em>RakNet is not bad, Roblox is not bad either. I am making this article not only because of games I have worked on, but also because of my curiosity</em></p>
<p>This article is originally published as a reply to a thread in DevForum.</p>
]]></content:encoded></item><item><title><![CDATA[UI borders with rounded corners]]></title><description><![CDATA[Introduction
I tend to get pissed off over small details, especially with UI design. It is probably a bad habit since it wastes a lot of time and really strains my eyes. However, UI is pretty much about the details, a good UI is when good UX is match...]]></description><link>https://blog.7kayoh.net/ui-rounded-borders</link><guid isPermaLink="true">https://blog.7kayoh.net/ui-rounded-borders</guid><dc:creator><![CDATA[nanako]]></dc:creator><pubDate>Wed, 09 Feb 2022 20:14:01 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321926671/MIVQuVQXu.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h3 id="heading-introduction">Introduction</h3>
<p>I tend to get pissed off over small details, especially with UI design. It is probably a bad habit since it wastes a lot of time and really strains my eyes. However, UI is pretty much about the details, a good UI is when good UX is matched with fine details. So I kept the habit.</p>
<p>This one though, I don’t really think it’s me being picky, <strong>it can bring a huge difference when scaled up</strong>. It’s about applying strokes to rounded UI in Roblox.</p>
<p>At the moment, there are two ways to apply stroke to an UI –– either by using UIStroke, or by Duplication &amp; ZIndex. Both has this problem, but you can’t fix it if you are using UIStroke.</p>
<h3 id="heading-the-problem">The problem</h3>
<p>Ohhhh no. Inconsistent radius!</p>
<p>If you have good eyesight, you will sense that there’s something wrong. <strong>The stroke and the actual layer do not share the same roundness.</strong></p>
<blockquote>
<p>But they have the same corner radius value!</p>
</blockquote>
<p>They have the same corner radius value, yes. But do they have the same size? No.</p>
<p>Corner rounding is like putting a circle into your shape, and its size is based on the corner radius (times two). As it is bigger, the shape itself would start to look like a circle. Eventually becomes completely rounded once the radius has reached half of the shape’s height. From that being said, when the size of the shape has changed, the distance for the circle to make the shape as a circle will be changed too.</p>
<p>Assuming that stroke is 2px thick, that means the distance has been increased by 2px, hence making it less rounded.</p>
<h3 id="heading-the-solution">The solution</h3>
<p>We have just explained how corner rounding works with simple logic, and that “roundness” is based on the corner radius and the size of the shape.</p>
<p>So, how do we rectify it? Simply by reverting the distance change with Mathematics. If it has been increased by 2px, increase corner radius by 2px too.</p>
<p>Hence, we can come up with a formula:</p>
<p>BorderRadius = CornerRadius + BorderWidth</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321924819/p3-Jiz8Ff.png" alt /></p>
<p>LaTeX, if you want.</p>
<p>Happy designing.</p>
]]></content:encoded></item><item><title><![CDATA[UI Animations done right.]]></title><description><![CDATA[Introduction
Whether you are UI coder or not, animating UI can be painful. Choosing the correct easing for the correct UI can take a lot of time, and usually the provided easings does not suit your UI well enough. Easings provided by Roblox in enumer...]]></description><link>https://blog.7kayoh.net/ui-springs</link><guid isPermaLink="true">https://blog.7kayoh.net/ui-springs</guid><dc:creator><![CDATA[nanako]]></dc:creator><pubDate>Sat, 22 May 2021 14:58:03 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321917262/LCiGmcIqG.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h3 id="heading-introduction">Introduction</h3>
<p>Whether you are UI coder or not, animating UI can be painful. Choosing the correct easing for the correct UI can take a lot of time, and usually the provided easings does not suit your UI well enough. Easings provided by Roblox in enumerations can not be modified, which can be disastrous if the easing is too exaggerated, or too weak.</p>
<p>It’s not only about easing. If you are animating an UI with an unpredictable value (user-defined, etc), maintaining the duration consistency for each animation can be difficult, and usually creates a hot mess in your codebase.</p>
<p>For one animation, it is fine, but if for multiple, uhhhh. Yeah, not a good idea.</p>
<h3 id="heading-why-bother">Why bother.</h3>
<p>Why bother creating a new tweening library simply for custom easing? And why bother creating multiple formulas just to calculate the correct animation duration?</p>
<p>If you are encountering either these two problems, maybe it is time for you to learn a new concept –– <strong>Spring motion</strong></p>
<iframe src="https://player.vimeo.com/video/553697714?h=069a90dd7d&amp;app_id=122963" width="700" height="459"></iframe>

<p>Spring-driven UI animation</p>
<p>Rather than defining an animation with time and easing. Define an animation with frequency and damping ratio. No matter how far away the end value is, the animation is always consistent, <strong>it scales with the distance.</strong></p>
<p>With the damping ratio, you can create infinite possibilities on the animation behaviour –– whether to go overshoot, or smoothly. Solving the two problems we have mentioned in this article, completely.</p>
<h3 id="heading-how">How</h3>
<p>You do not need to study physics and reinvent the wheels to create spring motions. For Roblox, there are a couple of modules that does it for you. Such as <a target="_blank" href="https://github.com/Fraktality/spr">Spr from Fraktality</a>, or <a target="_blank" href="https://github.com/Reselim/Flipper">Flipper from Reselim</a>, et cetera.</p>
<p>Of course, it would be really hard to guess the animation behavior with only numbers. There is a <a target="_blank" href="https://www.desmos.com/calculator/rzvw27ljh9">visualizer</a> for it.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1646321917262/LCiGmcIqG.png" alt /></p>
<p>Parameters view for the visualizer</p>
<p>In springs, the speed is faster when the frequency value is greater, where the damping ratio changes the converging behaviour, <strong>in which, value lesser than 1 would create overshoot.</strong></p>
<p>That is pretty much how you implement spring motion for UI.</p>
<h3 id="heading-conclusion">Conclusion</h3>
<p>Spring motion is great for UI animations, especially if you want custom easing, or want to have a consistent animation speed.</p>
<p>It’s also great for other applications, such as camera panning, camera manipulation, car physics, et cetera.</p>
<p>Of course, while spring motion seemed like an ideal solution for animations, it’s not always. Ask yourself is there any necessity to adopt spring motion before actually doing it. Sometimes it would backfire.</p>
]]></content:encoded></item></channel></rss>