morisawausa / _vfvisualizer

A visualizer and tool for setting up substitution rules for variable fonts
https://vfbounds.occupantfonts.com
Apache License 2.0
33 stars 0 forks source link

Add Glyphs 3.app feature code as a compilation target #2

Open nicschumann opened 3 years ago

nicschumann commented 3 years ago

Glyphs 3 has support for substitutions by directly writing opentype feature code that's conditioned on designspace locations (see the end of this thread for details). (This is not part of adobe's OpenType feature specification, it's a layer that Glyphs 3 added.) We could have the variable font visualizer author this feature code base on what you select in the interface, and then you could copy/paste the code back into Glyphs directly, which would sidestep the need to go through designspace files entirely.

You could export a .ttf (with no production names) from Glyphs, drop it in the visualizer, generate your subs, and paste the resulting features back into Glyphs. Job done.

weiweihuanghuang commented 3 years ago

Seconded, I was thinking of trying to build this myself too actually

nicschumann commented 3 years ago

Thanks @weiweihuanghuang ! I'm glad the idea makes sense. We're still in Glyphs 2 land at Occupant Fonts. I think I'll look at building this when we make that jump to Glyphs 3.

In the mean time, if you're interested in working on this feature, that would be pretty amazing. I'd be happy to help you get set up with the code / show you where to put code for a Glyphs 3 backend. Let me know!

weiweihuanghuang commented 3 years ago

My js isn't great but I'd love to try take a look – if you could point me where I can write the generator. The G3 sytnax is very simple tbh, this is a typical example that will go under the rvrn feature (although currently we're putting in rlig since rvrn fails to activate on anythinge except the default glyphs):

# ifdef VARIABLE

condition 127 < wght < 175;
sub dollar by dollar.bold;
sub naira by naira.bold;
sub won by won.bold;
sub colonsign by colonsign.bold;

condition 105 < wght < 175, 75 < wdth < 90;
sub dollar by dollar.bold;
sub naira by naira.bold;
sub won by won.bold;
sub colonsign by colonsign.bold;

# endif
nicschumann commented 3 years ago

Awesome. I'm super excited that you're into trying this out.

This seems like a good opportunity for me to add more information of contributing and development to the README document. I'll add a section at the bottom that describes how to get a local development environment up and running, and then another section that describes where/how to add a new generator.

I'll ping this thread when that stuff is up.

nicschumann commented 3 years ago

@weiweihuanghuang I just added a bunch of information to the README, in the Developing and Contributing section. I added some information about getting the development env up and running, as well as how to add a code generator. I think there's enough info in there for you to figure out the data you're working with, and how to transform it into Glyphs 3 feature code.

I also quickly stubbed out a place in the UI where the glyphs 3 code will render, for you to test with. When you open the Generate Table tab at the top right, you'll see a .glyphs tab. It looks like this:

Screen Shot 2021-07-08 at 12 10 48 PM

Whenever someone switches to that .glyphs tab, it will run your code generator, and dump the output into that window.

I also added a stub method in the src/store/tables.js file, where you can do your implementation of the code generator.

Screen Shot 2021-07-08 at 12 10 10 PM

There's a lot of documentation on the parameters you'll get in the README. You should return a list of strings that you want the user to copy and paste into Glyphs 3. Let me know if there's any other info I can give you / anything I can help out with. This is our first time having anyone outside the Occupant Fonts team work on our codebase, and we're learning what the best way to do it. Feel free to open a PR when you're ready to share. Thanks for being interested in helping out!

weiweihuanghuang commented 3 years ago

Fantastic, thank you! I have noticed you have exceptionally detailed documentation and comments in the code.

gorjious commented 1 year ago

Hello @nicschumann and @weiweihuanghuang I recently learned about this incredible tool. I am curious if there are any updates about using the VF Visualizer to create the Glyphs 3 feature code?

schriftgestalt commented 1 year ago

I wonder if would make sense to run that directly inside Glyphs as a plugin?

weiweihuanghuang commented 1 year ago

@schriftgestalt if it has the same visualisation functions yes that would be amazing?!