Initial Release

This commit is contained in:
2026-05-24 21:58:23 -07:00
commit 0a782e0096
209 changed files with 11657 additions and 0 deletions
@@ -0,0 +1,182 @@
<article
id="hello-world"
created="Apr 17 2024"
categoryId="behind-the-scenes"
authorId="bakonpancakz"
title="Hello World!"
snippet="Breaking the radio silence what has bakonpancakz been up to? And what exactly is a suzzy?"
banner="file://blog/hello-world/banner.gif"
noindex="false"
>
<header>Welcome to suzzy games!</header>
<text>
I made this site to serve as a hub for my game development hobby. There
is no theme, there is no incentive, just pure passion and efficient code.
I'll be sharing previews, progress, and generally whatever comes to mind.
So that's what this site is for! And this post contains a bunch of previews
of things I've worked on that <b>might</b> become their own game in the
future.
</text>
<quote>Except for Cart Ride that one was just an update :P</quote>
<!-- Game: Cart Ride around a Fumo -->
<header>Cart Ride Around a Fumo</header>
<text>
<a href="https://www.roblox.com/games/9987852646/Cart-Ride-Around-a-Fumo">Cart Ride Around a Fumo</a>
is my own spin on the cart ride genre that was all over in the olden days
of ROBLOX. It's a labor of love with way too much effort put into it, but
I like to look back at it and try to match that level of quality for
everything I do.
</text>
<quote>Why Fumos? Because they're funny.</quote>
<text>
I spent a whole two months on it and again, put way more effort into it
than I should have, but that's just how I roll (⌐■_■). I actually got a
lot of my cousins to playtest it and everybody had a lot of fun blowing
each other up. Which I like to think is what kickstarted my passion.
<h>(my origin story)</h>
</text>
<image
caption="Home Sweet Home"
alt="Overhead view of the in-game track"
resource="file://blog/hello-world/craf-1.jpeg"
/>
<text>
Around ten people play it daily and people are still donating despite
its age, so I definitely did something right. (^_^) It even has a
couple videos on it, one of <a href="https://www.youtube.com/watch?v=Jjep6xt3PiM">friends just having fun</a>,
and a <a href="https://www.youtube.com/watch?v=fyoQxBuR1Mo">super duper edited one</a>.
</text>
<quote>Thanks guys &lt;3</quote>
<text>
I actually planned to release a major update for it which would have added
cart customization and a track editor. But the update grew too large in
scope and is now being developed as its own standalone game.
<h>(stay tuned!)</h>
</text>
<text>
It's nothing too interesting in my opinion but here's what one of the
menus looked like.
</text>
<image
caption="(Scrapped) Cart Selection Menu"
alt="Screenshot of a scrapped concept showcasing cart customization"
resource="file://blog/hello-world/craf-2.jpeg"
/>
<!-- Game: Five Nights at Kanye 2 -->
<header>Five Nights at Kanye 2</header>
<text>
The <a href="https://www.roblox.com/games/13051172029/Five-Nights-at-Kanyes-FNAK-CLASSIC">original FNAK</a>
was made in only a few hours but my friends really liked the idea so I fleshed it
out a bit more and released a <a href="https://www.roblox.com/games/11229358049/Five-Nights-at-Kanyes-FNAK">remastered version</a>
just for fun. A few people liked it and sent me messages asking for a second
entry so I actually worked on it for a bit.
</text>
<image
caption="Main Menu"
alt="Main Menu for Five Nights at Kanyes 2, taking place in a dimly lit restaurant"
resource="file://blog/hello-world/fnak-1.jpeg"
/>
<image
caption="Kanye's Mansion (Courtyard)"
alt="Wide angle view of the courtyard in Kanye's Mansion"
resource="file://blog/hello-world/fnak-2.jpeg"
/>
<image
caption="Kanye's Mansion (Overhead with Layout)"
alt="Overhead view of Kanye's Mansion with each room labelled"
resource="file://blog/hello-world/fnak-3.jpeg"
/>
<text>
The story I had in mind was that this was a prequel to the first game,
and this was the night you broke into Kanye's house to steal DONDA 3
for Twitter clout <s>(now called x lol)</s>. Over the course of five
nights you <h>(and up to 3 other friends)</h> were supposed to collect
story items that would unlock another room after each night.
</text>
<text>
Kanye was also intended to have a better than average AI that would actively
hunt you down as you made mistakes. Something as small as leaving a light on
would make him suspicious and have him start to slowly but surely hunt you
down <h>(working as a soft time limit)</h>.
</text>
<text>
For some added suspense, the music changes as Kanye's suspicious level changes.
All the way from clueless to chasing you down. It is based on Kanye's track
<a href="https://open.spotify.com/track/3JWiDGQX2eTlFvKj3Yssj3">Closed on Sunday</a>
and made by Dakota <h>(he'll get a proper shoutout later!)</h>
</text>
<audio name="FNAK Stage 1 - We are Here (Arrival)" resource="file://blog/hello-world/FNAK_Stage_1.mp3"/>
<audio name="FNAK Stage 2 - Something Isn't Right (Tracking)" resource="file://blog/hello-world/FNAK_Stage_2.mp3"/>
<audio name="FNAK Stage 3 - He's Near (Tracking, Close)" resource="file://blog/hello-world/FNAK_Stage_3.mp3"/>
<audio name="FNAK Stage 4 - Found you (Chasing)" resource="file://blog/hello-world/FNAK_Stage_4.mp3"/>
<!-- Game: Project Z -->
<header>Project Z</header>
<text>
Project Z is a <i>player-versus-player, first-person shooter, zombie survival</i>
game where you barricade yourself into a room and fight off zombified
players for six waves with each wave unlocking new zombie classes and
zombie bosses. <h>Did you get all that?</h>
</text>
<text>
I worked on a few systems <h>(UI, Social, Weapons, etc)</h> but never
got around to making an actual working prototype to fully test the
idea out. Even worse is that changes to ROBLOX suddenly broke my
scripts so I can't even show them off except for in this equally
terrible quality video.
</text>
<text>
It's definitely a cool idea and I will most likely revisit it in the
future and give the love it deserves. This idea actually borrows a ton
from the original <a href="https://steamcommunity.com/sharedfiles/filedetails/?id=105462463">Garry's Mod Zombie Survival</a>
which I used to play it all the time back in middle school and really
wanted to bring the idea to modern audiences.
</text>
<video
caption="Broken Weapons and Sprays"
cover="file://blog/hello-world/ProjectZ-Cover.jpeg"
resource="file://blog/hello-world/ProjectZ.mp4"
/>
<!-- Section: The Plan -->
<header>What now?</header>
<text>
Well, I'm going back to working on that standalone project I mentioned
earlier! It's called Project Monke and you can think of it as Super
Monkey Ball and Super Mario Maker put together. It has online services
<h>(which is why you can create an account btw)</h> so that should give
you an idea of how large of a scope this project has.
</text>
<text>
If you make an account there isn't really a whole lot you can do with it
now, except for some profile customization and security related features.
I'll be adding comments to the site at a later date, but for now the
foundation has been set.
</text>
<image
caption="And for all the nerds out there, the backend is written in Go, the frontend is hand-written PUG+CSS+JS, and served using NGINX, on my personal server (nicknamed miku)"
alt="Picture of a computer stuffed in the closest with a Hatsune Miku sticker slapped in the corner"
resource="file://blog/hello-world/peak-performance.jpeg"
/>
<!-- Section: Special Thanks -->
<header>Special Thanks to Dakota</header>
<text>
Before I go, I'd also like to share a couple more tracks from Dakota
<s>who I have locked in my basement</s> who graciously offered to make
music for my projects. He also made the Five Nights at Kanye tracks you
heard earlier. <a href="https://soundcloud.com/user-627340075">Check out his Soundcloud!</a> ^_^
</text>
<audio name="Project Monke - Settings" resource="file://blog/hello-world/ProjectMonke_Settings.mp3"/>
<audio name="FNAK - Settings (Original)" resource="file://blog/hello-world/FNAK_Options_Original.mp3"/>
<audio name="FNAK - Settings (In-Game)" resource="file://blog/hello-world/FNAK_Options_InGame.mp3"/>
<video
caption="inside joke :3"
cover="file://blog/hello-world/settings-Cover.jpeg"
resource="file://blog/hello-world/settings.mp4"
/>
<quote>p.s. wanna leave an encouraging comment or question? Leave a comment on my twitter!</quote>
<quote>p.p.s there's an easter egg hidden somewhere on this site for users, I hope you love picross as much as I do~</quote>
</article>
@@ -0,0 +1,103 @@
<article
id="repo-of-knowledge"
created="May 12 2024"
categoryId="behind-the-scenes"
authorId="bakonpancakz"
title="Repo of Knowledge"
snippet="Fresh paint, building libraries, and starting side-projects (again). Welcome to new suzzy games website!"
banner="file://blog/repo-of-knowledge/banner.png"
noindex="false"
>
<!-- Introduction -->
<header>A Fresh Coat of Paint</header>
<text>
<b>Welcome to the new and improved suzzy games website!</b>
</text>
<text>
Absolutely everything on this site has been either upgraded or replaced
entirely. The blog system went from janky to proper, pages are now full
of content and trivia instead of being half-baked, and a new library was
built. <h>More on this later!</h>
I dedicated an entire weekend to turn this site from potato to french
fry. I absolutely love how it looks now and I hope you do too.
</text>
<quote>Sometimes I open up the website just to stare at it @_@</quote>
<image
caption="New and Improved!"
alt="A 4 by 4 grid showing the old site on top and the new site design on the bottom"
resource="file://blog/repo-of-knowledge/SITE_SHOWCASE.jpg"
/>
<!-- New Feature: oAuth2 -->
<header>Introducing oAuth2</header>
<text>
<b>Are you a developer? Then this chapter is for you!</b> Applications
and oAuth2 are now available for everybody! This allows third-party
developers to safely access your profile and the game data that
<b>you</b> decide to share with them.
</text>
<text>
New features and subsequent documentation on those features will become
available for developers in the library.
<h>Which brings us to the next topic...</h>
</text>
<image
caption="oAuth2 User Interface (You've seen one of these before right?)"
alt="An example oAuth2 prompt asking the user to allow access to certain account permissions"
resource="file://blog/repo-of-knowledge/OAUTH2_SHOWCASE.png"
/>
<!-- New Feature: Developer Docs -->
<header>Building a Library</header>
<text>
<a href='/library'>The library</a> is a new section of the suzzy website!
It contains legal stuff, branding guidelines, and most importantly
documentation for developers. If you're really bored check out the
<a href="/library/home/branding" target="_blank">branding article</a>!
It contains little bits of trivia on all past suzzy projects.
</text>
<image
caption="Library Homepage (Its Boo!)"
alt="A preview for the suzzy games library with the mascot sitting on a bean bag in their room reading a book"
resource="file://blog/repo-of-knowledge/LIBRARY_SHOWCASE.png"
/>
<!-- Announcement: New 2D Game Engine -->
<header>Introducing BECCA2D</header>
<video
caption="BECCA2D Splash Screen"
resource="file://blog/repo-of-knowledge/BECCA2D_TEASER.mp4"
cover="file://blog/repo-of-knowledge/BECCA2D_TEASER_COVER.png"
/>
<text>
<b>Introducing BECCA2D!</b> An <i>in-house 2D Game Engine</i> designed
from the ground up to be lightweight, efficient, extensible, and run in
Google Chrome. <h>sorry firefox users :p</h>
</text>
<text>
I'm planning on using this engine in a new side-project, a side-scrolling
style platformer fangame based on a certain fish vtuber I've taken a liking
to recently. This fangame also shares a considerable amount of features with
Project Monke, so this will also serve as a personal training ground of sorts.
</text>
<text>
But that's all I'm sharing about this side-project for today! I'll be making
a dedicated post on the engine showcasing its features, design, and reasoning
soon™
</text>
<!-- Summary -->
<header>Epilogue</header>
<text>
So that's my content dump for the month. Again I'm still working on new
stuff and it'll all be done and released eventually
<h>gimme like six months or something :P</h>
</text>
<image
caption="ok that's it see you soon™"
alt="A man holding the ball standing in front a white board with the words soon trademarked"
resource="file://blog/repo-of-knowledge/conclusion.png"
/>
<quote>p.s. I got a drawing tablet! nothing crazy just a wacom one! expect more doodles all over the site now</quote>
<quote>p.p.s still no blog comments btw >.></quote>
</article>
+104
View File
@@ -0,0 +1,104 @@
extends ../_TemplatePublic
block pageHeader
link(rel='stylesheet' href='file://styles/browser-blog.css')
meta(property='og:image' content='file://images/public-logo-og.png')
meta(property='og:title' content='suzzy games - blog')
meta(property='og:description' content='News and Updates straight from the source.')
meta(name='description' content='News and Updates straight from the source.')
title suzzy games - blog
style.
div.divider-mobile {
display: none !important;
}
block pageEscaped
div(class='widget-wrapper background-scroll')
//- Widget: Latest Articles
div(class='widget')
p(class='text-header') > Latest <
div(class='widget-latest-articles')
- var recents = articles.slice(0, 4)
each article, index in recents
div(class='latest-item')
img(class='latest-banner special-dropshadow' alt=`Banner Image for Blog Post '${article.info.title}'` src=article.info.banner)
div(class='latest-content')
p(class='text-headline') #{article.info.title}
div(class='latest-info')
p(class='text-tip text-muted') #{article.author.name}
p(class='text-tip text-muted') &bull; #{formatDate(article.info.created)} &bull;
p(class='text-tip text-muted') #{article.category.name}
div(class='divider-header')
p(class='text-tip') #{article.info.snippet}
a(class='text-tip text-muted' href=`/blog/${article.category.id}/${article.info.id}`)
| Read More (#{calcReadTime(article.elements)} minutes)
//- Widget: Latest Controls
div(class='widget widget-latest-controls')
div(class='latest-spacer')
div(class='latest-controls')
button(class='default' id='latest-last' aria-label='Last Blog Post') <
each _, index in recents
div(class='dot-circle' + (index === 0 ? ' dot-active' : ''))
button(class='default' id='latest-next' aria-label='Next Blog Post') >
script(src='file://scripts/browser-blog.ts')
block pageContent
div(class='main-wrapper')
//- Browser Filters
div(class='main-aside')
p(class='text-header') > Browser <
a(class=`filter-link ${!relevantCategory ? 'filter-active' : ''}` href='/blog')
img(class='filter-icon' alt='Icon for Anything' src='file://blog/category-any.png')
p(class='filter-name text-tip') Anything
each category in categories
a(
href=`/blog/${category.id}`
class=`filter-link ${relevantCategory && (relevantCategory.id === category.id ? 'filter-active' : '')}`
)
img(class='filter-icon' alt=`Icon for Category ${category.name}` src=category.icon)
p(class='filter-name text-tip') #{category.name}
div(class='divider-dashed')
//- Browser Articles
div(class='main-content' role='main')
if relevantArticles.length === 0
//- No Articles Found
div(class='collection-empty')
img(aria-hidden='true' alt='Icon for No Posts' src='file://images/public-noposts.png')
p(class='text-muted') no blog posts found
else
//- Article Previews
each article, index in relevantArticles
a(class='collection-item' href=`/blog/${article.category.id}/${article.info.id}`)
img(class='item-banner' alt=`Banner Image for Blog Post ${article.info.title}` src=article.info.banner)
div(class='item-content')
p(class='text-header') #{article.info.title}
div(class='item-info')
img(class='filter-icon icon-small' alt=`Icon for Category ${article.category.name}` src=article.category.icon)
p(class='text-tip') #{article.category.name}
//- img(class='filter-icon icon-small' alt=`Avatar for Author ${article.author.name}` src=article.author.icon)
//- p(class='text-tip') #{article.author.name}
p(class='text-tip text-muted item-bull') &bull;
p(class='text-tip') #{formatDate(article.info.created)}
p(class='text-tip text-muted item-bull') &bull;
p(class='text-tip') #{calcReadTime(article.elements)} minute read
p(class='text-tip text-muted') #{article.info.snippet}
//- Page Select
if relevantArticles.length !== 0
div(class='main-wrapper')
div(class='main-aside')
div(class='main-content' role='main')
div(class='collection-pageselect')
- var isLastPage = (pageCurrent === 1)
- var noNextPage = (pageCurrent === pageTotal)
- var BASE_URL = '/blog' + (relevantCategory ? `/${relevantCategory.id}` : '')
- var hrefLastPage = BASE_URL + (pageCurrent === 2 ? '' : (isLastPage ? '' : `/${pageCurrent - 1}`))
- var hrefNextPage = BASE_URL + (noNextPage ? '' : `/${pageCurrent + 1}` )
a(class='default text-tip' href=(hrefLastPage) disabled=(isLastPage)) <
each _, index in Array(pageTotal)
div(class=('dot-circle ' + (index === (pageCurrent-1) ? 'dot-active': '')).trim())
a(class='default text-tip' href=(hrefNextPage) disabled=(noNextPage)) >
div(class='divider-spacer')
@@ -0,0 +1,26 @@
{
"itemsPerPage": 8,
"authors": [
{
"id": "bakonpancakz",
"name": "bakonpancakz",
"icon": "file://blog/author-bakonpancakz.png"
}
],
"categories": [
{
"id": "behind-the-scenes",
"name": "Behind The Scenes",
"icon": "file://blog/category-bts.png"
},
{
"id": "project-monke",
"name": "Project Monke",
"icon": "file://blog/category-pm.png"
}
],
"articles": [
"04.17.24.Hello World.xml",
"05.03.24.Repo of Knowledge.xml"
]
}
+55
View File
@@ -0,0 +1,55 @@
extends ../_TemplatePublic
block pageHeader
- const article = relevantArticle
- const author = relevantArticle.author
- const category = relevantArticle.category
link(rel='stylesheet' href='file://styles/browser-blog.css')
link(rel='stylesheet' href='file://styles/template-article.css')
meta(property='og:title' content=article.info.title)
meta(property='og:description' content=`By ${author.name} on ${formatDate(article.info.created)}\n---\n${article.info.snippet}`)
meta(name='description' content=`By ${author.name} on ${formatDate(article.info.created)}\n---\n${article.info.snippet}`)
meta(property='og:image' content=`${article.info.banner}?direct=true`)
meta(property='twitter:card' content='summary_large_image')
title blog | #{article.info.title} (#{category.name})
block pageContent
div(class='main-wrapper')
//- Layout: Sidebar
div(class='main-aside article-chapters')
p(class='text-headline') Chapters
each element in article.elements
if (element.type === 'header')
a(href=`#${formatString(element.value)}` class='text-tip') &bull; #{element.value}
a(class='text-tip text-muted' href='#') ▲ Back to Top
//- Mobile Users get a small triangle in the bottom right instead
a(class='default mobile-home' href='#home') ▲
//- Layout: Article
div(class='main-content' role='main' id='home')
//- Article Headeer
img(
class='article-banner special-dropshadow'
alt=`Banner for ${article.info.title}`
src=article.info.banner
)
p(class='text-hero article-header') #{article.info.title}
div(class='article-header')
div(class='item-info')
img(class='filter-icon' alt=`Icon for Category ${category.name}` src=category.icon)
a(class='text-tip' href=`/blog/${category.id}`) #{category.name}
p(class='text-tip')
| #{formatDate(article.info.created)}
p(class='text-tip')
| #{calcReadTime(article.elements)} minute read
div(class='item-info')
img(class='filter-icon' alt=`Avatar for Author ${author.name}` src=author.icon)
p(class='text-tip') #{author.name}
div(class='divider-line')
//- Article Content
include ../_TemplateArticle
div(style='height: 64px;')
script(src='file://scripts/shared-article.ts')