TTF interpolation defects

[dy]

Hello! I am building a variable font for rendering waveforms, https://audio-lab.github.io/wavefont/, and observing an issue with interpolating TTF state. Font has alignment axis, and masters define top-align and bottom-align state, with values of algn 1 and 0 respectively, see descignspace file. Center align state (algn 0.5) is expected to be interpolated by font. And it is interpolated nicely by OTF font, generated with afdk:

But with TTF font, generated by fontmake, interpolation shows artifacts: As if top part of bars have right edge lowered by 1px.

What can that be related to? Some rounding to int?

[anthrotype]

you said you generated the OTF using afdko. What specific tool and exact command-line did you use to build it?

[dy]

buildmasterotfs -d masters/wavefont.designspace

and then

buildcff2vf -c -k -d masters/wavefont.designspace -o ./font/wavefont.otf

The afdko version used is 3.6.2-alpha2

pip install --pre afdko==3.6.2a1

[anthrotype]

i'm unable to build your designspace using the command fontmake -m masters/wavefont.designspace -o variable, I'm getting this error (full traceback when running fontmake with --verbose DEBUG):

ERROR:root:In 'wavefont.designspace': Generating fonts from Designspace failed: The file '0.glif' associated with glyph '_0' in contents.plist does not exist on <osfs '/Users/clupo/Github/wavefont/masters/1_0.ufo'>/glyphs
Traceback (most recent call last):
  File "/Users/clupo/.local/pipx/venvs/fontmake/lib/python3.9/site-packages/fs/osfs.py", line 639, in open
    return io.open(
FileNotFoundError: [Errno 2] No such file or directory: b'/Users/clupo/Github/wavefont/masters/1_0.ufo/glyphs/0.glif'

[... omit for brevity ...]

fontTools.ufoLib.errors.GlifLibError: The file '0.glif' associated with glyph '_0' in contents.plist does not exist on <osfs '/Users/clupo/Github/wavefont/masters/1_0.ufo'>/glyphs

The above exception was the direct cause of the following exception:

Traceback (most recent call last):
  File "/Users/clupo/.local/pipx/venvs/fontmake/lib/python3.9/site-packages/fontmake/__main__.py", line 464, in main
    project.run_from_designspace(designspace_path, **args)
  File "/Users/clupo/.local/pipx/venvs/fontmake/lib/python3.9/site-packages/fontmake/font_project.py", line 947, in run_from_designspace
    raise FontmakeError(
fontmake.errors.FontmakeError: In 'wavefont.designspace': Generating fonts from Designspace failed: The file '0.glif' associated with glyph '_0' in contents.plist does not exist on <osfs '/Users/clupo/Github/wavefont/masters/1_0.ufo'>/glyphs

[dy]

Ah, sorry about that, yes, ‘npm run build’ should come first, these glyphs are automated.

On Mon, Feb 22, 2021 at 6:26 AM Cosimo Lupo notifications@github.com wrote:

i'm unable to build your designspace using the command fontmake -m masters/wavefont.designspace -o variable, I'm getting this error (full traceback when running fontmake with --verbose DEBUG):

ERROR:root:In 'wavefont.designspace': Generating fonts from Designspace failed: The file '0.glif' associated with glyph '_0' in contents.plist does not exist on <osfs '/Users/clupo/Github/wavefont/masters/1_0.ufo'>/glyphs Traceback (most recent call last): File "/Users/clupo/.local/pipx/venvs/fontmake/lib/python3.9/site-packages/fs/osfs.py", line 639, in open return io.open( FileNotFoundError: [Errno 2] No such file or directory: b'/Users/clupo/Github/wavefont/masters/1_0.ufo/glyphs/0.glif'

[... omit for brevity ...]

fontTools.ufoLib.errors.GlifLibError: The file '0.glif' associated with glyph '_0' in contents.plist does not exist on <osfs '/Users/clupo/Github/wavefont/masters/1_0.ufo'>/glyphs

The above exception was the direct cause of the following exception:

Traceback (most recent call last): File "/Users/clupo/.local/pipx/venvs/fontmake/lib/python3.9/site-packages/fontmake/main.py", line 464, in main project.run_from_designspace(designspace_path, **args) File "/Users/clupo/.local/pipx/venvs/fontmake/lib/python3.9/site-packages/fontmake/font_project.py", line 947, in run_from_designspace raise FontmakeError( fontmake.errors.FontmakeError: In 'wavefont.designspace': Generating fonts from Designspace failed: The file '0.glif' associated with glyph '_0' in contents.plist does not exist on <osfs '/Users/clupo/Github/wavefont/masters/1_0.ufo'>/glyphs

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/googlefonts/fontmake/issues/738#issuecomment-783305801, or unsubscribe https://github.com/notifications/unsubscribe-auth/AACJII4B2B6YUKWK4EUODVDTAI5N5ANCNFSM4X6OXBWQ .

[anthrotype]

still getting an error after running npm run build from the root of the wavefont repository directory.

$ npm run build

> wavefont@2.0.0 build
> npm run build-values-1-0 && npm run build-values-1-1 && npm run build-values-1-center && npm run build-values-100-0 && npm run build-values-100-1 && npm run build-ttf

> wavefont@2.0.0 build-values-1-0
> build-values.sh 1 0

sh: build-values.sh: command not found
npm ERR! code 127
npm ERR! path /Users/clupo/Github/wavefont
npm ERR! command failed
npm ERR! command sh -c build-values.sh 1 0

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/clupo/.npm/_logs/2021-02-22T11_45_38_224Z-debug.log
npm ERR! code 127
npm ERR! path /Users/clupo/Github/wavefont
npm ERR! command failed
npm ERR! command sh -c npm run build-values-1-0 && npm run build-values-1-1 && npm run build-values-1-center && npm run build-values-100-0 && npm run build-values-100-1 && npm run build-ttf

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/clupo/.npm/_logs/2021-02-22T11_45_38_250Z-debug.log

[dy]

Hm, try sudo chmod +x build-values.sh sudo chmod +x build-values-center.sh. Are you running in macOS? If doesn't work, I do manually

./build-values.sh 1 0
./build-values.sh 1 1
./build-values-center.sh 1
./build-values.sh 100 0
./build-values.sh 100 1

Sorry for that hassle, will replace bash script soon.

[anthrotype]

even after setting the executable flag I get the same error when doing npm run build. I was able to run the shell scripts one by one. Yes, i'm running macos 10.15, with node installed via homebrew. I have no idea why it fails like that, I'm no js expert.

Ok, I built the variable font with fontmake 2.3.0, this is what I got:

wavefont-VF.ttf.zip

but it's now obvious to me how I can reproduce those glitches you reported in the screenshot.

Where did you render the font? What OS or browser or app? What text string and variation settings?

[dy]

Observing the same issue with your font.

It fails for all values of wdth with algn = 0.5, in fact any align other than 1 and 0 fail. Example can be any string, eg. āĄĉĐĘġīĶŀʼnőŗśŜśŗőňľijħĜđĉă

Brave/Crome on Windows:

Firefox on Windows:

Works fine in Safari macOS and iPhone, edge is flat there.

That can possibly be platform problem, unless there are interpolation settings inside the font itself.

[dy]

It has something to do with order of points in contour. Swapping contour to

    <contour>
+     <point x="0" y="0" type="line"/>
      <point x="0" y="10" type="line"/>
      <point x="100" y="10" type="line"/>
      <point x="100" y="0" type="line"/>
-     <point x="0" y="0" type="line"/>
    </contour>

moves that saw to the bottom:

[anthrotype]

the fact it only happens on some browsers and not all of them, and the fact that it only happens for TTFs, makes me think this might have to do with so-called "inferred variation deltas" which are only found in TrueType-flavoured variable OpenType fonts: https://docs.microsoft.com/en-us/typography/opentype/spec/gvar#inferred-deltas-for-un-referenced-point-numbers

Could you please try to rebuild the VF using the option --no-optimize-gvar and see if that changes the result?

[dy]

this might have to do with so-called "inferred variation deltas" rebuild the VF using the option --no-optimize-gvar

Brilliant. It worked! Many thanks. Is that still an issue then or can be closed?

[anthrotype]

hm, that's not good. It means there are bugs in the way the font's gvar is interpreted in some environments. It'd be better to file issues with the affected browsers. Could you provide an easy way to reproduce this, like a zip file containing the two fonts with and without inferred gvar deltas, and an html file using both with some strings and feature settings so one can load that in various browsers?

[anthrotype]

also note that disabling the gvar optimization makes the VF slightly bigger (by how much it depends).

[dy]

For this particular case there's no size difference. Attached the minimal demo: ttf-gvar-issue.zip

[anthrotype]

thanks! I think the the src: url(...) point to the same wavefont.ttf, but the files are named wavefont-good.ttf and wavefont-bad.ttf. Otherwise, works, thanks

Just tried on my macOS Chrome and could not reproduce.

[dy]

Whoops. This one is corrected. ttf-gvar.zip

Yes, it works on Mac/iPhone for me too.