Who said sleek+design requires Adobe Flash? Pushing the boundaries on how we use javascript and HTML to build exceptional experience is what interest every designer today. In this article we have collected 10 layouts that risk their site structure with unusual approaches. That’s what makes them different and leave an unforgettable impression. Hopefully you will find some creative ideas that you can develop further in your future designs.

1. Rain Creative Lab

The site utilize and combines 3 major technology: CSS/HTML, Javascript(Jquery) and Flash. They didn’t just use them as 3 separate technologies, but rather integrate them to create that one seamless and unique experience. The background is interactive. Click and play with it. Or use the Keyboard controls to have an unforgettable experience. You can read more about the “making-of” the site here.

2. appear

At first glace, i thought this site is flash based. But then i checked the source code to see it wasn’t. Everything was really impressive, the best thing is the way your mouse has full control over what you see. Simply drag the left panel to see more projects, move your mouse over any logo and you will see an elegant transition to see more details about each project.

3. Zachary Pulman

A 4 column grid based design. When you click one of the 4 main blocks a new panel is smoothly displayed beneath it. I really like how the designer managed to create this slick blocks and kept a clean grid behind them.

4. Fresh01

What’s interesting about this website is the way the text inside the blue circles change based on how far down a page you have scrolled. As if you are walking through a long road, showing you the date and type of post you are currently at.

5. You Love Us

The layout on youlove.us is definitely very vibrant. Beside the clean design, the site is slightly animated yet creating an appropriate atmosphere by using a large vivid background-image that scrolls smoothly through the header and the footer.

6. Nealite

Nealite uses a six-column grid. Text and images are perfectly placed on the grid giving the layout a complete form and a sense of order. Notice various font sizes and text styling in the design — they introduce a profound visual hierarchy into the layout that works perfectly within the complex, unpredictable layout.

7. Duplos

The distortion in the layout is caused by the nice floating tags. Although the design seems to be chaotic, this chaos creates tension in the layout and looks very appealing.

8. Pretty Production

It seems that horizontal approach is currently used primarily for visualization purposes, but it can be used for normal designs too. Pretty Production made an interesting example of how this can be achieved in an eye candy design. As the users scroll, different areas of the site flow in front of users’ eyes.

9. Blue Beetle

Sometimes a background image is enough to make the layout stand out. Although one can recognize a conventional layout structure here, the design looks distinctive and memorable. Specially when you get the feeling of bites and stings from this enormous amount of ants.

10. Snugglefux

Snugglefux uses an unusual yet appealing style to display blog posts. Notice that the accordion technique he is using to gather the blog posts together and how he use this gradient transition when you hover over these big links to make the design look very appealing.