I love eagles, they look very strong and powerful. This one is created with actionscript (flash). I edited the composition with photoshop to add the text and changed contrast. The lines and letters are created generatively, using mouse gestures and random movements. I have worked hard to create this image, it is full with details, full of lines. Hope you like it.

Full composition size: 10.000 x 7500 px

I like iGoogle. It’s very handy, because I can read my RSS-feeds everywhere I am. A while ago, I tried to personalize the header of iGoogle. I found the option to create your own skin, simply by uploading an image. I didn’t know the theme would be public, because I didn’t read the conditions. So, if anyone is interested.. Here is the iGoogle-theme:
see.the.sky @ iGoogle

Found out something useful, which I’d like to share with you. It’s about calculating the width of menu-items perfectly.

Imaging you are creating a liquid website with a menu. If you want all items to have the same width, you could set the width of each item to totalMenuWidth / items.length. In most cases this will work out. But what is your menu is very small or the items doesn’t fit in that fixed width because the text is too long?

Well you could hardcode the width’s to make your own perfect proportions and spacing, but if your menu is xml-driven and you/someone else adds new menu-items, you have to re-assign the hardcoded widths and you feel unhappy 🙂 Most hardcoded stuff is evil anyway because it is laziness. (I use it a lot :P)

Well, I’d like to calculate the perfect scaling menu, so I don’t have to worry the menu will break. You can use the text-length of the menu-item as input for the width calculation. The more letters, the bigger the menu-item, right? So, If you multiply all menu-text-lengths and divide this to the current text-length, you’ll get a ratio which can be divided from the total menu width. I like this theory. So we need to do this in 2 steps; first get the ratios and get the total menu-text-lengths (with a loop), then calculate and apply this on each item.
Pseudocode:

itemwidth = fullMenuWidth / (totalTextLength / menuitem.text.length)

This works fine, and its actually very cool. Now we have a function which actually use some proportions to create a liquid menu. After a while I realized that the proportions weren’t really right. If the menu text have odd text-length differences (eg 5 letters vs 25 letters), it looks weird. Larger texts take too much width. I wanted the same proportions kinda like a html-table.

So the menu-items needs to have better proportions. Bigger text should be a smaller and the smaller text should be bigger. After some searching I ‘discovered’ Square root, a.k.a. Math.sqrt() in actionscript. With this function you could ‘normalize’ numbers. Bigger numbers are getting smaller, smaller numbers are getting bigger. This was exactly what I needed!

You can see the result below:

You can see the differences between the menubars and you’ll agree to me that the last one is the best 🙂 I think this theory could be applied to a lot more things, like graphs or grids.

In case anyone is interested in the code; it can be downloaded here (AS3).

Quick post: Smashing Magazine posted an article about Algorithmic and Code Generated Artworks. Some of my artworks are on that list. I love the way they describe the code generated artworks:

The most interesting thing we like about art is that it is independent of any medium; an artist can express himself without any limitations or restrictions by creating a wonderful and creative piece of art. A creative artist can come up with an inspirational and motivational thought and put that in their artwork in such a way that it becomes a masterpiece that dazzles our mind.

In this post we present some amazing examples of Code Generated, Algorithmic Abstract Artworks and CG Artworks. There are some really interesting platforms and libraries; by using them, artists can create unusual artworks. Most popular among these libraries are Flash Scripting, Generator.x, Processing (Java Based), openFrameworks (C Based) and for creating CG Art, artists are often using 3D Max, Maya, Zbrush, V Ray, Photoshop etc.

Hopefully, you’ll love them and will find them creative or inspirational. Please explore the further works of the artists linked below and also feel free to suggest other artworks in the comments to this post.

Smashing Magazine is a weblog dedicated to web-developers and designers and is a great resource with great links and inspirational articles.

Check it out: http://www.smashingmagazine.com/2009/08/21/45-amazing-examples-of-code-generated-and-3d-cg-artworks/

This was the first hello world post on blog.stroep.nl. I’m very proud to blog for more than a year, but tomorrow is my real birthday 🙂

Almost 1 year since my first post. I already updated my blog to a newer WordPress installation. But since my design was getting older, I was tired looking at it. It looks a little bit messy. I think the layout (top nav, left content, right sidebar) interacts nice; so I keep this layout. But the design was a little bit overdone and I was not totally happy and I hacked multiple times layout things to it. More browsers didn’t like my site anymore.

Stroep v1

I just want stroep.nl has to look better.

Last time I downloaded a theme as basic for my design and edited it. First I felt a little bit ashamed doing this. I am a designer and I can design and build my own theme. But.. I don’t have the time to reinvent the wheel of creating themes. So I don’t feel ashamed anymore. I think it’s smart using good templates as start for creating personal(!) blogs. Oops.. I did it again 🙂 I used this Linetech as start for the design. It’s a great theme. I easily modified it to my stroep-style.
I love the sidebar from my previous design. You can switch between comments/recent post. So I kept this principle. I pimped my tag-cloud too. It has random colors. Don’t ask me why; I think it just looks cool and I never seen it before too btw. Speaking of random; the header images shows some random art too.

Stroep v2

I always wanted a clean dark layout with art in the header. I found some great wood-patterns. These are great because I really think this patterns make the blog more ‘friendly’ in comparison to a noisy background or a solid dark color. I know dark layouts have downsides; It’s less readable. Well for now I can live with it. The pro of a dark design is it makes art/photography look more beautiful. This blog is mostly about generative art or topics about flash related stuff, so I think its worth giving a dark design a try.

I also removed 2 advertising-blocks, and just added it 1 to the sidebar. Nobody clicks it anyway. So it doesn’t have to break my new layout (yet). If someone wants to have a banner on this site (which has something to do with design/art/programming or related things), just contact me. I have about 1000 visitors a month.

My blog looks better (not perfectly the same) in modern browsers. If you use IE6 you get a nice update message. My philosophy is we all need to stop supporting old crappy browsers and notify unlearned or conservative users. I used transparent PNG’s, rounded corners with CSS, and all without any fix for browsers who doesn’t support it. For my blog I don’t care and to be honest I feel forceful not having to support ‘them’.

Hope you like it! Let me know what you guys think.

I installed the ‘Hyper cache‘-plugin yesterday. It minifies my output-html and posts are saved as static files on the server and the plugin enables gzip-compression. It automatically clears cache and starts over after one day. I don’t like to promote shit, but this plugin rocks! 😀

Minifiy html profit

Well, this doesn’t change the world. But check this out:

G-zip compression profit

Do you see? My content is 305 KB without compression. Now it is served as 180 KB! 😉 Anyway; G-zip compression is very good if you need to safe bandwidth, but don’t forget you have some higher server load. I guess it also uses some more CPU at the client side. If you want to learn more about g-zip compression, it is already better explained on betterExplained.com.

Sending compressed data is very interesting. I think the world would be better place if every wordpress-installation has a cache plugin. 🙂