Jump to content

Invision Community Blog


Managing successful online communities

Michael
Sign in to follow this  
 

Skin Generator Service

Having a great forum skin is something every forum owner craves. A great skin is a big selling point, as it gives visitors a good first impression, and it colors (pun intended) the overall experience of using that forum. While a great many sites are perfectly happy with the stock IP.Board forum skin, getting something new is often a top priority for sites that are trying to make it big. Up until now, you've had a few options for this:

  • Download or purchase a skin from IPS Resources, or a third party resource site
  • Pay a skinner to make you a custom skin
  • Teach yourself how to skin

While all of these options are certainly good choices, we'd like to introduce another option for you: our Skin Generator service. This is a brand new service we have developed and made available to those with active IP.Board services licenses as a special little perk.

The way the tool works is that it presents you with several options for customizing your skin, such as choosing different color choices:

blogentry-44642-031144500 1269454637_thu

Clicking on one of the color text boxes there gives you a small UI (from jscolor.com) to choose different colors. You can either use that dialog, or type in a hex color there. There is also an option to apply our 'contrast limiting' function, which attempts to ensure light colors aren't too light, and dark colors aren't too dark; it can be used, or not, to try and get the skin looking the way you want. Once you have chosen colors and any other options, click the Preview button to show what that skin will look like; that shows in the main part of the page. Here's a quick one I created to demonstrate this preview:

blogentry-44642-068096800 1269455068_thu

Note the tabs at the top for the different views, you can preview your choices in a couple of different forum views there. Here's a Topic View preview of this same skin:

blogentry-44642-064029600 1269455173_thu

Previewing the skins is cool enough, but it wouldn't be a very good skin generator if it wouldn't let you get the skin you created for use on your own site, would it? Below the options for choosing your skin colors, there is a box for choosing some options to build your skin download:

blogentry-44642-002242300 1269455313_thu

In here, you can name your skin, and choose the IPS applications you have installed, and their versions. By choosing all of these, your downloaded skin will contain all of the appropriate CSS, templates, and image files for all of these apps. No more worrying about whether the skin you got from a resource site has been coded to work with your IP.Gallery install!

Once you fill out this box, click Export, and it'll prompt you to download the .zip file of that skin; the Skin Set and Skin Image Set files will be included in that zip, ready for you to import into your site. Here's one I created and installed on my test board:

blogentry-44642-056204400 1269455509_thu

Please consider this a beta service at this point. As this is a brand new service plus it is doing something rather difficult (creating a skin automatically) we do expect many bugs. Right now this is designed for IP.Board 3.0.5. We will be upgrading it to IP.Board 3.1 when it is released. Please post any bugs you find or ideas you may have!

That about wraps it up, please let us know what you think, or any other features you'd like to see introduced in future updates! :)
Sign in to follow this  

Comments



Recommended Comments

What a great idea! Exactly what is needed for people like myself who have no money to hire skinners, no time to make their own, and specific color ideas that I haven't seen in existing skins. Thank you! :thumbsup:

Share this comment


Link to comment
Share on other sites

I got a nice brown color theme from it! w00t!

Colors used:
52361D primary
721F1B secondary
FFFFFF background
37281C base

Anyone get a decent red, purple, orange, or green style going?

Share this comment


Link to comment
Share on other sites

[quote name='.Wolfie' date='24 March 2010 - 03:52 PM']
I got a nice brown color theme from it! w00t!

Colors used:
52361D primary
721F1B secondary
FFFFFF background
37281C base

Anyone get a decent red, purple, orange, or green style going?

You can click the 'Link to this theme' textbox to get a link to your theme, which you can bookmark to work on it later, or share with others. :)

http://community.invisionpower.com/index.php?app=core&module=skingen&to=52361D&to_alt=721F1B&bg=FFFFFF&text=37281C&contrast=0

Share this comment


Link to comment
Share on other sites

[quote name='Glumbo' date='24 March 2010 - 04:05 PM']
Is there a way to change the design right away without having to download a new skin?

Just change the colors and hit the Preview button again, unless I'm misunderstanding your question. :unsure:

Share this comment


Link to comment
Share on other sites

[quote name='zaz! Interactive' date='24 March 2010 - 04:05 PM']
Is there a way to change the design right away without having to download a new skin?

If you mean to change your current/existing skin, you'd have to change all the color values to reflect the changes. Probably easier to just import a new skin, unless your host is so strict on memory that you can't import anything.

Share this comment


Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Add a comment...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...