RPGWW: Doma Theme

For artistic creations in non-text format.
Reiks
 
Posts: 65
Joined: Sat Mar 28, 2009 12:50 pm

RPGWW: Doma Theme

Unread postby Reiks » Thu Apr 23, 2009 4:41 pm

I really want to do some work. The whole realm inspires me so I wanted to make a non character theme. I don't know much about PHPBB but I'd like it to look like this:

http://i2.photobucket.com/albums/y17/ga ... bgcopy.png

I wanted something clean, creative, and pertinent. For Doma I think "castle city, knights, traditional fantasy town" which may be why it's so central to everthing. I went with browns and steely colors to pull everything together. I have a castle in the corner but I toyed with the idea of realistic or fantasy anime. I still don't know which would be better.

To make it more Doma and less default fantasy I added the Doma banner and put some cloth texture on it so it looked more like a banner. For the RPGWW logo, I tried to make it regal. I like the metallic sheen, I was worried it might look a bit too...campy though. Overall, I think I pulled off a theme that represented Doma...

Thoughts, help?

Thanks

Idran1701
None some call is air am
 
Posts: 42195
Joined: Wed May 29, 2002 9:37 am

Unread postby Idran1701 » Thu Apr 23, 2009 11:54 pm

While I can see what you were going for with the background, it's a little busy. You usually don't want more going on in the background of a page than the foreground. There are a couple other problems with it; it's going to be hard to extend over the entire page, it's not something that lends itself well to repeating, and any text on the stone part, like the affiliate links in the header or the copyright at the bottom, is going to either be nearly unreadable or clash with the color scheme of the rest of the page.

I like the splash of color on the right, it seems to draw the eye across from left to right which is always a good thing. Perhaps go with a simple repeating masonry background similar to what you've got now, with the banner turned sideways to let the pattern repeat, and have it stretch down, covering the right 5-10% of the background or so?

As for the foreground, it looks good. It goes well with the background, and with itself. The banner looks nice too, I like the gold trim, though it might work better if it was about half the width (the trim, not the banner). That's just me, though; I'm a fan of thin borders. I have to agree on the sheen. If it was just a single gradient across a corner, maybe, but it's a little strong as is. Also, the text is a bit too close to the top of the border. You always want to have some space between text and its box, you don't want your text to actually touch it.

Reiks
 
Posts: 65
Joined: Sat Mar 28, 2009 12:50 pm

Unread postby Reiks » Fri Apr 24, 2009 9:53 pm

Edit: Link to new mock up --> http://i2.photobucket.com/albums/y17/ga ... mabg_2.png
Idran1701 wrote: There are a couple other problems with it; it's going to be hard to extend over the entire page, it's not something that lends itself well to repeating... Perhaps go with a simple repeating masonry background similar to what you've got now, with the banner turned sideways to let the pattern repeat, and have it stretch down, covering the right 5-10% of the background or so?


I see what you're saying. I didn't take that into account because I had envisioned the BG as fixed and possibly 10248x768. Let me see if I understand you right and flip the banner. Went above and beyond the call of duty on this one. I didn't like the banner lengthwise across the top because the RPGWW logo covered up the sword so much that it no longer looked like a country's flag. So I added it longways to both sides; this should still repeat well.

Idran1701 wrote:and any text on the stone part, like the affiliate links in the header or the copyright at the bottom, is going to either be nearly unreadable or clash with the color scheme of the rest of the page.


Hmmm... Hadn't thought of this either...I didn't add any text to the mock up but I'll go ahead and do that just to get a feel for how text will look and behave. Added some text (Garamond for all text minus RPGWW and motto which is Monotype Corsiva). Standard blue, purple and red, looks pretty good everywhere except for in the dark brown rows as seen in the "Who's Online" section. Not sure how to approach that one.

Idran1701 wrote:As for the foreground, it looks good. It goes well with the background, and with itself. The banner looks nice too, I like the gold trim, though it might work better if it was about half the width (the trim, not the banner). ... Also, the text is a bit too close to the top of the border. You always want to have some space between text and its box, you don't want your text to actually touch it.


I'll play around the the logo some more. I might also play around with the Doma banner, too. If I can get this layout right, I can have fun with the icon set. Again I'm thinking traditional fantasy (Scrolls, shields, swords, etc) but that's a ways off. Expanded the metal sheen to encompass all of the necessary link information. Still have the RPGWW name to close to the top but we've got plenty of room so far to move that down. Narrowed the trim a tad more. Added two icons just to hint at a what would be cool for a set (I am ever so impatient).

Thanks for the suggestions.
Usually I tend to like my first draft the best until I warm up to the changes but I have to say I think I like this one better. It has less of a forum feel and more of a "Ye Royal Message Board" feel. I'm still trying to view the changes I make to the CSS but to no avail. *scratches chin* I'll keep looking online for answers.

User avatar
pd Rydia
Moderator
 
Posts: 5269
Joined: Mon Apr 22, 2002 4:12 pm
Location: Temple of Fiends

Unread postby pd Rydia » Thu Apr 30, 2009 2:30 pm

Oh hey, this is really cool! I am definitely interested in using a theme such as this. :ghost:

The mirrored flag bg looks pretty cool, but when taking up the whole background as it does in domabg_2.png, it makes the black-and-tan table theme seem a little out of place. I like the colors you've chosen for the table, so I'm leaning toward Idran's suggestion of a simpler, more subdued repeating background image of faux masonry. However, you could also adjust the table colors to better match the colors of the mirrored flag. Either way, both themes make me think, "HFS, Doma!", and I can't wait to see where this goes.

About icons:
Likin' the scrolls. I'm guessing the plain scroll is for "no new posts" and the flaming scroll is "new posts"? If I could make a humble suggestion, how about a closed scroll for "no new posts" and an open scroll for "new posts"? I think closed/open books would also work. (I'd be willing to try my hand at some spriting, if you like, though I don't promise any decent results. D= )

Idran1701
None some call is air am
 
Posts: 42195
Joined: Wed May 29, 2002 9:37 am

Unread postby Idran1701 » Thu Apr 30, 2009 4:19 pm

Actually, what I was proposing was leave it on the right side, but rotate the pattern 90 degrees, so that it was a series of vertical stripes rather than horizontal. Then let it run down the right side repeating. And I have to agree with Dia, having the banner on both sides kind of renders the rest of the background irrelevant, since you can hardly see it behind the tables. I'd say leave the banner on the right side if you do anything with it, since you want it there to tug the eye across the page. Having it in both sides negates that benefit with the aforementioned added problem of obscuring what you assumedly intended to be the main element of the background (the stonework), while having it on the left side alone, while aesthetically it might look good, in terms of a web design wouldn't really achieve the desired effect. The natural position of the eye when a page loads tends to be near the top-left quadrant for most browsers, and anything on a text-heavy site like this that helps pull the eye to the right across the test always helps. That's an area that the current design is somewhat deficient in, admittedly, but it could work out well on your design.

As for getting it to work CSS-wise on your local machine, I can't say why it wouldn't be working for you, but if it comes down to it I can put it together from the final mockup. I know part of the reason you wanted to do this was to practice with CSS, but if you can't get it working on your own, at the least I could get it set up here and you could look over the end result.

I will give one general piece of advice as well, since it's a trap a lot of beginning designers fall into. You never want to design for a specific resolution when designing a webpage. You want to make a design that works at any reasonable resolution, because you can't guarantee what your end users will be using. These days reasonable would be defined by most designers as anything 800x600 or up. (Some go with 1024x768 or up, but if I remember correctly about 20-25% of internet users still use 800x600, so personally I'm reluctant to step it up.) Aspect ratio is also a consideration; since more and more people are using widescreen, you should try and make something that will look good in both 4:3 and 16:9, though this can be a tough challenge. Of course, a lot of people using widescreen don't use maximized browsers either, so you can't even count on aspect ratio too much.

Anyway, the best way to do this is to design things to float. Elements should be able to shift on the page as the browser window changes size, and background elements should rarely be a page-filling image. A repeating image is okay, as those are easy to work with for any resolution size, as is a background element that fills a part of the screen, such as a watermarked background image on one side of the page. I can understand why you were looking towards 1024x768, since it's the most common resolution currently used by internet users, and it's only sensible to work for the most common case. But in this sort of situation, there are so many users not using the most common case that by focusing on that, you actually end up excluding the majority of users (I believe 1024x768 is something like 40% or so). Especially with, like I mentioned, the rising proliferation of widescreen monitors. At least half of monitors being sold today are widescreen, and though 4:3 is still the most common in use, the user share is slowly tipping in favor of 16:9.

Reiks
 
Posts: 65
Joined: Sat Mar 28, 2009 12:50 pm

Unread postby Reiks » Sun May 03, 2009 11:38 am

I dig it Idran. You know what of the logistical problems I'm facing with the banner is that the sword keeps getting lose in the design.

To Dia's point about the "stone and steel" color palette for the actual forum colors, I'm going to play around with maybe taking the banner colors and using them somehow in the design and maybe we can work in a smaller version of the flag someplace else.

Let me ruminate on a version three and take a closer looking at all my code (I probably have something misplaced/typed). I'll keep ya'll posted.


Dia: Like the idea about the scroll icons. I'll post up some more mock ups and get your feedback on those too.

Idran1701
None some call is air am
 
Posts: 42195
Joined: Wed May 29, 2002 9:37 am

Unread postby Idran1701 » Sun May 03, 2009 1:54 pm

If you want, you can email me the code and I can take a look at it. Stick it in an attachment so the email program doesn't alter it any, though.

Reiks
 
Posts: 65
Joined: Sat Mar 28, 2009 12:50 pm

Version 3-5

Unread postby Reiks » Sun May 03, 2009 9:12 pm

http://i2.photobucket.com/albums/y17/ga ... mabg_4.png
In this one, the banner goes the whole way 'cross and if you're keen, you'll notice I went to rocky background with smaller rocks. I centered the RPGWW placard in the banner, covering the sword completely. Information looks a bit squished with this one.

http://s2.photobucket.com/albums/y17/ga ... mabg_3.png
Didn't notice when I was photoshopping this version that didn't place the right banner against the right edge. Oops. Again, this is my attempts on saving the sword. Kept the large placard

http://i2.photobucket.com/albums/y17/ga ... mabg_5.png
This one's more cool colored instead of neutral. Same as version 3 but the dark gray is now navy (couldn't work the red in, too.... bright/warm). Seems like it's missing something though....

Idran1701
None some call is air am
 
Posts: 42195
Joined: Wed May 29, 2002 9:37 am

Unread postby Idran1701 » Mon May 04, 2009 12:36 am

I really like the first/third one there. I'm going back and forth on color scheme; they both look good, and I can't really choose between them. It's a neat touch of creativity, though, using the pennant as a banner at the top. It works really well. I don't think it really needs the sword, but if you wanted to keep it, I think it'd look good if you just had it across the red like it would normally be, and have the placard in front of it.

However, and I know I keep pushing this, I still think a tiled background of the same general concept would work best. I poked around some, and found this masonry pattern: http://backgrounds.smartwebcenter.com/r ... ock048.jpg . Can you see how it looks if you tweak the palette of this image to match the ones you were using, and use it as a tile for the design's background? Leave it the same size, just tile it over the back.

Reiks
 
Posts: 65
Joined: Sat Mar 28, 2009 12:50 pm

Update!!!

Unread postby Reiks » Mon May 04, 2009 6:00 am

Those are some nice looking rocks and they should repeat pretty well. I'll mock up some scenarios after work with it. I have a feeling it might look pretty hot without the taupe overlay but we'll see.

As for sword saving, it was really for the Doma tie-in but I just thought about using it somewhere in the icon set. There's 20+ of those so heck that should be easy enough (maybe for sticky post).

So yeah, I'll play with this later tonight.

So check out the new hotness:
http://i2.photobucket.com/albums/y17/ga ... mabg_6.png

http://i2.photobucket.com/albums/y17/ga ... mabg_7.png

Reiks
 
Posts: 65
Joined: Sat Mar 28, 2009 12:50 pm

On the topic of Icons

Unread postby Reiks » Mon May 04, 2009 5:51 pm

Since I'll be modifying subSilver here are a list of Icons that we can customize. I'd imagine we'd only want to customize the most visible and prominent. An adventurous soul could attempt all. I can add descriptions if the names are not intuitive enough (prolly will anyway when we get closer to settling design.):

folder
folder_announce
folder_announce_new
folder_big
folder_hot
folder_lock
folder_lock_new
folder_locked_big
folder_new
folder_new_big
folder_new_hot
folder_sticky
folder_sticky_new

icon_delete
icon_latest_reply
icon_mini_faq
icon_mini_groups
icon_mini_login
icon_mini_members
icon_mini_message
icon_mini_profile
icon_mini_register
icon_mini_search
icon_minipost
icon_minipost_new
icon_newest_reply

msg_inbox
msg_outbox
msg_savebox
msg_sentbox

topic_delete
topic_lock
topic_move
topic_split
topic_unlock

vote_lcap
vote_recap
voting_bar

whosonline

Idran1701
None some call is air am
 
Posts: 42195
Joined: Wed May 29, 2002 9:37 am

Re: RPGWW: Doma Theme

Unread postby Idran1701 » Sat May 16, 2009 11:13 pm

(My apologies in advance, Reiks)

Reiks
 
Posts: 65
Joined: Sat Mar 28, 2009 12:50 pm

Re: RPGWW: Doma Theme

Unread postby Reiks » Sun May 17, 2009 8:44 am

Let me guess, I'm going to have to download a whole new pack and this is probably more complicated than PHPBB2? *LOL* It's okay, I've never been on the most upgraded boards yet so I'll have a good time playing around until I can think up something good. Maybe I'll put this on a backburner and work on my other stuff which is less codey and more artsy.

User avatar
pd Rydia
Moderator
 
Posts: 5269
Joined: Mon Apr 22, 2002 4:12 pm
Location: Temple of Fiends

Re: RPGWW: Doma Theme

Unread postby pd Rydia » Sun May 17, 2009 2:07 pm

domabg_6.png is hot.


Return to Fanart and Miscellaneous

Who is online

Users browsing this forum: No registered users and 1 guest

cron

Yalogank