Playground Blues feed

A Masterpiece by Massimo Vignelli

Wed, 06 Aug 2008 21:28:16 -0000

I conclude that I am no longer a graphic designer, but an information architect, and from now on that is how I will describe the meaning of my work and the scope of my activity.

Amen.

For me, to be an information architect means to organize information in a way that is essentially retrievable, understandable, visually captivating, emotionally involving, and easily identifiable. Information should be semantically rooted, syntactically correct, pragmatically efficient. It doesn’t work otherwise.

Amen.

Comment

Vincent Bugliosi, who prosecuted Charles Manson, appears before the House Hearing on Limits of Executive Power.

Sat, 26 Jul 2008 06:14:13 -0000

On December 9, 1998 a previous House Judiciary committee issued four articles of impeachment against President Bill Clinton for doing something infinitely less significant than what the evidence shows the Bush Administration did in this case. Indeed it is a calumny, a slander of the highest rank to even talk about them in the same breadth on the same page.

Robert Wexler of Florida has some passionate words as well:

Our government was founded by a delicate balance of powers, whereby one branch carefully checks the other branches to prevent a dangerous consolidation of power. The actions of this White House have eviscerated this careful balance. This is not a Democratic or Republican issue, this is an American issue. Without these checks and balances a president can run ruff-shot over any law with impunity. Congress must end this disturbing pattern of behavior.

Comment

Update to Playground Blues RSS feed.

Sat, 26 Jul 2008 01:48:46 -0000

I'm trying something new with my RSS feed. Most of you are subscribed to the 'posts' feed and I've decided to add what I'm calling long-form bookmarks.

These bookmarks will only show up in the /posts/ feed and tumblelog. They will not show up in my Del.icio.us feed.

Carry on.

Comment

Gadget fast

Fri, 18 Apr 2008 20:17:59 -0000

My iPhone and laptop will be unplugged starting Friday evening for two days. I’ve let the fog of distractions generated by these two devices grow too thick so for the next few days (much like China) they’ll be turned off.

It doesn’t stop there. The following week Twitter, Flickr, an my feed reader will be muted. I have nothing against these services, but it’s time to step back and take the pulse of things around me and see if I’m missing something.

I used to do more gadget/service fasting and I’m well over due. My plan is to do some brainstorming for a few projects currently on my plate and catch up on some reading, but more importantly, spend time with my girlfriend.

See you all next week!

Comment

Capistrano rules

Tue, 18 Mar 2008 04:03:38 -0000

I’ve grown tired of committing changes to my subversion repository, logging into my server, updating my live checkout, and restarting python processes. I finally decided to implement Capistrano and eliminate this repetition.

Here are my repetitive set of commands:

$ ssh playgroundblues.com
$ cd ~/projects/playgroundblues
$ svn up
$ cd ~/www/playgroundblues.com/www
$ touch django.fcgi

Now, with the help of Capistrano, I just type:

$ cap deploy

You’ll first need to install Capistrano which is as simple as gem install -y capistrano. Once that’s complete you need to create a “capfile” which is where you’ll define your tasks:

task :deploy, :hosts => "username@playgroundblues.com" do
  run "cd ~/projects/playgroundblues; svn up; cd ~/www/playgroundblues.com/www/; touch django.fcgi"
end

The above will vary depending on your host and directory setup. After you save the above file and as long as you’re in the directory where the capfile resides you can, in the terminal, type cap deploy and Capistrano does the rest. Bliss.

Comment

Aspen Simulator

Fri, 14 Mar 2008 02:36:39 -0000

As much as I’d like to blog about my trip to Austin and SXSW last week I’m just too excited over the iPhone SDK goodies that dropped last Thursday.

You may be asking yourself, “he’s a web guy, why does he care?” Well, there happens to be a beautiful gem tucked away called the Aspen Simulator.

This is a complete pixel and functionally perfect replica of the iPhone and it’s fantastic for testing web apps. Before I was spending a lot of time back and forth between my iPhone and my desktop but since this thing is so identical I really don’t have to own an iPhone (but I will anyway).

It’s a little hard to find, but after installing the developer tools look under / Developer / Platforms / AspenSimulator.platform / Developer / Applications.

A few tricks

If you want to do a two finger zoom just hold down the option key while click dragging. You can also rotate the the phone by using the command key and right left arrows. To lock the phone press command L. Still try to figure out how to do a two finger scroll.

Comment

Ah-ha Event Delegation

Thu, 06 Mar 2008 03:38:20 -0000

Wrapping my head around things like OOP took months. It’s not because I’m an idiot (I don’t think) - it’s just because I needed all the explanations to marinate before having an ah-ha! moment.

I had an ah-ha today, with regards to Event Delegation. I’ve never seemed to completely understand events, yet I use them all the time. They’re an essential aspect of Actionscript and Javascript and there are two basic ways of capturing events, Event Handling and Event Delegation.

Most of us, whether we realize it or not, are familiar with Event Handling. Imagine we have an unordered list with a class name .nav and each item has a link. For this example, I’m going to use jQuery, so if you wanted to call a javascript function when the user clicks a link in the list, you’d do the following:

$('.nav a').each(function() {
    $(this).click(handleClick);
});

function handleClick(event) {
    // fun stuff goes here
}

If you’re jQuery savvy, the above code should be familiar. We’re looping over all the anchor tags within the unordered list and assigning the function “handleClick” to the click event. Each time someone clicks a link, “handleClick” is called and the anchor tag is in the function scope. This is Event Handling.

Event Delegation makes things a little simpler by eliminating the need to loop over every anchor tag. We simply apply the click event to the unordered list like so:

$('.nav').click(handleClick);

Since the click event is registered with the unordered list, it gets fired off when anything inside the list is clicked. The scope of the handleClick function is set to the <ul> but if you want to target the anchor tag below the mouse click, you use event.target. This is Event Delegation.

Both are very powerful but in most instances Event Delegation is going to require less code while boosting performance. Many thanks to Jacob for making this ah-ha moment possible.

Comment

Going mobile

Mon, 18 Feb 2008 17:17:06 -0000

Over the weekend, I decided to whip up a mobile (iPhone) version of Playground Blues. I walked into Broadway Cafe around 3pm on Saturday, and by 5:30, I had m.playgroundblues.com. Here’s how it went down.

Step 1

Since I’m still using Dreamhost and FastCGI, I created my .htaccess file along with my dispatch.fcgi file for my new sub-domain as usual. Made one little change to my dispatch file: instead of having DJANGO_SETTINGS_MODULE pointing to playgroundblues.settings, I pointed it to playgroundblues.settings_mobile.

Then, in my project folder, I made a duplicate of my settings file and renamed it to settings_mobile.py. Let me emphasize again, this is a duplicate.

Step 2

Created a new templates folder and named it “templates_mobile.” Opened up my settings_mobile.py file and added a new line to the top of my TEMPLATE_DIRS tuple. This tells Django to first look in mobile templates, and if the template doesn’t exist, fall back on regular site templates. (Remember, this is only for my mobile site.)

TEMPLATE_DIRS = (
  "/home/playgroundblues/templates_mobile/",
  "/home/playgroundblues/templates/",
)

Step 3

In my new templates_mobile folder, I created a new base template called “base_mobile.html” which I’ll use to extend in all my child templates instead of the main sites base.html. Then I went through the sites pages and recreated mirrored templates in the mobile folder. So /templates/blog/post_detail.html was overwritten by /templates_mobile/blog/post_detail.html. I stripped out extraneous content that was unnecessary for someone on the go, leaving core content and functionality.

The nice thing is if someone happens to creep into a section that you haven’t gotten to (as long as you didn’t override base.html), your site will display as it would on a computer proper. If there’s a more succinct way of doing this, please let me know.

Comment

iPhone bookmark iconage

Wed, 16 Jan 2008 03:39:53 -0000

If you’re wondering how to control the icon that gets generated for your webpage with the new 1.1.3 iPhone release, look no further than Apple’s iPhone Dev Center.

Apple has added a section called “Create a WebClip Bookmark Icon” and it calls for a 57x57 pixel icon. After some testing today I’ve concluded this recommended sizing results in a fuzzy icon, largely due to the iPhone being a 163 ppi display.

Instead of sticking with the recommended sizing I bumped it up to 158x158. When this gets scaled you’ll be left with a crisp icon that sits nicely amongst Apples crisp icons. Onward.

Comment

Django Basic Apps

Sun, 02 Dec 2007 15:45:28 -0000

I’ve been working on abstracting some Django applications from past projects so they can effortlessly be plugged into future projects. I hate writing the same blog application repeatedly, so this is an attempt to make life easier. I think this will be a fun, little suite of plug-n-play Django apps that everyone can benefit from.

I’m calling this suite Basic Apps with the hopes they’ll live up to their name. They’re freely distributed under the New BSD License and hosted at Google Code. The goal is to use the month of December to get feedback from everyone and finalize the models, so beware of model changes.

The apps I’ll be introducing today include Basic Blog, Basic Places, Basic People, Basic Library, and Basic Profiles. Before you run off keep in mind these are basic apps. You won’t see anything earth shattering. The idea is to be simple and pluggable so when it comes time to add a blog or user profiles to your project you’ve got a jumping off point. That said, I’d like to provide a brief description of each app:

Basic Blog

This is a blog, nothing more nothing less. There is a Post model and a Category model. The dependancies include Django Comments and Django Tagging.

Basic Places

This app stores place information, (gasp!) The models include Place Type, City, Point, and Place. Django Tagging is the only dependancy.

Basic People

This app stores people information. (you’re kidding!) This app has nothing to do with Users. The people that go here are individuals that will never have access to your project. It is used heavily with the library app. The models include Person Type and Person.

Basic Library

This actually contains three apps: Music, Movies, and Books. All three are independent and should be placed independently in your PYTHONPATH. Movies has one model, Movie. Books has two, Book and Publisher. Music has Label, Band, Album, and Song. All three depend on the Basic People app. They all have a Genre model to boot!

Basic Profiles

This app extends the Django User app, providing added user information. The models include Profile, Mobile Service, Link, Service, and Service Type.

All of these apps need Python 2.4 or higher and Django 0.97 or higher. If you have any feature requests or notice any issues please create a ticket on the corresponding Google Code site using the Issues tab. I’ve also started a Django Basic Apps discussion over at Google Groups. Now, let’s build some shit.

Comment

Make Flash and Javascript Sing

Sun, 18 Mar 2007 20:48:08 -0000

Yes its true. You can make Javascript and Flash play together! Way back in 2005 the company formerly known as Macromedia threw together a nice little kit to make these two languages play nicely. Here’s how.

First we need to secure some crutial files. The first is a SWF called JavaScriptFlashGateway.swf which allows us to setup a “proxy” between our Flash and Javascript. Second, make sure you link up JavaScriptFlashGateway.js. Third, put JavaScriptSerializer.as and JavaScriptProxy.as in your Actionscript class path so you can import them into your Flash movies.

Once all that is in place it’s time to write some code. For this example I’m going to make a ball move across the screen using two input fields in an HTML form which will allow a person to enter X and Y values to move the ball across the screen. Before we can get any further we need establish an ID so things are nice a secure between our Flash and Javascript. We’re going to use the current time as our ID like so:

var uid = new Date().getTime();
var flashproxy = new FlashProxy(uid, 'JavaScriptFlashGateway.swf');

Now lets add some code to our flash movie. In the first frame add:

import JavaScriptProxy;

var Ball = {}
Ball.moveBall = function (p_x:Number, p_y:Number) {
    ball_mc._x = p_x;
    ball_mc._y = p_y;
}

var proxy:JavaScriptProxy = new JavaScriptProxy(_root.lcId, Ball);

We’re simply importing the JavaScriptProxy class and creating a Ball class. The Ball class gets a method called moveBall which is what we’ll call via javascript. Notice the JavaScriptProxy is passed our ID that we created earlier and a reference to the Ball class.

Lets turn back to our HTML file and add some more Javascript to complete the deal.

var tag = new FlashTag('flash/ball.swf', 400, 350);
tag.setFlashvars('lcId='+uid);
tag.write(document);

function move_ball () {
    var x = document.moveball.x.value;
    var y = document.moveball.y.value;
    flashproxy.call("moveBall", x, y)
}

Here we’re using the handy FlashTag class to embed our ball.swf into our page. We’re also passing the ID we created earlier, very important. The move_ball function is what we’ll call upon submission of the HTML form. It uses the flashproxy instance to call our Actionscript method “moveBall” passing it the x and y coordinates into the SWF thus moving the ball.

Hope this makes a little sense. The code can be downloaded here or you can just look at it here. I’ve also created another example that utilizes a Flash video player and playlist. You can also call Javascript functions from within your Flash movie. There is one gotcha that I’ve come across in order to do this. Be sure to set the Flash parameter allowScriptAccess to “always”. Otherwise communication from Flash to Javascript won’t work.

Comment

The waves of creativity

Sat, 17 Mar 2007 20:48:47 -0000

There are a lot of environmental factors that go into fostering a creative environment. As creative persons mature, we become more in-tune with what works best for us when it’s time to dream up new ideas and solutions. Some of us trek to coffeehouses while others listen to Bach, Satie or Mogwai. Whatever we do we’re all essentially trying to achieve a certain state of mind.

Before I go any further here is a quick explanation of the human brain by neuronal scientist, Richard Restak:

The adult human brain weights about three pounds and consists of about 100 billion nerve cells or neurons along with an even greater number of non-neuronal cells called glia (in Greeg, glia means "glue") interspersed among the neurons. The neurons are responsible for the communication of information throughout the brain.... The cerebral cortex contains about 30 billion neurons linked to one another by means of a million billion neuronal connections called synapses. ...each neuron is no more than two or three degrees of separation from one another.
Mozart's Brain and the Fighter Pilot page 2

My very basic understanding is that synapses are essentially electrochemical connections that vibrate at varying frequencies. These frequencies can be measured and grouped into four different categories: Beta, Alpha, Theta and Delta.

By now you’re probably wondering what the hell does this have to do with creativity. Well let me quickly explain these four “states of mind.” Beta is the frequency we find ourselves in all too often. It’s associated with being tense, alert, or afraid. Alpha is a state of relaxation without the loss of awareness. Theta is a day dream state and Delta is a state of unconsciousness, a sleep state.

When we seek out our ideal creative environments we are essentially trying to lower our brainwaves from Beta to Alpha. This takes time and cannot be done instantaneously. We can immediately go from Delta to Beta but not vise versa. We have to be someplace familiar where we feel safe and secure. A place were we can let our guard down.

Certain types of people exist in a constant state of Beta, some job types require it. When you intermingle Beta’s with Alpha’s and Theta’s you undoubtedly create a source of tension. This is because the Beta’s set the tone for the room and raise everyone to their frequency. This is why you rarely see sales and account management mixed with designers and illustrators.

Environment is worth more than any salary. I think most designers would agree when I say I’d much rather be making peanuts at a Googleplex than six figures at Joe’s Banner Ad Emporium.

More info can be found here:

Disclaimer: I’m no scientist. I just think this stuff is interesting and worth spreading. Correct me in the comments if necessary.

Comment

Not so convergent

Wed, 14 Mar 2007 19:21:18 -0000

Talking about “convergence” is like talking about “the war on terror.” They’re two incredibly broad terms with unforeseeable outcomes. Convergence has been vogue for a while and I’m a little skeptical about its usage to describe media convergence. At this years SXSW, for the first time, someone summed up what I’ve been trying to understand.

When I think of convergence I do so in terms of the classic media outlets converging with the Internet. There is a lot of convergence rhetoric at my job and in the field of news. Advertising is also experiencing the pains of understanding what the web is and how to leverage it. Convergence seems more like a trojan horse to me, creeping into peoples minds making them think it will deliver harmony between old and new. It’s just not true.

Its not about media convergence. I love that idea, it's something you listen to along time. I don't know how many guys in the movie business and TV business are always telling me that some day the Internet will grow up and be more like TV and movies which are real businesses, unlike the Internet. You know they don't converge. Broadband eats everything. It eats the living daylights out of it.
— Bruce Sterling

While old media tries to “converge” over the next few years we’re going to see more Salon’s, Newsvine’s, and Digg’s take over. They’ll do so because they don’t have to change old minds. The Google / Viacom battle will be nothing short of entertaining. This is how the old always dies off, clinging to what they know and understand.

Comment

RIP Print

Mon, 11 Dec 2006 23:19:11 -0000

Print is about to die and we better prepare ourselves. I was doing some christmas shopping last week and stumbled into a Sony Style story. I’m not a fan of the Sony brand but they do seem to come out with some daring devices. The first thing that struck me was the Sony Reader.

The Sony Reader is basically a very thin screen that uses E-Ink technology to display text and basic graphics. The resolution is shocking, it’s like staring at a piece of paper. The device has a lot of problems and the operating system is pretty clunky and locked down but you can tell this is the beginning of something.

One thing is for certain, this dawn of reader devices will kill print. They will get vibrant colors, more responsive interfaces, and durability. You can bet other companies are developing their own devices and this is the end of the road for print and it’s so exciting.

Comment

The Future Role of Libraries

Tue, 21 Nov 2006 02:59:51 -0000

If Libraries want to stay relevant they have to redefine their role in communities. The common perception is they have books, lots of books. This is obvious. Over the last decade the perception has grown to include internet access. However, this isn’t enough to survive. If you live in a progressive town like myself, WiFi is ubiquitous. When the Library is competing with Henry’s Coffeehouse, well, I don’t need to tell you who wins.

In the next half decade we’ll most likely have access to any book imaginable through the use of a single device. Whether we like this idea or not it will at some point replace the role of the book. Books have lived a long life when compared to the Music medium. Music has been on a steady pace of evolution from vinyl to eight track to cassette to CD and now digital. Digital seems to be the evolutionary end because it’s intangible. Google is hard at work scanning the Worlds books which are longing for a digital resting place.

Do Libraries become insignificant when digital books reach a tipping point? Not unless they transform their role as repositories of knowledge to places of gathering. Nothing can replace face to face interactions. When we gain knowledge we ultimately seek understanding.

When Open Source infected the programming world it became one of the most significant movements in history. The speed with which we’ve created the Information Age would not have been possible without this movement. If Libraries applied the Open Source philosophy to Education they could usher in the dawn of a new age, The Age of Education. This could rival some of the best Universities. This wouldn’t be a normal teacher/class education. The books would be our teachers. People would roam the halls seeking other people. Understanding would be gained through discussion and debate. Some of us would travel long distances to Libraries famous for their people and discussions.

For centuries Libraries have been entrusted with housing knowledge. That trust is quickly being handed over to the Internet. Libraries now have the opportunity to be handed the trust of understanding.

The preceding was sparked by some plans I saw for a new Library to be built in my town of Lawrence, Kansas. The design feels so open and welcoming with its huge windows and roof top gardens. It has a sense of curiosity with it’s inconsistent fourth floor appearing to look in a different direction than the other floors. It feels like a place I would go to have conversations and seek understanding.

Comment

Warming up to context.

Fri, 08 Sep 2006 20:48:39 -0000

Context can be described as, “the circumstances that form the setting for an event, statement, or idea, and in terms of which it can be fully understood and assessed.” Context plays an important role in communication and I’d like start by providing better context to posts.

You may have noticed a left column on my blog post pages. It now contains geo location information regarding where the post was written, categories it belongs to, links that exist within the post and photos that were taken on the day the it was published.

What does all this mean?

The goal is to give posts an added level of meaning. In some instances I’ve noticed a correlation between photos and what I decided to write or maybe a location inspired a post. Sometimes it may not be as apparent but, if anything, it brings a little more life to information.

I’m planning on adding photos that correlate to the location pages once I have time to play with the new geo data in Flickr. I’d love to see other examples of this practice. Suggestions are always welcome.

Comment

Nothing In Disguise

Wed, 19 Jul 2006 20:48:19 -0000

A few Sunday’s back I was in a coffee house determined to work. Instead, I quickly fell into a dream state which is the plague of many Sunday mornings. I felt guilty about being so unproductive, but, I had no pressing deadlines, no urgent emails, no clients knocking at my door. Later that night I felt a surge of creativity and began painting, which got me wondering. Lets see what Brenda Ueland says:

Our idea that we must always be energetic and active is all wrong. Bernard Shaw says that it is not true that Napoleon was always snapping out decisions to a dozen secretaries and aides-de-camp, as we are told, but that he moodled around for months. Of course he did. And that is why these smart, energetic, do-it-now, pushing people so often say: “I am not creative.” They are, but they should be idle, limp and alone for much of the time, as lazy as men fishing on a levee, and quietly looking and thinking, not willing all the time.

It’s important to make time for nothing. It allows you to open your mind to thought you might not normally invite in. In a way, these moments cultivate our creative fields. When it’s time to harvest, ideas should be ripe for the pickings. Basically, the answers we arrive at are a result of past thought. Neglect these moments and you limit the quality of creative outcomes.

“Some 40 thousand (and counting) elementary schools have eliminated recess in favor of more time for academics,” says David Elkind. This is shocking. From what I recall, recess was the most rejuvenating part of my elementary day. “Our schools are now contributing to the suppression of curiosity, imagination and fantasy.”

As we get older we unknowingly loose touch with our creative side and our imagination. I remember looking at clouds and immediately spotting frogs, space ships or elephants. Now I have to concentrate to come up with anything. Making time for relaxing and dreaming is so important, if for no other reason than to look up and see a giraffe float by.

Comment

Broken Window Theory

Fri, 08 Apr 2005 19:38:30 -0000

Lately I’ve become a little obsessed with the “Broken Window Theory.” I was introduced to this theory by Travis and Charlie. Soon after, it began popping into my head at work, home, or while I was coding. Then I started noticing it in books and on the radio.

The theory is normally applied to urban decay and crime, however, it can be applied to almost anything. How did your apartment get so dirty? How did your code get out of control? Well, it’s all because of one sock, one poorly placed if statement, or one broken window.

One broken window, left unrepaired for any substantial length of time, instills a sense of abandonment — a sense that the powers that be don’t care. So another window gets broken. People start littering. Graffiti appears. Serious structural damage begins. In a relativly short space of time, the structure becomes damaged beyond the desire to fix it, and the sense of abandonment becomes reality.

The preceding quote was taken from The Pragmatic Programmer by Andrew Hunt and David Thomas. It basically means watch out for the small stuff. If you can keep the tiny cracks out early they won’t turn into gorges. The hope is that if your projects are pristine and another person is invited to change or update something they will take notice in its perfection and not want to be the first to break a window.

Comment