Posts tagged 'Inspiration'

Don’t You Wish You Could Pogo-Stick To Work

Pogo by egoodwinart

I have always been struck by this painting of a business man hopping on a pogo stick with his briefcase in hand. Some days when I am walking from the metro to work I think “It would be so awesome to do this on a pogo stick, just like in the painting.” But then I would have to wear a suit everyday to heighten the outrageousness of the idea. People generally don’t expect suit-wearing, briefcase-toting business folk to be hopping down the street like a 12 year old kid. That’s what makes it interesting.

Of course most of my commute is spent underground in a train that has a premium on space and managing a pogo stick would be a big hassle. I guess if I ever get a job where I can walk the whole way to the office I will trade in my sneakers for some wing tips and a pin stripe suit to go along with my visual gag.

Prints of this painting are available at egoodwinart’s online art store.

Stripes, Stripes, And More Stripes

It is stripe mania over at Stripemania.com. There they have a stripe generator to help you make slick, striped backgrounds in web 2.0 or web 1.0 flavors.

Stripemania Screenshot

Need some stripe inspiration? Check out Stripe.licious, Stripe Mania’s collection of user created stripes in all types of colors and widths. Whichever method you chose to get your stripe, you can download it in either a transparent background or regular gif. The images come ready to be tiled as a seamless background for your next web or graphics project.

Pretty self explanatory but very well executed.

Inspiration: Srown Design Group

Srown.com Screenshot

Srown.com is the home of the stylish Srown Design Group. If you are a design group you most certainly have to look good and the team has pulled it off with this slick black and pink website. I like how the background draws the attention to the middle of the page where all of the content is as well as use of the upper corners for the most important navigation: Home and Contact. Srown has even used a bit of pizazz by fading up new content after you click a link.

Looks aside though, and this site has two big problems. For one, the site doesn’t use separate web pages for each section, instead everything is loaded up front and using JavaScript, Srown replaces the middle container with the content. This is bad design as it prevents linking to specific content. There are ways to incorporate a bookmarkable history of pages using JavaScript like the jQuery history plugin. Also, users with scripting disabled will be limited to the first screen of content since the navigation relies entirely on JavaScript.

Ultimately Srown used the wrong technology for the job. Instead, the team should have used Flash which would be more flexible in developing visual effects. There is also a higher chance of a user having Flash installed compared to having JavaScript enabled since the Adobe plugin is installed in 99% of computers worldwide. Instead, Srown settled for the middle of usability (and the middle is the worst) without taking advantage of the extra benefits Flash had to offer.

As you can see a site can be visually stellar but utter crap in usability. Before ever starting a project it is important to sit down and think things through from a technical stand point to see what different technologies have to offer. So while Srown looks awesome it suffers in usability which brings up the important point that substance beats style out any day.

Stylish Lamps Made Out Of Old Bulbs

Every time a light bulb burns out I feel a little uneasy about throwing it away. I find the simple design of a light bulb is a great source of inspiration. Bulbs Unlimited must have felt the same way so they created a kit that lets you creacycle (creative recycle) those dead bulbs and turn them into a functional new lighting piece yourself.

Lamp Virus

These look so cool and there are four different patterns to choose from: Virus, Cube, Corona, and Circle. You can purchase a kit in the price range from about 12,95€ ($18) all the way up to 89,95€ ($122), depending on the complexity of the design.

Lamp Cube

(via Technabob)

Inspiration: Stage 5 Studio & Circle Six

Stage 5 Studio Screenshot

Stage5Studio.com

This little site is a nice example of how to do a dark-colored site using bright colors for highlight. I really like the idea of highlighting certain info with a solid background color similar to the rollovers of my links. Best of all, the site is a single page. Straight and to the point.

Circle Six Design Screenshot

blog.CircleSixDesign.com

Circle Six uses a killer color combination of orange and blue. I really like the logo which plays with depth by wrapping through the logo and on top of and over the orange nav bar. I’m not a big fan of the fluff at the bottom. The best thing has to be the Twitter status which fades in both size and color as the updates age.

Circle Six Design Twitter Screenshot

Inspiration: SEOStudio.co.uk

This search engine optimization company has a slick website with a royal blue and white theme. The main category navigation has an interesting roll-over effect where the icons not selected become grayed out. A reader can maximize the reading room by hiding the nav area which slides shut thanks to the animation prowess of the Script.aculo.us library.

The only thing I would change would change about SEOStudio.co.uk would be the color of the type. Blue on blue provides a low contrast and to aide readability I would pick something lighter.

Smooth icons with a soft glow as well as the eye-catching color choice make this a site I’ll keep track of for times when I need some inspiration.

seostudio.co.uk Screenshot

Yummy LoremIpscream

LoremIpscream.com Logo

You scream, I scream, we all scream for LoremIpscream.com? Because using a regular lorem ipsum generator is so dull these days, Matt Thompson created a site to spice things up a bit. Besides offering the standard vanilla flavor of dummy text, Lorem Ipscream offers a variety of other mashed-up, random bits including the inaugural addresses of every president and about 23,000 punk and emo song lyrics. Clicking the same flavor produces different results each time. How valuable the random bits of text are may be another question entirely.

Why do we need this? Matt claims “it is essentially just a tool, the performance art aspect will come with how the community of web developers, hackers, and general lurkers use it.” I may not understand it to the fullest, but it sure is a delicious design just like Matt’s site.

Matt Thompson’s Site

We Dudes & Design Float

I stumbled on two sites today that really struck me with their design.

WeDudes.com
WeDude.com Screenshot
WeDudes is a site dedicated to creating little versions of yourself or avatars. I’m really attracted to the fun cartoon style of the page. Not much else to say about this simple site as it is in a closed beta, though I would like to see more of it.

DesignFloat.com
DesignFloat.com Screenshot
This site is another Digg.com inspired social news site but with a focus on all things design. From all of the other Digg clones running on Pligg on the web, this one takes the cake for the best creative stylings. The idea of floating a story up to the top is a clever paradigm and the bright colors give it a fun, light feeling. I’ve added their NetVibes widget to my everyday reading list in case a good story rises.

Faveup - Inspiration For Designers Block

Faveup.com Screenshot

Everyone likes to look at pretty things, designers just get a little more involved. There are a host of design inspiration sites out there but Faveup.com divys their content up into logos, business cards, flash websites, and CSS websites; something for everyone. I love browsing through creative offerings and this site keeps my imagination going in the online side and the print side of things.

Retro Theater CSS Design

Retro Theater CSS by ERic Roge

The Retro Theater CSS design by Eric Roge is a perfect example of what can be done with a little creativity. The trick to pull this wffect off was using background images attached to several different extra divs to create the theater. The content is contained in a div with an ID of “container” then centered and set to a width of 450 pixels. Since the other theater elements need to stay in place when a user scrolls, their position is set to fixed which allows the movie screen to scroll without using an “overflow:scroll” on the container div. While it may seem like more work to make the screen scroll this way, the extra effort pays off with a more natural scrolling experience for the audience. No matter where the mouse is on a page the use of the scroll wheel will be consistent. The static seen flickering on the movie screen comes as an animated gif set as a background image on the container div.

I bet there was a lot of trial and error involved in developing this layout but the results speak for themselves. Eric did a spectacular job of capturing the feeling of an old retro theater. If this was a site for a movie theater or film festival the design would separate them from their competition while conveying their message in a unique and interesting way.