Portfolio – refined comps

Portfolio Comps

Possible design firms to visit in Seattle

• Zaaz
• Flying Spot
• If/then
• Digital Kitchen
• Elephants and Ants
• Engine Interactive

Portfolio Process

Research (competitors, future employees, inspiration):

http://www.zaaz.com

http://www.gagedesign.com

http://www.elephantsandants.com

http://www.methodologie.com

http://bkwld.com/

http://www.narrowdesign.com/

http://www.goforchange.pl/

http://www.thisisgrow.com/

http://www.soft.se/#/index

http://zinnidesign.com/

http://www.agent8.co.uk/

http://mnatwork.com/#/?state=0

http://www.twigglegraphics.com/

Word list/brainstorming:

design, development, art, pyschology, color theory
web, network, connections
code, logic, analytical, technical
clean, organized, understated, modern, friendly, accessible
clarity, balance, functional, purposeful
duality, synthesis, professionalism

Concept:

I think the thing that sets me apart from other designers is the fact that I have a background in programming. I have completed the Web Manager certification program through the Internet Studies Center and have worked with Javascript, PHP, SQL, C#, Visual Studio, and the ASP.NET framework.

To reflect this, my portfolio is going to be focused around the concept of synthesis; for employers, I am the perfect balance of web designer and developer. I want my site to be both well designed and showcase my technical abilities. I plan to keep the design clean, minimal, ordered, and functional. I have not had the chance to work with JQuery in any of my projects, so I would incorporate JQuery elements in my portfolio as well. I also have found that many portfolio/business sites include links to social media sites like Facebook and Twitter, so I am planning on making these social media sites a part of my portfolio and extending my look/feel/identity to them as well.

Site-map:

HOME

1. Work
   • Web
     • IKEA
     • Campus 100
     • Jump Music
     • Summerstart/Transitions
     • Bookstore (redo)
     • Sarah Jerns (new)
   • Video
     • Music Video
     • Kinetic Type
     • Foul Play Commercial
     • Synesthesia Video (new)
2. About
   • Resume
   • Bio
3. Contact

Wireframes:

Proposal & Timeline Draft

Proposal:

1. Sarah Jerns Portfolio

   Description:

   My friend Sarah and I have been discussing working together to create a website for a while now. She is a music major at Western and heads up a band called Pan Pan. For one of my projects, I am going to create a personal online portfolio to showcase her work and capabilities. As well as being a public profile for her fans, friends, and family, Sarah also would like the site to appeal to important people in the music industry.

   The site will be detailed and informative and include audio and video files of Sarah’s work. It will also link to the various existing Pan Pan sites/social media pages. To make the site more interactive, I plan to create a blog in which Sarah will be able to post content and upload media through a password protected admin page.

   Goals:

   • create an informative promotional site that can be easily updated
   • become more familiar with using media (music, video) on the web
   • learn about search engine optimization

   Technical:

   The site will be created in HTML and CSS. The blog, since it needs password protection and the ability to upload content, will be created in ASP.NET using Visual Studio.

2. Synesthesia Music Video

   Description:

   I want to create one more motion graphics piece for my portfolio using Aftereffects. I plan to tie this video into my other project and work collaboratively to create a short music video with Sarah Jerns. The video is going to center around the idea of sound-color synesthesia:

   Cytowic calls sound → color synesthesia “something like fireworks”: voice, music, and assorted environmental sounds such as clattering dishes or dog barks trigger color and simple shapes that arise, move around, and then fade when the sound stimulus ends. For some, the stimulus type is limited (e.g., music only, or even just a specific musical key); for others, a wide variety of sounds triggers synesthesia.

   Sound often changes the perceived hue, brightness, scintillation, and directional movement. Some individuals see music on a “screen” in front of their face. Deni Simon, for whom music produces waving lines “like oscilloscope configurations—lines moving in color, often metallic with height, width and, most importantly, depth. My favorite music has lines that extend horizontally beyond the ‘screen’ area.” (Taken from Wikipedia)

   I want to animate various shapes/colors to move organically and abstractly with the music. My focus will be on create audio/visual sync in which the shapes respond to various instruments, tempo changes, rhythms, etc. within the song.

   Goals:

   • create a beautiful, abstract video for a composition from Sarah Jerns
   • learn more about animation in Aftereffects
   • work collaboratively

   Technical:

   This video will be created in Aftereffects.

3. Redo PHP Bookstore Project

   Description:

   A while ago I created a bookstore site in PHP for MIS 314. The site functions well, but the design is not portfolio worthy. I plan to redesign the site from the ground up. This will include entering new books in the database to create a limited and unique product line.

   Goals:

   • To improve the design on an existing site so that I can include it in my portfolio and demonstrate my knowledge of PHP
   • Create a unique bookstore identity and interface with a limited product line

   Technical:

   The redesign of the site will be done mainly with CSS and new images. Updates will be made to the products in the database using phpMyAdmin. The existing PHP code will not be modified.

Timeline:

timeline PDF

3D exercise

http://myweb.students.wwu.edu/~jamese4/dsgn451/3dExercise/3dDemo.aep

Movie Title Sequence

Final Mean Creek movie title sequence:

http://www.facebook.com/video/video.php?comments&v=640130027390#!/video/video.php?v=640130027390

IKEA final project

Here is the link for the final version of my IKEA project:

http://yorktown.cbe.wwu.edu/08Fall/jamese4/IKEA/IKEAscraps.html

and a screen capture using Screentoaster.com:

http://www.screentoaster.com/watch/stV09dR0VIR19XR11cXlNaVFZU/ikea_screencapture

IKEA – refined comp

Movie Title Preproduction

Film Choice:

Mean Creek

Plot:

When Sam (Culkin) continually gets picked on by the school bully, he and his protective older brother decide to teach the bully a lesson he will never forget. Together, they come up with a plan that involves inviting the bully on a special river trip for his birthday where they will make sure he is humiliated for all to see. Deciding that he no longer wants to go through with the plan, Sam tries to call it off but it’s too late and he must live with the resulting consequences.

Credits:

Whitewater Films Presents
A Jacob Aaron Estes Film
Mean Creek

Actors/Actresses: Rory Culkin, Ryan Kelley, Scott Mechlowicz, Trevor Morgan, Josh Peck, Carly Schroeder
Casting: Matthew Lessall
Costume Design: Cynthia Morrill
Music: tomandandy
Co-Producer: Jacob Mosler
Associate Producer: Dessie Markovsky, Ryan Peterson
Editor: Madeleine Gavin
Production Design: Greg McMickle
Director of Photography: Sharone Meir
Executive Producer: Deborah Del Pete, Gigi Pritzker, Nancy Stevens
Writer: Jacob Aaron Estes
Producer : Susan Johnson, Rick Rosenthal, Hagai Shaham

Word list:

dark, sad, haunting, blue, regret, mistakes, choices, betrayal, innocence/guilt
kids, youth, adventure, outdoors, woods, river, canoe, dirty/muddy, payback, prank, change of heart
bully, school, video camera, diary, swiss army knife, squirt guns, wristwatch
lonely, misunderstood, outcast, isolation

Possible Fonts:

I want the titles to look handwritten. Below are a few fonts that are similar to the look I want to achieve. I want the text to look like it could have been written by one of the characters in the movie. It should look like a kid/teens writing but lack any confidence or sureness to it.

Song Choice:

The Longing Part 9 by Felixdroid
found here at Magnatune.com

Concept:

The movie opens with a shot of George Tooney (the bully) through his handycam. George uses this camera as a sort of personal diary to document his life and thoughts. The movie also ends with footage of George from the camera.

For my opening sequence, I want to include the camera as it is an important theme in the movie. While the titles are playing, I am going to show close up shots of a person (representing George) getting ready for the day and walking outside. The sequence is meant to represent what happens before the first scene of the movie and give the viewer a glimpse of George’s POV. There will be shots of him packing a backpack with various items shown  throughout the film (swiss army knife, squirt gun, camera) and shots of  him walking outdoors (shoes stepping in the mud, walking by trees/water). The type will be revealed using masks as items on the screen are moved/lifted/opened/closed/etc. By having the type quietly revealed, I hope to tie in the movie’s tagline: beneath the surface, everyone has secrets.

The background music for the title sequence will be very similar to the music from the current titles… somber, understated violin/piano music. The film will also have a bluish tint to it. Both of these devices are used in the latter half of the movie after the mood changes, and by using these devices I hope to both foreshadow what happens and set the mood for the film.

Storyboard: