Roleplaying Aesthetics: Posts That Please The Eye + Do's and Dont's
Here on Iwaku, we have lots and lots of formatting options and BB Codes to beautify our posts. From something as simple as picking out different fonts, font sizes, and colors to the incredibly detailed ways we can use tables, accordion tabs, tabs, and fancy buttons, a post can go from simple to visually striking after some touch-ups. And we have different preferences, from a beautiful simplicity to meticulous attention to detail. Of course, it depends on every individual user's preference. But here is a lesson on how to make aesthetically pleasing posts, what to do, and what not to do.
Here is a look at the rich text editor. To a newcomer or someone unfamiliar with all its fancy buttons, it can look overwhelming. But it can prove very useful to have a basic understanding of its features. Here is a lesson on the basics of the rich text editor.
#1 - Colored Text
Selene couldn't stop herself from arching a brow at his retort, before, with just as sharp return, she murmured, "Would you have listened to me if I hadn't put up the barrier?" She kept her tone even and rational before his anger, knowing the truth in her words. If she hadn't put up the barriers to bind him, he probably would have gotten to her by now, infuriated and incensed that he had been summoned by a human. It was only a precaution - a necessary one. "Do not put words in my mouth, demon," a hint of warning finally showed in her voice as she narrowed her eyes almost imperceptibly.
What can colored text do for your posts?
Regarding in-character posting? Colored text, especially in posts featuring more than one speaking character, can help dialogue stand out from the rest of the post. It can help distinguish one character from the other and lessen confusion if characters are assigned their own 'voice colors', which in a group roleplay can be especially useful.
Do use colored text to help your words stand out and to make them 'pop' visually if you want.
Do not use hard to see colors. Consider the four color schemes of Iwaku, the background color of your text if you are using one, and color combinations. If you are using a colorful or detailed background, consider using color in your text sparingly. You do not want to overwhelm readers visually. Remember that you are formatting to make your posts aesthetically pleasing, but not so much that it distracts or deters a reader from seeing what actually matters: your writing.
Here is a handy color guide with consideration to Iwaku's color schemes!
Bonus: a resource on color psychology and symbolism by my partner.
#2 - Fonts
Selene couldn't stop herself from arching a brow at his retort, before, with just as sharp return, she murmured, "Would you have listened to me if I hadn't put up the barrier?" She kept her tone even and rational before his anger, knowing the truth in her words. If she hadn't put up the barriers to bind him, he probably would have gotten to her by now, infuriated and incensed that he had been summoned by a human. It was only a precaution - a necessary one. "Do not put words in my mouth, demon," a hint of warning finally showed in her voice as she narrowed her eyes almost imperceptibly.
A less-touted sister to coloring text, fonts are a great way to simply change the overall feel and impression your writing leaves on your readers. Let's admit it: different fonts have different personalities, and why not take advantage of it to spruce up your posts if you want to? Our site's default font is Verdana, but we have 11 other fonts that we can experiment with!
Times New Roman, Andale Mono, Book Antiqua, and Georgia all can give your texts a touch of formality or an 'official' look. The font I am using for this guide, Trebuchet MS, is simple and easy to read, and quite minimalistic.
Do experiment with how fonts affect the overall 'look' of your posts.
Do not use too many fonts. As a general rule of thumb, two fonts are more than enough for a good layout, much like how you shouldn't use too many colors in your text.
Want more fonts? This site has them. Disclaimer: fonts you download from other sites will not show for other users.
#3 - Adding Images + Other Media
Adding images can help flesh out your post more, or help you show details or backgrounds without having to go to the effort of describing them through words. It can show character appearances and references to viewers.
However? There is a limit to how many images or gifs are good for every post. I would have to add that outside of just aesthetics, large filesizes and numbers of images, and not just gifs, make it very difficult for people with limited data plans or slow internet connections.
Too many images can also make your post overwhelming.
Do add images to supplement your posts if you so want. Examples of supplements include: character or post banners and line dividers. Also try to follow the font and color scheme you have selected for your post when including banners or images.
Do not use too many images and gifs per post. The overall effect of too many anything can just be plain jarring or murder on the eyes.
The same could be said of videos. Videos can also add to a post or distract a viewer from the actual post, or compliment your writing (for example, music and soundtracks to enhance the reading experience also counts towards aesthetics).
#4 - Div Boxes and Backgrounds
Code:
[div=padding: 1px; font-family: Trebuchet; font-size: 11px; color: #551A8B; background-color: #bba3d0; border: 1px solid #551A8B; width: 200px;]THIS IS A DIV BOX][/div]How it looks:
THIS IS A DIV BOX
We are able to use the basic [solid] code to place boxes around our text. And we are also able to use the [fieldbox] code to come out with boxes that include titles around our text. The same reasoning and idea is behind the use of the div bb codes, which allow you a great amount of flexibility. You can add color or image backgrounds, adjust height and width of the box or the content, and much more. You'll find that experimenting with BB Codes in general can lend you very nice or interesting results.
@FieryCold has a lovely post on coding stuff here.
But this lesson is not meant to teach users how to code (I'm not good enough at coding to do that). It is meant to stress the importance of carefulness with making your content fancy and fancier with bb codes and div boxes.
I have already stated what to do and not to do in the previous sections, so here are the rest.
Do experiment with background colors or images and how those work with your text's fonts and color. We have a Test Archives area for that very reason. Go wild and be creative there as you test your stuff.
Do not use overwhelming colors and images along with more overwhelming colors and images for both backgrounds and contents. I can't stress that enough. And not only overwhelming, also consider how colors look against different color schemes. Dark red does not work on Iwaku's dark themes, as do many other dark colors. Conversely, very light or bright colors may not work well in the light themes. Now it's up to you how you want your post to look like, but some consideration for the people you want to read your work would be appreciated.
#5 - Last Reminders, Tips and Tricks
Here are the last few tips and reminders for a balanced, pleasantly appealing post that doesn't strain the eyes.
- After formatting and coding, you can try switching to Iwaku's other color schemes to test whether or not your text color and backgrounds work with them. I think this should be emphasized for GMs because everyone in the group will read their important GM posts.
- Don't completely rely on rich text editor. The editor is good for basic stuff like coloring and formatting your text, but things like div boxes can only be used with coding.
- Your posts can look different on different browsers, and on different computers and phones. It is inevitable. The few things you may do to adapt to this would be the use of different properties for div boxes.
#6 - Resources Cited
All the links and resources sited here come from our very own Content forums, though FieryCold's 'Coding Hell' thread comes from their own testing thread in our Testing Archives.
A Beginner's Guide to Rich Text Editor by @Sen
Colour Guide by @Holmishire
The Psychology of Color by @Sen
CODING HELL by @FieryCold
If it's roleplaying terminology and basics you are new to, try this.
Last edited:
