Page 1 of 1

Kestral's Attempt to Make You Go Wow

PostPosted: June 18th, 2009, 10:03 pm
by Kestral
There's a LOT more than what meets the eye to make this site.

To begin with, there isn't something that comes out of the PhpBB package that sets up the general header we see at the top. I would be thrown off by that in the beginning.

You also have to consider how much work is done. I'll point everything in a normal character page.

I'll use this as an example.

Already we have lot's of tables conveniently set up. Tables. Conveniently. Spacing, padding, are of the tags, and so on.

BUT THEY AREN'T TABLES.

Oh, ho, ho. You see, everything on the left side technically isn't a table. It's one whole background image with text. It still takes padding, spacing, and such.

Something that isn't easy for someone who just picks up CSS or HTML and styles away. (I have trouble making borders! Image borders.)

The Style type tables (and/or divs) are made easily if you have access to PhpBB's source HTML. But the Coins lighting up are a neat effect that may take a bit to get around.

Now, I'd like to point out the devilishly simplicity of the meat of the page. The stats. As you can see, the table looks good.

But wait, it isn't a table. It's another image!

Some may be able to right click on it, and select "View Background Image". Simple. I know I wouldn't think of that at first. (Those bars, are static. :p)

See the tabs at the bottom? Yeah, that's kinda intricate.

Keep in mind: Skills, Factions, and Stats, and the blue text.

First, see the scroll bar? Fancy. I think I've learned how to do it once, but never tried. But still looks good to me. They all use the same Background Image, too.

Secondly, see the convenient icons? Start up Oblivion, and try to rip every single icon used here. Go, now.
Back? See how very tedious that is?

Now, my favorite part, the text.

It may seem simple, type. Oh, ho, ho, ho!

Select it. View image. What do we get? An image!

http://www.elderstats.com/character/S1/ ... elector=h2 (Blue Text)
http://www.elderstats.com/character/S3/ ... elector=h2 (Brown Text)

Yes, an image... Not really, though. The image is created. Created by the script in the file. I can't wrap my mind around how Tom did it (With the help of Xavier, of course, who probably made the looks. Well, re-created it.)

I'm not done with everything, but this is just a small tid-bit of what Tom and Xavier had to do to make this place.

I give both, Tom and Xavier, my seal of Approval!
http://i266.photobucket.com/albums/ii26 ... 1245359101


Not that you really need approval. Consider it an award. :o

Re: Kestral's Attempt to Make You Go Wow

PostPosted: June 18th, 2009, 10:33 pm
by Tom
Well, thank you, Kestral. It's nice to see that someone understands the work that was put into making The Elder Stats. :)

If you look through everything that Kestral was saying, he is quite right. It was a tedious adventure trying to make this website. That's part of the reason that it took 3 months to make (and although some people say that 3 months is like nothing to make a website like this, that is a lot of time for me). This was really my first attempt at making such a large-scale website, and I'm glad to see that everyone likes it. It's always nice to see a fellow web developer come by and explain how hard web developing is without me looking like I'm trying to "toot my own horn," so I appreciate your writeup here.

By the way, if you are wondering about the brown and blue text that Kestral was talking about, he was right that I had to make a script so that an image could be dynamically created based on the information that was in the database, but I also had to create a brand new font file in order to do this. So, I went and copied every possible normal character from Oblivion where the font was the style I wanted, and I had to copy, edit, and resize every character in the font. Then, I had to cut each one out and resize them again using a program for font creation. It was a tedious 2-day ordeal to get the font working the way I wanted it to, so I'm glad that you noticed that, as well.

On one final note, I only really use phpBB for the forum mechanism and for managing each member's information and sessions. Otherwise, I pretty much built the rest of the website from the ground up. And although it was long and tedious, I actually somewhat enjoyed doing it. ;)

Re: Kestral's Attempt to Make You Go Wow

PostPosted: June 19th, 2009, 1:08 am
by Kestral
I wouldn't call myself much of a developer, rather a person who has a general knowledge of scripting.

But, scripting, styling, can be fun. Making what you want, and creating it the ways you want it, too.

Re: Kestral's Attempt to Make You Go Wow

PostPosted: June 21st, 2009, 8:52 pm
by Xavier
Wow, Kestral. Thanks for taking the time to notice what Tom and I have done. I can say it was fun making the top banner, the nav bar, the new layout for the profiles, and then character profiles. I love working and making graphics in Photoshop. It can also be pretty rewarding when you are finished going into the actual game and taking screenshots to put onto this website. Some of the stuff on here isn't really stuff you'll just find on Google Images. Tom and I make a good team. He does the coding and I do the design. I'll have to say though, the coding is a much harder and longer job than actually creating the design.

Re: Kestral's Attempt to Make You Go Wow

PostPosted: June 21st, 2009, 11:51 pm
by Kestral
Xavier wrote:Wow, Kestral. Thanks for taking the time to notice what Tom and I have done. I can say it was fun making the top banner, the nav bar, the new layout for the profiles, and then character profiles. I love working and making graphics in Photoshop. It can also be pretty rewarding when you are finished going into the actual game and taking screenshots to put onto this website. Some of the stuff on here isn't really stuff you'll just find on Google Images. Tom and I make a good team. He does the coding and I do the design. I'll have to say though, the coding is a much harder and longer job than actually creating the design.

Did you recolor the PhpBB icons?

Re: Kestral's Attempt to Make You Go Wow

PostPosted: June 22nd, 2009, 2:06 am
by Tom
Kestral wrote:Did you recolor the PhpBB icons?

The phpBB icons that we use here were actually taken from a brown-colored version of the original prosilver template for phpBB3. We could have changed the colors of the icons ourselves, but we figured that it would save time to just take them from the pre-made template instead. It fits the design quite well.

Re: Kestral's Attempt to Make You Go Wow

PostPosted: June 22nd, 2009, 5:04 am
by Kestral
So, this style's skeleton is a brown prosilver with an added background?

Re: Kestral's Attempt to Make You Go Wow

PostPosted: June 22nd, 2009, 4:57 pm
by Tom
Kestral wrote:So, this style's skeleton is a brown prosilver with an added background?

In a sense, yes. I didn't modify much of the core HTML for prosilver when I restyled this template (aside from adding the headers, navigation bars, and a few other things), and I modified the CSS colors so that they would fit the website's overall design. I didn't try to change the way prosilver looked from an architectural standpoint, but I did change the colors.

Re: Kestral's Attempt to Make You Go Wow

PostPosted: June 22nd, 2009, 8:55 pm
by Kestral
Ah, I see.