project reality header
Go Back   Project Reality Forums > Developer Blogs > AncientMan
23 Sep 2024, 00:00:00 (PRT)
Register Developer Blogs Members List Search Quick Links

Rate this Entry
From Community Member to Interface Design
Posted in: Graphics
Posted 2009-02-19 at 05:38 by [R-DEV]AncientMan

Well I may put something in here since it's here to use.

Anywho, I'm Gavin, or AncientMan, I am 18, Australian, and I'm the Interface Designer for PR.

Interface design... Not as well recognised as a Level Designer, or an Animator, or a Modeller, but still a part of the game which is often overlooked.

So, how did I get to be this guy?

Well, back in 2007, when 0.61 was still the version being played, and I decided that I wanted to help PR out in some way. Not having much experience except for some basic Photoshop skills, I didn't have that much to contribute. However, I saw a post in one of the forums asking how to increase the view distance, and that got me started. I edited a few levels, increased the view distance, and took a couple of screenshots. They were alright, but they were just that, screenshots. So, after seeing the loading backgrounds being a dull, blurred, black and white image, I decided to edit the image a bit then replace the backgrounds on each map. The result was this:

https://www.realitymod.com/forum/f66-...g-screens.html
(Download links are dead now, but the preview images are still there)

Why I increased the view distance for the loading backgrounds? Don't really know, but they look more interesting then seeing a few meters then fog.

I happened to get [R-CON] status for doing that, so I was pretty stoked. But yeah, it was just one thing that I had done, and I wanted to keep on doing something to keep my [R-CON] status.

So, keeping with the load theme, I decided to work on the map overviews. I still didn't have that much experience in Photoshop, but I tried anyway. In the same thread I linked before, you can see the original ones. They were pretty bad on some maps. You can also see some of the first attempts at making my version of the map overview. The first attempts were pretty bad as well.

But, with help from now [R-DEV]Chuc, a few tutorials, and constant persistence, I learned, and they got better.

And, finally, 0.7 came to release day, and both my new load backgrounds and map overviews were included, for every map. Many long days turned out to be worth it.

So, after 0.7 was released, I was stuck again trying to think of something to do. And then along came a developer linking to the BF2 Menu Flash files (think they were in reply to then [R-CON]Afterdune trying to edit the MOTD box to have a PR image). So, since I had nothing better to do, it was time to have a look at them.

I'd never used flash before, and really didn't have a clue what I was doing, but I was determined to do something with them, so I kept at it. After a few days I figured out what things did what, and I got an idea to have a "PR Tip" to the loading menu. With some help from Sir. Elxx (From BF2 Sandbox, BattleRacer, etc.), I had done it, random tips that are shown at load. So that was included in 0.75.

Along came 0.8, and after learning more about Flash and the BF2 menu, I decided to completely redesign the loading menu (since it was simpler to edit), then later do the main menu in another release (since it was much more complicated due to more frames).

I whipped up a design plan in Photoshop, and the end result was this:


Original Photoshop design plan of the loading menu. Ignore the text used, was place-holders for size and alignment, to make sure everything fitted.

After seeing the Devs were pretty interested in this, I started getting to work in Flash. A few days later, quite to my surprise, I was promoted to [R-DEV] along with various other [R-CON]'s. So now I had even more reason to keep working at it, as now I wanted to keep my [R-DEV] status.

Work was quite quicker than I expected, and after a day or two I had it working ingame:


From Photoshop to Flash.

Obvious changes were made in the process of making it work in Flash, but it turned out pretty well. From there, I got to work on the other frames of the loading menu, and ended up with the following:


WIP of the "Score List" frame.


WIP of the "Top Squads" frame.


WIP of the "Briefing Room"

From there, it was tweaking and refining to get it to what it is looking like now (haven't really touched it since I first made it, 0.85's loading menu is the same as 0.8's).

So now, it's 0.803, with a lot of time of nothing to do. So, I decided to have a crack at the main menu and see how quickly I could do that, and see if I could squeeze that into 0.8.

Another Photoshop plan...


The original Photoshop design plan of the main menu.

I had hoped to get some sort of news ticker to replace the MOTD screen (similar to BF2142), but after much effort, I decided to can the idea since it just wouldn't work.

Anyway, about a day later I had it ingame and working:


Doesn't take that long after all.

But, that is only 1 frame, out of quite a lot. The rest of the frames looked something like this:


The joys of redesigning a menu, it's never done until everything is done.

After about 1 week of working on it as much as possible, it was done, at last. So much quicker than I expected, and the end result was still fairly decent. Was done by 0.804. Oh, as a side note, maths and calculators are actually pretty useful in this type of work dealing with alignment and coordinates.

From there, a new background movie was made by [R-DEV]AfterDune, tweaks were made, bugs were fixed. I also completely redid all the map overviews and loading backgrounds to fit in with the updated menu's. And 0.809 was released.

So from there, the community got their hands on it and gave some feedback, and I made a bunch of tweaks to it. Removing the background from the main navigation buttons, moving the buttons to the bottom left, tweaking the server browser to remove filters and have a map overview button, fixing up the damned 800x600 CTD bug (bloody fonts), and various other tweaks, and we ended up with 0.85's menu.

I also decided to take a step into the in-game interface, with some various edits such as the CP Font and colour, the background removal of the ammo counter, and some other small things to get started with that was needed.


Trying to figure out what colour looked best. In the end it was white. Had to make a custom font so it had the outline.

And that's pretty much where we are at the moment. For 0.9+, I'm looking into font's with the menu's, a better control menu (maybe), and in-game interface editing, like replacing the horrible yellow with the PR theme of grey. Maybe some other suggestions might help with regards to the PR Interface?

Anyway, this is getting pretty lengthy, so I might stop this here. I hope it's been interesting to see the "shortened" story of me going from a community member with no forum posts and very basic knowledge of Photoshop, to a PR Developer with many more skills in Photoshop and Flash. I also hope it's inspiring for those people out there who are interested in getting into game development, but lack the skill. Constant persistence and asking for help will get you there in the end.
Updated 2009-02-28 at 14:37 by [R-DEV]AncientMan
Views: 17370 | Comments: 13

Main  |  Next Entry »

Comments
Total Comments: 13
  1. Old Comment
    LtSoucy's Avatar
    wow really nice job showing from R-CON to R-DEV
    Posted 2009-02-20 at 12:26 by LtSoucy LtSoucy is offline
  2. Old Comment
    tmnoobage's Avatar
    great blog, very interesting
    Posted 2009-03-07 at 13:33 by tmnoobage tmnoobage is offline
  3. Old Comment
    Z-trooper's Avatar
    Interesting read AncientMan
    You have done a great job of making PR stand out from vBF2 and other mods. Interface and apperance is a vital part of game design. It has cirtanly given PR a more polished look. Keep at it buddy.

    You got me inspired to do my first DEV blog entry
    Posted 2009-04-11 at 18:48 by Z-trooper Z-trooper is offline
 

All times are GMT. The time now is 05:29.