When it comes to my own personal webpages, I like to create my own backgrounds for them to add a personal touch. I like to make backgrounds that flow nicely on the page without any seams or lines in them, as they just look more professional and put together. However, I used to only know how to do this using vertical and horizontal stripes. Striped backgrounds are cute, but I found that this was all I was making, and I wanted to make something a little more elegant. I always wondered how people could have a design that just flowed from tile to tile and connected so well. So I decided to play around with GIMP to unlock the secret to making flowing, continuous webpage backgrounds. I mean there just had to be an easier way than just having a great eye and great precision, and doing it by hand. Through playing around with gimp a bit, I unlocked the secret to amazing backgrounds. A magic, make seamless filter!
In this video I'll show you two slightly different methods to making a flowing background. They are really both the same concept, but one is more for single objects, and one is more for flowing, connected pieces. You can use whichever you prefer. You can even combine the two ways if you wish. However, I personally like to make my backgrounds a little simple and not to busy so it won't distract from the webpage.
Step- By- Step Instructions:
1. Open GIMP, and create a new file by clicking File>New, and choose the image size you want. I personally prefer to work with a 300x300 pixel square tile for this. You can choose what size you prefer to use. However larger sizes may look to large on the page, and may even create issues with uploading due to larger file sizes. After specifying your image size click OK and a new window will open with your blank image.
2. Create your design using the method you'd like.
Method 1: Centered Design- Decide what you want your largest brush size to be. Make sure that it is a bit smaller than the image you are working with and place it in the center of the image. You may also add other designs around it to make it your own, but make sure these designs don't come to close the the edges. You'll want to leave a good amount of blank space.
2. Create your design using the method you'd like.
Method 1: Centered Design- Decide what you want your largest brush size to be. Make sure that it is a bit smaller than the image you are working with and place it in the center of the image. You may also add other designs around it to make it your own, but make sure these designs don't come to close the the edges. You'll want to leave a good amount of blank space.
- If the largest brush you use is to large, the designs will overlap or look faded after you add the make seamless filter.
Method 2: Flowing Design- I prefer to use some lighter, more delicate looking brushes such as glitters for this, but you can make what you wish. Brush size doesn't matter as much in this case, and you can use larger brushes, even if it goes over the edge of the image. Try to avoid making some areas to dark or bold to make the design flow better.
- You can combine these two methods if you wish by first creating your lighter, flowing design, and then placing a bolder element in the center of the image.
3. If you were working in multiple layers, make sure you flatten the image by right clicking on a layer and selecting flatten image. The filter won't work right if you don't do this, as the filter will only be applied to the selected layer not the whole image. One your image is flattened click on filters>map>make seamless. This will make the image flow better when tiled.
- With method 1 you will most definitely notice that the filter leaves the center image, and takes parts of it and places it in the corners of the image. These areas will connect perfectly when tiled. With method two, you may notice some parts of the design fade a bit, i personally feel this looks great on some flowing designs if there is no real patten to it. You may also notice this with large designs on method one. The fading is how it blends images together without seam lines.
4. Test how it looks before uploading it! Click on filters>map>tiled and make the image size a multiple of the original tile. For example with a 300x300 pixel tile, make the tiled image 600x600 pixels, then take a look at your tiled image. This will give you an idea of how it'll look on your webpage.
5. If you are happy with your design and you're ready to use it, go to file>export. (Only click save if you intend to work on it later, as save will only allow you to save it as a GIMP file which can not be uploaded as a background.) Select the location on your computer in which you wish to save it, then name it as you wish. Check what file format you can upload as your background, and save it in that format.
6. Upload it to your webpage! Don't forget to take a look at how it looks on your website.
FTC Disclaimer: I am not affiliated or being endorsed by any of the companies mentioned in this post. I am not being paid to write this post. All opinions are my own.
