Print

Please login or register.
1 Hour 1 Day 1 Week 1 Month Forever
Login with username, password and session length

[DragonDePlatino]

DOWNLOAD

Resolution is an issue that has always plagued tilesets. Downscaling always ruins quality and upscaling causes blurriness. Artists can work hard on tilesets only to find they're unusable on some monitors. The solution? Vector tilesets!

Spoiler (click to show/hide)

Traditionally, raster graphics represent images as a grid of pixels. But vector graphics represent images with mathematical perfection. Built by adding and subtracting geometric shapes, vector graphics work well on all monitors and are resolution independent. As an experiment, I spent a few days vectorizing curses_640x300.bmp. I closely traced each glyph, cleaning up and realigning some characters in the process. This tileset might need more work, but I'm pleased with the results so far.

Spoiler: Preview (click to show/hide)

In the future, I might expand this tileset to include non-default glyphs. A full graphics set would be an impossibly difficult task but some basic glyphs like barrels and walls would be reasonable. Any thoughts? Input?

Installation

If you want to edit or export this tileset for your monitor, open the download's .SVG in a vector program like Inkscape. To calculate your ideal tileset resolution, divide your monitor's horizontal resolution by 5 and use that as the width of the tileset. If you want pixel-perfect glyphs without any anti-aliasing, highlight everything then go to Filters -> Pixel Tools -> Pixellize. The next time you export, the file will only use full white and full black.

If that sounds like too much work for you, here are some pre-exported versions from default all the way up to 4k:

Spoiler: curses_vector_8x12 (click to show/hide)

Spoiler: curses_vector_12x18 (click to show/hide)

Spoiler: curses_vector_16x24 (click to show/hide)

Spoiler: curses_vector_24x36 (click to show/hide)

Spoiler: curses_vector_32x48 (click to show/hide)

Spoiler: curses_vector_40x60 (click to show/hide)

Spoiler: curses_vector_48x72 (click to show/hide)

Tutorial / License

As 1080p and 4k monitors become more commonplace, I hope more people in the future will make vector tilesets. They're time-consuming, but not artistically challenging to create. If you can combine and subtract simple geometric shapes, you can make vector art. Give it a shot! I made a nice Inkscape tutorial if you want to get your feet wet with vector design.

You may edit and redistribute the content of curses_vector for any purpose, even commercially. It is reserved under a CC-BY-SA-4.0 license.

[ANickel]

This is an interesting idea, but are the advantages of creating a vector-based tileset greater than the time and energy required to make the tileset?
If the only advantage is multiple resolution support, I'm not sure the idea will pick up much steam.

[DragonDePlatino]

Possibly. Progress was slow for me at first but after a while I got into a rhythm. I'd estimate this tileset took a combined 12 hours of work which can probably be said for a lot of raster tilesets.

One perk with vector art is that you can produce very clean, sharp lines that aren't possible with bitmaps. Fonts, clipart, app icons, logos and flash animations are almost always vector art. Another advantage is that it's very easy to apply filters and effects without loosing your lineart. All of the following effects are completely reversible without layering or undo:



Not the best example, but others could probably do better since I'm still learning.

[Max™]

Well shit man, if that's "still learning" I'm straight up dumbfounded.

Spoiler (click to show/hide)

[CLA]

You can do a lot of reversible effects easily with bitmap tilesets in Photoshop too. The advantage of vector graphics for DF lies mostly in getting larger resolutions cleaner with less work.
With a 12x12 tileset or something, you're better of polishing pixel by pixel in the end for the best results, as the vector>bitmap export doesn't leave you with enough control at those resolutions (The 'W', 'Z', and '«'/'»' tiles in your smallest export look quite soft and unsharp for example).

And if you want to produce a look that doesn't appear too clean and vector-y (non-linear gradients, or paint-like effects for example), at some point you'll have to put in more effort with a vector graphics program than you'd have to with a bitmap editor.

Still, I think there's definitely a use for it with larger resolutions, as shown with your bigger tilesets.

[DragonDePlatino]

@Max™
Thanks! Yeah, if you look through the official Inkscape gallery you can see some insane stuff. Not even close to that level yet. 8I

@CLA
I almost forgot to mention that! Yes, first and foremost vector art makes HQ art a cinch. Admittedly, it's pretty poor at organic-looking art but I'm a fan of its distinctive look. I imagine it would look nice on mobile devices.

I'll look into fixing those glyphs. Vector rasterization will never be as clean as good 'ol pixel pushing but if I do a better job of aligning nodes on pixel margins, it'll show up better at low resolutions.

[Max™]

Actually now I'm mad at you because I have to see if I can figure out how to use that method for my vorpalcurses set since the whole scaling thing was kinda my goal.

Incidentally, I know the math on the 640x300 would scale up to 1280x600/1920x900 but that would probably confuse the shit out of people who don't recognize the tileset dimensions offhand. I like to rename sets to the tile size for that reason, 8x12/16x24/24x36/32x48/36x56 and so forth. The 1920x900 set fits 1920x1080 at 80x30 grid size, it's what I took that screenshot with.

[DragonDePlatino]

Yeah, the naming convention is pretty bad but it's what I went with since it sounded the most "official". I think I'll change it next update to something like curses_vector_8x12.

If you're interested, I can give you a crash course in vectorizing tilesets. After doing 256 glyphs I've built up a pretty fast workflow.

[Max™]

Well, considering I never really "got" vector art until seeing it in tileset form, and that it would be a great resource for more talented artists? Uh, yeah.

[DragonDePlatino]

The tutorial is up if anyone's interested in how I made this tileset. I included a link at the bottom of the first post.

[Max™]

Well fuck, that'll take me some time to really get the hang of but it's a lot simpler than I expected, since some of it is kinda familiar from screwing with GIMP. Can get Inkscape from the Arch repo too, nice.

[DragonDePlatino]

New version is up! I realigned the 8 and cleaned up a number of glyphs including v, w, circles and double arrows. Everything should be more or less acceptable now. I also switched the naming convention so it's immediately clear what you're using.

[jecowa]

I like the new naming system. I prefer seeing the tile sizes instead of the minimum resolutions needed to display them.

[Taffer]

Interesting work! There's still some odd antialiasing in the small sets, but I suppose that's unavoidable?

[DragonDePlatino]

Antialiasing can be removed with Inkscape's pixellize filter, but then I'd just have the default tileset.

Any glyphs in particular that look bad? I can minimize antialiasing by aligning things on pixel boundaries whenever possible.