#149034 - JanoSicek - Sun Jan 13, 2008 10:45 pm
Hi all,
I am quite new to the homebrew community, and today it is 7 days since I started developing. My first release is a font. I took interestin sub-pixel font made by Sylfurd, however the color artifacts were quite ugly.
Therefore I have created a new font, it is 4x8, so it is slightly bigger, however the readability is superb. There are almost no color artifacts, and the font is gamma-corrected for NDS screen.
The advantage of size 4x8 is that you can use it on a tiled background BG0 and BG1! I scroll BG1 4 pixels to the right and then I can do tiled text output using these two layers.
A short page with preview of the font and some info can be found here:
http://www.haluz.org/yesh
There is also possibility of doing 3x8 font which would be rendered in same way as font Yesh1, therefore it would have the same size as Sylfurd's, however there will be no color artifacts present. If you need some help with text output, ask away, as I feel like an expert after reading several papers on subpixel font rendering and gamma correction :) Also, can anyone tell me how the font in SylphIRC or SylphAMP works? I cannot make these application run.
#149035 - Lord Graga - Sun Jan 13, 2008 11:09 pm
You could also put them into a single layer by scaling it to half width and scaling the tiles up to double width.
Awesome job, if I ever need a console they might come handy.
#149037 - JanoSicek - Sun Jan 13, 2008 11:37 pm
| Lord Graga wrote: |
You could also put them into a single layer by scaling it to half width and scaling the tiles up to double width.
Awesome job, if I ever need a console they might come handy. |
That's exactly what am I doing, however that takes a rotation background, and my BG2 and BG3 are already used. You can use it both ways.
BTW: You can put fixed-width font into a tiled background with size 3x8,4x8,6x8 and 8x8 with some scaling. The size 5x8 and 7x8 don't work, or at least they weren't for me. The first column of characters is not displaying the same data as the last column of characters, due to the floating point errors.
#149038 - tepples - Sun Jan 13, 2008 11:46 pm
Or you can use both BG0 and BG1, loading the font into the left half of each tile and then putting even columns in BG0 and odd columns in BG1. The 80-column mode on the Apple II used a similar 2-layer interleave, and so do the 12-pixel-wide modes of Puyo Pop and Luminesweeper.
That said, I'll probably make a demo that uses a similar technique with my own font because I prefer DFSG freedom.
_________________
-- Where is he?
-- Who?
-- You know, the human.
-- I think he moved to Tilwick.
#149039 - JanoSicek - Mon Jan 14, 2008 12:14 am
Yeah I am using the two tilemap technique. BG0 for even columns and BG1 for odd columns. Works pretty quick.
I do not want to restrict anyone, please use my font in any of your projects!
If anyone is interested in a good 3x8 font then maybe I'll render it. However I do not know if a lot of people need more than 64 characters per line.
#151653 - Lazy1 - Sat Mar 01, 2008 11:49 pm
I'd like a 3x8 font :D
I'm using your 4x8 one and it looks great but even more text would be nice.
Though I'm rendering to a framebuffer it's more than fast enough, filling the screen with As gets about 117FPS.
#151742 - Lazy1 - Tue Mar 04, 2008 7:00 am
Well then, does anyone know how I can get a full 3x8 subpixel font?
I know there is one floating around but that's just data in a header file, I need an actual bitmap that I can see to understand.
#151779 - JanoSicek - Tue Mar 04, 2008 10:31 pm
Hi,
I'm currently out of country, and I do not have my DS developmnet files here. What application you want to use the 3x8 font in?
J.
#151782 - Lazy1 - Tue Mar 04, 2008 10:35 pm
I was just playing around with this stuff and wanted to replace the libnds console with a much larger subpixel based one as a learning exercise.
#151784 - JanoSicek - Tue Mar 04, 2008 10:50 pm
I was thinking of the 3x8 or even 3x6 exactly for the console, but the 4x8 turned out to be quite readable and sufficiently small so I stopped. You can try to create your own font :)
[/code]
#151785 - Lazy1 - Tue Mar 04, 2008 10:57 pm
I would if I know how, any directions on how to do this?
#151788 - JanoSicek - Tue Mar 04, 2008 11:12 pm
First you must draw a font in 9x8 grid.
I recommend having empty first and last column.
I also recommend to not using thin lines -- that means having a 1 in a row with 0 on both sides: 00001000 is not nice, 000110000 is better.
Now if you split this 9 numbers for a row into three groups of three, that's three pixels. Three numbers denote RGB parts of the color (or BGR). If you have a row: 011 000 110 then this corresponds to pixels: cyan, black, magenta.
As you can see this will produce quite colorful font. This is algorithm used in generating the old, Sylfurd's font. To overcome this we will blur the source data. The 011 000 110.
The blur algorithm computes average of three numbers. To get value in column X, average X-1, X and X+1.
The 011 000 110 becomes 1,2,2,1,0,1,2,2,1 (in thirds)
Therefore the three pixels will be not CYAN, BLACK and MAGENTA, but #55AAAA, #550055, and #AAAA55. Here I use colors 00,55,AA,FF but the DS has no gamma correction, and you should use other value, I don't know them at the moment, but you can use the dropper tool on my font and find out. The Yesh2 font uses another blur and more colors...
I hope this was at least in part understandable...
#151798 - Lazy1 - Wed Mar 05, 2008 12:26 am
So I have to draw the font myself?
That may be a problem since I can't draw anything even reasonably well.
Would it be possible to render a normal, fixed-width font into an image and convert it that way?
#151799 - tepples - Wed Mar 05, 2008 12:29 am
On the DS Lite, you can assume that gamma is close to 2.2 like on a PC.
1/3 power: (1/3)^(1/2.2) * 31 = 19
2/3 power: (2/3)^(1/2.2) * 31 = 26
But then don't you need 64 colors to get all possible combinations of 0, 1/3, 2/3, and 1? Sure, some combinations aren't reachable from the [1 1 1]/3 convolution, but don't you need more than 16 to hit the ones that are?
Lazy1:
Yes it would be possible to convert an existing fixed-width font. Start with some of these 8x8 pixel fonts, and then just add a blank column at one side of each glyph.
_________________
-- Where is he?
-- Who?
-- You know, the human.
-- I think he moved to Tilwick.
#151800 - JanoSicek - Wed Mar 05, 2008 12:35 am
| tepples wrote: |
On the DS Lite, you can assume that gamma is close to 2.2 like on a PC.
1/3 power: (1/3)^(1/2.2) * 31 = 19
2/3 power: (2/3)^(1/2.2) * 31 = 26
But then don't you need 64 colors to get all possible combinations of 0, 1/3, 2/3, and 1? Sure, some combinations aren't reachable from the [1 1 1]/3 convolution, but don't you need more than 16 to hit the ones that are?
|
In theory there are 64, but in my font I had about 19. With blurring 1,2,3,2,1 there is even more possibilities, as you have 9 shades of grey per subpixel, that's 9*9*9 theoretical colors, but the real number is much much much smalller (40ish)
| Quote: |
Lazy1:
Yes it would be possible to convert an existing fixed-width font. Start with some of these 8x8 pixel fonts, and then just add a blank column at one side of each glyph. |
#151805 - Lazy1 - Wed Mar 05, 2008 2:32 am
Is there any way to get a full 8x8 font that has the extended characters as well?
#151931 - tepples - Thu Mar 06, 2008 9:32 pm
| JanoSicek wrote: |
| In theory there are 64, but in my font I had about 19. |
The point is that 19 > 16, meaning I have to double VRAM usage by using 256-color tiles (64 bytes per tile) rather than 16-color tiles (32 bytes per tile). That could mean the difference between fitting the screen into a VRAM bank or not.
| Lazy1 wrote: |
| Is there any way to get a full 8x8 font that has the extended characters as well? |
There are tens of thousands of characters in Unicode, and many of them are in writing systems that don't easily shrink to 4x8 or even 8x8 pixels. Which "extended characters" are you talking about? Did you mean "MS-DOS code page 437"? Or "ISO 8859-1"? Or "Windows code page 1252"?
_________________
-- Where is he?
-- Who?
-- You know, the human.
-- I think he moved to Tilwick.
#151963 - Lazy1 - Fri Mar 07, 2008 3:44 am
I would guess code page 437, I am not concerned with unicode.
#151966 - tepples - Fri Mar 07, 2008 5:18 am
8x8s.png is updated with a font that covers all of cp437.
_________________
-- Where is he?
-- Who?
-- You know, the human.
-- I think he moved to Tilwick.
#152053 - Lazy1 - Sun Mar 09, 2008 1:20 am
Thanks!
I got the font converted although not with blurring yet but it's pretty readable.
Although unlike the 4x8 font it doesn't like being colorized, I guess it's just too small for that.
Unless I'm trying to color the text wrong which I'm doing by shifting down certain color components to make the character appear a certain color.
#153357 - JanoSicek - Sat Mar 29, 2008 1:39 am
| tepples wrote: |
| JanoSicek wrote: | | In theory there are 64, but in my font I had about 19. |
The point is that 19 > 16, meaning I have to double VRAM usage by using 256-color tiles (64 bytes per tile) rather than 16-color tiles (32 bytes per tile). That could mean the difference between fitting the screen into a VRAM bank or not.
|
Of the 19 colors you can easily use 16 and ignore 3 with the smallest count. They are used only for a minimal number of pixels. Or you can just reduce the number of colors to 16 in your favorite painting program.
And to answer later question about coloring a font. I don't believe this is as easy as shifting some colors. Maybe if you XOR the image with some color, then it would work, but you would need to have a contrast background. For example for red font you need cyan background...
J.
#158870 - TwentySeven - Thu Jun 19, 2008 11:12 pm
Thanks for the neat idea!
Here's my donation, a colourized touchup of the bios character page.
http://www.two-seven.net/TwoSeven_Font.bmp
By the way, I found it significantly easier to work with a 12x8 tile size for building the 4x8 subpixel fonts.. Converting a 8x8 pixel font to 12x8 is a 150% stretch in photoshop, and then you can go in and give it a good ol' edit. Gives good results :)
#158878 - TwentySeven - Fri Jun 20, 2008 3:25 am
#158886 - JanoSicek - Fri Jun 20, 2008 7:11 am
Cool app!
Does the dropshadow really work? I'm surprised!
The sample image looks a bit red-ish.
BTW How do you calculate blur?
I used only two options:
a) average of three (1,1,1)
b) weighed average of five (1,2,3,2,1)
But now I think that the best option would be a filter which has the biggest difference between weights of the middle pixel and the one next to it. In the two examples the differences are 0% and 33%. The best filter satisfying all constraints would be (1,1,2,1,1) with difference of 50%. Maybe you can try adding that one :)
#158890 - TwentySeven - Fri Jun 20, 2008 8:09 am
Yeah, well I used a red dropshadow :)
For sampling a 12x8 down to a 4x8 you don't really need to use the R,G,B sub-pixels in a pixel to get a clean result, you can simply do a proper multisample per pixel and use whatever colouring you like (Including dropshadows and other tints)
If you want to use "proper" sub-pixels you're pretty much limited to white/grey font only...
As for filtering i do a horizontal one on the 12x8 source data using those exact kernels, 1,1,1 or 12321
![[Images not permitted - Click here to view it]](http://www.two-seven.net/fontedit.gif){kind=link}