Vector fonts & manipulation

[absolutezero342]

I have a client that wants to create a Flash app that allows a user to customize a jersey. The colors and logos are not an issue, the issue is the fonts!

I need a component or something that will allow the user to choose from multiple font types (preview would be nice) and enter dynamic input text and have it render in that type. So far, that's not hard...the hard part comes in where they need to be able to scale the fonts, choose different lettering configurations (ie. rainbow, arched, bridge, etc.). Obviously the fonts will need to be in a vector format, so that's the first obstacle and then I have to be able to manipulate those vectors on a character-to-character basis.

Does anyone know of an "out-of-the-box" solution that would simplify my life? I'm willing to pay some money for that kind of solution. I would rather do that than develop it myself, as I'm sure that will take a while. Surely someone has thought of marketing this as I do see it out there on different sites. Ideas? thx!

[neznein9]

Take a look at five3D - it's a 3D vector engine with full type support. To use it, you need to run a little flash plugin to cut up a font into vectors and convert those to a class, then the five3D engine can render out the font as a raw shape. For your purpose it would be pretty easy to use the entire engine, just not using any of the 3D position or rotation stuff...

[absolutezero342]

I was looking into that package, and I can see it allows for vectorizing fonts and I did that actually, BUT, there is no documentation for the classes on how to use them, so it's kind of a maze. Do you know how to use these classes? It seems to be my only solid lead as to how to do this project, but I don't even know where to begin really?

The main issue seems to be once you get the font into vector and you have a word you want manipulated, you have to find a way to uniformly make the change to the word on each character without making your change illegible or distorted in a way that doesn't make sense....ideas?

[absolutezero342]

here is a perfect example of what I need...they vectorize fonts and do manipulations on them...is there a class that they use to make this easier???

http://dyo.customink.com/cink/r.jsp?E=ci&F=t

[neznein9]

I haven't worked on five3D in a couple months but I think it should be as easy as this:

const scene:Scene3D = new Scene3D();
addChild(scene);

var txt:DynamicText3D = new DynamicText3D(HelveticaMedium);
txt.singleSided = true;

txt.size = 12;
txt.text = 'Words!';
txt.rotationZ = 45;
txt.x = 50;
txt.y = 10;

scene.addChild(txt); 

As long as you don't touch rotationX or rotationY and you leave txt.z at 0, you shouldn't introduce any 3d distortions. The cool thing is that this library is built to mimic the native display classes so you can make sprite3Ds to nest all your objects and apply transforms (even filters!) through inheritence.

[absolutezero342]

again, I really appreciate your help! another question...how would you do character-by-character manipulation on the letters? for example, if I wanted to make the characters appear in an arched format, do you have any ideas on how I could achieve this thru five3d? would the manipulations still preserve the basic font appearance?

thx again for your feedback!

[neznein9]

If you take a look into five3D's font files you'll see each letter is just an Array of points (and some weirdness describing the line/curve between them). In your code you could copy the arrays of the letters you want, adjust the points according to a mesh/envelope distortion, and then use those new arrays to create a custom font that you give to five3D to render...I'm not even sure all of those steps are possible (specifically, creating a font class on the fly...) but it's still going to be easier than digging around inside the five3D engine and trying to apply your distortion at runtime.

[absolutezero342]

any advice on creating mesh/envelope distortions? are there any classes out there for creating different types of distortions given certain points or something like that? or does five3d have any built-in support for stuff like that?

[neznein9]

Paul over at Reflektions miniml has been playing around with mesh triangulation recently...the math there should be a good starting point.