Official Forumwarz Blog

The official blog for the web game, Forumwarz

Posts Tagged ‘tour

Screencast: The Conversation Editor

A bunch of people showed interest in the conversation editor I showed off in the screenshots of our admin section.

I decided to record a screencast that shows off how the tool works. It’s un-rehearsed and rough around the edges but it’ll give you an idea of how we write the conversations that you play out in sTalk.

Written by eviltrout

February 18, 2009 at 3:29 PM

Posted in Coding, Home, News

Tagged with , , ,

The Forumwarz Admin Tab

While it’s not as obvious when you’re going through quests and having fun playing, underneath the scenes, Forumwarz is just a database.

Every forum, attack, conversation and cinematic is represented in the database somewhere so we can keep track of it and modify it as we need. In order to maintain all this data, we have quite a large admin section. Only a handful of people have access to it, so it’s not the prettiest thing in the world, but it’s functional and allows us to build new content and episodes.

This blog post is a small tour of the admin section. There’s way too much to show everything in detail, but here are a bunch of screenshots with descriptions so you can get a bird’s eye view of how we do things. Click any of the screenshots to zoom in.

(Note: These screenshots contain minor game spoilers. I’ve tried to keep later content out of them but you should view at your own risk.)

1. The Admin Root

As an Admin, you get a tab you can click on. When you do, you come to a menu that scrolls vertically. It’s basically just a set of links to the various sections of the site that are editable:

2. Abilities List

Most of the links take you to overview pages for their sections. Here’s what the ability page looks like. Note we have filtering tools at the top to search for abilities to edit them easier. The ability post links allows us to edit the madlibs that appear when you perform an attack.

3. Event View

On the previous screenshot, did you see the little gear icons? Those mean that the particular item in the database has an event associated with it. Events are links to Ruby scripts that execute code when things happen.

This is the event for the Drool on Keyboard and Bash Head against Keyboard attacks (note they are exactly the same from an event standpoint.) The code says that this attack damages the enemy’s pwnage by a value between 3 and 6. It also tells the toolbar to inactivate the action after executing it.

In my earlier attempts at building Forumwarz, these attributes were represented by entries in a database table. But I quickly found it was less flexible. The beauty of Ruby code for events is that I can make an attack do almost anything I want. I could make an event contact Yahoo! weather, get the temperature and make an attack hurt for that much, for example. Not that I’d advocate doing that for performance reasons :)

4. The Conversation Editor

One of the most dynamic things you can do in Forumwarz is have a conversation with an NPC. We started by thinking of conversations as threaded, but then we realized that we often want to jump back to previous states (for example: “Let’s talk about something else…”). The current conversation system is a finite state machine with a visual editor:

The interface is designed so that our writer (Jalapeno Bootyhole) can jump in and create conversations. He can create new states, and link them together with choices and arrows.

After a few edits, I step in and embed small amounts of ruby code in the conversations. This allows us to change the flow depending on things you’ve done in the game. For example, in the above screenshot, right off the bat it checks if you’ve talked to Bruce Bear already. If you have, it sends you down a different path than if you haven’t.

When the conversation is done, we compile it into Ruby code. This is what the output looks like. This ruby code is then interpreted as you step through the conversation. You’ll notice that images and special characters are encoded as html in the strings.

Any programmers reading this might have noticed that the compiled conversation is actually an Event. Our event framework is the same everywhere, whether it’s using an item or having a conversation (they have access to the same game-changing features.)

5. Cinematics List

Cinematics are interesting. Any time the game interrupts you and takes over fullscreen you are probably watching a cinematic. Cinematics can vary from a simple NPC wanting your attention to extended gameplay sequences like the beginning of Episode 2 (the cinematic there is larger than all the cinematics in Episode 1 combined.)

6. Editing a Cinematic

Cinematics are divided up into shots. Each shot can be different, showing an image or text crawl or even an NPC saying stuff.

7. Shot Properties

Furthermore, shots can be given extended properties. We can tell shots how to transition in and out (shake, fade, scroll, etc.). Additionally they can call external Javascript if we want something else interesting to happen.

8. Forums

All our Forums are stored in the database. On this list you can see a “Special” forum which is where we store generic content that can be inserted into any other forum a certain percentage of the time.
I have no idea why the generic forum has an XSS and FBO quota though, looking at it! The little icon of three little colored dots means that database entry has a style associated with it. Clicking it allows us to customize the way that forum looks using CSS.

9. Reports

We have an extensive Reports section that gives us back summaries of the data in the database. A lot of them are business oriented such as how well the various brownie point packages are selling. But there’s also gameplay stats in there, such as which classes are the most popular, what abilities people prefer using, etc. It’s a goldmine of corporate secrets!

(For the paranoid: Big Brother is the name I gave to our conversion tracking. It tracks our various ad campaigns and how many users each one brings in so we can evaluate how effective they are.)

10. Nicknames

Ever wondered how the name generator works? We have two columns of data. It randomly joins together a value from both columns, then does post-processing on it to add typos, converts random characters to numbers, etc.

11. Word Types

Anyone who’s used ForumBuildr is aware of how we generate all the text in the forums. It uses certain word types, identified with a @ before their name. They are replaced, madlib-style, into arranged paragraphs. Here’s a page that lists them:

12. Editing a Word Type

Finally, the last thing I took a screenshot of, is how we add words. It’s pretty simple, we just give a huge blob of text into a field, separated by commas.

That’s it!

I hope you enjoyed this little tour of the admin section. Forumwarz is definitely the biggest site I’ve built from scratch, and it’s fun to show the sections that only 3-4 people ever access. If you have any questions, be sure to ask!

Written by eviltrout

February 11, 2009 at 7:34 PM

Posted in Coding, Home

Tagged with ,

Follow

Get every new post delivered to your Inbox.