MyEduSmart: find your grades

[jamie]

Hi all, I’m Jamie. I’m not in any way a career game developer, but sometimes you have an idea for a project and you’ll stop at nothing to build it, and for me that’s MyEduSmart.

MyEduSmart is an in-development browser game in the “desktop simulator” genre, and the goal is to find your grades in the worst college website ever created. There are no ARG or horror elements in it, it’s just a lot of jokes, parodying not just school websites but also everything you hate about work, government, and healthcare portals. (Now that I think about it, maybe it IS a horror game.)

I’ve demoed this game for a lot of people in person (the reactions are always fun to see) but this is the first place I’ve announced it publicly online.

Tech stack

Unsurprisingly, MyEduSmart runs in the browser, and uses a typical frontend stack: TypeScript, Vue.js for frontend framework, Vite for packaging/bundling/dev environment, Tone.js for audio playback. I’ve generally been very reluctant to adopt anything in the modern JS ecosystem, but TS and Vue eventually won me over.

Although it looks like multiple pages, it is in fact a single HTML file, and hosting the game requires only a static file server. It all fits in an iframe on Itch.

There are a few instances where more unusual browser features are employed as jokes in the game. (Sadly, I can’t request to enable desktop notifications from within an iframe. “Stay in the know with MyNotifications!”)

Graphics

There’s a certain look to school websites from different eras that I’m going for here. There are a few parts of it that look dated and amateurish, but I try not to use that as too much since it can be a crutch. It often tends to be funnier when the site design is modern, professional, and utterly soulless, and the humor is delivered more through behavior and writing. More importantly, the design philosophy here is to look inconsistent, rushed, and either under-budgeted or over-budgeted.

I have a big folder full of reference screenshots (some sent over by friends from their work and school websites) that I’m still mining ideas from. I have no idea what I’m doing with CSS and have no professional web or graphic design experience, which is almost a plus here.

Vue 3’s “single-page components” and scoped styles proved particularly nice for this project because I can define completely different CSS for each part of the game. This helps sell the notion that MyEduSmart is a dozen or so incompatible services from different teams stapled together.

I grab a lot of assets from OpenClipArt, Pixabay, and Pexels. FontAwesome and Material for icons. Lots of Google Fonts too. Tip: if you plan on using Google Fonts, use google-webfonts-helper to download and self-host them.

Writing

My vision for this game is 90% Easter eggs. Anything you click on should have a dumb joke. There is in fact a plot to the game, which gradually plays out over the MyInbox messaging system and the “virtual assistant” chatbot MartyHelp.

My most recent milestone was making it possible to play MyEduSmart start to finish. The original concept was that the game ends when you find your grades and your “grades” are just the statistics on how quickly/efficiently you finished them, but that felt anticlimactic, and the current ending is much more bombastic and fittingly absurd. But even if someone just clicks around for 15 minutes and laughs, that’s a success in my book.

Project management

I had the idea around 2017, and I was in community college at the time. When COVID hit and the “e-Learning” industry exploded, MyEduSmart became so urgent that I couldn’t not make it. I really buckled down and officially started the project in August 2023, and I’ve been working on it on and off since then. It’s mostly a solo effort, but I have one other person who’s contributed a lot to the “learning modules,” which we make in Google Slides.

All game devs know that the craft is not just the sum of programming, writing, visual art, music, sound design, and game design, because above all those it challenges your skills in managing and sticking to a large project (and particularly, managing yourself).

I feel pretty confident about this one and I’m expecting to have a public beta at some point before 2025.

[twky]

Glad to finally see some public writing on this! As someone who literally has worked on college webapp infra the development angle on all this is pretty funny to me. Making good tech choices to result in a bad UX sounds very delicious. Several of our older less-used pages on the app I used to work on had turned out to be broken for months because we thought we could graciously get rid of having to link two different versions of bootstrap at the same time.
But Jamie: how will you beat the ARG allegations?

[kdx]

that looks… fun?? will follow closely, and for sure try on release

[jamie]

One of the challenges of this game is that when I’m working on some part of it, it’s really hard to stop myself from going overboard and creating a lot more work for myself. I wanted to knock out the Stress Module (one of the crucial sections for the plot) a week or two ago, and while working on it I ended up adding five “submodules” each exploring some aspect of stress management. Each submodule contains a quiz to “test your knowledge.” Basically I quintupled the amount of writing I need to do for this section.

The Stress Module is designed to look a lot more professional than the other learning modules, and early feedback tells me that this makes it all the more horrifying.

[jamie]

@twky

But Jamie: how will you beat the ARG allegations?

I call it a “reality game.”

[jamie]

I got a little tired of this project and felt a barrier to working on it as of a few weeks ago, but my energy to move forward with it seems to be back now.

It’s currently in state that only a game dev could appreciate, given the amount of placeholder content, etc. but it’s playable start-to-finish and ready for some early playtesting. If you want the link & password let me know.