User:Koala/SVG Initiative

From Rigged Wiki
Jump to navigation Jump to search

Introduction

The SVG Initiative is (hopefully) a group effort to re-create numerous wiki graphics and team logos as Scalable Vector Graphics (SVG) files.

Since SVG files can easily be rendered at a higher resolution without the pixely blurry artefacts that raster images would produce, this allows them to be used more flexibly. Especially for creators of promo material, this is important, as they can then use logos the same way no matter what nominal resolution they were created at.

How To Help

Getting Started

Use the software Inkscape to create SVG files. Import the raster graphic you wish to vectorize, then go to File->Document Properties->Resize page to drawing or selection. Lock the layer; this will be your reference layer. Add another layer on top to draw the vector on.

What to Vectorise

Not all logos and images are fit to be redrawn as vector images. For example, the /mu/ logo would not work as a vector. Choose one that has flat colours or simple gradients.

For icons, logos with just the nominal resolution changed will look like shit, due to not being designed to work at 50x50 or even 25x25 pixels. When vectorising icons, make sure to not use strokes (as the middle of the stroke is on the border of a shape, i.e. a 1px stroke will be 0.5px on one side and 0.5px on the other, which means it'll look like shit rendered out). Also make sure to have nodes snapped to integer pixel values to avoid blurry results.

Guidelines

  • Do not use the automatic bitmap tracer. It produces shit.
  • Try to build up shapes from the simplest primitives. If something looks like a circle, use a circle.
  • When appropriate, use the grid and enable grid snapping of various elements on the sidebar to the right.

Saving

The default Inkscape SVGs contain a lot of data we do not need, such as the size of your editor window when you last saved the document, or your history. Furthermore, it'll also have a base64 encoded raster image of your reference in it, which will bloat it quite a bit. Therefore, before uploading the image to the wiki, do the following:

  1. Delete the reference layer
  2. Choose File->Save a Copy..., choose as file type Plain SVG.
  3. Keep the original Inkscape SVG with the reference layer intact around if you'll need it again for small fixes and convenience, i.e. do not save the file after deleting the reference layer unless you're sure you won't need it anymore in the future.

Then, upload the files to the same location the original raster image was, but instead use an SVG extension. In essence, this means uploading a new file with e.g. An icon.svg instead of An icon.png as the file name. MediaWiki will warn you about a very similar file existing. Tell it to shut the fuck up and save the file anyway.


Finished Vectors

Please expand this list when you finish a logo.

Work in Progress

Please put yourself on this list if you are working on a vector of a specific file, and sign your entry with --~~~~. This is so that we can see who started working on what when, and thus allows us to judge whether you're still working on it or if you're distracted masturbating to Chinese Cartoons. This way, we can avoid having multiple people do the same work.

  • I've got .ai versions of the /sp/, /an/, /b/ and /int/ logos since I made those, at least in their current iteration. Once I get back home I'll convert them to .svg and post 'em here. Not much, but that's something I guess. --Volst (talk) 07:10, 28 April 2015 (UTC)

Scratch that, I only have /an/ in .ai. Woops. --Volst (talk) 09:48, 1 May 2015 (UTC)