Tic-Tac-Typo is an implementation of a tic-tac-toe bot contained entirely within a font.

To start playing, type a "+" into the text box above. This will start the game, and let the font, playing as X, make the first move. You will be playing as Os, and will be going second.

A hastily drawn diagram of an empty tic-tac-toe board. Each box has been labeled with a single number, starting with one in the bottom left to nine in the top right.

To make your move, enter the number corresponding to the box that you wish to play in as seen in the picture above. The font will make its move immediately after.

To reset the game, simply press backspace until the game is reset, before pressing "+" to start a new game.

Q: How does this work?

A: Ligatures. And tears. Lots of tears. This took way more work than it should have.

Q: Why are the Xs pluses and the Os squares?

A: It's an aesthetic choice. I also got lazy and didn't read the documentation for generating font files. Instead, I thought it would be easier to hand write the glyphs themselves as ttx files.

          155 776 rmoveto
          -300 -10 300 vlineto
          -145 -776 rmoveto
          300 631 rmoveto
          -10 -300 10 vlineto
          0 -631 rmoveto
          498 776 rmoveto
          -300 -10 300 vlineto
          -488 -776 rmoveto
          643 631 rmoveto
          -10 -300 10 vlineto
          -343 -631 rmoveto
          831 776 rmoveto
          -300 -10 300 vlineto
          -821 -776 rmoveto
          976 631 rmoveto
          -10 -300 10 vlineto
          -676 -631 rmoveto
          643 443 rmoveto
          -300 -300 300 vlineto
          -343 -443 rmoveto
          976 443 rmoveto
          -300 -300 300 vlineto
          -676 -443 rmoveto
          343 800 rmoveto
          -1000 -20 1000 vlineto
          -323 -800 rmoveto
          676 800 rmoveto
          -1000 -20 1000 vlineto
          -656 -800 rmoveto
          1000 476 rmoveto
          -20 -1000 20 vlineto
          0 -476 rmoveto
          1000 143 rmoveto
          -20 -1000 20 vlineto
          0 -143 rmoveto
          endchar

      

This was a bad idea. I didn't realize that they used a relative cursor, like in python turtle graphics until I was already committed, and that I had greatly underestimated how fast I could create these things. To add rounded edges, or even diagonal lines would have been outside of the limits of my patience. I can do the mental math needed for perfect squares and crosses. Perfect curves and diagonal lines are way harder and there was no way I would have been able to do them in my head, so I made the executive decision to have a simplified look.

TL;DR : Bad decisions and doubling down.

Q: Can I download it to try it out myself?

A: Yes. The files can be downloaded by clicking here, or from my github page.