Add Time [ TIME ], or, Animation [ ANIM ] axis

ebraminio commented 1 year ago

Font project(s) using the axis

https://github.com/Typogram/Anicons (TIME)
https://github.com/simoncozens/lottie2vf (ANIM)

Short description of what the axis does

Providing animated icons using variable fonts

Image

https://github.com/googlefonts/axisregistry/assets/833473/ed3e30c6-e422-4300-b2ba-08a1bc39f956

from https://ebraminio.github.io/flutter_variable_font_animation_demo/build-web-html/

https://github.com/googlefonts/axisregistry/assets/833473/87e1d5be-f590-4e8b-85bb-656475e11d17

from https://simoncozens.github.io/colrv1-rocks/

Also have a look at https://ebraminio.github.io/flutter_variable_font_animation_demo/build-web-html/ that has lots of animated icons using fonts.

Why is the axis needed

"Flutter is an open source framework by Google for building beautiful, natively compiled, multi-platform applications from a single codebase." (copied from https://flutter.dev). It offers static icons to developers using font icons. It even while releasing a production app, uses a tree shaking / font subsetting process to turn a general propose font icons into the only used part using harfbuzz-subset. But Flutter only offers static icons via font icons and it's currently AnimatedIcon facility uses raw dart codes, https://github.com/flutter/flutter/tree/master/packages/flutter/lib/src/material/animated_icons/data and even these raw dart codes and the facility that has created them can't be used to create custom animated icons as this line final _AnimatedIconData iconData = icon as _AnimatedIconData; ensures the used _AnimatedIconData is owned by the project itself and blocks any external uses.

So I was thinking what if just like use of font for static icons, we could use variable fonts font animating icons and maybe add a new axis, maybe called TIME, like the naming in https://github.com/Typogram/Anicons but using seconds as the value. The axis max value can be a good indication of how animations on the specific font take long. This proposal assumes all the glyphs in a specific font will have a fixed time length. For example all the stickers in whole Telegram (a messaging app with user provided sticker and emojis) have 3 seconds fixed length https://core.telegram.org/stickers#animation-requirements and in here we just have font wide fixed time length which can be changed from font to font.

Another idea can be considering a global fixed length, say from 0 to 1, for all of the fonts, call the axis ANIM like the font in https://github.com/simoncozens/lottie2vf and then maybe having an opentype table called time that indicates how long every specific animation should take in real world time. That way there won't be font specific time length and every glyph can be configured separately. And then that choosing a specific range for time axis value can be even unnecessary as that time table can specify what is the relation between the variation axis and real world time. And maybe that time table can be done inside GDEF or something.

Or maybe we can have both, having TIME for animation with time limitation and ANIM for kind of UI animation that aren't inherently time constrained like https://developer.android.com/reference/androidx/appcompat/graphics/drawable/DrawerArrowDrawable

Axis metadata fields

#TIME roughly based on https://github.com/Typogram/Anicons
tag: "TIME" 
display_name: "Time"
min_value: 0
default_value: 0
max_value: a fixed time length for a specific font, (e.g. 3 for 3s)
precision: any arbitrary number in the range
fallback {
  name: "Default"
  value: 0.00
}
fallback_only: false
description: ""

Or

#ANIM roughly based on https://github.com/simoncozens/lottie2vf
tag: "ANIM" 
display_name: "Animation"
min_value: 0
default_value: 0
max_value: (not that clear to me what is used there tbh)
precision: any arbitrary number in the range
fallback {
  name: "Default"
  value: 0.00
}
fallback_only: false
description: ""

davelab6 commented 9 months ago

I broadly support a TIME axis; I believe @dberlow proposed a TIME axis ranged 0..60.0. #4 also lists some TIME axis fonts already out there.

vv-monsalve commented 9 months ago

The first of the Axis Requirements to introduce a new axis is:

An existing font project introducing the axis There should be a production-ready VF project with the new axis. Axes can’t be defined up front without a variable font family that requires the axis.

We need a font (either commissioned or submitted) using the axis and already listed to be included in the Catalog to review and register a new axis.

dberlow commented 9 months ago

All of the axis proposed by Font Bureau fit the below criteria: "An existing font project introducing the axis There should be a production-ready VF project with the new axis. Axes can’t be defined up front without a variable font family that requires the axis."

None of axis proposed by Font Bureau fit the below criteria: "We need a font (either commissioned or submitted) using the axis and already listed to be included in the Catalog to review and register a new axis."

What part of a variation axe = 1 second was proposed 6 years ago based on the assumption that it would be needed to sync time and motion in the simplest way, based on https://v-fonts.com/fonts/zycon, which was developed and released in 1992.

As part of the same FB framework, axes supporting the tracking of movement in a variation glyph was also recommended for coordination of x and y motion against the background.

With yet another change in how axes get adopted, it's, in my opinion, best for FB to quit trying to do anything about the many issues surrounding interoperable axes, of any kind, registered or not.

This is also the first time I've been led to this doc: Axis Requirements, which reveals no date or authors.

Thanks.

googlefonts / axisregistry