MyBB Community Forums

Full Version: Theming Process
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
This was originally a PM between computergeek67 and I, but then I thought that this information might actually benefit others as well. I hope computergeek67 doesn't mind me posting this.

Darrell Wrote:Hey,

I just had a question for you... when you design a theme, what's your process? Do you thumbnail it first, then design in photoshop, then code it out, then break it up to fit MyBB's templates?

Or do you design it, then just slowly edit MyBB's templates until it matches your design?

I'm just curious because I'm in the process of making a theme, but it seems to be taking forever editing all the templates one by one. Undecided

computergeek67 Wrote:I've never thought of documenting my process but I'll try to do an accurate representation of it. Here's my whole process:

I start by getting inspiration from PatternTap. I look at the headers, footers, buttons (for English buttons), and other collections and draw out edited version of what I like. One of the hardest parts is drawing. I come up with multiple concepts based on the images found on PatternTap and try to make it resemble a theme. Once I have a concept I love, I dive into Photoshop. Most of the time, I pick a color scheme from Kuler or Color Scheme Designer first. Once I have the color scheme ready, I start designing the theme. It's not that hard to make a skeleton of what the theme will look like with colors because all I'm doing is copying my drawing.

The fun part is coding the theme. Since I'm familiar with the templates, I know where the code should go and how it should be coded. Almost all the time, though, I dive into Firebug and make the HTML and CSS changes there. It's a lot easier to edit this way since I don't have to save anything and if I completely mess up the theme, I can just refresh the page and start over. I then format the CSS and HTML to the way they should appear in the MyBB editor and copy whatever I have into the templates and CSS. It takes a while but it serves the purpose. I periodically check to make sure all the code is cross-browser compliant meaning that it works in all browsers and doesn't break. Then, I make the English buttons and upload them making sure they fit with the layout.

If you find anything that you don't agree with or find that it's too slow, it's fine if you change it. This is my process and it works for me although it has changed a lot during the time I've coded themes.

So now here's a question to all the other themers out there...

What's your theming process?!?!

Please share so that others may benefit from your knowledge. Big Grin
My partner designs a PSD. Whatever it looks like is ultimately the final goal, complicated or not. Once I get the PSD, theme actual theme begins to take shape. I start with the overall layout, main colors, to the tables, footer, etc. Once the overall look is complete I move to more finicky places such as making sure there's padding where it's needed, etc.

My process is probably somewhat similar to most other authors (tl;dr OP). Since I don't design the theme I can't really give much input on that topic.

Go with the flow. Start big and work your way down.
(2010-04-13, 02:32 AM)Scoutie44 Wrote: [ -> ]My partner designs a PSD. Whatever it looks like is ultimately the final goal, complicated or not. Once I get the PSD, theme actual theme begins to take shape. I start with the overall layout, main colors, to the tables, footer, etc. Once the overall look is complete I move to more finicky places such as making sure there's padding where it's needed, etc.

My process is probably somewhat similar to most other authors (tl;dr OP). Since I don't design the theme I can't really give much input on that topic.

Go with the flow. Start big and work your way down.

So once it's all coded, THEN you separate them and put them into the templates? Or do you change the default templates to match the look of your PSD?
The templates get changed to match the PSD, yes.
I just go to the top of the forum and work my way down as I get ideas XD
(2010-04-13, 07:36 PM)Lyndon Wrote: [ -> ]I just go to the top of the forum and work my way down as I get ideas XD

That's how I'm doing my current one. But it's taking a while, that's why I thought I'd ask... I thought maybe there was a quicker way of doing things. Smile