Portfolio Design

The goal of this project was to give us experience with web design and basic HTML/CSS with specific limitations such as a chosen typeface and color palette.

I created a portfolio which can be found here at http://myweb.stedwards.edu/hwhite5/index.html.

I used notepad++ to compile the code as well as DreamWeaver CS5 and Illustrator CS5 to create the images. I have never been so limited on color palette and typeface, so I learned quite a bit about working within such difficult constraints. 

Field Guide

This project was a way for us to find our own topics as well as sub-topics/categories for the main concept and figure out a way to best showcase all the information.

I chose to do my project on dog friendly parks and restaurants in the surrounding Austin area. My medium was an app called Doggy's Day Out. You can find the app online (it was a mobile website app) at Doggy's Day Out. Please resize your screen to a smaller size, or else go to the app on your phone. DO NOT OPEN IN INTERNET EXPLORER! I have not optimized it for IE yet and cannot guarantee perfect working order.

That said -- I really liked seeing my app work and plan on continuing to finalize this app to gain experience with media queries and web apps. I plan on continuing to develop the app and keeping the blog updated with changes.

History of Graphic Design

I am taking this class this coming semester and have yet to complete the work.

Locating Place - Book

This project was trying to teach us how to take a project from the start to the end and in the process getting submerged in the content (or in this case culture) that is part of the project. The project had us head into a specific section of East Austin and do our best to capture pictures of the area that fit certain guidelines. From there, we were to create a visual piece in the form of a video that could be either interactive (flash) or not, and choose a theme to help represent East Austin through your eyes.

This part of the project was creating a book with the same content and pictures used in the movie. I tried to show the "peeling away" of layers and stereotypes to reveal the true nature of a place or building and in the process show that it is impossible to break down a scene to be the same across every audience.

The book can be flipped through here. Keep in mind the blue squares are showing through to pictures below them.

This book was created in InDesign and Illustrator. I also hand crafted the perfect bind as well as cut out the vellum and paper in the correct places. The paper had a light texture to it to give the paper a better look and feel.

Overall I am very happy with this project. It clarifies that if I ever do book work I will not want to be the one to assemble it. I'd like to consider myself the visionary in these situations.

Concept Map

This project's goal was not only to research a given topic extremely thoroughly, but also find a way to display the  information without any graphics in a clear, concise manner.

At first I found this project extremely difficult -- as I tend to try and explain information with simple graphics and without words. However as I chose a theme and stuck to it, the project began to grow on me and I am extremely pleased with the end result. I created the entire document in Adobe Illustrator CS5.

Locating Place - Movie

This project was trying to teach us how to take a project from the start to the end and in the process getting submerged in the content (or in this case culture) that is part of the project. The project had us head into a specific section of East Austin and do our best to capture pictures of the area that fit certain guidelines. From there, we were to create a visual piece in the form of a video that could be either interactive (flash) or not, and choose a theme to help represent East Austin through your eyes.

I created a video that used a "home video" feel to take users through East Austin through their own eyes, however the goal was to show the difference in perception from one person to another; what one person see may be a "slum" or a "restaurant" while another may see it as "the local hang out spot" or "home".

I am extremely happy with this project and I believe the amount of work put in shows. This project opened my interest to doing videos like epipheo in the future, and when I have free time I tend to create videos just to play with AfterEffects and spice up my skills.

This was created using AfterEffects CS5.

Found Type

We did not do a found type exercise for this class

Activity Booklet

This project was teaching us what it would be like to design for a conference with very specific requirements. For example: only 2 colors could be used, and the copy was already given. We had to find a way to organize the copy as well as the photographs and do it all in a way that would be cheap and easy to assemble for the volunteers.

The speakers side of the brochure can be found here and the sessions side of the brochure can be found here. 

I learned a lot about print media and how spot colors work from this project. I was overall very happy with the end result, and wish I still had a physical copy to hold on to.

Identity Series

This goal of this project was to help us design for a specific event where we may not necessarily have any knowledge of the subject. In order to fully understand the project, research was necessary as well as the development and mastery of button-making.

(first version)

(final version)

This project was extremely difficult for me, and my iterations changed dramatically from one version to another (shown). However in the end, I am very happy with the final product and I learned a lot about High Modernism in the process.

Weather Report

The goal of this project was to master the "L.A.T.C.H." concept (location, alphabet, time, category, and hierarchy). Choosing 3 of these concepts, we were to create a weather report no longer than 1:30 minutes long.

I used Location, Alphabet, and Time. Using quick transitions and animation, I tried to, while making the information clear and aesthetically appealing, make the video seem as professional and believable as possible. The images were created in Adobe Illustrator and imported to Adobe After Effects.

Kitchen of Meaning

The goal of this project was developing conceptual brainstorming. We were supposed to develop critical thinking skills as a means of analysis, talking about, and making design. Additionally, we were to understand the relationship of audience, design choices, and communication performance goals. All of this was to be done through a selection of a word from a list on a 18"x24" poster. My word was "nascent"

(above) is the current version. The final is due 03/28/2011 and I have a few things to fix. Final will be uploaded when it's done.

(final version)

Loved this project. This is the perfect example of a project that you're excited to see the final product for. I am extremely pleased with how this one turned out, and plan to keep this as a major portfolio piece for several years. This was created in Adobe Illustrator CS5 and printed at St. Edward's University.

Words In Motion

The goal of this project was to explore the meaning of a word through motion.

I chose the words "Bold" and "Increase". For the word Bold, I used some humor to achieve the effect of "bold... bolder!" I created the words and chose the text in Adobe Illustrator and created the movie in Adobe After Effects.

For the word "Increase", I used an increase in size, speed, and number to define the word. In order to make the meaning of "increase" different from "condensed", I kept the large number of words on the screen for only a short period of time. Like bold, I created the words in Adobe Illustrator and animated them in Adobe After Effects.

Instructional Design

The goal of this project was to design an instructional experience for a user. Picking from a list, we were to design and produce a "how-to" piece using both image and text, and were to explain our idea simply and aesthetically pleasingly through words and images. My task was "Mailing a Letter".

Trying to make the book something useful and appealing for letter writers to buy, I created an instructional book that was easy to understand and also had the potential to hold envelopes, stamps, and stationary if so desired (the link above will take you to the pdf format). The pages were created in Adobe Illustrator, printed out, and bound via a plastic spiral coil for easier flippability to desired pages. The front and back cover are also mounted on a harder board material to give the book some weight and make the pages seem more like a book.

Blue Squares

The first day back after our winter break we were asked to complete an exercise. Professor Tuan gave us the illustrator file of a series of blue squares (see video) aligned in a block formation. He then gives us a .mp4 of these squares doing various rotations and effects. He asks us to recreate this video using After Effects. 

Using different effects in Adobe After Effects (3D rotation of x,y,z axis, directional blur, fade in/out, etc) I mimicked the original video and created the above final product.

Personal Geography - Cognitive Map

The goal of this project was to successfully use symbols to communicate something. In this case we were to create a map from home to school (or school to work or any one path during our day) and explain this path using a cognitive map.


The first version of the map:

What made this map unique was the fact that it was user interactive; a user would slide the tabs to reveal what they would do in the morning. From that choice, they were sometimes limited on the next choice they could choose (e.g. if I sleep in, I don't have the option to eat breakfast).

The final map:

The final map has the tabs laminated to allow easier slide-ability as well as preventing unnecessary bending of the paper from use. Because there was such a large empty space on the tabs, I added a little phrase:

Advance through my thoughts, a map of my mind. To follow the path move down then side to side. If the path chosen has a spotlight of color, follow it down and connect it to the other. No path? No problem! Choose one and keep going. If "the end" is reached, admire your choices and go back! And begin again.

I created each section in Adobe Illustrator before printing them and assembling them. The tabs were laminated at Kinkos.

Personal Geography - Perceptual Map

The goal of this project was to successfully use symbols to communicate something. In this case we were to create a map from home to school (or school to work or any one path during our day) and explain this path using a perceptual map.


The first version of the map:

I used pure color with this one, and I liked the idea of having ray-like senses expanding from one point. However it was pointed out to me that the radial progression didn't make sense, so I took my idea in a different direction.

The final map turned in:

This map had a definite start and stop point and the senses were not only clearly marked by color, but also with symbols that helped identify what the sense was experiencing at the moment. This map helped me reshape the first map and the final map - cognitive.

I created both images in Adobe Illustrator.

Material Studies

     The goal of this project is to "study the creative possibilities of materials by creating a typeface from some material of your choice" I need to find 3 types of objects that can be molded into typefaces and then choose the best one to showcase the typeface.

This picture is the final product. I chose the word "Twang" for my rubber band typeface, and tried to mimic someone playing with rubber bands at work/home when bored. The yellow rubber bands contrast against the blue rubber bands and allow readability when tweaked in Adobe Photoshop. The above photo was printed on an 18"x24" sheet for the final.

 I used Adobe InDesign to create the PDF for the Process Book in which I document the process of creating this final image.

Personal Geography - Artifact Map

The goal of this project was to successfully use symbols to communicate something. In this case we were to create a map from home to school (or school to work or any one path during our day) and explain this path using an artifact map.

The first artifact map I turned in:

In this map, because the distance between school and home is so large and boring, I tried to explode the school and home sections of the map. 

The final artifact map I turned in:

In this map, I decided that exploding the sections didn't add the appeal I wanted. By the time I edited this map, I had also figured out the color palette I desired for all three maps and used that palette to help give my map definition. I created both maps in Adobe Illustrator.

Critical Mass

  The object of this project is to build up, through creating and experimenting, a large amount of material and piecing them together using After Effects skills. Then, we are to create a 45 second HD movie (or less) that is an allegory of a science concept: earthquake, volcano, photosynthesis, climate change, reproduction, or evolution.

11/3: finally finished the movie! Using play-doh, I made a stop motion movie representing reproduction in an allegorical way - i had the colors of play-doh mix to create a third color (or a child). I also added in some vector art to give it another dimension, and the soundtrack is all thanks to Mike McNeil. It really adds another dimension to the movie and it wouldn't be nearly close to what it is now without his help. The video was taken with a camera and then the images and audio were pulled together in Adobe After Effects to create the final composition above.

Interaction Exercise

     This project was an interactive exercise using flash. We used our symbols project as our topic and picked one of the three branches to do our movie on (see blog entry titled Symbol Methodology). I used the branch of Manufacturing called Creation for my movie, and showed a gradual progression through the brainstorming process from written ideas, to sketches, to final drawings. In flash I used mainly fading in and out with little movements to help emphasize certain progressions. Halfway through my movie I give the viewer a chance to interact and choose the correct symbol, as well as added a replay button at the end. 

     In order to fully take advantage of this project, I had to learn small amounts of ActionScript, as well as how to use different Flash features including color, creating graphics/buttons, layers, movement, Alpha, and Fade in/out.