Graphics Guide
#1

Graphics Guide

Table of Contents
Hey, graphic artists! If you're planning to create post templates, signatures, avatars, or anything else pretty, please keep in mind a few principles of design. They will make your others' lives a lot easier!

Avatars


An avatar goes to the left of your post and is something used to identify your character. Please see the Rules for specific restrictions regarding your avatar.

Avatar Format

Your picture should be in .GIF, .PNG, or .JPG format. GIF files can only handle 256 colors and thus your files might look different than when they did in the photo program; they are also abnormally large, and thus JPG is preferable. PNG format has the advantage of being lossless; however, these files can be very large when used for larger images and should be avoided. If all of this talk of filetypes confuses you, your best bet is JPG.

When you have a finished avatar, you will need to upload it. You can upload it to the forum itself -- this is generally the simpler and recommended method.

Hosted Avatars

You can also upload your avatar somewhere else though.
[Image: akumuwolf.jpg] [Image: kiritar.png] [Image: ruriknew.gif] [Image: kaena.gif]
Hover over images for format type, character name, and credit

Signatures

Signatures appear at the end of each of your posts and can be a good place to establish a theme or mood for your character, as well as include general information that may be useful to other players, such as what form your character is generally in.

Text-Only Signature

The traditional signature usually has the name of your character and some song lyrics or a quote, either related to the character or "just pretty." You can make nice text-only signatures, but stick to the text styling guidelines discussed above.

Azrael Oriax
it's peaceful, the pitch black
when the last light on goes out.

Image Signature

Naturally, you can also make nice signatures out of images, where you can use any font you want. To ensure that your signature looks right for everyone, use a .PNG or .GIF image signature with a transparent background. It's important to remember to keep your signature readable across as many skins as possible.
[Image: N4TgtFX.gif]

Other Signature Baubles

Some roleplayers also place image or table credits, absence notices, or open character advertisements in their signatures in addition to, or in place of, the traditional signature. Some people choose to promote various aspects of 'Souls in their signature -- for example, displaying some pack pride, or even encouraging others to edit the Wiki or vote for 'Souls every day.

Logs: Post/Graphic Logs and Archives


These three similar things are meant to track your character's threads and your character's graphics. You can keep them in -- you guessed it -- the Post and Graphic Logs forum. You may find it easier to keep these things on the Wiki or even in your forum profile (though beware the character limit!).
  • A post log is just that -- a log of all the roleplay threads your character is currently active in. Things typically included in a post log are reply status, a thread link, the thread title, and the participants. Reminders can also be kept in a post log.
  • Many users also keep an archive of their character's finished topics separate from their post log, but in a similar format.
  • Many users also keep a log of their character's graphics somewhere to facilitate their easy use. You should never store things in the Talents forum -- threads are periodically purged.

Graphical Tables


Some roleplayers enjoy using graphical "tables" or post templates to write their posts. A table can be constructed out of basic HTML tables or CSS-styled div elements. For some excellent basic guides, see RPG Post Templates on Forum Roleplay.

Your basic table generally includes an image and In Character and Out of Character labels. Beyond that, there's really no limit to what can constitute a table. If you aren't really sure where to start, you can always ask around in the Talents forum, look at a few HTML/CSS tutorials, or just ask someone else to make one for you.

Essential Text Formatting

You can format the text almost any way you'd like -- but make sure your text is readable!
  • Some common web safe fonts are Verdana, Tahoma, Arial, and Trebuchet MS. You can also use Google Web Fonts and similar embedding services -- but be careful and keep readability in mind.
  • Good font sizes are generally 12 - 16px. Your precise font size may vary depending on your font.

Common Table Mistakes

'Souls is, at its heart, a writing community. These five common mistakes make it very difficult to read other roleplayer's writing and make it more difficult to roleplay. This can range from a mild annoyance to a serious hindrance to roleplaying. Do you want to reply to threads when you have to squint and struggle to read the other person's writing? No!

Too Little Contrast

The first common mistake: failure to include enough contrast between the table background and the table text. For users with darker monitors, contrast between darker colours is difficult to distinguish. Another important consideration is color contrast -- if your contrast for text and background is poor, users will have difficulty reading your table.
  • BAD: Hi, you cannot read this very well!
  • GOOD: Hi, you can read this text very well!
  • BAD: Hi, you cannot read this very well!
  • GOOD: Hi, you can read this text very well!

Small or Improper Font

Using a small, or generally unreadable font. Small text can be difficult to read for users with big screen resolutions. Poor font choices are also equally problematic: if you choose to use a front like Papyrus or Mistral, not only will it make your table difficult to read but also make your post look rather silly! Here are some examples
  • BAD: Hi, you cannot read this very well!
  • GOOD: Hi, you can read this text very well!
  • BAD: Hi, you cannot read this very well!
  • GOOD: Hi, you can read this text very well!

Font Style

There are various ways to style your text, and while they do give you quite a lot of control, some stylistic choices make reading very difficult. Certain types of text style should be left for headers and subheaders, rarely used in speech, and avoided entirely in the main body content.

Small-caps should never be used for table text, not for speech or thought, and definitely not for your primary choice. Text-transform should never be used for table text, whether that is to change everything to uppercase, lowercase, or initial-caps. None are appropriate. Letter-spacing can be used in moderation, but too much and your text becomes unreadable, fast! Line height is another important consideration -- too much or too little, and your text becomes far less readable.
  • BAD: Hi, you cannot read this very well! Imagine if there was a lot of text, like this! It gets really taxing to read after a while, and throws off your "inner reading voice." Don't do this, please!
  • BAD: Hi, you cannot read this very well! Imagine if there was a lot of text, like this! It gets really taxing to read after a while, and throws off your "inner reading voice." Don't do this, please!
  • BAD: Hi, you cannot read this very well! Imagine if there was a lot of text, like this! It gets really taxing to read after a while, and throws off your "inner reading voice." Don't do this, please!
  • BAD: Hi, you still cannot read this very well!Imagine if there was a lot of text, like this! It gets really taxing to read after a while, and throws off your "inner reading voice." Don't do this, please!
BAD:
Hi, you cannot read this text very well! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eros mi, luctus sed consectetur eget, rhoncus non nisi. Mauris acelitorci. Fusce faucibus liberoid anteporta ac vestibulum metus venenatis.
GOOD:
Hi, you can read this text very well! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eros mi, luctus sed consectetur eget, rhoncus non nisi. Mauris acelitorci. Fusce faucibus liberoid anteporta ac vestibulum metus venenatis.

Text-Shadow

An example of overuse is using text-shadow for the entire table. While it can spice up the dialogue when you bold your text, it can also make it very difficult to read if everything has a significant or stark shadow!
  • BAD: Hi, you cannot read this very well!
  • GOOD: "Hi, there!" you can read this text very well!

Opacity

CSS opacity is particularly problematic because not only does it make the background transparent, it also makes the text transparent. If you'd like to have a light white background, please consider using an image that is set to 25% opacity.

Scroll Tables

Since scroll tables significantly eliminate a lot of white space and insert an extra scrollbar, it makes it difficult to read the text. When coupled with other mistakes, it makes it even tougher to read the post! If you absolutely must use a scroll table, please ensure the height and width give other players enough room to read and comply if they ask you to change tables.

Another important consideration is that some mobile browsers do not properly support the CSS overflow command. Mobile users can't scroll your post at all. In these cases, you're actually forcing users to quote your post to read it, which is unfair!

Justified Text

A readability problem exists with justified text alignment. Left aligned text is generally much easier to read than justified -- especially when you can't hypenate (you can't via CSS).

BAD:
Hi, you cannot read this text very well! Note how the spacing becomes awkward if there are long words that cannot fit on a line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eros mi, luctus sed consectetur eget, rhoncus non nisi. Mauris acelitorci. Fusce faucibus liberoid anteporta ac vestibulum metus venenatis. Etiam non erat et erat rutrum porttitor. Donec nec orci arcu, condimentum posuere velit. Curabitur et placerat ipsum. Cumsociisnatoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
GOOD:
Hi, you can read this text very well! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eros mi, luctus sed consectetur eget, rhoncus non nisi. Mauris acelitorci. Fusce faucibus liberoid anteporta ac vestibulum metus venenatis. Etiam non erat et erat rutrum porttitor. Donec nec orci arcu, condimentum posuere velit. Curabitur et placerat ipsum. Cumsociisnatoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Resources


Member Guides


More Resources


  1. BBCode Guide
  2. Resources @ "Souls Wiki
  3. Check the FAQ if you have questions about graphics.
  4. Any graphics-related question you have, whether it's related to art or roleplay graphics, can be asked in the Talents forum. There are plenty of helpful people willing to give you a hand!
  5. Just starting out? The Templates forum can give you a great foundation for any code -- and some images, too!.
  6. Want graphics, but can't make them yourself? Mosey on over to the Requests forum. You can always check out the Studios, too.
  7. IMPORTANT NOTES!
    • Regarding Freebies: There are many completely free resources around 'Souls to help you get graphics, including artwork. However, please note: if you're asking for graphics for free, they're being done as a favor to you. It's courteous to remember your "pleases" and "thank yous" and even more courteous to be patient with the person making you completely free stuff.
    • Regarding Artwork: As with tables and photomanipulations, you can sometimes find artists willing to give you completely free artwork! However, please note: artwork is usually a lot more intense to create than a table or a photomanipulation. It can be tough to come by free art at 'Souls sometimes -- but it can happen! Keep your eyes peeled.
    • Regarding Commission-Taking Artists: There are artists on 'Souls who take commissions and make drawings for a living. It's discourteous and unfair to ask someone to create you art if they aren't offering freebies. Look around for a free studio, or create a request, please.
#2

Copyright, Image Usage, Art Theft

Souls has many talented members -- some are skilled at photomanipulation and making graphics and others are illustrators or cartoonists. We take art theft and copyright infringement very seriously and make every effort to protect creator rights.

Copyright infringement is the usage of materials without the permission of rights holder -- in our case, it is the use of art or photography without the permission of the artist or photographer.

Contrary to popular belief, one cannot simply find an image on Google and use it as an avatar. All images uploaded to the Internet are not public domain; indeed, a majority of the content on the Internet is protected under copyright law. The fact that drawings and photos are easily saved, shared, changed, and re-purposed, doesn't mean that anyone has that right.

All images used and posted to 'Souls should be done so with permission and with credit.

Free-Use Photography & Template/Base Art

These days, it's a lot easier to find royalty-free stock photography, Creative Commons work, and free-use template artwork for use.

Sites like Pixabay and Unsplash make beautiful photography a lot easier to source. Many artists also offer up free lineart and art templates that others can color and use to depict personal characters. Many 'Soulsters have contributed to our own repository of free art templates over the years, and we also have a list of other image-related resources on the Wiki.

We encourage players to take advantage of these resources, but please remember that you still must credit your sources. Most free-use art and photography require it as part of their terms ("Attribution-NonCommercial-ShareAlike" is the most common CC license!), but regardless, 'Souls requires the credit in all cases for purposes of clarity and transparency.

Original Artwork

All instances of a player using art they did not create, commission, receive as a gift, or otherwise have permission to use will be investigated by the administration.

If you are using someone else's art, in addition to crediting, please make sure that:
  • The artist allows use of their work. Some artists are okay with roleplayers and other netizens using their images for whatever, with no restrictions. Some artists never want their art used anywhere without their permission. Look for an artist Terms of Use or Frequently Asked Questions list. Failing all else, contact the artist and ask. If they grant permission for usage, save or screenshot the correspondence and be ready to give it to the 'Souls Assemblage.
  • You adhere to terms set forth by the artist. For example, if the artist asks for a link back to their gallery where you use their art, include the link. If the artist requires that their copyright notice remains intact on the art itself, leave it alone.
  • Remember that all art you did not create must at least include text credit to the artist. The only exception is if the artist explicitly requests that they are not credited.
  • If you do not know whether an artist allows general usage or not, assume that they don't and don't use the art.
If you made the art you're using, please remember to credit yourself! You deserve the credit, and again, this helps a lot with clarity and transparency from a staff perspective.
#3

Art Theft VS Tracing, Copying, and Referencing

Art theft -- e.g., claiming another person's work as your own -- is a bannable offense. This includes implicit claiming -- e.g. not crediting and allow others to assume that you've made the art.

Art theft is not limited to just taking an image and calling it your own. Tracing or editing the original image by adding elements, recoloring, or redrawing parts still does not make the image yours and is still considered art theft.

Tracing, Copying, and Referencing

Using someone else's art wholesale is a pretty straightforward violation, but the line gets a little fuzzier when artists are still using their own hand to create something.

Tracing

TRACING is the direct copying of an existing work by drawing over the lines of the original. Tracing part of a work and improvising the rest is still tracing -- for example, everything was traced except the ears, which are repositioned, or the mouth, which is slightly different. Tracing can be an excellent learning tool, but in general, we discourage artists from sharing art that has been traced. It can be misleading at best and cause a lot of undue grief and drama at worse.

If traced work "must" be shared, it is required that 1) the original artist allows it, 2) the tracing artist notes that the work is traced, and if possible, 3) the original work is linked. This applies to both traced art and traced photos.

Traced work that is not properly credited or sourced is considered art theft.

Copying

COPYING is an attempt to replicate an existing work without tracing. This generally means that most elements of the existing work and the copy are the same, such as pose, expression, clothing type, etc, though again some elements may be changed or simplified.

Unless their style is photorealism, most artists inject their own personality and style into "direct copies" of photos. We do not consider copying photos to be art theft and do not require credit in these cases.

However, "direct copies" of existing art, where very few elements of the original are changed, fall under the same guidelines as tracing.

There isn't always a clear line as to when a copy deviates from the original "enough" though. We encourage artists copying others in whole or part to use their best judgment, and to be thoughtful and courteous. When in doubt, ask permission and leave credit.

That said, many expressions and poses are used frequently between many artists and two artists using the same pose doesn't necessarily mean that one copied the other. It's not unbelievable that two (or even twenty!) artists independently wanted to draw a wolf with cocked eyebrows and a roguish grin. So we also encourage artists to give others the benefit of the doubt as much as possible.

Copying is the fuzziest grey area here. Artists who post copied work may be asked to remove the work, but with the exception of direct copies of art, we would not consider typically this art theft.

Referencing

REFERENCING is looking frequently at an existing work, or many existing works, in order to more accurately depict certain elements of a shared subject. For example, looking at photos or artwork of wolves to better understand underlying anatomy, but not trying to directly replicate part of any given source work, or looking at a kicking pose to construct your own character in that kicking pose.

Sometimes the line between copying and referencing is also fuzzy. Pose referencing often involves looking at a single image, but you're transposing your own character into the place of the model. It's safest to use photos for reference though, as referencing existing artwork can often lead to accidental or unintentional copying.

Referencing work is a crucial part of being an artist, but as always, please be thoughtful, courteous, and use your best judgment! We do not require referenced work be mentioned or credited, nor will referencing work ever be considered art theft, but if in referencing a work, your resulting piece ends up looking too much like a copy, then it's a copy!

Examples







Code Theft?


It's a little bit different when it comes to code. In general, the administration has taken a stance that most types of code used in the roleplaying world can't really be stolen. A majority of HTML, CSS, and Wiki code snippets written for usage in roleplay communities are relatively basic -- there are only so many ways a post template can be cobbled together. The same techniques produced across various profile skins, post templates, tables, post logs, etc. can only be reproduced using those same pieces of code. There aren't two different ways to write an ordered list in HTML, after all.

Different players have different levels of code skill, and looking at more advanced code is an excellent way of learning. Modifying existing code and learning how it works is one of the best ways to self-teach code.

We encourage players to ask other players before taking any code from them -- that's the polite thing to do!

However, the administration does not involve itself in the vast majority of complaints regarding coding.


Forum Jump: