web app or other solution for coloured script

Miles Newlyn
Miles Newlyn Posts: 252
in Font Technology
I've a client who is trying to find a way to implement the lettering style below in a way that can be typed.
My thoughts are that a custom script font that has a single stroke could be embedded in a web app. The app would then join the letters and apply a custom brush to the stroke that makes the word. Individual strokes, like the 't' bar would need some additional scripting.

Does anyone know if this is possible, have an alternative idea, or know anyone i could speak to about building it?


Comments

  • Georg Seifert
    Georg Seifert Posts: 674
    You could do a SVG font with embedded images.
  • Miles Newlyn
    Miles Newlyn Posts: 252
    Hi Georg,

    If i used a SVG font each letter would be the same colour, and the thickness of the stroke would not increase towards the last letter of the word.

  • Georg Seifert
    Georg Seifert Posts: 674
    If you have a bunch of alternate letters that could still be done. But the letters would need to be simplified a bit because if you need thickens and color to be controlled individually, the number of glyphs needed would be do big.
  • Hrant Հրանդ Փափազեան Papazian
    Hrant Հրանդ Փափազեան Papazian Posts: 2,044
    Splicing this in:

  • Johannes Neumeier
    Johannes Neumeier Posts: 377
    Built an app (web stack) prototype a while back where we used the svg drawing library paper.js to do very similar things for paths drawn by the user—animate width based on speed, color based on offset to a target path. Doing something similar with a predefined path is entirely plausible, e.g. animate the color and thickness along its length. For packaging this web view into a mobile app the performance was not satisfactory, but if you are looking to animate or save the vector outcome that environment could be of interest. Paper.js supports svg export, but I am not sure how it would deal with a stroke only font or how to access the paths to convert to svg strokes which to work with; something like Opentype.js might be used for that.

Categories