Process Book: Spring 2011

  • Published on

  • View

  • Download

Embed Size (px)


Graphic design process from spring 2011.



  • 1 - 2 - 3 - GO!

  • Taylor interacting with the ancient fish of the Devonian...

    We used my touchscreen laptop so that when you

    tapped the screen ripples would either startle or entice

    the fish swimming in the ocean below.

    I was surprised when I learned that this years char-rette was rogue. It seems like a strange time to pick a word that has been so recently associated with a very outspoken political movement. It is almost asking for people to do projects related to Sarah Palin or the Tea Party. For my whole life Ive given the word rogue a negative association, but from the very beginning of this project this has been flipped by the people around me. I

    was hearing people say things like, Martin Luther King Jr. is rogue. Jesus is rogue, none of which are things that I agree with based upon the actual definition of this word.

    No matter how many times and where I looked this word up it only had one definition: scalawag, thief, dishonest,

    scoundrel. No where could I find a positive interpretation

    of this idea, not even from the usually loose Visual Thesau-rus. My professors and classmates should have been us-ing a word like maverick or nonconformist, I thought. Am I missing something?

    After much thought, I realized that rogue was more than a word. Rogue embodies a certain spirit if you will...the idea of going rogue stands for more than what the dictionary had lead me to believe. It can be mischie-vous and playful or serious. Really, it could be anything. I could even go rogue by doing something completely un-rogue. The possibilities with a theme like this are end-less.

    a definition from the Visual Thesaurus, even in free as-sociation mode these are the only words that it shows to

    be related to rogue

  • WORDLE CLOUDI decided to look up rogue in various dictionaries

    and in the thesaurus, as well as looking up antonyms, syn-onyms, and quotes containing the word. I then plugged all of that information into Wordle ( and it organized the data into a word cloud by how many times each word appeared. This visual representation helped me sort out all the information and helped me to make some interesting connections.

  • A rogue mindmap that our 252 class came up with

  • FIRST IDEASThese are a couple of early ideas that my group and

    I had for the Rogue Charrette. We decided to go in a dif-ferent direction because we were concerned about the very short time line. The final idea we ended up deciding

    on was also too ambitious as well for a one-week dead-line, which is something to keep in mind for the future. I do really like these concepts, however, and will shelf them for later.


    While reading a book for my Age of Dinosaurs class I had a revelation. We were studying how limbs evolved and how the first vertebrate stepped onto land. The

    first fish-creature to step foot on to dry land was pretty

    rogue if you ask me. It wanted to avoid predators and have an endless food supply. It was an amusing idea that both my group mates and I enjoyed. I had also seen an interesting project called OASIS involving a touch-screen display that could be looked into like an aquari-um. I decided to take this as my inspiration as we moved forward with the project.

    We decided to do turn my touchscreen laptop into a similar device for people to interact with. We would do the animating and programming in Adobe Flash. The different parts of the fish and other objects in the scenes

    would be made out of cut paper and then reassembled in Flash to make animating easy and to give a natural look. All the backgrounds will be done on watercolor paper.

    Photos from the OASIS project

  • Pederpes says, Embrace your inner fish!


    The idea of a rogue fish seemed pretty funny, espe-cially after we got online and looked up some of the first

    fish to step on land. I can totally imagine some sea critter

    seeing all of the delicious bugs on the beach and want-ing to nab some of them. Or a tricky fish that can jump

    out of harms way when a predator comes near. Some of

    these creatures looked rather silly and inefficient, but they

    were the first step into what would become us millions of

    years down the line.

    It was really fun to reasearch this world and create some of the rather strange creatures from it. I could have made this project 5 more extensive, but for the sake of time we decided on just creating some generic fish,

    a main fish, a predator, and some basic background


  • INSIDE FLASHI was the main animator/coder in this project, while

    Katie the sound portion and Taylor did the artwork. It turned out to be a lot more work than I had initially envi-sioned (as usual) but I managed to get a working proto-type of the project running in only one week with minimal ActionScript experience. I definitely learned a lot about

    the ActionScript language from this project that I can ap-ply to future works.

    The basic flash workspace I used for this project

  • animating the predator fish

    animating the third scene

  • There was a lot of coding involved in this project to make it interactive. I certainly know a

    lot more about Actionscript now!

    Here you can see some of the many timeline layers that I used for this project

  • CUTOUT CREATURESEarly on we decided that we wanted a paper cut-

    out style with watercolor backgrounds. Cutting out the individual body parts made it easy to animate them later and gave it a very polished look without having to draw everything. Taylor was in charge of creating the cut-out fish and backgrounds, while Katie did the thought


    THE HEROThe hero of this story (who we called main fish) is

    the first fish to evolve to step onto land. This fish is actu-ally a part of one of the schools of generic fish, but it has

    slightly different fins and brighter colors to signify its indi-viduality. We showed that this fish is rogue by making

    it more outgoing than the rest. Instead of running away from your finger when the screen is tapped this adventur-ous fish actually follows to investigate.

  • BACKGROUNDSWe did watercolor washes for the backgrounds,

    along with some cut-outs of rocks and a plant. The great thing about this set-up is that since all of the elements of the background are separate they can be moved around to create an endless variety of seascapes.

    ASSEMBLYOnce we had the individual pieces it was easy to

    assemble and animate them in Flash. With the predator fish we had one body piece, one head, one fin, and one

    side of the tail. I then duplicated the fins and the tail and

    put the pieces together to create the final animated fish

    using motion tweening.

    The crab cut-outs (shown left) were not actually used in the final piece, but it shows how the assembly works

    with a more complicated creature.

  • THE SETUPWe set up the project by a water fountain on the

    second floor, because it was slightly out of the way and

    seemed to fit with our water theme. The project was

    meant to be a relaxing break from the rest of the hectic charrette. Unfortunately, our nice music that we com-posed could not be heard because of some rogue proj-ect that was simply a pair of speakers blasting profane rap music. We had claimed our spot much earlier in the day and were already set up when the other people ar-rived and even when we asked if they could move to the other side at least they would not. I guess that is rogue of them...? I still think that, for a project that was cranked out in only one week it quite beautiful. A few days more refinement could have made it more successful but I

    enjoyed the experiment so much that Ill probably do more flash animations in the same style. Overall, Im re-

    ally happy with how it turned out and am very thankful to my group members Taylor and Katie for helping me pull this off.

    It was really fun to watch people stumble upon the project. It was even more enjoyable to watch them touch the screen only to realize that the fish followed your

    finger and interacted with you. There were some techni-cal difficulties that we somewhat managed to sort out

    by the end of the Charrette. After watching people look at the project I found out that people dont necessarily want to spend a long time interacting with something, theyd rather move on after a few taps on the screen. For our project at least, it seemed as though since they didnt watch the whole thing the Rogue part of our project where the fish comes onto land was often missed. This is

    something that Ill have to keep in mind with future inter-active works. It was a great learning experience.


    I liked this project because is was quick and easy way to experiment without getting too invested in any one itteration. Happy accidents were prevolent, especially once I got out of Illustrator and started to layer letters us-ing transparency.

  • INSPIRATIONThese are some images that I looked back on when I

    wasnt sure where to go next. Some of these are from the AIGA archives, others are from logo design sites, and the rest are from a class presentation.


    These are the parts of the various typography hand-outs that I thought were the most interesting/useful. Im putting these here for future reference.

  • EARLY ITERATIONSThese are some of the earlier letterform combina-

    tions that I was w