[HN Gopher] Tetris Font
       ___________________________________________________________________
        
       Tetris Font
        
       Author : Bluestein
       Score  : 524 points
       Date   : 2024-06-20 11:11 UTC (11 hours ago)
        
 (HTM) web link (erikdemaine.org)
 (TXT) w3m dump (erikdemaine.org)
        
       | Bluestein wrote:
       | The author explains:
       | 
       | "Each letter and digit in this typeface is made up of exactly one
       | of each of the Tetris pieces: (I), (J), (L), (O), (S), (T), and
       | (Z). Furthermore, the letter is designed so that it can actually
       | be constructed by stacking these pieces one at a time and be
       | supported by previous pieces, as in Tetris. These designs were
       | found by hand, aided by the BurrTools software which enabled
       | searching for whether the Tetris pieces could fit inside a
       | candidate outline for a letter. The piece colors roughly follow
       | The Tetris Company's standard colors, or you can switch to black
       | pieces. The initial rotations follow the standard Super Rotation
       | System."
        
         | lupire wrote:
         | I was today years old when I learned that each tetromino has a
         | letter shape.
        
           | Bluestein wrote:
           | "Trade" you for "tetromino", which I did not know was a thing
           | :)
           | 
           | TIL ...
        
       | fransjorden wrote:
       | This is really cool! As a big Tetris and typography fan this is
       | such a novel combination, especially as they're all buildable in-
       | game.
        
         | Bluestein wrote:
         | Quite the "rabbit hole", trying different texts, punctuation
         | (sadly, none that I could produce, which - if you think about
         | it, makes sense) ...
        
       | mdrzn wrote:
       | Very cool!
        
       | makach wrote:
       | Wow! But can you vary how you build each type - all letters seem
       | to follow the same recipe
        
         | Bluestein wrote:
         | Yes. I think the "recipes" are hardcoded.-
        
         | jtxt wrote:
         | This is neat, but yeah, another fun challenge: have it build a
         | letter/word/pixel art from random pieces, the best it can.
        
         | edemaine wrote:
         | Thanks for the feature suggestion! I've gone ahead and
         | implemented random valid stacking order. So if you reload the
         | page, and enter text that repeats the same letter more than
         | once, you will hopefully get different build orders (depending
         | on random choices). For example:
         | https://erikdemaine.org/fonts/tetris/?text=aaaaa&rotate=0&sp...
        
           | Bluestein wrote:
           | Making a great thing even greater :)
           | 
           | Congrats on such a neat idea so nicely executed ...
        
       | andrei-akopian wrote:
       | From a programming perspective, it would have been cooler if the
       | font generation was automatic at the cost of a bit of quality.
       | This might have allowed for more interesting variation,
       | lowercase, and support of other symbols.
       | 
       | There is nothing less anoying than seeing a really custom font
       | repeat a letter.
        
       | TacticalCoder wrote:
       | For those who don't know the author:
       | 
       | https://en.wikipedia.org/wiki/Erik_Demaine
        
         | pcloadletter_ wrote:
         | LOL, completed PhD at 20
        
         | breck wrote:
         | Oh wow, quite a portfolio: https://github.com/edemaine
         | 
         | He is also the maintainer of KaTeX, which I depend on.
         | 
         | (Thanks Erik!)
        
         | moritzwarhier wrote:
         | I know him from proving NP-hardness of the game Sokoban:
         | 
         | https://erikdemaine.org/papers/PushingBlocks_CGTA/
         | 
         | And I clicked this submission because of his name, after all
         | the time.
         | 
         | I didn't fully go through or understand the proof, but it was a
         | refreshing addition to the classic problems I had to understand
         | for college at the time.
         | 
         | Didn't need it, just fed my curiosity.
         | 
         | And when I clicked this link, my curiosity was fed again.
         | 
         | Seems like it's worth having heard of him, even as a non-
         | scientist, because his subjects are just so interesting.
         | Reminds me of Scott Aaronson in that regard.
        
           | areyousure wrote:
           | That paper does not prove that Sokoban is NP-hard. It does,
           | however, cite an earlier paper proving the stronger result
           | that Sokoban is PSPACE-complete:
           | 
           | Culberson, Joseph. "Sokoban is PSPACE-complete." (1997). http
           | s://era.library.ualberta.ca/items/f551dfd8-c8e6-4e78-883...
           | 
           | See also https://erikdemaine.org/papers/NCL_TCS/
        
             | moritzwarhier wrote:
             | Yes, correct, and mentioned in the abstract. Sorry, I was
             | imprecise and wrong.
             | 
             | Thanks for the links!
        
       | muth02446 wrote:
       | I worked on a similar project here:
       | 
       | https://github.com/robertmuth/TetrisScroller
       | 
       | It has a pretty much complete ascii font but I am cheating in
       | that I allow one non tetris piece with only 3 pixels arranged as
       | an angle. There is also a simple tool that tries to find a
       | covering of a given font.
        
       | csmeyer wrote:
       | This is cool, and some of Demaine's other work is amazing too.
       | 
       | https://erikdemaine.org/papers/Origamizer_SoCG2017/paper.pdf
       | 
       | ^ provides an algorithm for generating any 3D solid via folding a
       | 2D net (origami style)
        
         | refset wrote:
         | The Advanced Data Structures course lectures are great,
         | including his very own research on "Retroactive Data
         | Structures"
         | https://courses.csail.mit.edu/6.851/spring21/lectures/L01.ht...
        
           | Bluestein wrote:
           | All the "time travelling" they do with these data structures
           | is really cool.-
        
       | tobyhinloopen wrote:
       | Who would want to use the browser's back button to undo a state
       | change... I had to press back 20 times
        
         | xd1936 wrote:
         | Right-click the back button?
        
           | TehCorwiz wrote:
           | Browsers only display the last 10 - 20 states, so if you've
           | been clicking around it quickly fills up with just this page.
        
             | laszlokorte wrote:
             | Would be nice if browsers would group back button entries
             | by: 1. same url except hash 2. same domain 3. rest
        
           | tobyhinloopen wrote:
           | Where's the right click button on my phone
        
         | Wowfunhappy wrote:
         | I don't think it's on purpose, just a naive consequence of
         | using the URL for state.
        
           | moritzwarhier wrote:
           | Pretty common.
        
         | mvf4z7 wrote:
         | Should be replacing state in the history stack rather than
         | pushing a new state.
        
         | corytheboyd wrote:
         | Agreed, was very annoying, please don't misuse history like
         | that :(
        
         | edemaine wrote:
         | I find the back/forward buttons useful for undoing/redoing
         | changes, so that I don't lose past cool designs / settings,
         | though I can see it being a controversial approach.
         | 
         | That said, there were definitely way too much history generated
         | when typing into a text field. I just implemented a planned
         | compromise, where you only get a history event when changing a
         | "committed" text field (meaning you previously defocused the
         | field). Hopefully this is the best of both worlds!
        
       | erk__ wrote:
       | I did kinda the opposite and instead of making a font out of
       | tetris I made a font play Tetris.
       | 
       | I did it with the Harfbuzz shaper which now have experimental
       | support for embedding WebAssembly programs to shape fonts.
       | 
       | Talk where I show it off:
       | https://www.youtube.com/watch?v=Ms1Drb9Vw9M
       | 
       | Source code: https://github.com/Erk-/programmable-fonts
       | 
       | You can also see actual uses of this WebAssembly embedding to
       | show that is not just for fun here:
       | https://github.com/harfbuzz/harfbuzz-wasm-examples
        
         | cs702 wrote:
         | _Awesome._
         | 
         | This is precisely the sort of beautiful thing I love finding on
         | HN.[a]
         | 
         | Your work put a smile on my face.
         | 
         | Thank you for sharing it here!
         | 
         | ---
         | 
         | [a] For those here who only want to see the demo, it starts at
         | 22:50: https://youtu.be/Ms1Drb9Vw9M?t=1370
         | 
         | ---
         | 
         | PS. I also submitted your demo to HN. I think it deserves its
         | own post: https://news.ycombinator.com/item?id=40737961
        
           | redbell wrote:
           | I liked how you set your bio in the "About" section, kind of
           | _circular dependencies_ :)
        
         | Bluestein wrote:
         | Incredible ...
         | 
         | (The Tetris pieces going _up_ upon _backspace_ are a riot :)
        
         | RugnirViking wrote:
         | thats absolutely bananas, awesome job. The bad apple showcase
         | is great too.
        
         | quotemstr wrote:
         | Nice demo. Really kicks all the "bytecode can never be fast ---
         | we have to AOT everything" people in the teeth, doesn't it?
        
         | sureglymop wrote:
         | Coolest thing I've seen so far this year. Demo starts at 22:55
         | but the whole presentation is worth watching.
        
           | Bluestein wrote:
           | I agree. Watched the whole thing and the entire video is
           | worth it.-
           | 
           | (The "historical exploration" of type, and typesetting, even
           | if an introduction, is great ...)
        
         | nialv7 wrote:
         | You can even play Pokemon using fonts:
         | https://www.coderelay.io/fontemon.html
        
       | bpiroman wrote:
       | Excellent!!
        
       | poopcat wrote:
       | I have to admit I did not know where it was going at first but
       | was thoroughly delighted once it finished stacking up haha
        
       | zeitlupe wrote:
       | It reminds me of long-gone times where the web was about sharing
       | easy fun like this instead of viral marketing and influencers.
        
         | Bluestein wrote:
         | (It indeed does :)
         | 
         | Same here)
        
       | PetitPrince wrote:
       | Related: One of the subniche in the Tetris communities is Tetris
       | art / pattern creation, i.e. drawing predefined patterns while
       | playing the game (almost) normally.
       | 
       | One of most practiced pattern is the chevron, where you draw a >
       | shape with holes, but otherwise fill the whose board. This
       | stemmed from the Japanese arcade version of Tetris by Sega (or
       | Segatet for those in the known). This version was hugely popular
       | in the arcade (it stayed for an incredibly 10 years in the top100
       | earner in some arcade magazine), and some player were destroying
       | the game so much that they invented this challenge. This was
       | recognized in Segatet successor Tetris the Grand Master (TGM3),
       | and formally named "Secret Grade". One example here:
       | https://www.youtube.com/watch?v=ZgzcAkjp0J8 , and another there
       | with TGM3 signature speed
       | https://www.youtube.com/watch?v=32wzKc0cHQU .
       | 
       | But in general, Shuey is the master of arbitrary making pattern.
       | Look at him drawing a Luigi:
       | https://www.youtube.com/watch?v=_tipJDjeKuY .
       | 
       | Note that since then, an algorithm for arbitrary pattern
       | generation has been devised by Michael Birken:
       | https://www.youtube.com/watch?v=PJkHwulsac4
       | 
       | (sort of related: the playing forever algorithm may be
       | interpreted as a pattern creation
       | https://tetris.wiki/Playing_forever )
        
         | mandibeet wrote:
         | It's so satisfying to watch...
        
         | lupire wrote:
         | Do these pattern drawings only work with aluck Manipulation?
        
       | joshmarinacci wrote:
       | I love little webtools like this that save state in the URL for
       | easy sharing.
        
         | Bluestein wrote:
         | Indeed.-
         | 
         | (The URL as a tool. Such a great "innovation" too. URLs are
         | wonderful ...)
        
       | nofinator wrote:
       | Very neat! I love how you can do an entire paragraph.
       | 
       | For example
       | https://erikdemaine.org/fonts/tetris/?text=%7D6G6C+8%40%3F%3...
        
         | Bluestein wrote:
         | Indeed.-
         | 
         | (And, incidentally, how the URL encodes the value used for text
         | generation, so that you can share links to actual examples ...)
         | 
         | Pretty neat.-
         | 
         | PS. Nice Rickroll, BTW :)
        
         | froh wrote:
         | very neat text you've chosen there, too!
         | 
         | thank you :-)
        
         | mandibeet wrote:
         | Now I sing tha song for about 15 min already
        
       | corytheboyd wrote:
       | I think there's a small bug where the speed change isn't
       | reflected in the downloaded gif (it's very slow by default)
        
         | edemaine wrote:
         | I couldn't reproduce this bug. Perhaps the program you're using
         | to display the GIF doesn't support the GIF frame delay feature?
         | (E.g., Chrome seems to display them fine.) Feel free to open an
         | issue on the repo if I'm missing something:
         | https://github.com/edemaine/font-tetris
        
           | corytheboyd wrote:
           | Ah, fwiw was using my iPhone for the test, so perhaps it's
           | just scoped to that. Not like that's a use case you really
           | need to support with this :)
        
       | throwitaway222 wrote:
       | Perfect, maybe we can make HN use this font for a day
       | exclusively.
        
       | thih9 wrote:
       | I don't understand the limitation to use all of the pieces
       | exactly once, I'd say the rule to keep valid Tetris moves only is
       | enough. I'm curious what could be built with just that in place.
       | 
       | Right now I especially dislike letters: 'B', 'G', 'I', 'N'. For
       | comparison, I like 'F' and '1', they both look very natural to
       | me; 'A' and 'S' get a pass too. 'Q' gets a special mention for
       | its long tail.
       | 
       | That being said, the project is super cool and looks great
       | already.
        
       | acidx wrote:
       | Reminds me of this sample from the Lwan project:
       | https://time.lwan.ws/blocks -- where the clock is rendered on the
       | server, and new frames are sent to the client using chunked
       | encoding.
        
         | Bluestein wrote:
         | (Incidentally, _great_ webserver ...)
        
       | tamimio wrote:
       | Cool, I wish there was a variations for the pieces for each
       | letter though.
        
       | ericfrederich wrote:
       | Would be nice if the "obscure in URL" feature wouldn't show the
       | text in the textbox when you send it to someone.
        
         | Bluestein wrote:
         | Well noticed. Good point ...
         | 
         | (Or an additional "Obscure in textbox" checkbox or something
         | along those lines ...)
        
         | edemaine wrote:
         | Good idea! I've gone ahead and implemented this feature: if
         | "obscure in URL" is turned on, the text won't be visible unless
         | you focus on the textbox (e.g. to edit it).
        
       | omoikane wrote:
       | Reminds me of this paint-by-tetris tool:
       | https://www.ioccc.org/years.html#2013_birken
        
       | _joel wrote:
       | Nice
       | https://erikdemaine.org/fonts/tetris/?text=u%26rz+~uu&rot=1&...
        
       | jacobgorm wrote:
       | My Amiga could do that too!
       | https://www.youtube.com/watch?v=-r9LlyJ9YN4
        
         | Bluestein wrote:
         | TETRIS: THE MUSICAL (!)
         | 
         | - https://www.youtube.com/watch?v=TwcS46tkixI
        
           | elihu wrote:
           | Huh, I was expecting that other Tetris musical:
           | https://www.youtube.com/watch?v=hWTFG3J1CP8
        
             | Bluestein wrote:
             | I stand humbly corrected :)
             | 
             | ... that one is great - in a different way - but great
             | nonetheless.-
        
       | legohead wrote:
       | Feels like there should be many ways to make a particular letter,
       | and it'd be neat if it was random each time. I tried "Hello" and
       | noticed the L's are the same. Considering it's just for fun I
       | think it'd add a little more fun if it was actually unique
       | letters.
       | 
       | Also, can we get a checkbox for "pause after animation"? I want
       | to take a minute to check out the letters before it starts
       | animating again. I know you can click off Animate after it
       | finishes, but if I share this, others may not be so keen.
        
         | edemaine wrote:
         | Regarding the first question, I've gone ahead and implemented
         | random build orders, so at least the two Ls in HELLO will
         | usually produce different animations (depending on random
         | choices). Designing completely different glyphs for the same
         | letter is quite challenging (finding these already took a lot
         | of work).
         | 
         | Regarding the second question, there's already a 2-second
         | delay. I wonder if there should be a slider to specify the
         | delay?
        
       | nothingneko wrote:
       | i was interested to see how it would render kanji, probably is
       | harder than i think
        
       | gnanasekaran08 wrote:
       | Nice..
        
       | ambyra wrote:
       | Multiplayer Tetris that spins!!
       | https://youtu.be/PGFgcaVmL_I?si=egqUDmOc8D2cUAUM
        
       | nemoniac wrote:
       | ASCII only?
        
       ___________________________________________________________________
       (page generated 2024-06-20 23:00 UTC)