Can't get a workflow for font creation - Windows 10 64 bit

Found another roadblock for new and apparently dumb users like me. :smiley:

I tried following the instructions here:

I got as far as needing to use python to convert the font. The python command in the console just throws this error, even after running the Windows X86-64 MSI Installer (2.7.6) [1] (sig) version from the python 2.7.6 release page, located here:

'python' is not recognized as an internal or external command, operable program or batch file.

Iā€™m trying to use the windows Command Prompt, in the directory I downloaded the python file to. I renamed my font to match the commandā€™s name too. I assume this is the ā€œconsoleā€ I am supposed to be putting the command into? (I donā€™t use python much, being a windows user and all.)

Iā€™m a bit lost now as to what to do in order to make a font for use with Play Canvas. The GitHub readme doesnā€™t say anything about what to do if I canā€™t use python, and the python installer for the version specified in the readme does not seem to install so we can use it like the readme says to.

And of course without a .json file I canā€™t make any text on the screen. Help?

Currently you need Python to run that converter script. Maybe this link on installing Python helps http://docs.python-guide.org/en/latest/starting/install/win/ ?

If youā€™ve installed Python and typing it in cmd doesnā€™t work itā€™s probably an Environmental Variables issue which I think that link above explains.

Alternatively you can use HTML for your UI.

1 Like

ā€“EDIT: UPDATE: Iā€™m a bit of an idiot today. My font name is Basic.fnt, not font.fnt. The script worked right after I changed the command to:

python fnt_to_json.py Basic.fnt font.fnt

Still leaving the below part of my post, cause I am curious how one would implement the other interface mentioned, though itā€™s probably more like another question entirely. For now Iā€™m going to try hammering with the new json file and the font display script.


Iā€™m not sure how to use HTML to make interface text in game. The user manual doesnā€™t seem to say anything on the topic (Searched for ā€œhtml UIā€, got random irrelevant stuff instead, and the part 6 tutorial that redirects back to me using these tools to make a font).

Nor do I think that will actually work for something like a clock or a speedometer, both of which need to react very quickly and dynamically turn invisible if a game isnā€™t in progress. I need text to show speed, current time, and also dynamic text prompts like ā€œtap on these sides of the screen to turnā€, or ā€œlap 2 of 3ā€, and such. (Iā€™m making a racing game in case you couldnā€™t tell by now.)

In general itā€™s much more powerful to use HTML / CSS for your user interface because this is the Web and you can do a lot more stuff with these technologies. The downside is that you kinda need to know how to write HTML and CSS :slight_smile:

There is no tutorial on HTML / CSS UIā€™s although we could write a basic one to get people started. The general way it would work is you would have an HTML asset where you would write your HTML code, a CSS asset that would contain the styling for your UI, and then a script that would create the UI using the assets above. You would use a script to get buttons etc in your HTML and attach click handlers on them or to change the displayed text of various elements.

Here is a sample project that demonstrates some of the above https://playcanvas.com/project/354600/overview/htmlcss--live-updates .

Iā€™m having a similar issue when trying to run the python script. I have set up my environment variables correctly, I believe, and when I try to run the script in the command line, I get the following error:

File ā€œfnt_to_json.pyā€, line 7

SyntaxError: invalid syntax

Iā€™m not sure what to make of this error or where to go from here. Any ideas? Thanks!

You probably have a more recent version of Python installed? This script requires Python 2.7

Hi Vaios, thanks for your reply!

I made sure to have Python 2.7.6 installed as per the instructions, so thatā€™s not the reason. Wish it were that simple though! Iā€™m sure it is something simple that Iā€™m missing, but I canā€™t put my finger on what it is. :frowning:

Whatā€™s you operating system? And how exactly are you running the script? Can you type the exact copy from your terminal? Can you also share the entire stack trace of the error youā€™re getting?

Line 7 seems to be import os. Not sure why youā€™d get an error there unless you havenā€™t installed Python properly.

Hi vaios,

Sorry for the delay!

My OS is Windows 8.1. Iā€™m running the script through the command prompt. This is exactly how Iā€™m running the script and the steps I used to install Python:

(1) I downloaded Python 2.7.6 and installed to the folder C:\Python27. I moved the font files that I created (fnt file and the png files) to the Python27 folder.

(2) I added the following line to my environment variables:

Variable Name: Path
Variable Value: C:\Python27;C:\Python27\Scripts\

(3) In the command prompt, I typed the following:

cd Python27

python fnt_to_json.py C:\Python27\constantia72px.fnt C:\Python27\constantia72px.json

(4) I then get the following output:

File ā€œfnt_to_json.pyā€, line 7

SyntaxError: invalid syntax

Iā€™m assuming some of the steps are likely redundant, like going to the Python27 path. But if I try doing python call just at C:\ I get this error:

python: canā€™t open file ā€˜fnt_to_json.pyā€™: [Errno 2] No such file or directory

So Iā€™m guessing I didnā€™t add the path correctly to the environment variables. But going directly to the folder seems to work regardless.

Let me know if this gives you any more insight. Thanks so much!