Random Free Vectors Part 2 – Rounded Squares
Here is another example of a design play with a single shape. With a single shape, it’s possible to achieve very intricate designs, with a little layering, color, and path manipulation. I’ve been exploring simple shapes and layering lately, and again wanted to share with you a little super-simple inspiration.

Tips for exploring this on your own:
How I made these Shapes:
1. Like I mentioned above, I just used a single shape over and over, a rounded rectangle, but I also combined a lot of paths to form some more complex shapes. Here’s how: Make a bunch of rounded rectangles on top of each other at different sizes, like this.

Now in the Pathfinder palette (window > pathfinder) Hit the “Exclude Overlapping Shapes” button, then immediately hit the “Expand” button. (or you can hold down option/alt while hitting the Exclude Overlapping Shapes button).

Illustrator subtracts all of the areas that were previously overlapped, and the expand button gets rid of the leftover paths and creates one simple compound path for you. Here is the result!


2. The same thing goes for the shapes that have only strokes, but we will use a different button in the Pathfinder. Create a bunch of rounded rectangles, overlap them and apply a stroke like this.

Now hit the “Add to Shape Area” button in the Pathfinder to combine all of the rectangles into a single path, then immediately hit “Expand” to get rid of the leftover paths.

Illustrator combines all of the shapes into a single path for you. Here is the result.





















Nice, thanks
This is something I should play with a little more and I’m happy to report that I actually can once again. I don’t know if anyone else experienced anything like this, but I was devastated when my new MacBook Pro decided it wanted nothing to do with Pathfinder and systematically quit Illustrator (CS2) every time I hit any button in that palette. Last week, I tiptoed my mouse over to the palette not expecting anything and it added my shapes! I had given up after many months of this behavior, but hopefully I haven’t jinxed myself by talking about it because I really like your design idea and want to get in a little practice.
It looks like a building layout plan. Great as always!
Bittbox! What are you thinking?
Rounded Squares?
I though these were Squared Off Circles!
Nah I’m kidding. This is a great way to inspire people to take a trip across the Pathfinder!
As always, awesome tutorial. One request though… could you possibly mention the context in which one could use your tutorials. For the conceptually challenged (me) this looks really cool, but I wouldn’t know what to do with it (or even start looking for someplace to look for it). Thanks again for sharing.
@Dave
I hate to list the ways to use this because there is no way to list them all but you could. . .
Use then as a low contrast background element in a header.
Rasterize your design and make a photoshop brush.
Use as a background shape behind some text in a poster.
Use it as a texture layer in an illustration.
or. . my favorite. . . clouds in an esurance.com tv commercial :)
You can really do anything, but the point here is essentially to experiment with making complex shapes out of a simple shape. Very Quickly. Without relying on searching the web for a free file. Sometimes the simplest answer is the best answer, and I tend to forget to think about the basics a lot of times. (repetition and variety, a very simple, basic design theory)
This post isn’t meant so much for you to take and use rounded rectangles in a design, as it is meant to make you think about some basic design theory/techniques to apply as needed in whatever design task you may have in front of you.
~BittBox
bitt,
great. another awesome how-to. thanks. and thanks for the quick reply on my last post. do you get the email at “info@bittbox.com”? is bittbox a company or just your perosnal website. such a great resource.
george
Geo,
Reach me at contact@bittbox.com and this is a personal website from a single crazy designer.
~Bitt
Thanks for all the freebies
and for the inspiration!
[...] resto de los sets son:Random free vectors part 1 circlesRandom free vectors part 2 rounded squaresRandom free vectors part 3 flowersRandom free vectors part 4 wingsRandom free vectors part 5 [...]
Not Found
The requested URL /wp-content/uploads/2007/03/random_squares_1.zip was not found on this server.
:)
Thanks!
I just moved servers and some of the files got lost in the mix.
Files replaced
~Bitt
@ BittBox:
Thanks so much!
~The “not found” guy :p
[...] Part 3, Part 4] [Glass Buttons & Bars] ???????: [Butterflies] [Wings] [Flowers] [Rounded Squares] [...]