Seattle Seahawks Project

Well, I just finished up a pretty cool app for the Seattle Seahawks. They are unveiling their brand new Virgina Mason Athletic Center and needed a dynamic way to show off the new digs.

There was obviously a lot of time spent in Maya modeling the buildings and floors. I think if we had more time it would have been awesome to fully texture the building, but considering it’s mostly a slick way to navigate the building I’m still confident this gets the point across.

The information for all the rooms is powered by external xml documents giving them the ability to add/remove/edit their content at will. It’s all dynamic so no matter what they decide to add it can be accommodated without updating the Flash file. (Always a good end result for the developer). It pumps in text, pictures, and video in a tight easy-to-use package.

Stay tuned as I know they’ll be adding to it continually. Go Seahawks!

The brand new Virgina Mason Athletic Center

Posted in Flash/ActionScript, Web Design | Leave a comment

Oregon Ducks iPhone Wallpaper

Update:  I’ve got some new ones here that people seem to like more.

Here is a free Oregon Duck iPhone Wallpaper. Just right click and “save to computer.”

If anyone out there needs a different size just let me know in the comments. And I’ll try and get you a new one.

Go Ducks!

Posted in Misc. | Tagged , | 5 Comments

Market Watch: Flash Designers Stock Skyrocketing

"No, we can’t do that in Flash. We just won’t get good SEO."

"Actually Sir…we can and we will.”

I’ve had that line in my back pocket for years and I’m finally able to use it.  A couple days ago, ars technica announced that Google and Yahoo we’re developing the means to crawl all the lovely swfs out there.

“This announcement has been a long time coming, as Flash developers have been wishing for ways to make their content searchable for close to a decade. Adobe acknowledges this in its announcement, saying that although search engines are able to index static text and links within Flash SWF files, "[Rich Internet Applications] and dynamic Web content have been generally difficult to fully expose to search engines because of their changing states—a problem also inherent in other RIA technologies."

It will probably be sometime before the crawling of swfs is as effective as a traditional html page.  Initially, the spiders won’t be able to crawl pictures or video. The news is nevertheless extremely encouraging.

In the end, this is a huge win for Flash designers and developers. I would also predict the demand for these skill sets to rise considerably. There are no longer any excuses or explanations for why they had to go with the AJAX guy.

Posted in Flash/ActionScript, Web Design, Web Development | Tagged , , , , , , | Leave a comment

It’s okay to like root again!

This is semi old news, but with some newly found free time on my hands I figured I’d make mention of it. Back in the days of ActionScript 2.0 we all learned to hate _root. I suppose it had it’s place, but it was truly a fickle beast. Let’s look at the primary nuisance of _root.

Let’s assume that our Flash website starts with a GUI that houses all the navigation and other constant elements, but loads all the content from separate swfs. This tends to be a common practice because it offers an “On Demand” approach. In other words, we don’t piss off the user by loading 2mb of LOL cat pictures when, in fact, the user hates cats.

The problem begins here. Let’s assume that during development I decide to reference the _root timeline and evoke a stop();. This would be acceptable in the localized testing of this swf, but not when I’ve imported the swf into my GUI. In fact, it would tell the GUI timeline to stop();, in which case my slideshow of LOL cats would come to a screeching halt! Gasp.

Long story short… _root acted very much like an absolute address.

Well, the nice folks over at Adobe have decided to kill the evil bastard stepchild _root and introduce his much smarter and flexible brother root. Yay. Applause. Cheers. This version of root is now treated much more like a relative address. In our example that means that the root you reference during development will be the same root referenced even after having been loaded into the GUI.

Therefore, it’s okay to like root again.

Posted in Flash/ActionScript | Tagged , , , | 1 Comment

ActionScript 3.0 Cheat Sheets (Set 1)

I’m sure that many of us are the same and spend our designing/developing hours doing many different things. I would love to spend all my time in Flash, but my job demands that I get involved in many other areas and languages. Therefore, I’ve always had flash cards (no pun intended) at the ready, to remind me of a few simple lines of code. Now, I’m giving them to you.

These may not make sense to anyone else, but they help me out whenever I sit down to do a new project and need to brush the dust off my ActionScript knowledge. Please note that these are not comprehensive and there is obviously a googillian things missing. (I believe a googillian is the net worth of Google) These just happen to be things I type over and over again and like to reference quickly.

In the future I think I’ll create more sets of these and provide some clearer form of organization. Use these for now and if you like let me know. I should note that these are formatted to be printed on 4×6 index cards. Happy ActionScripting!

Sidenote: I got a triple kill with the gravity hammer last night in Halo. I’m pretty proud of that.

Posted in Flash/ActionScript, Web Development | Tagged , | 3 Comments

How to Define a Fill Pattern in Photoshop (CS3)

Let’s talk about fills. You probably already know about solid fills and gradient fills in Photoshop, but it seems a far underused fill is the pattern fill. With the ability to customize and create your own fills you have an awesome tool at your disposal for just about anything requiring a repeating texture. I predominantly use them as subtle backgrounds and often on websites. Let’s take a look at how they’re made. (Hint: It’s really easy)

Step 1

First, I want to point out that we’re not going to be making anything revolutionary here. Unless you consider a bunch of dots mind-blowing. This tutorial is to show you how to create your own patterns. That being said, let’s begin.

The first and most obvious thing to do is determine what type of pattern you are looking for. Snowflakes, dots, or diagnonal scan lines are all examples of patterns that can be repeated. For the sake of simplicity we’ll just make a pattern of dots. Yay.

Step 2

Create a scaled version of your pattern. Unless you are able to visualize what a repeating pattern will look like when it’s cut up you probably want to start with a working version first. Here’s an example:

Start by planning out your pattern

Here we’re simply going for a pattern of dots that will just repeat itself indefinitely. Notice how I used guides to define a perfect square. This is important for correctly aligning your repeating elements. It will also be helpful later when we crop our pattern.

Step 3

Now that we know what pattern we are going for, we need to crop our pattern into its repeating form. As I already have the guides setup, I’ll just be using the inner sqaure for the crop. The following image shows the result of the crop.

Result of a sqaure crop

Needless to say, if you were to just copy and paste this image in both the x and y directions you would end up with a repeating pattern. Yay!

Step 4

Now that we have our desired shape we need to define the pattern within Photoshop. To do this go to Edit > Define Pattern…

You will be asked to name your pattern, call it “Dots” or something that makes sense to you. Finally select OK.

Step 5

Believe it or not you’re done. You now have the pattern you created at your disposal. In order to use it you need to select your paint bucket in the toolbar or press “G” on your keyboard. Once you do that you’ll probably need to change the fill selection from Foreground to Pattern.

Choose pattern instead of foreground

Once you’ve done that you just need to to fill in a layer just like you’ve done a thousand times before in Photoshop. Feel free to try creating your own patterns. This tutorial just brushes the surface and shows the technical side of defining the pattern. I’ll leave the imaginative possibilities up to you.

Posted in Photoshop, Photoshop | Leave a comment

Initial Styles Sheet (Including Browser Reset)

When I was first diving into web design I was always curious as to how other people laid out their styles sheet. Was there some magical formula that everyone was using? Is there an industry standard that I should be following? I can’t say that I’ve ever seen one common way of doing it, but I’ve definitely nestled down into a format I like.

Skip the rest of the jibber jabber and download my CSS file.

First Things First

One of the best things a developer can do is perform a browser reset. The theory behind doing this is to start on an even playing field. Common browsers like Internet Explorer, Firefox, and Safari all interpret default elements in their own ways. Therefore, a method is needed to to clear these.

I prefer Eric’s reset over at www.meyerweb.com. I’m comfortable with what it does and it seems to do a damn good job of resetting. Feel free to use your own reset if you have one you prefer.

The Basics

The rest of the styles sheet is pretty self explanatory. I just comment out the major sections based on the following categories:

  • Imports – import any external styles sheets
  • Layout – all structural elements that form the layout of the page
  • Lists – I personally like to separate these from the layout section because there are often so many
  • Navigation – all styles pertaining to navigation features
  • Typography – all type including color, size, and even links are defined here

I’ve seen more extensive layout methods that include alphabetizing your elements, but for most smaller sites this organizational method works for me.  Also remember that (command+f) or (control+f) is your friend. Don’t sort through hundreds of lines of code when you can search for it much quicker.



Posted in Web Design, Web Development | Tagged , , , | Leave a comment

Setup Assistant Infinite Loop

This is just too scary not to write a post about. I was recently installing some OS updates on my Mac Pro when I experienced the “Setup Assistant Infinite Loop” bug. I had manually restarted the Mac Pro after it hung when trying to install updates and was presented with the Setup Assistant. This is the dialogue box you get when you first setup your computer. Yikes!

My initial thought was…crap…I just lost everything. Have no fear folks, there is a solution. :)

I can’t take credit for the solution, but I can confirm that it works. I found it in the forums over at AppleInsider. Here’s what you do:

  • Boot into Safe Mode by holding down the shift key upon boot. (You have to hold it down for a long time. Several minutes)
  • Do not log in
  • Hit the back arrow key
  • Then hit the restart button
  • Wait, it will then run or rerun the updates
  • Wait and wait and wait and it will finally restart

You should be back to normal without any data loss. Now go out and buy a secondary hard drive and get Time Machine up and running just in case something like this happens again and it doesn’t go so well.

Posted in Computers | Tagged , | Leave a comment

CD/DVD Tray won’t stay open!

I went to go put in a CD to my Mac Pro the other day and I couldn’t get the CD/DVD tray to stay open. I’d press down eject, the tray would pop out, and then it would immediately suck back in. What the heck?

I debated trying to quickly insert the cd in before the tray would close, but eventually decided against it. I’m not sure what triggered the thought, but I took a look at Parallels which was running on my machine at the time. It turns out OSX and Windows were dueling with each other over the drive. OSX was strong enough to eject the drive but lacked the stamina to keep it open.

The Fix: Easy. Just disable the drive in Parallels. I haven’t done any further investigation as to whether the two can coexist and share the drive. That, my friends, is for another day.

Posted in Computers | Tagged , | 1 Comment

Paragraph Margins

In keeping with my theme of posting small quirky things in hopes that it helps someone in a mad Google search fest, I say to you this… You must define paragraph margins when creating your WordPress theme. Otherwise, all you get is one huge block of text. Of course, you should always define your <p> margins anyways. But, if you’re a little lazy like me sometimes and happen to forget, you’ll end up with one large body of text. Yuck! For those not all too familiar with CSS your paragraph style might look something like this.

p {
      color:#000000;
      font-family:Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px; (or em's, whichever you prefer)
      margin: 0 0 20px 0;
   }
Posted in WordPress | Tagged , , | 3 Comments