Dept of | by Philip Likens

Begins With… Board Game

February 3rd, 2010

This semester I had to create a project for one of my classes.  It had to be non-digital in nature so I chose to create a board game.  The board game is based on a digital game I created last year – Begins With… Here’s a link to the final project proposal (pdf) which explains the game, the rules, why I designed things the way I did, etc.

On a side note, you can keep up with my weekly postings on my grad school blog for the 705 class (for which my project was made) here:  Formula ITGM 705

Graduate School

January 5th, 2010

I just started grad school at SCAD.  I’m taking 2 classes in the Interactive Design and Game Development program.  Interactive Design/Media Applications is the first class and is in my direct major.  The second class is a generic Contemporary Art class.

It’s interesting so far.  I think it will be a good experience.  Currently they have me reading the first chapter of A History of Modern Computing by Ceruzzi which will be a good background for the Programming Logic class going forward.  The book I’m looking forward to reading for the IDMA class is Rules of Play: Game Design Fundamentals by Salen/Zimmerman.

I’m excited to see where these classes are headed, though I know they will be challenging.

The Biz

December 4th, 2009

Has anyone ever thought that the public might not be able to support the music or movie industry as it is?  That perhaps we shouldn’t be trying to save these industries, but let them die back to something the public will be able to support.  Much like a plant, maybe it’s a natural process of purging the excess, irrelevant, dead blooms so that the good will be able to live.

Proper Documentation

November 23rd, 2009

You might be a geek if… you believe you can do anything, provided there’s proper documentation.

Binary & Hex

November 18th, 2009
A generative art experiment with Genetic Algorithms and Color Transformations

A generative art experiment with Genetic Algorithms and Color Transformations

As I increase in my understanding of number systems the world of programming opens up more and more.  I just realized (tada!) that the max number of color variations in our traditional web system is 16777215.  16777215 is equivilent to #ffffff.  So when you give Flash a color like 0×000000, it’s really just converting it to 0.  Alternatively, if you give Flash #ffffff, it’s converting the color to 16777215.  So if I want a random color in Flash it’s as simple as Math.round( Math.random() * 16777215 ); and if I want to transform a color over time, I only need to increment that variable my color is stored in.  This is a really simple realization that most people already understand, but for me it’s opening up a whole new world.

As for binary, I’m using a lot of it.  I’m encoding paths for genetic mutations, neural networks rely on binary, etc.  I keep finding new ways to use binary – ways that surprise me, but that make sense.  I hope my students in Programming Logic listen when I talk about Binary and Hex numbering systems.

Audiophile

November 11th, 2009

I was recently tasked with creating an audio player in Flash Actionscript3 that uses ID3 tags to read the artist and title of each track.  I got a little carried away and ended up using a modified version of my rotation algorithm, along with a new custom made bitmap particle font.  I like the final result though.  I may adapt it eventually for null process if they decide they would like to use it.

Grad School, Notebooks, Genetic Algorithms, Oh My!

November 7th, 2009

Well, I got everything sent off to apply to grad school (SCAD) this week.  Now I’m waiting for some kind of word back.  Though I doubt they’ve received the materials yet as I sent them Wednesday.  Just nice to have everything out the door.

In the process of writing and thinking about my process and purpose I have decided to start carrying a notebook again.  And, mind you, not a computer but a real live notebook with a pen and everything.  I think I was at my most creative when I did, and I need to return to that mentality.

In other news, I’ve been working with genetic algorithms for the first time.  It’s a combination of binary, Flash’s drawing api, evolution, etc for the sake of creating something beautiful.  Right now it’s totally separate from the artificial neural network development I’ve been doing the past couple years, but there my eventually be a convergence.

I’ve added a link to the right for the portfolio I sent in to grad school.

Education: Motion Design

September 14th, 2009

I teach a motion design class at the Art Institute, cleverly disguised as a Flash class.  I do care about my student learning the Flash program, but I care just as much to teach them good motion design.  I think good motion design is more or less comprised of three things basic things: Rhythm, Transition and Point of Origin.

Point of Origin is simply where the graphic, text, or whatever asset is coming from as it moves.  What was it’s original position on screen?  In life, all things have a point of origin and it’s startling if we can’t guess what that point of origin was.  So think about someone just appearing beside you as you turn around – you didn’t see them coming and didn’t expect them to be there.  It’s startling as you say audibly “You came out of nowhere.”   To some degree the same is true with motion graphics – graphics, text, etc that just “appears” is jarring.  Jarring can be good or bad depending on the situation, but generally people want those assets to have a predictable point of origin.

Transition has to do with the way things move.  An asset sliding in from the left, fading in from the top, fading out in the middle.  Transitioning elements and playing those elements against each other can have a powerful effect.  If we had the words “Motion Design” that we wanted to appear onscreen in some way, we have several options.  One option might be to fade both words in at the same time.  Another would be to fade one in from the top, the other in from the bottom, ending on the same line.  The second method will create more interest.

Rhythm has to do with the inherent beat any animation will have – and you will either be on-beat or off-beat regardless of whether you have music or not.  All people have rhythm, it’s built into us.  We have a heart that beats at a certain pace.  And to varying degrees all people can tell if something is “off” or “on”. Spacing your animations to create a beat that either goes along with music, or has no music at all is important.  Taking .5 seconds to fade something in, leaving it for 2 seconds, then fading it out over another .5 seconds will look better than something just randomly timed.   Keeping a rhythm also allows you to break the rhythm for dramatic effect.

So those are the big three I emphasize in my class – Point of Origin, Transition and Rhythm.  If you can use those three effectively you’ll come out with decent motion piece.  The rest depends on your content and your writing.

Education: Designing Logos

September 6th, 2009

Logo design is a tricky thing.  The question is how to you communicate the essence of a company in a small symbol and type treatment?  Here are a few pointers, as well as some examples taken from logopond.com.

Many companies simply use a type treatment as their mark.  This approach works best if the logo’s name is short (think google, gap, macy’s), or if the company goes by an acronym (think abc, ibm, ups).  If the company’s name is too long or has multiple words, it may be tough to create a strong representation of the company using only type.  Most of the best type-based logos tend to be fairly bold as they scale large or small easily.  Sans-serif fonts tend to be better and usually there is some sort of circle or bounding box around the words to help the type pop.

http://logopond.com/gallery/detail/64990

http://logopond.com/gallery/detail/63998

http://logopond.com/gallery/detail/61860

Other companies choose to employ a graphic element to represent their company, usually in addition to a type treatment.  Still others integrate the graphic into the logo in some way.  Again, something bold is usually best as line artwork can get “lost” when it’s taken down to a small size.

http://logopond.com/gallery/detail/65940

http://logopond.com/gallery/detail/69920

http://logopond.com/gallery/detail/41911

Some helpful hints:

  1. Choose 1-3 colors for a logo.  Anything more tends to be too complex.  Start designing with black and white, finalize the graphic and type treatment, then add color as you wish.
  2. Keep the block in mind.  Any logo must be used in a variety of places.  If you drew a rectangle around the logo, how much space does it take up?  Usually you don’t want something that is too horizontal or too vertical, but a good mix of both.  If it is, you’ll have many more options for placement when you go to use it in a design.
  3. Keep it simple.  The best logos tend to be the most simple with an “ah ha!” element.  For example, the wooden house logo above uses a house/tree combo to communicate the name and what it does.  It’s instantly recognizable.  Paired with the right colors, you could see that the name and the graphic go together even if you were to separate them.
  4. Think about how your logo will be used.  If it’s going on the web, on letterhead, on a business card, billboard, etc – how will you use it?
  5. What do the colors communicate? Red might be aggressive while blue might be calming.
  6. What does the typeface communicate?  A serif font is classic, timeless and established while a sans-serif tends to be more trendy and techie,
  7. Don’t use gradients.  Gradients add complexity and tend to lessen the pop and contrast of a treatment.  They are also harder to represent over a variety of media in a consistent form.

That’s all I’ve got for now.  There’s much more you have to keep in mind, think through, etc.  Mostly though, go find some logos you like and study what they do well.

Education: The Lost Art of Reading

August 26th, 2009

Everyone needs to read, but I think we designers tend to overlook reading physical books.  As such, I want to point to a few resources that I’ve particularly enjoyed reading/looking at over the years.

Tibor Kalman, Perverse Optimist – This book details some of Tibor Kalman’s work and life as a designer.  The man was brilliant creatively and pushed the edges of commercial design to be accountable to the greater good.  His most famous works include some products carried in the MOMA store and work with COLORS Magazine.

Life Style – By Bruce Mau.  Bruce Mau came up with an incomplete manifesto for growth and published it, along with a lot of work, etc in a book called Life Style.  The hardcover edition of this book is one of the most beautiful books I’ve ever seen – bound in a number of different fabrics.  Mine is a shimmering pink (by chance).  Mau’s work is brilliant and highly influential, intelligent, and challenging.  He also has a good interview with Charlie Rose.

The Art of Looking Sideways – This one is by Alan Fletcher and is just amazing.  I don’t know much about Fletcher other than what I know from this book.  But this book is thick, cheap, and wonderful.  Each page is packed with information and ideas to explore.  It’s not a book you sit and read, but a book that you flip through every once in a while to garner some bit of inspiration.  It’s an amalgamation of quotes, images, thoughts and colors divided up into small sections.  A perfect coffee table, discussion starting book.

The End of Print, etc – I say etc, because I’ve enjoyed any of David Carson’s books.  I think he’s a little uppity as an individual, but his work was revolutionary.  He’s the reason I started paying attention to type and had a huge influence on the way I’ve done my photography.  A brilliant designer as evidenced by the books he created.

MTIV: Process, Inspiration and Practice of a New Media Designer – This is a book by Hillman Curtis.  It’s an older book, but one I really enjoyed.  It details the process Hillman Curtis takes at his small design firm.  Very interesting.