collapse

Author Topic: How to make and add Fonts on the Mugen Option screen  (Read 1793 times)

0 Members and 1 Guest are viewing this topic.

Offline OldGamer

  • IMT ScreenPack Creator
  • IMT Content Architect
  • *
  • Posts: 1106
  • Country: United States us
  • Last Login:October 11, 2023, 10:45:30 PM
  • Mugen Creator for Stages & Screen Pack
How to make and add Fonts on the Mugen Option screen
« on: September 11, 2019, 12:23:54 PM »
when you are trying to add a font for the option screen for mugen 1.0 and mugen 1.1 the Option runs on Option.def  and they use two type of fonts
 Truetype Fonts as TTF and other is Bitmap fonts as Sprite fonts variables

you have two chooses to add fonts

for Bitmap font they need to be at least 16x16 size and not by 8x8  you have to find fonts for that size or make your own Sprite fonts for them

The 3 main colors for the fonts to show in the option screen is WHITE,GREY OR YELLOW are aloud to be in the display color and need to be 256 bit of colors

when making your own Bitmap Sprite fonts they have to be index as png or pcx with the same color pallet

and you have to crop each letter with Gimp or Photoshop or Microsoft Paint

once you crop them you need to indexed them with your Image editor

next you need to come here because this is important
http://www.elecbyte.com/mugendocs-11b1/fonts.html#ascii-character-reference

that is a chart ascii-character-reference
Only characters from the ASCII character set are supported by bitmap fonts. The extended ASCII set is not supported. For a table of the ASCII character set, see "ASCII character reference" below.

Bitmap fonts must be accompanied by an SFF file that contains the sprites for the glyphs. Each character in the font maps to a sprite indexed by 0,<ASCII code> where <ASCII code> is the corresponding ASCII code for the character. For example, the character 'A' (ASCII code 65) maps to sprite 0,65. Zero is the group and sixtyfive is the index number display for fighter factory

Any character which does not have a corresponding sprite will not be rendered.

Bitmap fonts may contain one or more color banks. Each color bank maps to a palette stored in the SFF, and indexed by 0,<color bank number> where <color bank number> is a positive number. If during font rendering, an invalid color bank is specified, the palette of the first sprite in the SFF will be used.

Okay now how do you go about doing it ?
 1.first make your own fonts or draw them out it's your choose how do it

2. use any image editor to crop and index each character letter and symbols and numbers into pcx or png


3.first you need go to mugen font folder and find f-4x6.def  be sure to make a copy duplicate of its
just like this


4.please keep your  copy f-4x6.def leave it there for now

5. go ahead and add your bitmap sprite characters in the fighter factory 3.0.1 that you already crop and indexed for them
be sure to save as Mugen 1.0 not mugen 1,1 and give a name as for Im going to name it BlueLettersOption save as SFF AND save it in the mugen font folder


6.now final delete the old options.def that in your mugen font folder and rename your copy f-4x6.def to options.def its should look like this


7. next is you need to open your copy f-4x6.def as a notepad
don't be scared of the ugly text mess

8. scroll down and find  File = f-4x6.SFF and change it to whatever name you want give it, but as for me I'm going to change to  BlueLettersOption.sff its should look like this


9 go to option,def Size = 3,6  and play with these value until you get right, BUT as I'm going to set my value to Size = 15,15 and the Spacing = 0,0 set it to
0,0 and Offset = 0,0 like this


After all said and done you can see the changes after and the before
Default option screen


Now before you add the Bitmap sprite on your Option screen its look like this now



if your not a artist and you don't know how to draw your own bitmap that mean you can always come here to make a auto make the font from here
http://arcade.photonstorm.com/

or here at sprite resources for premade fonts just be sure that the font are 16x16 be sure that the fonts is 16x16
https://www.spriters-resource.com/search/?q=fonts


BUT if your to DAM LAZY TO DO ALL THAT WORK
 there easy way and that Truetype font

with Truetype fonts you can resize them in the Option screen but also be sure that the font you choose is really TTF aka truetype fonts

JUST KEEP IN MIND THAT TRUETYPE FONT WON'T CHANGE COLORS FOR OPTION SCREEN
They can change color for other places in the screen pack but not on the Option screen, because they always stay as while color
 you can find a bunch of them here at dafont
https://www.dafont.com


to just add your truetype font
1. choose the truetype font you want and please put in the truetype font inside the mugen font folder
2. go inside your mugen font folder  and find Option.def
3. open the Option.def with notepad

you will see this Ugly mess of text and you find arial.ttf


once you find it you want to change the name, I'm going to use busterbit.ttf that I found on the datfont and I am going to change arial.ttf to busterbit.ttf


now only thing you need to play with is the font size and Size of font: width, height.  Only height is used for truetype fonts.
Size = 6,11 <<<<<<<<<< play with this until you got the perfect size for your option screen font fit right

here an example from after and before

Default Font after


Before I change it and fit the right type of SIZE





Offline DEMONKAI

  • The Visionary and IMT's
  • Contributor
  • ****
  • Posts: 8335
  • Country: United States us
  • Last Login:October 11, 2022, 09:44:18 PM
  • Never limit your vision as a creator!!
    • DTHECHEMIST
    • D THE CHEMIST
    • Demonkai's Mugen
Re: How to make and add Fonts on the Mugen Option screen
« Reply #1 on: September 11, 2019, 08:37:35 PM »
wow. this great. thanks for the info  ^^(PM)^


Do you have any tips to create your own customized hyper effect blast lines? Been trying to find a cool way to make my own with Hi res quality
Lots and lots of supers so f*ckin what

HAIL CROM!!

Offline sky79

  • Contributor
  • ****
  • Posts: 997
  • Country: United States us
  • Last Login:December 19, 2022, 11:31:05 AM
  • Real players and makers share.
Re: How to make and add Fonts on the Mugen Option screen
« Reply #2 on: September 12, 2019, 03:19:54 PM »
What do you mean by "Blast Lines"?
Keep Mugen Free

Offline OldGamer

  • IMT ScreenPack Creator
  • IMT Content Architect
  • *
  • Posts: 1106
  • Country: United States us
  • Last Login:October 11, 2023, 10:45:30 PM
  • Mugen Creator for Stages & Screen Pack
Re: How to make and add Fonts on the Mugen Option screen
« Reply #3 on: September 12, 2019, 03:32:51 PM »
wow. this great. thanks for the info  ^^(PM)^


Do you have any tips to create your own customized hyper effect blast lines? Been trying to find a cool way to make my own with Hi res quality
I send you a link on your message, your best bet is Adobe effect and they have tons and tons of video guide on how to make Anime Line Background effects 

Offline OldGamer

  • IMT ScreenPack Creator
  • IMT Content Architect
  • *
  • Posts: 1106
  • Country: United States us
  • Last Login:October 11, 2023, 10:45:30 PM
  • Mugen Creator for Stages & Screen Pack
Re: How to make and add Fonts on the Mugen Option screen
« Reply #4 on: September 12, 2019, 03:39:55 PM »
What do you mean by "Blast Lines"?
He mean Animated speed Line Animated effect Background for Hypers

like this one

Offline DEMONKAI

  • The Visionary and IMT's
  • Contributor
  • ****
  • Posts: 8335
  • Country: United States us
  • Last Login:October 11, 2022, 09:44:18 PM
  • Never limit your vision as a creator!!
    • DTHECHEMIST
    • D THE CHEMIST
    • Demonkai's Mugen
Re: How to make and add Fonts on the Mugen Option screen
« Reply #5 on: September 12, 2019, 10:58:57 PM »
He mean Animated speed Line Animated effect Background for Hypers

like this one


yes. i was trying to learn and hi res ones myself from scratch. i saw certain alternate tips to get to that but they were using tools i dont have access to. so im looking for a cheaper slick way haha
Lots and lots of supers so f*ckin what

HAIL CROM!!

Online O Ilusionista

  • Since 1999 and kicking :)
  • IMT Content Architect
  • *
  • Posts: 12459
  • Country: Brazil br
  • Last Login:Today at 11:21:03 AM
  • OpenBOR & Mugen addicted
    • BMT - Brazil Mugen Team
    • Email
Re: How to make and add Fonts on the Mugen Option screen
« Reply #6 on: September 13, 2019, 11:07:24 AM »
Nice tutorial, OG!

Offline OldGamer

  • IMT ScreenPack Creator
  • IMT Content Architect
  • *
  • Posts: 1106
  • Country: United States us
  • Last Login:October 11, 2023, 10:45:30 PM
  • Mugen Creator for Stages & Screen Pack
Re: How to make and add Fonts on the Mugen Option screen
« Reply #7 on: September 14, 2019, 01:28:12 PM »

Tags:
 


* IMT Facebook

Help us by Donating!

IMT Discord

Join us at our Discord! Click the image below!

* IMT Shoutbox

Sorry, this shoutbox does not exist.

* Recent Posts

* IMT Calendar

April 2024
Sun Mon Tue Wed Thu Fri Sat
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 [27]
28 29 30

SimplePortal 2.3.5 © 2008-2012, SimplePortal