Pure Awesomeness

Inspirational Video for all Artists

November 22, 2011 by Greg | 0 comments

Made by Hand / No 2 The Knife Maker from Made by Hand on Vimeo.


Matthew Abersold shared this with our web design group on Facebook, and I thought I would share it as well. This is a super inspirational video about never giving up, always giving your best, and never settling for okay. Hope this inspires you, me, and him too to get up and put in the work and effort to make something this world appreciates

QueryLoader – Preload your website in style

November 19, 2011 by Greg | 0 comments

QueryLoader 2 - Preload your images in style

QueryLoader 2 - Preload your images in style

There is always a minor problem when it comes to preloading image on a website. Nobody really has a full solution for it. There are a lot of preloaders available, but most of the time they only display the words: “Loading page” or have an animated image that spins. Why can’t there be a nice loading bar of some kind?

I’ve gotten a few request on how to make a preloader, or people asking me how to get all the images of a web page and preload them (even the images in CSS).

This preloader has it all. Loading bar, custom animations and getting all images included in the web page.

A direct link to the zipfile:
https://github.com/Gaya/QueryLoader2/zipball/master

View the example here:
http://www.gayadesign.com/scripts/queryLoader2/

What QueryLoader2 does is simply scanning the given elements for images (and background images) and preloading them before the website is visible.
This version has been modified to make it easier for users to implement (especially those who are already into jQuery.)

QueryLoader currently works with jQuery v1.6.4 and in IE version > 7, Chrome, Safari and Firefox.

Written by the folks over at gayadesign.com

Parallax Scrolling

November 18, 2011 by Greg | 0 comments

Video games often use parallax scrolling technique to create an illusion of depth by moving multiple layers of images at different speed. This technique can also be applied in web design. This post consists a list of mind blowing parallax scrolling sites, design tips, and resource tutorials. If you are considering to start a parallax scrolling site, this is a must read post.

Nike Better World

Nike Better World is probably one of the early sites who started this parallax scrolling trend. Still looking good.

 

Nike Better World

Nike Better World

 

Smart USA

As you scroll down the Smart USA site, the elements zoom to you. What is really impressive is they managed to maintain the similar look and feel in their mobile version. Most parallax scrolling designs don’t play well on mobile devices. Having a separate version is a smart idea.

 

Smart USA

Smart USA

 

Ben The Body Guard

Although the perspective seems very wrong (it doesn’t feel like a bird’s-eye view) on Ben The Body Guard, but having a character and trian runs across the scene is pretty cool.

 

Ben The Bodyguard

Ben The Bodyguard

 

Laurentius

I don’t understand Dutch, but browsing on Laurentius site was very enjoyable. You can scroll through the slideshow with mouse scroll wheel, scrollbar, navigation buttons, or arrow keys. I particularly like the slide between 4 & 5 where the butterflies flew out the scene randomly.

 

Laurentius

Laurentius

 

Mario Kart Wii

Mario Kart site gives you the same kind of experience as if you were playing on the Wii. It is fun to see the carts move on the track. Notice when you try to scroll down on the last slide or scroll up on the first slide, the graphic elements shake to create the effect of braking.

 

Mario Kart Wii

Mario Kart Wii

 

Moods of Norway

Moods of Norway truely depicts the beauty of a city line in a parallax scrolling tour. It takes you from the country side to the urban city in different lighting and season. I thought it is a travel site, but it turns they are a product site (LOL). Don’t forget to check the site on your iPhone. It displays a sweet message when you are viewing in portrait mode. You can swipe through the scenes in landscape view.

 

Moods of Norway

Moods of Norway

 

Art of Flight

Like the Mario Kart site, Art of Flight provides the same experience as if you were flying in a helicopter. It gave me a headache (in a positive way) from watching the elements flying around the scene. Very well done!

 

Art of Flight

Art of Flight

 

Smokey Bones

Beside the parallax scrolling on Smokey Bones, I like the bottom of the site where you can break the balls and play pool (well, sort of).

 

Smokey Bones

Smokey Bones

 

BeerCamp

BeerCamp doesn’t have the stunning images like most of the parallax scrolling sites, but it is very well executed. Everything is laid on the screen. As you scroll, the design zoom in layer by layer.

 

Beer Camp

Beer Camp

 

Beetle

Make sure you are on high speed connection to check the Beetle site because it is very graphic instense. The scrolling at the beginning is put together with image by image like keyframe animation.

 

Beetle

Beetle

 

New Zealand

The scene design on the New Zealand site is breath taking — beautiful and high resolution imagery. However, this beauty costs some load time and graphic resources.

 

New Zealand

New Zealand

 

Activate Drinks

Among all the sites on this list, I think Activate Drinks has the best pre-load idea. First it shows you a nice loading animation and then the cap on the bottle starts turning as you scroll.

 

Activate Drinks

Activate Drinks

 

Gidsy – Making the Perfect Listing

This “Making the Perfect Listing” page is nicely put together with just basic color and shapes. Scroll and watch the shapes merge together.

 

Gidsy - Making the Perfect Listing

Gidsy - Making the Perfect Listing

 

Things to Consider

If you are thinking to design a parallax scrolling site, here are some factors you should consider:

  • Preload the graphics: if your design is very graphic instense, preload the graphics before loading the site. This will give the user more seamless experience.
  • Mobile devices: pay extra attention to mobile devices because users might not get the same experience as the desktop browsers.
  • Viewport sizes: be sure your scene works on various viewport sizes (small, medium, large).

Tutorials

Here are some tutorials that you might find useful:

Free iPhone 4s

November 18, 2011 by Greg | 0 comments

This is for real. The folks over at Web Design Ledger are giving away an iPhone 4s and 10 copies of Steve Jobs Biography.

From Web Design Ledger:

Today we have an awesome giveaway from our friends at MightyDeals.com, a platform that offers the best deals on products and services for web professionals. Their deals are really good and highly discounted (sometimes as much as 90% off the retail price).

In this giveaway, you have the chance to win 1 of 10 great prizes, with the first prize being an iPhone 4S (the contract free unlocked model directly from Apple) – shipped to your door, as well as a copy of Steve Jobs’ biography, by Walter Isaacson.

The other 9 winners will receive a copy of Steve Jobs’ biography.

Go here for more details on how to participate in this amazing contest!

 

Here is a bit of information about the prizes:

 

iPhone 4S

 

Free iPhone 4s

Free iPhone 4s

 

iPhone 4S is quick and responsive, which makes all the difference when you’re launching apps, browsing the web, gaming, and doing just about everything.

It sports a dual core A5 chip, with all new 8MP camera and options. iOS5 and iCloud and with personal assistant Siri. Model provided is 16GB, with option to choose black or white models (pending availability).

This is the UNLOCKED model, which is free of any contracts and works on any GSM network worldwide. Includes free shipping to anywhere in the world. Worth $649. Option for the winner to choose the black or white version. Read more about iPhone 4S

Steve Jobs by Walter Isaacson

Steve Jobs Biography

Steve Jobs Biography

Based on more than forty interviews with Steve Jobs conducted over two years, as well as interviews with more than a hundred family members, friends, adversaries, competitors, and colleagues, Walter Isaacson has written a riveting story of the roller-coaster life and searingly intense personality of a creative entrepreneur.

Although Jobs cooperated with this book, he asked for no control over what was written nor even the right to read it before it was published. He put nothing off-limits. He encouraged the people he knew to speak honestly. And Jobs speaks candidly, sometimes brutally so, about the people he worked with and competed against. His friends, foes, and colleagues provide an unvarnished view of the passions, perfectionism, obsessions, artistry, devilry, and compulsion for control that shaped his approach to business and the innovative products that resulted.

Important:

  • The unlocked iPhone includes all the features of the iPhone, but without a contract commitment. You can activate and use it on the supported GSM wireless network of your choice. Please note that it will NOT work with CDMA-based carriers. If you are with a CDMA-based carrier (such as Verizon or Sprint in the US), you will have the option to receive a payment of $649.
  • iPhone and books will be sent free of charge to all winners pending availability.
  • Customs or local taxes remain the responsibility of the winners.
  • Contest void where prohibited by law.
  • Apple, Inc. is not a part of this contest or endorsing it in any way or form.

My 30th Birthday!

November 14, 2011 by Greg | 0 comments

Greg Brumann's 30th Birthday Party at The Taphouse & Lucky Strike

30th Birthday Party at The Taphouse & Lucky Strike

So I am turning 30… and it is going to be awesome. First of all my amazing girlfriend, Michelle, is going to fly in from Indianapolis 2 days before hand, and leave 2 days after. So it really can’t get any better, but it looks like it is going to. Saturday night we are going to all meet up at The Taphouse in Bellevue, enjoy a good dinner and some awesome beers, afterwards we will head up to Lucky Strike for some dancing and bowling. I am not sure who is DJ’ing, but they usually have a solid DJ.

HOPE TO SEE YOU THERE!

For more information leave a message on here, or contact Me at 360.632.0757 or Michelle at 765.606.1775

You can also view the Facebook Event here

Rooster Down Tattoo Gallery Urban Arts Festival Poster

November 14, 2011 by Greg | 0 comments

Rooster Down Tattoo Gallery Presents The Urban Arts Festival

Rooster Down Tattoo Gallery Presents The Urban Arts Festival

I typically don’t post my work on here, but I figured I would share this piece, since it is for an event that my friends of at Rooster Down Tattoo Gallery (RDTG) are putting together. RDTG just opened an EPIC gallery in Ballard, it has like 8 private tattoo rooms, 2 different lounges, and a lot more – even if you aren’t into tattoo’s you will be impressed by their new gallery.

About the event:

Who: Oldominion feat. Grayskul & The TH3RDZ, Nacho Picasso, Feezable The Germ

What: Urban Arts Festival Presented by Rooster Down Tattoo Gallery

Where: Cowgirls Inc. 421 1st Ave S. Seattle, WA

When: November 23rd, 2011, at 9:30PM

Why: Celebration of Rooster Down Tattoo Gallery opening a Ballard location

 

Additional Sponsors: GBPro.net, Rich Kids Clothing Brand, Paul Marie Clothing, and Town Sound

Learn Javascript

November 14, 2011 by Greg | 0 comments

JavaScript (JS for short) is the programming language that enables web pages to respond to user interaction beyond the basic level provided by HTML links and forms.

This tutorial from Mozilla is great. It has in-depth instruction for Introductory Level users, Intermediate Level users, and Advanced users. You will likely learn something from all of them, and I highly recommend doing all of them. JavaScript is an essential tool for you to get a job in this industry, and this could really help you up your JavaScript skills.

If you want to read more, and learn more head on over to the Mozilla Developers Network

Bootstrap, from Twitter

November 7, 2011 by Greg | 0 comments

Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. It includes base CSS and HTML for typography, forms, buttons, tables, grids, navigation, and more.

History

Engineers at Twitter have historically used almost any library they were familiar with to meet front-end requirements. Bootstrap began as an answer to the challenges that presented. With the help of many awesome folks, Bootstrap has grown significantly.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Safari, Internet Explorer, and Firefox.

Tested and supported in Chrome, Safari, Internet Explorer, and Firefox

  • Latest Safari
  • Latest Google Chrome
  • Firefox 4+
  • Internet Explorer 7+
  • Opera 11
What’s included

Bootstrap comes complete with compiled CSS, uncompiled, and example templates.

Übermind

November 1, 2011 by Greg | 0 comments

Übermind

Übermind

Today I had the pleasure of hearing Kim Morgan speak about Übermind and what they do. Übermind is a brilliant Seattle based company, that specializes in pretty much everything. Seriously, they live up to their name, they WANT to see your project through each and every step.

Übermind is the world’s leading agency for mobile and emerging technologies.They have grown by over 200% since they first started in 1999 with a mere 7 employee’s. They now have a Denver based office, also.

This year Übermind was named a “Best Place to Work” by Advertising Age in August, and CEO Shehryar Khan was named one of “40 Under 40” by the Puget Sound Business Journal in July. Khan wants to spread the word that Übermind is “always interested in meeting with talented individuals who can contribute to the company’s mobile mission,” iOS, Android, and UX engineers in particular.

Think you got what it takes? Visit www.übermind.com/careers