An attempt to make a font look more handwritten(jvns.ca)
jvns.ca
An attempt to make a font look more handwritten
https://jvns.ca/blog/2020/08/08/handwritten-font/
19 comments
+ the text isn't joined up.
The "connect" in the first image is going upwards I think
https://jvns.ca/images/font-sample-connect.png
https://jvns.ca/images/font-sample-connect.png
"Connect" is a picture of his actual handwriting; the black text is the first version of the font.
Shout out to everybody who, unlike the author, has mostly illegible handwriting and wouldn’t want it immortalised in this way.
Hah, that's actually why I want this. I'm a lefty, and that pretty much guarantees sloppy handwriting. I like how using fonts makes it look so much cleaner. The only problem I had before reading this was that the results were too clean.
> I'm a lefty, and that pretty much guarantees sloppy handwriting.
Is that true? Why would being lefty mean sloppier handwriting? Smudgier maybe because of left-to-right writing system, but sloppier?
Is that true? Why would being lefty mean sloppier handwriting? Smudgier maybe because of left-to-right writing system, but sloppier?
Pushing the pen is a little trickier than pulling it.
Not sure that’s true, I used to work with a right-handed Pakistani person who was fully bilingual in Urdu and English and they claimed their handwriting was neater in Urdu than English. I couldn’t tell because I can’t read Perso-Arabic.
Although it’s also possible that RTL writing systems like Perso-Arabic are designed in such a way that it’s ergonomic for the right-handed majority of the population to write in.
It’s an interesting topic, wonder if there are any papers on it
Although it’s also possible that RTL writing systems like Perso-Arabic are designed in such a way that it’s ergonomic for the right-handed majority of the population to write in.
It’s an interesting topic, wonder if there are any papers on it
I think it is easier because the length of unbroken long lines isn't as long as in cursive Western writing. So they aren't push-hop-push-hop their way through long unbroken lines like we are. Lefties often prefer printing for exactly that reason. It's slower, but at least they can read it after.
Pushing instead of pulling the pen, at least that seems part of it in my case. I've seen people write 'top down', but...
Regardless, 'how people write' has typically been designed by righties. Fascists. Oh how they mock us.
Regardless, 'how people write' has typically been designed by righties. Fascists. Oh how they mock us.
Do you actually push instead of pulling for English as a leftie? I ask because you definitely don't need to "push instead of pull" for RTL languages if you're right-handed (though I'm not suggesting nobody does; I'm sure some fraction of people do), so it's hard for me to see why that would be true for left-handed folks in English.
Look at the angle of the pen/pencil when a right handed and a left handed person is writing. The lefty is indeed pushing the point into the paper. Right handed people drag it.
The lefties who try not to push it curl their wrists into that weird lefty-pose. That way does allow them to drag it. I don't do that, thankfully. It looks pretty bizarre, because writing shouldn't require such acrobatics.
The lefties who try not to push it curl their wrists into that weird lefty-pose. That way does allow them to drag it. I don't do that, thankfully. It looks pretty bizarre, because writing shouldn't require such acrobatics.
I think I miscommunicated my thoughts, but I was neither trying to say there aren't left-handed folks who push, nor that there aren't ones who pull with a weird pose. Rather, I was wondering if these are actually needed, or if one could do it differently (yet comfortably). Because I believe for LTR and RTL languages, people comfortably write with their right hands holding the pen at basically the same angle regardless of the text direction. Compare [1] with [2] for instance. In both cases the pen tip points to the "north northwest" (so to speak), yet the languages go in opposite directions.
[1] https://www.youtube.com/watch?v=QG-i9yA_OHs&t=3m59s
[2] https://www.youtube.com/watch?v=AwUkseFmqb4&t=1m19s
[1] https://www.youtube.com/watch?v=QG-i9yA_OHs&t=3m59s
[2] https://www.youtube.com/watch?v=AwUkseFmqb4&t=1m19s
Yes, I see.
I worked in Riyadh for a while. When it came to numbers, since they would generally be writing in Arabic, they'd leave a gap, and then write Western numbers LtoR, before going back to the start of the number and continuing on RtoL in Arabic. That's when it hit me that people who write Arabic push the pencil in the same way that lefties push it in LtoR languages.
Interestingly I didn't see even one adopt the Lefty-hook hand with their right hand. Unfortunately I never noticed anyone there writing Arabic left-handedly. And I watched for it on purpose, because I was genuinely curious about that.
One thing though, is that Arabic letters are formed in a different way than Western letters are. I suppose Western cursive gets close - but cursive is where lefties push the pencil most, and where writing begins to suffer. (Yes, as per other comments, there ARE lefties who can be tidy. But that's like saying there are grandma's out there that can't cook. Of course you can find examples if you look for them.)
Incidentally, I don't do the lefty-hook thing either. But I'm well aware of it since it is part of so many lefty jokes, and I have seen quite a few people who do it.
I worked in Riyadh for a while. When it came to numbers, since they would generally be writing in Arabic, they'd leave a gap, and then write Western numbers LtoR, before going back to the start of the number and continuing on RtoL in Arabic. That's when it hit me that people who write Arabic push the pencil in the same way that lefties push it in LtoR languages.
Interestingly I didn't see even one adopt the Lefty-hook hand with their right hand. Unfortunately I never noticed anyone there writing Arabic left-handedly. And I watched for it on purpose, because I was genuinely curious about that.
One thing though, is that Arabic letters are formed in a different way than Western letters are. I suppose Western cursive gets close - but cursive is where lefties push the pencil most, and where writing begins to suffer. (Yes, as per other comments, there ARE lefties who can be tidy. But that's like saying there are grandma's out there that can't cook. Of course you can find examples if you look for them.)
Incidentally, I don't do the lefty-hook thing either. But I'm well aware of it since it is part of so many lefty jokes, and I have seen quite a few people who do it.
Turn the paper, not your wrist!
A much easier solution for left-handers is turning the paper. 45-60 degrees works best for me. Then you don't need to curl your wrist.
A much easier solution for left-handers is turning the paper. 45-60 degrees works best for me. Then you don't need to curl your wrist.
That's more or less what I do.
The other problem lefties face, that impacts writing clarity, is that when writing in a school binder, those rings are exactly where your wrist needs to be pretty much half the time.
Of course the answer is to write on paper outside the binder, and then turning the paper to a good angle works well enough. But that doesn't help when it comes to coil books, etc, which doesn't impact righties, but does impact lefties.
The other problem lefties face, that impacts writing clarity, is that when writing in a school binder, those rings are exactly where your wrist needs to be pretty much half the time.
Of course the answer is to write on paper outside the binder, and then turning the paper to a good angle works well enough. But that doesn't help when it comes to coil books, etc, which doesn't impact righties, but does impact lefties.
I refute your claim that being left-handed pretty much guarantees sloppy handwriting.
My parents are both left handed. Mum’s handwriting is very classically neat according to a standard form with fairly wide letters. Dad’s is not classically neat, favouring taller letters and shapes more angular than rounded, but it’s definitely tidy and very legible.
Another of the neatest writers that I know is left-handed. (And female. I have observed a moderately strong correlation—though by no means uniform—between classically neat handwriting and being female.) I can think of several other left-handed people that I know, but I don’t know their handwriting. My left-handed grandmother’s handwriting is neat in the fairly illegible cursive style of the era, but she does it with her right hand since they beat left-handedness out of you (in handwriting at least) in those days.
(Fun fact: I and my seven siblings are all “failures”. Consensus seems to be something like 20% chance of a child of two lefties being left handed, so the probability of all eight of us being right handed was somewhere around 17%.)
My parents are both left handed. Mum’s handwriting is very classically neat according to a standard form with fairly wide letters. Dad’s is not classically neat, favouring taller letters and shapes more angular than rounded, but it’s definitely tidy and very legible.
Another of the neatest writers that I know is left-handed. (And female. I have observed a moderately strong correlation—though by no means uniform—between classically neat handwriting and being female.) I can think of several other left-handed people that I know, but I don’t know their handwriting. My left-handed grandmother’s handwriting is neat in the fairly illegible cursive style of the era, but she does it with her right hand since they beat left-handedness out of you (in handwriting at least) in those days.
(Fun fact: I and my seven siblings are all “failures”. Consensus seems to be something like 20% chance of a child of two lefties being left handed, so the probability of all eight of us being right handed was somewhere around 17%.)
Women have better hand-eye coordination. And that also makes them better welders. At least, that's what the grizzled old guy that taught me how to weld said.
Maybe you want to try a fountain pen? For me my handwriting legibility differs greatly between using it compared to a ballpoint. I don't like the scratching or more pressure needed when using ballpoints.
I have a font that I made based on my own handwriting that does this. Three variants is really not enough to feel organic, five or six is.
Spending a while tweaking kerning in Glyphs helps too. When I’m using it in something, then every time I notice some bad kerning, I’ll dump the text into Glyph’s preview window and tweak things. It is an ongoing process. Still needs a bunch of characters, too, I think it’s missing numbers and some important punctuation...
(Also looking at my blog the last time I fucked with it was probably around 2015. https://egypt.urnash.com/blog/tag/font/ )
Spending a while tweaking kerning in Glyphs helps too. When I’m using it in something, then every time I notice some bad kerning, I’ll dump the text into Glyph’s preview window and tweak things. It is an ongoing process. Still needs a bunch of characters, too, I think it’s missing numbers and some important punctuation...
(Also looking at my blog the last time I fucked with it was probably around 2015. https://egypt.urnash.com/blog/tag/font/ )
I think the first chunk of code in https://forums.adobe.com/message/1785905#1785905 has what I used to make it cycle between multiple copies of each letter.
The "programmatically generate a lot of ligature pairs with random choices as to which variant" is clever, but I feel like it's gonna be pretty obvious - you'd get the same ligas a lot in common words like 'the' and the eye would pick that out very quickly!
(also man this font I was working on has some crazy ideas in it, I really like the 'switch to italic glyphs by putting a slash at the front of the word' idea. No faffing around with a separate font. Very weird but very useful for the case of "lettering my comics".)
One major difference in how I approached this problem was to work from an existing corpus of letters drawn with the natural rhythms of handwriting, too. I took a bunch of hand-lettering I'd done and worked from that instead of drawing each letter in a little box for a program to parse...
The "programmatically generate a lot of ligature pairs with random choices as to which variant" is clever, but I feel like it's gonna be pretty obvious - you'd get the same ligas a lot in common words like 'the' and the eye would pick that out very quickly!
(also man this font I was working on has some crazy ideas in it, I really like the 'switch to italic glyphs by putting a slash at the front of the word' idea. No faffing around with a separate font. Very weird but very useful for the case of "lettering my comics".)
One major difference in how I approached this problem was to work from an existing corpus of letters drawn with the natural rhythms of handwriting, too. I took a bunch of hand-lettering I'd done and worked from that instead of drawing each letter in a little box for a program to parse...
> switch to italic glyphs by putting a slash at the front of the word
Wait, are you saying it might be possible to implement typesetting rules by creating a font that interprets syntax?! As in egypturnashs-markdown-renderer-font.ttf??? That is both horrifying and wondrous.
Wait, are you saying it might be possible to implement typesetting rules by creating a font that interprets syntax?! As in egypturnashs-markdown-renderer-font.ttf??? That is both horrifying and wondrous.
Yep!
OpenType can do some very very complicated things; I would honestly be surprised if it's not Turing-complete. But it is also one of those languages where a lot of things are possible but actually doing them is pretty tedious. Take a look at some of the links at the end of my notes on this font and you'll see what kind of repetitive horrors have to be generated to do Weird Stuff.
OpenType can do some very very complicated things; I would honestly be surprised if it's not Turing-complete. But it is also one of those languages where a lot of things are possible but actually doing them is pretty tedious. Take a look at some of the links at the end of my notes on this font and you'll see what kind of repetitive horrors have to be generated to do Weird Stuff.
Interesting. I immediately thought of ligatures to generate variation but hadn't clued that the common ones would be obviously similar. As someone who can't repeat my own signature the same way twice a handwritten font is something I really want for filling in forms "by hand".
Making a font can be very detailed process and often a slow process. I really admire font makers and type designers who put so much effort in creating fonts.
Here is a very informative and enjoyable look at how one visual designer went about creating their first handwritten font:
The process for making and selling a font:
https://www.youtube.com/watch?v=jtSZqhtSjpk
Here is a very informative and enjoyable look at how one visual designer went about creating their first handwritten font:
The process for making and selling a font:
https://www.youtube.com/watch?v=jtSZqhtSjpk
This is great. I attempted a couple of handwriting fonts before, but could never get them to look like my actual writing which is never nearly so uniform (even if I tried). I wrote a letter to my sister who, even after mix-n-matching the fonts to make it as realistic as possible, said it looked like it came from robot-me. I'm going to try your method, because I still have application for a more hand-written looking font.
I once spent some effort to make my handwriting very legible, without concern for calligraphic sensibilities. For example I had serifs on several but not all letters. Perhaps such handwriting (and similar efforts) would lend themselves more to handwriting fonts than digitizing handwriting that is not practiced for legibility. I mean: perhaps it would look handwritten when digitized more so than fonts based on handwriting not optimized for legibility (optimized in the sense of my effort). The author’s handwriting looks quite legible. I wonder how they approached their own handwriting before digitization.
> I once spent some effort to make my handwriting very legible, without concern for calligraphic sensibilities. For example I had serifs on several but not all letters.
As far as I'm aware, it's perfectly normal to write 'I' with serifs and everything else without.
As far as I'm aware, it's perfectly normal to write 'I' with serifs and everything else without.
I've seen this problem discussed multiple times. People want ‘handwritten’ fonts for one reason or another, but then once you notice identical letters you can't unsee them.
The thing about ligatures is that they don't permit true randomness, but you can cycle through a set of glyphs for a letter—if I understand correctly, you don't even need neighboring letters for that. However, people stop after adding just a few variations, and that still looks mechanical because the same letters occur many times in a paragraph. For good results, you should just keep throwing more variations in—like a couple dozens I think (maybe depending on the frequency of a letter, but then if you come upon ‘QQQQQQQ Inc.’, the effect will be ruined).
Also, invariably people tune kenning in ‘handwritten’ fonts. Why? Pretty sure they don't do that with actual writing, do they? If anything, I'd add some subtle sloppiness to the font generator's output.
The thing about ligatures is that they don't permit true randomness, but you can cycle through a set of glyphs for a letter—if I understand correctly, you don't even need neighboring letters for that. However, people stop after adding just a few variations, and that still looks mechanical because the same letters occur many times in a paragraph. For good results, you should just keep throwing more variations in—like a couple dozens I think (maybe depending on the frequency of a letter, but then if you come upon ‘QQQQQQQ Inc.’, the effect will be ruined).
Also, invariably people tune kenning in ‘handwritten’ fonts. Why? Pretty sure they don't do that with actual writing, do they? If anything, I'd add some subtle sloppiness to the font generator's output.
I often get mail from AT&T or some other big-corp with a handwriting-like font on it, but they aren't sophisticated enough to vary the letters, so it's a dead giveaway that it's just junk mail. Sadly, the day those guys manage to apply this tech convincingly is the day I'm going to end up opening a lot more junk mail.
I remember back in the dark ages (before the 2000s) playing with Postscript to add random perturbations to letters in order to generate semi-convincing "not obviously printed" address labels (for competition entries.)
Occasionally it would perturb too hard and you'd end up with one or more legs of your letter at some distance. Most aggravating.
Occasionally it would perturb too hard and you'd end up with one or more legs of your letter at some distance. Most aggravating.
If you took this to the extreme and added glyphs and rules for for each letter combination (e.g., aa, ab, ac, ad ...), that would probably get you something that looked pretty natural for text that didn't have repeated words too close to each other (since the same word will look identical).
On a slight tangent, back in the day it was easy to knock up a Java GUI for an app, only to present it to a client who would then mistakenly think it was the finished product.
There was a pluggable look-and-feel for Java Swing called the NapkinLAF, which presented the UI using a pseudo hand written font and irregular lines.
Clearly writing Java GUIs have been dead for a while, but the project lives on at http://napkinlaf.sourceforge.net/ and has some screenshots of what it made the GUI look like.
There was a pluggable look-and-feel for Java Swing called the NapkinLAF, which presented the UI using a pseudo hand written font and irregular lines.
Clearly writing Java GUIs have been dead for a while, but the project lives on at http://napkinlaf.sourceforge.net/ and has some screenshots of what it made the GUI look like.
Yes, back when OS/app appearance was still very customisable, themes like that were not uncommon.
...and if sites which contained lots of mobile screenshots like damnyouautocorrect.com (seems to have disappeared, and I can't find anything on what happened to it...?) were any indication, it seems a lot of people like script fonts too.
...and if sites which contained lots of mobile screenshots like damnyouautocorrect.com (seems to have disappeared, and I can't find anything on what happened to it...?) were any indication, it seems a lot of people like script fonts too.
The introduction to OpenType options is awesome! Sounds like we could set up a font to display smart quotes while still copy-pasting code snippets as dumb quotes!
It would be interesting to see if an AI can learn about the movements that trace someone's particular handwriting, perhaps it can identify and reproduce the different "styles" involved (i.e from person to person).
This problem was more or less solved with neural networks in 2013, see https://arxiv.org/abs/1308.0850. I've implemented a similar model in javascript that you can interact with: https://seanvasquez.com/handwriting-generation/
As a highschooler, sites like Calligraphr and this advice have been a blessing in circumventing arbitrary "you must handwrite this" requirements for assignments.
I've seen some interesting things done with Rune. For example: https://observablehq.com/@illus0r/calligraphy
Not related but your website loads instantly it's refreshing.
Is there a software that draws text as if someone is writing it? each letter drawn starting from one point and slowly going to the other end, words written drawn one letter at a time.
Perhaps something like this? https://seanvasquez.com/handwriting-generation
This is awesome. The fact that it writes the same word very differently each time is impressive. Would be interesting to know the underlying mechanics.
Neat! With real writing it’s nice to be able to use the random variations and patterns in writing as landmarks.
I always thought that would be useful on a screen.
I always thought that would be useful on a screen.
- Direction of the text (we don't write exactly left to right, we strive for that but end up going slightly up or down, usually correcting the tilt of one word in the next as we notice the deviation).
- irregular spacing
- Some letters invade the others' space (the g's for example end up going a bit under the previous letter).
The combination of those three is, I think, what gives the artificial text the feeling of being a row of invisible boxes each filled with a character. Still, the result is extremely cool!