Coding Adventure: Rendering Text

Sdílet
Vložit
  • čas přidán 28. 04. 2024
  • This... is text! Let's figure out how to draw it.
    Starring: Bézier curves and (so many) floating point problems.
    Source code: github.com/SebLague/Text-Rend...
    If you'd like to support my work (and get early access to new projects) you can do so here:
    / sebastianlague
    ko-fi.com/sebastianlague
    Resources:
    developer.apple.com/fonts/Tru...
    www.microsoft.com/en-us/resea...
    wdobbie.com/post/gpu-text-ren...
    Font and Music Credits:
    github.com/SebLague/Misc-Proj...
    Chapters
    0:00:00 Intro
    0:01:58 The Font Directory
    0:04:27 Loading Simple Glyphs
    0:10:42 Bézier Basics
    0:13:42 The Character Map
    0:15:47 Implied Points
    0:18:11 Compound Glyphs
    0:20:25 Size and Spacing
    0:21:27 Rendering Glyphs with Lots of Triangles
    0:22:17 Optimized Curve Rendering (Loop-Blinn)
    0:28:20 A Brief Look at SDF Rendering
    0:30:33 The Counting Method
    0:31:48 Ray-Bézier Intersections
    0:34:09 Point in Glyph Test
    0:36:35 Shader Time
    0:38:37 Floating Point Problems
    0:41:22 The Evil Artifact Detector
    0:45:36 The Closest Curve Method
    0:50:48 Curve Splitting
    0:54:31 Defeating the Evil Artifacts
    0:58:58 Anti-Aliasing
    1:02:47 Performance and Legibility
    1:05:11 The Counting Method Returns
    1:09:45 Outro
  • Zábava

Komentáře • 1,3K

  • @IngieKerr
    @IngieKerr Před 16 dny +3459

    As per the old traditions of typesetting, fonts come in three cases; upper-case, lower-case, and edge-case.

  • @oculicious
    @oculicious Před 16 dny +712

    A) I hate that math can be patented
    B) I had no idea how much math you had to do for just one letter

    • @WhateverOwO
      @WhateverOwO Před 16 dny +19

      it's not really math, it's algorithms and algorithms should have the possibility to be patented.

    • @P1XeLIsNotALittleSquare
      @P1XeLIsNotALittleSquare Před 16 dny +63

      @@WhateverOwO but 20 years is kinda ridiculous

    • @jolkert
      @jolkert Před 15 dny +122

      ​@@WhateverOwO
      I think most (if not all) things should not be allowed to be patented

    • @defalur
      @defalur Před 15 dny +115

      @@WhateverOwO To be fair, algorithms are pretty close to being maths, and patenting them can cause issues. For example, the OpenCV developpers had to create a new way to extract and describe points on an image because the state of the art algorithm at the time "SIFT/SURF" are patented. What they came up with "ORB" is pretty good, but not being able to use an algorithm, that you could possibly independently invent in some cases, without having to pay some random guy to use it is quite infuriating.

    • @oculicious
      @oculicious Před 15 dny +30

      @@WhateverOwO algorithms are just applied mathematics

  • @Barbara_Salesch
    @Barbara_Salesch Před 16 dny +1070

    "...were designed to meet anticipated needs which never materialized" - i love that sentence

    • @Retucex
      @Retucex Před 15 dny +15

      It's like the origin story of the YAGNI principle

    • @onlysmiles4949
      @onlysmiles4949 Před 15 dny +87

      Reminds me of a joke I read a while back that was something along the lines of
      "There are 4 competing standards for this system"
      "Hey, what if we created a universal standard that solves all the problems so we don't need to deal with 4 different standards?"
      "There are 5 competing standards for this system"

    • @rustyricotta5216
      @rustyricotta5216 Před 15 dny

      @@onlysmiles4949 classic xkcd 927

    • @melodyecho4156
      @melodyecho4156 Před 15 dny +40

      @@onlysmiles4949That's an XKCD, right?

    • @melodyecho4156
      @melodyecho4156 Před 15 dny +19

      Yup, XKCD #927

  • @boiimcfacto2364
    @boiimcfacto2364 Před 16 dny +348

    The worst part about watching a Sebastian Lague video: knowing you'll have to wait months for the next one...

    • @Raoul1808.
      @Raoul1808. Před 15 dny +23

      Honestly I don't mind the downtime, in fact I quite prefer it since it gives him more time to experiment with something and document it in an video in a very entertaining way. This is one of my favourite series on CZcams.

    • @HDL_CinC_Dragon
      @HDL_CinC_Dragon Před 14 dny +9

      I think that's the second worst part, rather than the actual worst. I think the actual worst part is that you know the video is going to end.

    • @eestaashottentotti2242
      @eestaashottentotti2242 Před 5 dny

      The most pressing reason for humanity to invent time machine.

  • @chadbramwell977
    @chadbramwell977 Před 17 dny +2207

    I've tried loading and rendering fonts multiple times but stopped because of the complexity everywhere. I continue to be amazed at the level of debugging tools you write! And I appreciate how much effort you spend forming your work into a journey that's easy to follow. Thanks for showing one path through the complexity and taking a relaxed/fun approach to it! I'm inspired to try again!

    • @toeb.
      @toeb. Před 16 dny +40

      15 hours ago. what

    • @user-iv8ii7xh5e
      @user-iv8ii7xh5e Před 16 dny +18

      ​@@toeb. bro is ahead of times💀

    • @nrnjn8547
      @nrnjn8547 Před 16 dny +7

      Probably unprivated later

    • @Xyz-tw8ym
      @Xyz-tw8ym Před 16 dny +2

      Yupp. That's what I was thinking 😂​@@toeb.

    • @Moe5Tavern
      @Moe5Tavern Před 16 dny +16

      Sebastian please make a video explaining how you can code a time travel machine in C++ thanks

  • @wlockuz4467
    @wlockuz4467 Před 16 dny +2239

    You're the Bob Ross of programming.
    Your videos are so relaxing to watch, the learning is just an added bonus.

    • @epiklizard6629
      @epiklizard6629 Před 16 dny +12

      Was thinking of making this exact comment. Cheers!

    • @TracyNorrell
      @TracyNorrell Před 16 dny +52

      "here we have some happy little bezier curves"

    • @Anonymous-fr2op
      @Anonymous-fr2op Před 16 dny +4

      ​@@TracyNorrellhonestly, he is the calmest soul ever, at least imo. And this guy follows him closely. Absolute joy to follow along

    • @francknouyrigat9809
      @francknouyrigat9809 Před 16 dny +1

      Hahaha true that

    • @voxsideres
      @voxsideres Před 16 dny +1

      I want to like your comment, but I don't want to be the one to take away 420 likes, so here you go 👍

  • @Gwilo
    @Gwilo Před 16 dny +261

    this entire video summarizes coding precisely;
    step 1. I want to make some kind of game engine! first off, I need to figure out how to render some text for the UI!
    step 162. it's been a few weeks and I've encountered one of the last bugs. I'm done coding after I get this text to render

    • @xandermckay9806
      @xandermckay9806 Před 16 dny +10

      Or just use a library for it

    • @stickguy9109
      @stickguy9109 Před 16 dny +41

      In my extremely crude and basic game engine I just used a spritesheet of ascii letters and called it a day. I never even came close to thinking just how complex it could be to properly render some text. It's one of those things we take so much for granted.

    • @nickpatella1525
      @nickpatella1525 Před 16 dny +68

      step 163. oh no it's patented

    • @Bestmann3n
      @Bestmann3n Před 16 dny +16

      @@stickguy9109 text rendering is like UI layout/systems. endless rabbit holes that can consume years of your life. the trick is to avoid trying to solve the capital G general problem and instead just do the simplest thing that's good enough and then move on. for most video games simple bitmap fonts are enough and they can be implemented in less than a day

    • @stickguy9109
      @stickguy9109 Před 16 dny +4

      @@Bestmann3n Yeah I agree

  • @-5urv3y-
    @-5urv3y- Před 16 dny +175

    After spending a long week focusing on quadratics, I come home for the weekend to unwind to videos containing parabolas.

  • @artemonstrick
    @artemonstrick Před 16 dny +1228

    the true nature of programming is beautifully (and very scary) encapsulated in this video: simple and beautiful solutions break down against gazillion corner cases, floating point math and "bad" input

    • @David-um8tb
      @David-um8tb Před 16 dny +219

      Don't forget that you might unintentionally implement a patented solution.
      Edit: just in case it wasn't clear, I believe patents shouldn't exist.

    • @pik910
      @pik910 Před 16 dny +28

      horrors beyond comprehension

    • @unknownname3703
      @unknownname3703 Před 16 dny +115

      @@David-um8tb software patents are evil

    • @CatDevz
      @CatDevz Před 16 dny +41

      @@unknownname3703 patents are evil

    • @leftward_hoe
      @leftward_hoe Před 16 dny

      @@David-um8tb imagine patenting writing. what an idiotic concept. you can't claim ownership of the process of writing letters. this is no different than trying to patent using ink in your pen. unless the pen is patented too? so who actually is allowed to write anything? do we all have to use charcoal that we make ourselves? or is the process of making charcoal also patented? or is it just part of the process of making charcoal that is patented? where does the idiocy end. "software patents" LMAO

  • @wlockuz4467
    @wlockuz4467 Před 16 dny +131

    That explanation of Bezier curves was just genius. You tricked me into learning them, and now I'll never forget about them.

    • @bigpopakap
      @bigpopakap Před 13 dny +14

      You really should watch Freya's videos about Beziers and splines. The spline one is looooooong, but it's amazing! So beautifully animated and explained.

    • @olivierdulac
      @olivierdulac Před 11 dny +2

      ​​@@bigpopakapyes, yes, yes, Freya's videos on the subject are incredible

  • @stickguy9109
    @stickguy9109 Před 16 dny +69

    The most impressive thing in this video and the thing that baffles me the most is how you never got tired of trying again and again to solve the artifacts problem. After a few tries I would have quit right then and there but you didn't.

    • @shmunkyman33
      @shmunkyman33 Před 3 dny +1

      I have no idea if Sebastian has ADHD and I'm not saying he does or doesn't, but that very much feels like an ADHD thing lol. When you get fixated on a new problem, "just a few more tries" ends up ballooning to hours or days of tedious trial and error because each new achievement is enough to trigger that dopamine release.

    • @stickguy9109
      @stickguy9109 Před 3 dny

      @@shmunkyman33 I don't know to my knowledge ADHD people can't sit in one place what you're saying sounds like the opposite

    • @purewaterruler
      @purewaterruler Před 2 dny

      ​​@stickguy9109both of those things are adhd things! The difficult thing for people with adhd is managing and directing attention. That includes both having a hard time focusing on something, AND having a hard time stopping focus on something. The latter case is often called hyperfocus

  • @vladchira521
    @vladchira521 Před 16 dny +62

    I am always in utter awe at your ability to calmly (at least it's how you present it) tackle any topic in programming, without frustrations and abandonment. You are an inspiration for all of us aspiring programmers

    • @nukedboom
      @nukedboom Před 14 dny +4

      I'm sure he's been frustrated with many a programming problems, but regardless of whether he has or hasn't, Sebastian's perseverance is something to strive for.

    • @HDL_CinC_Dragon
      @HDL_CinC_Dragon Před 14 dny +4

      Regarding being so calm and collected in the videos, I refer to the great Ben Bailey: "That's editing." :D

  • @cybroxde
    @cybroxde Před 17 dny +345

    After spending two painful days writing a point-in-polygon algorithm for last year's AdventOfCode, it warms my heart to see someone else struggle with the exact same edge cases. I sincerely thank you!❤ And also huge respect if you figured that out on your own. I ended up finding a paper that described the up/down crossing approach and went from there.

    • @cybroxde
      @cybroxde Před 17 dny

      Paper, in case anyone is interested: DOI:10.1016/j.ifacol.2018.05.092

    • @MauritsWilke
      @MauritsWilke Před 16 dny +5

      Haha I also thought of that, me and a buddy spent an entire evening thinking of how to solve it. Discord whiteboard feature actually had a use case for once

    • @DerMax2012
      @DerMax2012 Před 16 dny

      There's a super easy point in polygon test algorithm called "pnpoly" (google it), which I used for AoC 😅Only works well for integer coordinates though. Floating point will probably have all the precision issues discussed in the video as well. It might be an idea to convert the coordinates to fixed point but I don't know how well that works together with the bezier stuff...

    • @nomadvagabond1263
      @nomadvagabond1263 Před 16 dny +8

      I remember this shitty ass exercice made me quit the aoc😂

    • @Imperial_Squid
      @Imperial_Squid Před 16 dny +1

      Haha yeah I remember that exact problem! Took a few goes off running my face into walls to finally encounter every edge case!

  • @juappdev
    @juappdev Před 16 dny +188

    What I love about text is there's so much optional stuff that goes into rendering it besides drawing the glyphs like CTL, layout, pixel alignment, angry art leads complaining that the font looks terrible, ...

    • @IceMetalPunk
      @IceMetalPunk Před 15 dny +10

      Art lead: "Wait, what was that last one?"
      You: "...pixel alignment..."

    • @HalianTheProtogen
      @HalianTheProtogen Před 6 dny

      I wouldn't call those optional myself.

  • @JensAndree
    @JensAndree Před 16 dny +39

    Old-school coder here, long before Truetype was the standard, but one that's always been fascinated by typefaces. I did briefly look into how to render Truetype on the Amiga but back then information wasn't easily available so I stuck using Agfa Intellifont and Postscript Type 1, and of course cool bitmap fonts for all the demo programming we did back then!
    I've always wondered how TT worked and this mammoth video was one of your very best videos, explaining in detail the format - and how to implement rendering without breaking copyright...
    Awesome! Thanks for putting in all the weeks I'm sure this video took to make?!
    I suspect the reason why Truetype is using a big-endian format is that Apple designed it on Motorola 68k. (same as the Amiga albeit Amiga was a much better computer than the Mac... ;) )
    I miss programming big-endian since it was so much simpler to use, especially in assembler, and I secretly wish Intel would change at some point but I know the benefits using small-endian.
    Just an anecdote from the past...
    Anyhow, using shaders to compute the rendering of the fonts was clever because in the beginning I wondered how much CPU you were going to use just rendering some text with your approach, and thinking back to the days of running a 7 mHz 68000 trying to squeeze in all the computations between each raster line not knowing the power that we'd have available today, would I even have believed it?!
    Yet again many thanks for making all the videos you do! Top class productions for sure!

    • @shinyhappyrem8728
      @shinyhappyrem8728 Před 14 dny

      It's easy to use little-endian in hex dumps, just start rendering from the top right instead of the top left :)

    • @oivinf
      @oivinf Před 13 dny +3

      Without infringing on a patent, not breaking copyright :) And luckily at least the first patent he mentions seems to have just a year or so left on its term, so we get to use it soon anyway!

  • @garyduell3768
    @garyduell3768 Před 16 dny +26

    I legit laughed at 2 problems for the price of one. It's such a vibe for programming.

  • @TinyDeskEngineer
    @TinyDeskEngineer Před 8 dny +4

    As soon as you said "The Beauty of Bezier Curves" I knew _exactly_ what was coming.

  • @aviinl1
    @aviinl1 Před 16 dny +533

    patents on algorithms should be illegal.

    • @EliasWolfy
      @EliasWolfy Před 12 dny +41

      yes, this is very annoying, the person who does this has no heart.

    • @L1Q
      @L1Q Před 12 dny +91

      How it is even feasible to not trip on a patent? Just derive a quadratic bezier based algorithm and Microsoft is at your doors? Makes no sense.

    • @TheKhalamar
      @TheKhalamar Před 11 dny +50

      Many companies file patents defensively. Not to prevent others from using the algorithm, but to prevent trolls from preventing them from using it.

    • @pernilsson9493
      @pernilsson9493 Před 11 dny +20

      Shouldn’t then other patents, like those of for example manufacturing processes also be illegal? After all, both are just sets of instructions of how to achieve something?

    • @iago1840
      @iago1840 Před 11 dny +31

      Patents, in any possible scenario and case, should be illegal. Intellectual Property is something that absolutely doesn't exist on reality, makes no sense.

  • @photon6802
    @photon6802 Před 12 dny +4

    It shocks me when I realize how much effort has been put in all of these adventures and how much of this I don't see as the viewer. I mean
    1) docs and articles research
    2) implementing and debugging
    3) coding interactive visualizations
    4) coding debug tools
    5) collecting all of the material into one smooth journey
    I'm pretty sure that I see just 10th part of all work been done to make this video happen. And the amount of behind the scenes work is the main reason why these adventures so interesting and comfortable to watch. Thank you for your job.

  • @PaulSpades
    @PaulSpades Před 16 dny +14

    As an amateur type designer, you definitely made the right choices of what to fix.
    Overlapping shapes are used in designing type, but not always compiled as such (I think most software can do a vector union for each glyph, but it might be avoided because of compound glyphs). Self intersections just can't be avoided in some designs, but they can be minimised. If you're working with lots of auto-generated weights, you can easily miss some.
    And a font that doesn't use the winding direction correctly does not deserve to be displayed.
    Unsurprisingly, you had to re-implement the entire postscript rendering algorithm to get at the end of the video.
    If I was to go so far, I'd simplify all curves to a quad or pentagon and say it was the fastest text renderer in the universe (*that avoids the pesky patents).

  • @ValeBridges
    @ValeBridges Před 16 dny +107

    Only 5 minutes in but I can tell this is a video I'm going to watch and rewatch a hundred times. For one it's a Sebastian Lague video, which are always entertaining and insightful and calming, a combination which I cannot get enough of. Furthermore, the topic of this video seems to cross over with so many other topics which I find fascinating.
    The thumbnail reminded me of Posy's video on segmented displays. The title made me think of Tom7's videos on upper-uppercase and lower-lowercase letters, and the mention of compound glyphs 5 minutes in brings to mind his anaglyphs video. The description mentions Bezier curves which remind me of Freya Holmer's splines video, as well as floating point errors which remind me of, like, the handful of videos on floating point I've watched.

    • @robinhood768
      @robinhood768 Před 16 dny +8

      after reading your comment, I am really looking forward to watching the video.

    • @dpgwalter
      @dpgwalter Před 16 dny +8

      Some of the best technical CZcams channels out there in that second paragraph

    • @matt_hart
      @matt_hart Před 15 dny +6

      i literally know every video you mentioned just by name. we really are all just watching the same videos, aren't we

    • @sponge1234ify
      @sponge1234ify Před 12 dny +2

      (Tell me if my commented the same thing, it disappeared on my end)
      Then I feel like you'll enjoy Agma Schwa's "Heterography: How to Destroy an Alphabet" video. It's a fun romp on writing system like Tom7's video.

    • @ValeBridges
      @ValeBridges Před 12 dny +2

      @@sponge1234ify I've seen it before too, lol. I did enjoy it.

  • @jammyfonx
    @jammyfonx Před 16 dny +75

    Your ability to just jump in to any odd thing and learn is both impressive and inspiring, and your videos are genuinely so much fun to watch, don’t ever stop doing what you do

    • @TheIncredibleAverage
      @TheIncredibleAverage Před 15 dny +1

      Yes reading the docs and researching doesn't occur to most modern programmers

  • @lynnwilliam
    @lynnwilliam Před 16 dny +20

    Studied this in computer science and I love that you covered it in a fun way. Because in college they teach it like reading a manual

  • @tvhead625
    @tvhead625 Před 16 dny +34

    1:09:59 "Graphic design is my passion" that took me so off guard LOL

  • @kytowhd
    @kytowhd Před 16 dny +661

    2 minutes into the video and i'm already completely lost😭

    • @_EasyOnEasy_
      @_EasyOnEasy_ Před 16 dny +19

      You made it that long!?!

    • @PatrickHoodDaniel
      @PatrickHoodDaniel Před 16 dny +29

      2 minutes into this video and I am hooked! Love this stuff!

    • @MatthewHolevinski
      @MatthewHolevinski Před 16 dny +26

      People have been struggling with the 'font' rabbit holes for 40 years, you're in good company.

    • @patman326
      @patman326 Před 16 dny +30

      If you're lost have you tried locating your current position by mapping it against a table of known dispositions and then feed that through an imposition formula?

    • @backslash057
      @backslash057 Před 16 dny +3

      I'm lost since 0:48

  • @chewico3d133
    @chewico3d133 Před 16 dny +62

    A yes, the worst nightmare of Rendering.

    • @MichaelPohoreski
      @MichaelPohoreski Před 16 dny +22

      The banes of graphics programming:
      * floating-point precision
      * transparency (mostly solved with OIT)

  • @CollidaCube
    @CollidaCube Před 16 dny +15

    Sebastian is the only person who can catch people's attention about FONTS for AN HOUR
    Dude your insane. I learn so much from every one of your videos. Keep uploading!

  • @googleyoutubechannel8554
    @googleyoutubechannel8554 Před 13 dny +4

    The 'twilight zone' cut-away... so good Sebastian, you're moving into 'film maker' level production here you realize...

  • @jakobwetzel8167
    @jakobwetzel8167 Před 16 dny +76

    1 Hour long Video? LETS GO! Thx Sebastian.

  • @minecrafter0505
    @minecrafter0505 Před 13 dny +4

    I was not expecting one of your videos covering dynamic unit testing as well as this one. Section "0:41:22 The Evil Artifact Detector" is great at communicating the concept and the benefit it can bring at scale.

  • @lucasmontec
    @lucasmontec Před 16 dny +28

    That patent is so stupid it hurts. A patent on a programming technique should never be a thing. Its like patenting multiplication. It doesn't make any sense.

  • @imrlyunoriginal
    @imrlyunoriginal Před 15 dny +22

    There is exactly one (1) CZcamsr who I would watch talk about displaying fonts programmatically for 70 minutes, and thank you for being him

    • @TNH91
      @TNH91 Před 13 dny

      Wait, this was 70 minutes? Where'd the time go?

  • @cerealkeepsyougoingeveryda555

    THE KING IS BACK!
    Though on a more serious note, Sebastian Lague has inspired me to pursue my deepest questions and go hands-on to understand things fully. Thanks Sebastian Lague!

  • @SongStudios
    @SongStudios Před 16 dny +35

    Another Sebastian video, i am so excited!

    • @EGeorgev
      @EGeorgev Před 13 dny

      And I just can't hide it.

  • @pesterenan
    @pesterenan Před 16 dny +8

    That was such an dive into all the intricacies of text! I'm surprised at how many math problems there are to solve just to show letters correctly on screen, that was really nice. Never a dull moment in the video, beautiful and well explained code. Congratulations, Sebastian!

  • @kaz49
    @kaz49 Před dnem +1

    I know I'll stop understanding about halfway through but I still watch because it's fascinating

  • @hmmmmm8716
    @hmmmmm8716 Před 16 dny +8

    omg, I've been following sebastian for so long see him post is about as rare and rewarding as a solar eclipse, just a couple of days ago I was rewatching his ants and slime simulation video and thought I'd try to do the ant colony optimisation in javascript and it took me a couple of days but I got it done, now working on porting it to C# in Unity to see how much faster it is, thank you for inspiring all of us Sebastian, your adventures pave the way for our own adventures too, hope you're doing well!

  • @Artentus
    @Artentus Před 16 dny +25

    The multi-channel SDF you mentioned is my favorite text rendering method so far. It looks really good except for very small text when strokes become thinner than one pixel. Its main advantage is that it is extremely fast.

    • @krytharn
      @krytharn Před 15 dny +1

      It's a nice trick, I agree, but memory hungry and nowhere near pixel perfect. If, like me, you work with designers who can see your text is one pixel too far to the right, the technique Sebastian is explaining here is far superior.

    • @shinyhappyrem8728
      @shinyhappyrem8728 Před 14 dny

      @@krytharn: "designers who can see your text is one pixel too far to the right" - even at 4k?

    • @caerphoto
      @caerphoto Před 13 dny

      @@shinyhappyrem8728 on a big enough screen, sure :D

    • @krytharn
      @krytharn Před 13 dny +1

      @@shinyhappyrem8728 Even at 10K :) They are there and somehow they're the kind I usually work with. Every little detail counts for them. But don't get me wrong: multi-channel SDF is a great replacement for the old bitmapped text.

  • @DanielNetSet
    @DanielNetSet Před 4 dny +1

    From 7k errors to 0. I admire your problem solving determination and skills❤

  • @whynotcode
    @whynotcode Před 13 dny +1

    This brought back memories. Back in the day there used to be a standard called OpenVG that was supposed to accelerate font rendering using dedicated hardware… it ended up being deprecated because OpenGL ES ended being faster and it wasn’t worth the space on the chip. I love the ambition of your projects and the polish of your videos. I feel like my videos take so long to make so yours must be a full time job 😅

  • @bullshitman155
    @bullshitman155 Před 14 dny +3

    Never imagined i'd watch a 1hr video on text rendering, but,, i guess here we are

  • @meganton9417
    @meganton9417 Před 16 dny +4

    Having heard about Bezier Curves in a lecture and whatched the two videos you mentioned about them, this was at the exact perfect level of still interesting, but not overwhelmingly complex. Great video, as always!

  • @AlexStrook
    @AlexStrook Před 7 dny +2

    this was so funny:
    Screen is on fire and
    "Let's start with the most serious issue first: Getting rid of that weird line"

  • @julienblais4592
    @julienblais4592 Před 2 dny

    This sums up a lot of what software development is: the hunches, the "good enough solution for now", the floating point shenanigans, the debug tools, the tests suite. This is a fantastic video, thanks!

  • @Blananas2
    @Blananas2 Před 16 dny +4

    Watching experts at work is always insightful; incredible work as always!

  • @opitopit2105
    @opitopit2105 Před 16 dny +5

    I've started a text rendering project just the last week or two and now I see that this legend has uploaded a video on the exact same topic. How is this even possible?

  • @jeanmeurice2584
    @jeanmeurice2584 Před 12 dny +1

    There is an interesting property of Bézier curves that makes splitting them at a point actually easier than expected (compared to what is done here in the curve splitting section). It is called "de Casteljau" subdivision.
    The new anchor point that lies on the line between the original anchor points of the curve is actually the linear interpolation with the same 't' as the splitting point.
    This can be visualized in your animation in "Bézier basics" where you show the interpolation line. We search the intersection between the tangent at the splitting point and the anchor line. The tangent is exactly the interpolation line.

  • @bernard-ng
    @bernard-ng Před 13 dny +1

    Je suis développeur depuis longtemps et franchement les vidéos de Sebastian sont les meilleurs en terme de vulgarisation et exploration

  • @thatprogramer
    @thatprogramer Před 16 dny +7

    I can't Believe i can read the intro text truly mind blowing how good our brains recognize patterns
    Im pretty sure the text reads "Coding adventures Rendering Text."

    • @AttyPatty3
      @AttyPatty3 Před 16 dny

      Well I mean, it was obvious that's what it said

  • @nuffsaid0
    @nuffsaid0 Před 16 dny +12

    This video is pure art. I can't imagine that if I told anyone that I watched more than an hour long video on rendering fonts with a smile on my face, anyone would believe. But I did.

  • @thecodewarrior7925
    @thecodewarrior7925 Před 16 dny +2

    As someone who has written a typesetter, it seems very up your alley! I would love to see how you approach it and I think it’s a fascinating topic to dig into.
    Like font rendering, at its basic level it’s not *that* complex, you’ve already done the most basic advance width implementation, but as you start handling more complex mechanics it has almost limitless depth.

    • @lifthras11r
      @lifthras11r Před 15 dny

      Indeed! As who have once designed a sizable font from the scratch---writing my own font file writer in progress---, it is really, _really_ complex if you want to cover them all.
      For example, even a basic font rendering needs *two* completely different outline formats (TrueType vs. CFF) due to the historical reason. This video implements only TrueType outlines, which cover more than 90% of all fonts in my experience, but a significant portion of (expensive) commercial fonts exclusively use CFF instead---such fonts can't use a typical `.ttf` extension however. And CFF is way more annoying to implement because it is an encoding for a specific subset of PostScript language...

  • @fredriks9070
    @fredriks9070 Před 14 dny +1

    I'm continually blown away by the quality and depth of your videos, and your ability to demystify complex topics in such a clear and engaging way!
    I've recently been fascinated by procedural animation, especially after watching David Rosen's GDC talk and his video on the "Gibbon: Beyond the Trees" demo. I remember you used procedural animation for the spiders in one of your earlier Coding Adventures, and I would love to see a standalone video on the subject!

  • @rockyraccoon
    @rockyraccoon Před 16 dny +4

    I absolutely love your videos. You have an uncanny ability to take almost any topic and make it interesting and entertaining. Thanks for the time and care you put into these videos. I always look forward to them.

  • @MagicPixel
    @MagicPixel Před 16 dny +6

    Sebastian, you have to make a video about how you make all these animations, especially the 2D ones. They are beautiful!
    This one was great, as always!

    • @pfqniet
      @pfqniet Před 16 dny +3

      He's actually covered this! Check out the video "Answering Your Questions" where he does a really nice breakdown of how he makes his animations :)

    • @MagicPixel
      @MagicPixel Před 16 dny

      @@pfqniet Cool, thank you!

  • @BritleFoot
    @BritleFoot Před 9 dny +1

    Thank you Sebastian! You’ve tough me to never give up on the hard things in life.
    So inspiring how you fought this glitches in text

  • @WannaComment2
    @WannaComment2 Před 16 dny +2

    35:19 lol I love how you sold that joke with the visuals

  • @chris.hinsley
    @chris.hinsley Před 16 dny +9

    Sebastian, a lot of games these days use the concept of signed distance fields and have a pixel shader do an alpha plot based on the distance from the text vectors. That might be an interesting one to have a go at once you’ve extracted all of the paths. Probably a good starting point for that one is a line draw routine that uses a pixel shader !

    • @MichaelPohoreski
      @MichaelPohoreski Před 16 dny +4

      I have a simple demo on ShaderToy: _Font: Bitmap vs SDF_ that showcases the difference.

    • @chris.hinsley
      @chris.hinsley Před 16 dny +1

      @@MichaelPohoreski Shadertoy is another wonderful resource for folks.

    • @universaltoons
      @universaltoons Před 15 dny +2

      he said it in the video

  • @mebamme
    @mebamme Před 16 dny +3

    I'm so looking forward to watching this video once I have an hour to spare!

  • @user-oh6uw9mu9u
    @user-oh6uw9mu9u Před 16 dny +1

    This might be my new favorite video of yours. Yes, watching chess or video game development is more "exciting", but exploring one of the oldest features of computers that we still use every single day is so interesting! I never would have guessed just how complex and smart font rendering is. I've noticed the colorful edges around text before but never looked up what it was for, so the sub-pixel AA explanation was appreciated too!

  • @dexterman6361
    @dexterman6361 Před 16 dny +1

    1h video from the dude who makes me want to continue and try at look and remember the fun parts of my programming journey and pushes me to learn and get better and keep enjoying things? I don't need sleep I need video!
    Sometimes it just takes another to show you how to recognize the parts of your life that you do get some fun from. I sometimes forget those parts and get lost in the everyday droning. I mean, don't get me wrong, rent and expenses these days make me think there is no future, but hey doesn't mean I have to stop and ignore the fun I may have along the way to doom right :)
    Thank you! I genuinely love watching your videos and trying to make the best of the time when I program, and try to better my skills at it. You sir, are really wholesome. God speed. I hope only good things come your way.

  • @awdk7994
    @awdk7994 Před 16 dny +39

    FREEDOM VECTOR RAHHHHH
    🦅🦅🦅🦅🦅🦅🦅🦅

    • @Giguv05
      @Giguv05 Před 16 dny +3

      LOL

    • @nullFoo
      @nullFoo Před 12 dny +1

      The magnitude of this vector can only be measured in feet and inches, no metric allowed

  • @GanerRL
    @GanerRL Před 16 dny +3

    ive messed with opengl font rendering before and its super nice to see a video explaining everything, makes me wanna redo it using these tricks lol

  • @Thecoolbigbear
    @Thecoolbigbear Před 13 dny

    Your bezier curves plugin helped me immensely when writing my bachelor dissertation. Funny thing is I never knew you created that plugin until years after completing my bachelors. Thank you so much! As someone else said in the comments, you are the Bob Ross of programming. I understand probably 10% and love when you show your own bugs. Please keep doing what you're doing!

  • @cruisecontrol1489
    @cruisecontrol1489 Před 10 dny

    Amount of work you put into visualizing the concepts is truly colossal. Your tenacious problem-solving approach is truly awe-inspiring.

  • @bamsestudio8699
    @bamsestudio8699 Před 16 dny +3

    I always like when a new video is out ❤

  • @aleksszukovskis2074
    @aleksszukovskis2074 Před 16 dny +6

    hell, yeah! this is gonna be awesome

  • @The.Sponge
    @The.Sponge Před 16 dny +1

    Incredibly entertaining! Your way of showing your work and workflow is inspiring

  • @dahahaka
    @dahahaka Před 2 dny

    Nice to see you shouting out Freya's incredible video on Béziers, it's such an incredibly well done explanation and visualization :)

  • @ryderthefirst5023
    @ryderthefirst5023 Před 16 dny +75

    Uploading an hour long video at my local 4am is cruelty 😢

    • @germanminer1276
      @germanminer1276 Před 16 dny +3

      For real, I needa sleep but new vid can't miss

    • @WangleLine
      @WangleLine Před 16 dny +10

      You'll have something nice to wake up to tomorrow!

    • @GeorgeSukFuk
      @GeorgeSukFuk Před 16 dny

      Get your ass up

    • @xandermckay9806
      @xandermckay9806 Před 16 dny +1

      For me, 7 AM. Lemme guess… You live 3 timezones away from me, so Mountain time?

    • @jonaut5705
      @jonaut5705 Před 14 dny

      @@WangleLine sleep can wait, this video cannot

  • @yousorooo
    @yousorooo Před 16 dny +8

    I love how in depth this video is. It’s even more in depth than my college courses. Rasterization is usually very brief without going into all the edge cases.

  • @dutssz
    @dutssz Před 12 dny

    "there's no way there's 1 hour and 10 minutes worth of text rendering stuff" said I, clueless of all the interesting intricacies of rendering fonts. Absolutely loved the video

  • @adriamesas1747
    @adriamesas1747 Před 13 dny

    Congrats for the video once more! It might not be too visual as the others but it’s content and how you explain it it’s gold. My field it’s marketing but I just love your videos and I could spend all the day watching them!❤️ Thanks for the effort you put in them, there are no longer channels like yours

  • @Dshado
    @Dshado Před 16 dny +3

    Woke, boke, and now I see there's a new Coding Adventure! Great Start to the Weekend

  • @verdantblast
    @verdantblast Před 16 dny +11

    When I saw the title, I didn't pay attention to the length of the video until I found out that he really planned to start talking about parsing file formats.
    More than an hour!

  • @mindgame112
    @mindgame112 Před 15 dny

    Your way of visualizing complex mathematics is really next level! The way you are able to explain quite complex formulas and make them understandable ... Top notch content thank you so much!!

  • @gg.mp4642
    @gg.mp4642 Před 14 dny

    I love the animations/visualizations, thank you for putting that much effort into them

  • @hnfrd
    @hnfrd Před 16 dny +42

    I found this 10 minutes after it was posted. The video is an hour long. But there's already people commenting how great of a video it was. Sebastian should do a video about THAT phenomena.

    • @Laborejo
      @Laborejo Před 16 dny +31

      My guess would be that financial supporters get an early view of the video. It can exist as unlisted for as long as he wants and then switch it to public.

    • @JordanMetroidManiac
      @JordanMetroidManiac Před 16 dny +2

      Bot comments exist

    • @Giga4ever
      @Giga4ever Před 16 dny +2

      Supporters can watch video earlier. But if you are a poor boy, just say so.

    • @canerylk2428
      @canerylk2428 Před 16 dny +2

      Nah it's good from the start.

    • @natescode
      @natescode Před 15 dny

      THAT is called Patreon and private video links for supporters before it is made public

  • @angelcaru
    @angelcaru Před 16 dny +7

    Bytecode instructions? HOW DID NOONE TELL ME FONTS ARE A PROGRAMMING LANGUAGE??????

  • @MarushiaDark316
    @MarushiaDark316 Před 16 dny +1

    Another sentence along the same lines as "The quick brown fox ..." that uses all the letters, which I really like is: "Pack my box with five dozen liquor jugs." If I recall correctly, it was first coined by H. P. Lovecraft. Didn't know about the disco one though, so that's cool as now I know of at least three.

  • @the-pink-hacker
    @the-pink-hacker Před 16 dny

    I've been watching your videos for years now and it feels like every time I watch one of your videos I actually learn something. Recently, I came into an issue about doing point-rectangle collisions at arbitrary angles. This video has given me so much inspiration on how to tackle this daunting issue. Thank you so much for all the years of inspiration and motivation down my path into computer science. I wouldn't be nearly as far as I am today without you.

  • @jamesmillerjo
    @jamesmillerjo Před 16 dny +5

    A seriously long and detailed research about various techniques

  • @thatonefoxxy
    @thatonefoxxy Před 16 dny +2

    WE'RE IN FOR ANOTHER HOUR OF A BANGER VIDEO BOIS!

  • @IgorStojkovic
    @IgorStojkovic Před 14 dny +1

    My God man! This is the best educational video I have ever seen! I can't imagine how much time you needed to study all those papers, find what is patented, implement everything and then on top of it all make such an amazing video about the whole thing. You just instantly got one more supporter. Keep up the great work!

  • @asherhaun
    @asherhaun Před 16 dny +1

    This is awesome! I remember experimenting with text rendering (only using bitmap rendering) and it was quite a rabbit hole with very little simple documentation. It was so satisfying to finally see hello world rendering in a window. As always, the explanation in this video is excellent.

  • @AMTunLimited
    @AMTunLimited Před 16 dny +4

    Awesome shout-out for Freya's videos. I feel like those two videos alone could kick off a graphic programming career, absolutely in awe

  • @akashossain8468
    @akashossain8468 Před 16 dny +8

    I don't know why am watching this but I know this does not fit into my brain.

  • @liuyxpp
    @liuyxpp Před 15 dny

    I have similar experiences when I developed a project. It is amazing that you can record this process so clearly and concisely in such an enjoyable way. Admire!

  • @krytharn
    @krytharn Před 15 dny

    My favorite subject covered by my favorite CZcamsr! I have dabbled with text rendering for months and I was familiar with much of what you do here, but I still learned new stuff.
    One thing to note is the pesky J that refuses to behave: the reason it probably cones out right when rendered by an OS, is that it probably just uses even-odd rendering: a pixel is drawn if it is inside an odd number of contours. What you do here is called non-zero rendering, where you count up if the contour is CW and down if CCW. There should be a flag in the font data telling you which method to use.

  • @janhrubec7643
    @janhrubec7643 Před 14 dny +1

    Love your videos. Really amazing work, they are really calming and peaceful and you always get to learn about a new and interesting topic.

  • @marked23
    @marked23 Před 16 dny +2

    This is so beautiful. You've gone well beyond an adventure. This is an epic.

  • @finlaycameron4553
    @finlaycameron4553 Před 13 dny

    Your videos are so chill, I love what you’re doing ❤

  • @skysphr
    @skysphr Před 16 dny +2

    Wow, literally yesterday I randomly remembered the channel and thought "It's been a few months, I bet Sebastian is cooking something really cool".

  • @jamescutajar2679
    @jamescutajar2679 Před 15 dny

    There is so much detail and the process is complicated, but I deeply appreciate the time you have taken to cover the topic. I've been searching on multiple websites to try and understand how the font file format works, and having such a detailed and concise video is amazing! Thanks!

  • @TearonQ
    @TearonQ Před 6 dny +1

    Aaaaaa i wanted to watch more of this!! i was so focused on watching it for the whole hour long video, then it just ended :c
    awesome job, really nice video !

  • @lobau_
    @lobau_ Před 11 dny

    The work that you are putting into those videos is inspiring. Thank you.

  • @omkarbhale442
    @omkarbhale442 Před 16 dny +2

    When I saw your video, I shouted "YES" a few times and my friend was staring at me. Brother I dream of becoming a programmer as skilled as you.

  • @rainrope5069
    @rainrope5069 Před 13 dny

    this video was amazing. I really loved how this project combined so many different topics- parsing binary files, rendering, and a lot of math and problem solving. I really like how you showed the failures and how many different iterations and approaches the rendering piece went through. Fantastic video and project!

  • @AngrySkyBandit
    @AngrySkyBandit Před dnem

    Awesome video ! You are one of the very few content creators who can release a +1h video, and I would go back to it when I have the time. Thank you for your work, and how you share it with us.

  • @borisjake2
    @borisjake2 Před 13 dny

    I love that you used the code you'd written to make the whacky ending. Every one of your videos is mesmerising, and I love hearing you how you tackle each problem and come up with solutions.

  • @FoxChaotica
    @FoxChaotica Před 16 dny +2

    I love the subtle joke of making the title a series of blocks, that's a nice touch