MyBB Community Forums

I'm by no means a great designer, and this theme is by no means done. A little while back, I had a (crappy) theme called Simplicity and this is more or less a refurbishment of it. I'm not planning to release it (it's got a hell of a lot of hardcoded values, plus various dependencies on plugins), but here's what I have so far. I don't have a proper name for it (thinking about Electra, or Wine Gums, or something like that) so I'm going with Seabody Technologies Theme since that's the board it's for.


The index. The message counter at the top displays the number of unread PM's a user has (if any) and the moderator link also displays unread posts from the Staff Discussion board. If you hover over a forum title, the description fades in next to it. I'm not convinced about the glass effect though. Before I had it, the welcome back message was just floating there, this was supposed to tie it to something but I'm not 100% sure it worked.


showthread enhanced with xThreads. The format for other boards is much the same, but without the large box above the first post. Much like harajuju, the postbit buttons fade in on hover. They're opacity 0.3 so that mobile users can still see and use them. Postbit's a work in progress - I'm still trying to find a design I like.

Those are the two major features done. I've done the profile page a little but it's too close to default to share it. So what do you think of it so far?

I think - that you need to look at the different elements and try and make them look part of the whole. At the moment I feel like I am looking at a collage of different themes.

The logo/board name and body background are a very specific style that does not usually work too well with lots of defined edges (like on your tborder) and you could consider making the whole theme look a lot more glass like to match - like you have it on the userblock at the top. That of course could be a tad problematic on browsers which do not fully support opacity.

Postbit/forum bit. I think you should take the border OFF the .tborder. The buttons you are using on postbit are really just too chunky for the rest of the postbit - I would suggest either toning the buttons down (take the icons off and reduce the font-size) or beefing up the rest of the postbit font-sizes to keep the buttons in scale. Maybe remove the post subject variable as it is not really serving any purpose unless you are in threaded view.

Colours: The red and black colour scheme on the index and postbit is not echoed anywhere in the header sections or the usercp - I think it is that which is adding to the feeling of a collage.

My advice: first make a palette of 5 colours. Decide which are your accent colours and which are your base and start from that. Choose your fonts: try and keep at two fonts and decide how you want to style key areas such as navigation links, thead, tcat and post_body. Apply that.

It actually helps a lot to use a theme that is already set as a skeleton of what you want - I have a modified version of default theme with a lot of the "cruft" removed and css buttons that I use as a base for all themes. You should make one for theme work, it saves a lot of time, alternatively, try modifying minimal by Theme freak - that is also fairly clean as a start point, though it has no css buttons.

www.colorpicker.com .

Try to use various patterns of colors (complementary, analogic, etc). Right now, it doesn't blend well.

Here's two more pictures (of the same parts, I haven't had an awful lot of time):

[attachment=28040]
Index. The menu is fixed, I installed a sidebar with Random Members, Latest Threads, News, etc. Also (major change) - the background. I don't know if Fractals are better or worse. I think it's more fitting, at the very least. Also recolored the buttons in the header.

[attachment=28041]
showthread. I reduced the css buttons, and that's the major change, I think the rest (if any) were very subtle.

@leefish - what do you mean by remove the tborder? I removed that class and all my posts width's poked out of shape. I also tried (and I think it's visible in the pic) to change the background of the border to match the post background, but no dice.

Also tried looking for the green that crazy's website suggested - no suitable background images and a solid colour/gradient just looked quite weird to me.

(2012-12-17, 11:05 AM)Seabody Wrote: [ -> ]@leefish - what do you mean by remove the tborder? I removed that class and all my posts width's poked out of shape. I also tried (and I think it's visible in the pic) to change the background of the border to match the post background, but no dice.

I mean remove the 1px border all around the table- it is in the tborder class - don't remove the class - edit the class. You can also set the background of the tborder to transparent.

Your logo looks 1990's, the rest of the theme looks mid 2000's and the background looks like a stoner's wallpaper. I'd suggest trying to make them all in the same era / niche.

this theme looks awesome but everyone does has opinion and i agree with Leefish it should be better if you do these steps he told you. For the rest its awesome how you did it.

Just a question do you also were thinking about a navigation menu?

(2012-12-17, 11:30 AM)Jordan L. Wrote: [ -> ]Your logo looks 1990's, the rest of the theme looks mid 2000's and the background looks like a stoner's wallpaper. I'd suggest trying to make them all in the same era / niche.

I've been aiming to get it to 2000's, but preferably closer to Web 2.0. I've taken some time off to see some styles of that niche and try to implement them.

(2012-12-20, 11:34 AM)Wazzyl Wrote: [ -> ]this theme looks awesome but everyone does has opinion and i agree with Leefish it should be better if you do these steps he told you. For the rest its awesome how you did it.

Just a question do you also were thinking about a navigation menu?

Navigation Menu? How so? Do you mean like breadcrumbs, or toplinks, or what?

@Lee, I tried background:transparent; and background:inherit; in my CSS for .tborder and both displayed the image background. :/