Wednesday, May 27, 2020

Introducing the new Games by Tim beta



Since 2011, I've ran Games by Tim on Blogger, Google's free blogging service. Back then, I hardly knew anything about web development. Now with seven years of web dev experience and an extensive portfolio of web projects, it's about time I remodel this site to something more modern, more flexible, and more representative of my abilities. Introducing the new Games by Tim!


The new Games by Tim is:

Fast
Thanks to modern web techniques like code minification, link preloading, and image lazy loading, the new site feels quicker to browse and navigate.

Responsive
The new site scales seamlessly, whether you're on an smartphone or a 30 inch monitor. There's no more separate mobile site, and desktops get blessed with larger images and font sizes.

Optimized
Each project gets a dedicated page, rather than a blog post. In addition, links and blog posts are now properly structured and formatted without Blogger workarounds, potentially boosting search engine optimization (SEO).

Sleek
Vector graphics, animations*, and gaussian blur** spruce up the new site's appearance. And of course there's a dark mode too!


* Animations are disabled if you've enabled "reduce motion" on your device.
** Gaussian blur does not currently work on Firefox. Firefox will instead use slight transparency for the time being.

The tech stack


The new site's hand-coded with Gatsby, a static site generator designed to build fast, modern blogs. Gatsby incorporates React, a JavaScript framework used to build user interfaces.

For writing blog posts, the new site uses Forestry. Typically, the blog editor you use is tied to a specific platform (ex: the Blogger editor can only be used on Blogger sites). Editors like Forestry on the other hand can be used for multiple platforms, especially custom-made sites. This type of editor is known as a headless CMS.

Whenever I submit blog posts, Forestry converts my writing to markdown files. Gatsby then reads markdown files to dynamically build new webpages with the blog posts. The resulting "compiled" webpages are uploaded to Netlify, a static web hosting service.

Since Gatsby-built sites are static, meaning the content does not change based on who visits the site, I don't need to pay extra for hosting services. This offers a significant advantage over alternate platforms like Wordpress and Squarespace.

What's left to do

As the new site's still in beta, there's still several steps I need to work on before taking it to production. These include:
  • Transferring all existing blog posts to the new site
  • Adding a new commenting platform (existing comments sadly won't survive the transition)
  • Adding contact info
  • Writing redirects from the old site's project links to the new format
  • Further optimizing for SEO
  • (If feasible) adding an email subscribe option to get notified about new blog posts (subscribers of the old site would need to resubscribe)
  • Making adjustments to the site based on user testing and feedback

In the meantime, I plan to dual-post new blog posts to the old site and new site. Note that timestamps will slightly differ for these posts due to the time it takes to reformat posts from Forestry to Blogger.

Any feedback?

Now's the best time to provide feedback as I'm still working out the new site's kinks. Feel free to share your thoughts in the comments below.

I look forward to working with the new Games by Tim, and I hope you'll enjoy the refreshed experience.

Saturday, May 23, 2020

Source files for Vista Point artworks released

Curious how I made the two Vista Point artworks (V1, V2) on this site? Now you can find out, because today I'm releasing the source PowerPoint files for both artworks!

The two artworks are licensed under the Creative Commons Attribution 4.0 International license. Enjoy!

Thursday, May 7, 2020

Escape a Tower version 2.6.1 - I can read the text now!



Today's Escape a Tower update addresses a major accessibility issue: text contrast.

Naturally, it's hard to read something when the text color's close to the background color. As it turns out, there's a contrast test known as the Web Content Assessibility Guidelines (WCAG), and a lot of Escape a Tower's text didn't pass even the minimum tests.

I've therefore darkened the majority of Escape a Tower's test to pass WCAG AA for normal text. Have a look for yourself.

Old text (does not pass any contrast tests)

New text (Passes WCAG AA for normal text)

Although I can read the old text just fine, I was surprised to find out not everyone may feel the same. I hope the improved contrast enables more people to experience the game.

In addition, this update runs the source code through a formatter for better code readability and changes the link from the GitHub pages URL to tower.gamesbytim.com.

Wednesday, May 6, 2020

Homepage tweaks

I recently updated my homepage, which now features a photo of me and a short blurb about myself front and center.

Old / New

Why make this change?

A portfolio site reviewer (yes, I'm preparing for the job search) got confused about my goals based off the previous homepage. For instance, am I into game development, web development, data engineering, or perhaps something else?

To clear up the ambiguity, I replaced the top banner with a personal statement that better describes my ambitions. The new statement clarifies that I'm not all about dedicated games, but rather software as a whole with gamification where it helps.

The photo of me address two issues. For one, it adds a more personal flair to the site. It also fixes the image that appears when linking Games by Tim in sites like Facebook or Slack. Previously, it'd show the So Many Numbers app icon since that's the first image on the homepage. Now it'll show my photo, which is more appropriate.

In addition, I've made minor adjustments to font sizes and capitalization.

Tuesday, May 5, 2020

Data science: Analyzing the top 1000 marathon times

And now for something different: data science! Here you'll find a write-up that explores a dataset of top marathon times. Originally published September 26, 2019 on a different site, I'm porting the post here for prosperity's sake.



When we hear about marathons, we often focus on the top elite runners. For instance, the top three marathon runners (men/women) as of 2017 were:



While this info is great to have, it doesn’t tell a complete story about top marathon runners as a whole. For instance, how close are other elite runners’ times compared to the top three? What other countries, if any, hold promising elite marathon runners?

That’s where it’s useful to analyze not just 3, but the top 1,000 marathon runners (men and women). I will use the Top Running Times dataset from Kaggle to conduct the report.