or, an introduction to my portfolio and brand.

Hi folks! It has been a while since my last posting. I’m afraid that, beyond my own expectations, school has further ramped up since the final project. This is a bit of my own fault since I decided to add two additional classes with larger outside projects. As a result, I am currently involved in producing an online magazine, a branding project and all of my various portfolio-related projects.

While my portfolio is still being developed (Object Oriented Programming makes things such fun), I wanted to show off my business card. Hit the cut for various looks and information!

Front:

There are a few elements I wanted to talk about for the front of the card. First is my name. I chose the font Canterbury Sans for my name. I feel that it represents my handwriting to an extent, since I tend to have tall extenders (eg the “l” height) and tall capital letters paired with a small x-height (the height of the lowercase letters). I also think that the difference in heights helps enhance the personality of the font and makes it stand out strongly.

The next item is the nautilus shell in the upper-left corner of the card. The nautilus is the main representation of my brand and carries multiple interpretations. The first is that of evolution. The Nautilus is a sea creature that has a deep connection to the evolutionary process through its prevalence in fossils. Amusingly enough, the creature itself has not evolved, remaining much the same over millions of years. However, when shown the image of a nautilus shell, the sense of progression and change is inherent. Second is that of a logarithmic spiral which carries a strong tie to mathematics and programming. In addition, the logarithmic spiral is often associated with the golden ratio, even though the golden ratio is only a particular case of the logarithmic spiral. This association draws in the expansive history inherent in the golden ratio and golden spiral, a concept that has been used in everything from design to architecture to books to artwork in the belief that it is the “perfect” ratio holy to nature.

Finally, the small text below my name. I used small caps to help differentiate it from the main display font and included “>>>” to form a second connection to the back of the card (the first being the nautilus shell).

Back:

I mentioned earlier that the nautilus shell speaks on the concept of evolution. Here, I took that one step further to create my own “Evolution of Man” using a tadpole, a lizard, an ape and a human, with the “>” forming the connection between the three and directing the eye toward the natural conclusion. This sense of “The Origin of Species” also drove me to use wood for the background of the card. I wanted to capture the sense of those old books and the sense of a natural process. Thus, it seemed that a wood would be appropriate choice to convey those particular meanings.

Now, you might be wondering, “why evolution?” Well, this ties back to my “What is Design?” statement that is under the About section on this site (You didn’t know it changed? Well, I’m mentioning it now!). I’d highly recommend clicking on the link and giving the full document a read, but the cliff notes are that the world around us constantly changes so design does too and that design needs to look both backwards to its own history and to the future in order to be effective. I wanted to capture that sense and the concept of myself as a designer constantly evolving seemed to make perfect sense in that context.

Thus, my “Evolution of AaronBell” concept grew. Please look forward to seeing the portfolio when it is fully completed! It shall be put onto the second domain referenced in the business cards – AaronB.net (it currently takes you back to 10-yen).

In any case, I hope you like the business cards! I had fun making them and they turned out great even when digitally printed.

It has been a long 3 months of work; time spanning three terms and multiple projects and at long last, it is done: The Final Project.

The project itself has gone through a number of revisions, but has always been focused on Generative Art. It started its life as a program that would analyze and interpret poetry to create appropriate artwork. Then, as that idea proved too big a bite to chew, the project was given a new wrapper; that of an e-card application. In this state, it lived for quite some time in the realm of development and documentation until near the end of the project, it became apparent that e-cards too would spoil some of the unique value inherent in Generative Arts. Thus, the project shifted again into something different, though not mutually exclusive to the e-card concept. This new direction was that of personalized, modern art that is driven by one’s voice. The concept of using voice as a vehicle for generating the artwork was developed during the e-card stage as a way of bring more physical elements into the creation process and making it seem more personal. Thus, this was the final brief for the piece:

XYZ runs a very successful “Do it yourself” chain of stores that allows customers to create artwork on a variety of kitchenware and ceramic items. While their physical stores are successful, the company sees potential in the power and versatility of the web to deliver a new kind of self-created art piece. At the same time, similar to the analog creation of artwork in their physical stores, XYZ is placing key focus on having one’s personal touch influence the artwork. In particular, XYZ is looking for a website that can use an analog input as the base to create artwork rather than a purely computer driven methodology. In addition, since one of the advantages of the internet is rapid distribution, XYZ wants to provide options for downloading and ordering the completed pieces.

This project will create a website that integrates analog with computer driven methods to create art.

Unfortunately, due to time pressures, I was unable to fully realize a new brand or website wrapper for the project, but that is something that can be addressed in the future.

The real meat of the project is, of course, the generative engine. The Engine (as I like to say) was an extremely complicated little creation for me. With no experience in the field of generative art, I was mostly experimenting with new concepts. For those folks who have been regularly checking here (thank you!), you will have seen some of the early development as evidenced in this first post on different algorithms and this later post with more integration. I knew my methodology for creating generative art was right, but I didn’t really have the sense of personalization and unique elements beyond that of simple randomization.

That’s where the “plug-ins” originated. Bringing in the user’s voice had the unexpected advantage of generating interesting shapes to act as a basis for artwork placement as well as adding in a degree of personalization that had not been achieved before. Originally, I wanted to include more options, but time crunch and deciding to limit options for the sake of simplicity led me to reduce it to only one, that of the circle.

Selecting one’s own vector imagery was always an inherent part of the project, from the early conceptualization period. The only thing that needed to be done was to create different kinds of interesting imagery. For that, I enlisted the help of three fellow students with a penchant for creating vector images to develop a number for me. Their work plus some of my own and other free ones I found online gave me a strong basis of 78 different options. In the future, I would like to implement a feature to allow people to upload their own imagery or create new images on the site itself. Unfortunately, they were beyond the scope of the project this time round.

Color selection was something that I had planned to include from the early stages as well – offering colors for different moods. I thought I would provide different color palettes for users to pick from, but when I discovered that Adobe’s Kuler offers an API capable of returning color palettes from user searches, I knew that was what I wanted to do. Why force users to pick from 5 or 6 different color palettes when I could allow them to search for their own? Of course, this came with a bit of a cost. Kuler’s API is rather slow and sometimes returns malformed XML, leading to no end of headaches for me. Even the final version occasionally has issues due to Kuler. Oh well.

All of these different plug-ins originally were very much integrated into a single code set, each with their own form and function hardcoded in. Unfortunately, while that allowed me to create pretty pictures, it didn’t allow me to do much with the code after that. Not to mention that so much of the backend had turned to spaghetti with code sending data all over the place with no direction. It was rather terrible and difficult to understand. So I rewrote it.

The biggest thing was to separate form and function on the code side; if I could create menu-independent backend, it would be simple to change the menu’s visual treatment without having to perform major surgery on the code behind it. The other big thing was to start integrating new functions into The Generator. In order to make concepts like moving through time on the generator were completely impossible in my former version of the code. Thus, I had to re-conceive how data would be stored and displayed. Happily, once that had been established, it was an easy feat to add in all the other elements like zoom, voice affecter and waveform overlay. In addition, the new method of data storage allowed for vector output to be much easier later on.

Speaking on output, the download menu was an area that took a bit of time. JPEG export was kindly provided by this Actionscript 3 compliant encoder. While it was capable of reducing quality as well, I wanted it only to export at full resolution. Unfortunately, it had a cap on around 2 Megapixels (2000 px X 2000 px), so I was forced to limit the size of the images to those dimensions. However, once there, it was a simple matter to set up AMFphp to receive the bitstream, save out a JPG image to the server, and allow users to download it. The vector output provided a bit more trouble.

I wanted to export some sort of vector imagery from flash. Now exporting anything out of flash is difficult enough, but vectors in particular are a pain. I looked at php-driven solutions where a pdf would be assembled on the server and saved out, but I couldn’t understand how to make that sort of idea work, so I thought some more. After some time, I came up with the solution of exporting an XML document from flash that would contain all the required vector elements of the document. Then, php would save this file and send me a message. I would use another program called Processing, to take and interpret the XML to produce a vector image. While there are PDF libraries available in Processing, the SVG export ones worked exactly the way I wanted them to, so I was able to produce my vector imagery with that method.

The final area I looked into was the menu system and some usability. While it was nowhere near my main focus for the project, I felt that it needed to be clean, simple and usable to really be a success. That would mean, of course, cleaning up the menus, uniting their looks and generally creating a friendly navigation system. I used the icons that I developed earlier since they are bright and legible, though they may be replaced later with the development of a brand. A lot of little work went into making the user experience work, even at a simple level, and it would be tough to really cover it all, so let’s just that that I did my best to guide and assist the users through the menu system to the important materials.

Thus, I was able to create this little application. It was a tremendous amount of work, but very rewarding and the sense of accomplishment at the end was amazing. In the future, I’d like to add even more features and explore the area of generative media further and further, but for now, I think I’ll just take a bit of a break.

Time Breakdown

Project Management ….. 32.75 hrs ….. 9.74%
Research ……………….. 46.25 hrs ….. 13.76%
Branding ……………….. 16.75 hrs ….. 4.98%
Design …………………. 31.25 hrs ….. 9.3%
Development …………. 209.07 hrs …. 62.21%

If you are interested, here is a pdf of my production book, which covers much of the above information and some other nuggets plus including pictures and other interesting items.

Check it out if you have a moment!

To the Project

In the realm of game development, when a game has “gone gold,” it is fully done and ready to ship to consumers.

My code for my final project is now silver.

I’ve implemented everything I wanted to and as far as I can tell, it all works without bugs. Thus, I felt it was a good time to post this up here for you folks to check out and play with. There are no instructions, but I think things are *mostly* understandable without guidance. I will need to change user interfaces of course, but the essential bone structure is all there and happy. If you find any bugs, just send me a message!

There are some important things to note. First, this generative project is voice driven. The first menu is where you record your voice. That will directly influence where the artwork is placed. Also, while the final imagery is drawing (items are being placed on the screen), you can similarly use your voice to affect the scale of the imagery. The louder one is, the larger the images will be. So, in case you folks were wondering, you will need a microphone.^^

The JPG and SVG export options both work. JPG results in a direct download. SVG will record your creation and send me an e-mail informing me that someone has requested one. The SVG part isn’t the most elegant solution, but it is was the best I could do to ensure that vectors were preserved; and I’m not good enough with java to make it work server-side.

I’ll put together a gallery for your pleasure at some point later – probably after the project is over with in 8 days. Also, if you use my little engine here for something, please credit me and send a link back here. It is nice to know where things are ending up (hmm, a watermark could be nice too – on jpgs).

In any case, have fun and let me know how things go!

Welcome to the Engine.

Hey folks, it has been far too long since I last posted on here! Part of the reason was due to a shift in focus of the project and due to a need to pound out code. The other part is that my final project has been regularly devouring my time (I’m generally at school working from around 10 in the morning until 11 or midnight, if not later) and that has prevented me from posting updates.

However, I have something to show now!

These are some of my first renders with a (mostly) fully functioning generative engine.

In general, the project has moved away from the idea and concept of the “e-card” into a realm of producing generative art. There is still the personalization and, interestingly enough, more analog input into the design, but I feel that the medium of art pieces represents and presents the media much stronger than an e-card could.

Overall, I’m rather happy with the result. These renders are pre-rewrite, so there are still some slight problems present (like some of the graphics getting cut off with a sheer line), but I’m most glad to see that the system works. Up until yesterday, I wasn’t sure I was going to be able to produce interesting, nice-looking pieces, but now I know I can. There is still much work to do since I didn’t code it particularly well the first time, but that should be easy enough to resolve now in advance of my review next Friday.

I’ll keep you folks updated as things progress!

One of the larger projects I was involved in last term was the creation of a DVD packaging for the documentary, “The Memphis Belle: A Story of A Flying Fortress,” created in 1944 by William Wyler for the Army Airforce. It told the story of the 25th and final mission of the crew of the Memphis Belle, a B-17 bomber heavily favored over Europe during World War II. We could make a packaging as simple as a single disk, dvd cover and dvd cover, but I wanted to do something different.

I made a “special edition” version.

Foreword: The project wasn’t meant to create a “perfect” final version of the packaging, but more to generate a prototype of what the packaging would be like for a potential client to approve or amend the direction of the project. As a result, some of the elements are not as totally clean as I would look for in a retail project.

To start, I needed to conceive of what the packaging would include. Originally, I wanted to create a DVD and CD combination. The DVD would contain the main documentary and the CD would contain famous speeches, smaller video clips and other relevant media. However, over the course of my research and image gathering, I found the potential to make an even more significant package as seen in the final list below:

• DVD
  • The Memphis Belle: A Story of A B-17 Flying Fortress

    1944 documentary

  • Mission Accomplished: The Story of the Flying Fortress

    1942 propaganda film

  • U.S. News Review: Issue 5

    1942 news reel / propaganda / documentary

• CD
  • Popular and propaganda music from US and Britain during WWII
  • Propaganda Music from a Nazi Swing / Jazz orchestra
• 2 Plate, 6 Panel DVD/CD holder
• Mission Diary
  • Excerpts from Marshall E. Stelzriede’s Wartime Journal
• B-17 Pilot’s Manual
• B-17 Schematic Poster and Technical Data
• Cloth Case for all components

As you can tell, I had a rather large scope for the project and hope that it would turn out really well. Originally, I wanted to create a third, smaller booklet on aircraft identification and technical specifications, but that fell by the wayside as time became short. In any case, let’s take a look at the finished prototype of the project.

Here is the package as it comes wrapped:

The cloth case is made from green canvas that I purchased from a local fabric store and bound the different parts together with fabric glue. When I made it, I didn’t have the two books in their final version, so I was forced to estimate how thick they would be in determining the dimensions of the case. Due to time and ability constraints, the edges of the fabric are still rough and frayed, but should this become a commercial product, more time and effort would be spent on the case to really give it a good feeling. My aim was more to simply create a casing for the other elements of the package.

I also hand-sewed a button onto the front and cut a slit in the cover flap so that it could be buttoned shut. The button fell off once, but the second time around it stayed on well!

Opening the case, you see the 4 different parts. The two books are in the back with DVD / CD case in the middle and the poster in the front.

Taking all the elements out, they look like this. Let’s start on the left at the poster.

The front of the poster was originally an image from Flight Magazine that was scanned in and posted online. The image came from the internet and I added the text in the upper right. The poster size is 11 x 17 and was printed on glossy white paper. I’m afraid I’m not sure the weight of the sheet.

This poster brings up the issue of copyright that we faced on the project. Originally we were supposed to completely avoid copyrighted material when gathering materials for the project, but the instructors realized that if we were working on the exact same project professionally, we would likely have access to all the source material we needed to achieve the look we wanted. Thus, they let us use some materials as long as we referenced where it came from. I chose to stay with public domain materials as much as I possibly could, but there are a couple exceptions that I will note here.

Here is the back of the poster. It was an interesting challenge to keep all the data lined up in their individual columns as well as between the columns. I think the final product is easy to read and understand (I did all the type setting as well) and is organized usefully. Thinking back, I’m not sure if I would switch the two columns next time. I like having the “blueprint” of the plane on the left side, but it might also make more sense to have the “Specifications” column on the left since those are more general than “Armaments.” In any case, I feel I achieved my goal of making it legible and easy to read.

Next is the DVD case itself.

This is the front of the DVD case. The font choice here was Minion Pro. I chose it as a compliment to Baskerville, which was used in the flight journal book. I felt that the serif nature and upright feel of the Minion Pro gave the font a feel of being “proper” and “classic” as might befit a historical piece about heroism and courage. In addition, it has a wide selection of bold and italics that I made usage of throughout the project.

I really wanted the case to have texture and feel rougher, but I was unable to accomplish that goal with the time and materials I had access to. In addition, I wanted to deboss the vector outline of the b-17, but faced limitations there too. To give the sense of the texture and feel of the actual DVD case, I chose a paper called Navajo, which is matted, off-white. That paper was used later on the books as well to give the photographs an older feel that I couldn’t access otherwise, but we’ll talk more about that later.

Here is the back side of the entire DVD case where you can see the spine design and the back painting. The design was such that when one opens the outer flap to access the DVD and CD, one sees the left side of that painting. As you can see, there are some cuts through the images. They were due to a slight issue I had in my construction methodology. Unfortunately for me, I chose a more interesting, 2 tray, 6 panel DVD case rather than the regular case that everyone else used. As a result, I needed a way to back it with a hard material and still put the designed images onto it. As a result, I took a think cereal box, cut it to dimension and glued the images to it. I had hoped to be able to leave them perfect, but the necessity of bending the box made it such that I had to kiss-cut the images and box to allow bending. Unfortunately, the cuts didn’t always go as planned and one of my dimensions was off as well, causing other troubles. Thus, the case doesn’t look as good as I hoped it would and could in a final run version, but I think it gets the point across for the look and feel of the final product. Another slight problem was that the printer we used to print out the design was too small to handle the full length of the box art and I had to divide it into two pages, then recombine them on the box to make it work. All in all a very troubling procedure!

Here is the inside of the case with CDs in their trays. The left side shows the name of the DVD / CD, the contents of each and includes a description of the three films on the DVD as well as an introduction to some of the more interesting songs on the CD.

Taking the CD and DVD out, you can see the full background image of the inside. The image was taken from this site with color photographs commissioned by the Farm Security Administration – Office of War Information from 1939 to 1945. Discovering that site was an amazing coup for my project due to there being a photo that worked perfectly in my design and that the image quality was astounding. The photograph used of a b-17 at sunset was a 160 MB tiff file and came to me at around 6 inches by 9 inches with 1600 DPI. Not to mention that since the photos are government commissioned, they’re public domain. I was quite the happy camper. Similar to the front side, you can see the cut lines I had to put in to allow the case to fold as well as the line where one photo changes over to the other.

This is a close-up of the DVD I made. I wanted something simple and effective for the case – ultimately picking this photo which left a lot of space for me to work around the hole in the middle. Looking at it now, I am not sure why I didn’t rotate the photograph to make the B-17 fling horizontally. Oh well.

This is the CD I made of public domain music from World War II. The name came from the fact that much of it was made to inspire the troops and uplift the morale of the citizens. Playing off that theme, I found and used a collection of propaganda posters as the background for the CD. The images were from the internet and were pretty bad quality in terms of print; 72 dpi and not very big. Luckily, I hit upon the idea of tiling them, so I could up the resolution and let them get small since I would just be using a bunch of them anyways. I really like how it ultimately turned out. The posters are a mixture of American, British and German.

Here is one of the two books that was created. From the outside, they look identical since it was my intent to put a sleeve jacket on one and engrave the other, but time and cost prevented either from occurring. Indeed, I only received the books back from the bindery the day I had to present the final version!

Marshall E. Stelzriede’s Wartime Story was a site that I came across during my research. It featured, prominently, the full journal of Marshall Stelzriede from his training through the end of his tour of duty over Europe. I became excited with the prospect of creating a journal to include in my package, since it would allow me to flex my type setting, layout and typography skills. Contacting the webmaster, Tom Stelzriede, I was informed that while it would be ok to use small sections of the journal, but not the entire journal. I understood the reasoning, but was still disappointed. Of course, thinking back on it now, I realize how much more work it would have been to typeset out the entire journal and am rather glad I only used smaller sections!

The body text type face was Baskerville. I wanted a font that would feel more humanist since this is a personal journal and ultimately settled on it. To match it, I picked out Minion Pro for the captions and Myriad Pro for the Header titles. I liked the choice to put the section headers on the left side of the page in large font size. it gives the book a bit less formal and orderly feel, which I thought was appropriate. My the photographs here were put in conjunction with each header section.

Another interesting issue came from the method of binding. As a student doing a one-off print project, we chose to use French Folding, in which each “page” is actually folded in half rather than being printed on the front and back of a single page. The main reason for this is because it allows students to arrange the final print version themselves rather than the bindery taking care of it. The troublesome element came because when one prepped the file for printing, the master versions of each page (the master layout every page conforms to) didn’t switch around, so all the margins I had laid out for facing pages were now reversed! I had to spend a bit of time fixing that up. I’m glad I caught it though because it would have ruined the project!

I mentioned earlier about the reasoning for picking this off-white paper had to do with making the photos feel older. In early print tests on white paper, I tried CMYK and Grayscale versions of the same picture to see which would look better. Since they use different color modes, occasionally there will be important differences between the two. In my case, the Grayscale looked nicer and older, but the lines on the CMYK were so much cleaner and bolder, especially on the poster photo that I felt I had to use that color format instead. Thus, in order to offset the boldness of the color for these older photos, I used the off-white, matted paper. As ink is transparent, it picks up the brownish color of the paper to weaken the photo’s boldness, creating an older looking feel with stronger blacks.

Now, let’s move over to the other book, the B-17 Pilot’s Guide.

For this book, I chose a slightly different tact than the war journal. Instead of Baskerville, I used Minion Pro throughout the entire layout in order to give the sense of a no-nonsense government publication.

At the bottom of the page is a small logo for the Army Air Force, which the B-17 belonged to.

All in all, this was a giant project for me to take on by myself. When I talked to Robin, the teacher for the class, she was worried that I was taking on too much and might not be able to finish the project. I did scale back a few elements that I originally wanted, but pushed forward with lots of extra effort to finish off the packaging. There are areas that I feel could be improved and cleaned up as I mentioned before, but all in all, I’m rather proud of the work I put into it. The feeling of unwrapping the books for the first time and holding them was wonderful; especially knowing the hours and hours I put into designing them.

What an effort!

One of the key segments of my project is in the vector art that will be used in the e-card generation system. When I first conceived of the project, I wanted to do everything for it myself; it would be mine completely. However, I also know that there are weaknesses in my abilities that would hamper the successful completion of the project goals. In this case, creating artwork is one of them.

Also behind the cut is my most updated version of the Generative Application.

I do enjoy drawing and when I spend a lot of time on something, it tends to turn out alright (I think). At the same time, I can’t seem to manage to create successful vector-based art particularly well, despite trying. After attempting to create a few pieces, I decided that if I wanted the final e-card application to look good and attractive (one of the project goals), I would really need to find a different way of getting the resources. One idea I had was to ask the dd09 and dd10 classes if anyone would be interested in helping me create 10 to 15 different vector pieces. Unfortunately, no one replied to my e-mail. However, a fellow student, Asuka Kono, offered to help create some vectors for me if I help her with her flash site. Not a bad trade if I may say so!^^ My adviser, Sergio, suggested that I also look at istockphoto as a resource for purchasable, royalty-free vector artwork. Spending time there and at other “free” vector sites around the web, I gathered this collection of various potential purchases:

The next step will be to go through them to identify what exactly I’m looking at from each and which ones I can eliminate. At the moment, the entire set would cost ~ $100 Canadian. If I need to spend money on the project, I will, but it would be better to really focus in on which ones give me the highest value. Not to mention working with Asuka to see what kind of imagery she would be interested in creating before actually purchasing anything.

All in all, I’m rather excited at how the project is progressing. I upgraded my previous algorithm program, moving toward a semblance of the actual completed engine.

Click here to view the updated version

As you can tell, there have been some major integration that has taken place. Now, the main page creates a grid of points on the window and auto-selects 10 of them. At those 10 points, it calls a random number to pick which algorithm will be used. That value, the “randomize” value and the point’s x and y value are passed to a controller which selects the particular algorithm and sends all the required information to it (including the selected image). Finally, the algorithm draws itself out.

I rather like setting the randomization to around 45-55 percent. that actually results in an offset of plus or minus the percent amount to the x and y coordinate of each point. Overall, I think it gives the design a really nice “random” feel while still keeping the imagery in a coherent group. The flower graphic that is currently used is only a test one (you can easily notice the pixelation at larger size!). My final version will use vector imagery so it can be resized to any final size.

The next step will be in identifying what vector work I’m interested in from the site, what I can get help with from my classmate and continuing to refine the generative application! Oneward!!

In the process of developing the components for my final project, I spend a good bit of time developing these algebraic equations that could then be used by themselves or in patterns. The end result is an extremely powerful pair of arrays that I can do just about anything with. Check it out after the link

My goal for the component was to create a set of points that would define the shape and to develop components that would be extremely easy to alter from the outside. If I could do that, it would be really easy to feed any sort of variables into the component and return a pair of arrays of points. Then, that set of points could be used as x and y coordinates to place any sort of vector graphics onto the stage. To start, I wrote down the various kinds of components I wanted to make; a circle, a sine wave, a cosine wave and a spiral. Then I spent time pseudo-coding how to develop the code that would feed into my arrays for each of the different shapes (wikipedia is a great resource for equations!). Finally, I started coding on the computer building what I thought would be the easiest to make; the circle.

As it turned out, since the circle was the first component I decided to make, it took by far the longest. I also had to build the testing file and testing code. The main necessities for the component are starting rotation (where the first point will be placed), how many points there are (determines the spacing between points) and the radius of the circle. All these variables can be shifted by the external component controller as well as internally depending on what is needed. As the points are plotted, they are fed into an array for x values and one for y values. Thus with the two arrays I have the entire set of points for the circle. Finally, the controller calls the testing function that draws dots based on the x and y coordinates from the array. I was rather happy to see it all working properly!

Next, I started working with generating a spiral. While I originally called it just “spiral,” it was actually generating a logarithmic spiral and when I later decided to add in other kinds of spirals, I needed to alter the naming for the function. This component uses mostly the same code from the circle example, except with one exception – the two lines that generate the x and y positions. I used these formulas as my basis for identifying what the x and y values.

//Logarithmic Spiral
// y = a * e ^ (tb) * sin(Theta)
// x = a * e ^ (tb) * cos(Theta)


Very similar to the Logarithmic Spiral, the Archimedean Spiral has only a single difference; the replacement of a multiplication with an addition as seen below.

//Archimedean Spiral
// y = a * e ^ (tb) + sin(Theta)
// x = a * e ^ (tb) + cos(Theta)

^Sine

^Cosine

The sine wave and cosine wave evolved together, since they are so similar. As seen in the code, the difference is just the addition of PI/2 inside the sine.

Sine
// y = A * sin(wt) + D
Cosine
// y = A * sin(wt+PI/2) + D

After developing the first set of code for the circle, each additional function only took a half-hour to 45 minutes to create, which greatly helped speed up the development time. As a final addition, I made each variable randomly assigned when the component was created, so every time one clicks on a specific function, one will receive a different looking set of points. All in all, I’m very pleased with the way that the components work and look forward to developing uses for them.

View the component tester here

From here, I need to create a few more components (namely a straight line and a spring-like shape) and then start developing concepts for larger shapes that will make usage of these smaller components. I’m also going to look into introducing randomness into the design to produce shapes that, while appearing more random, are still arranged in a shape. Onward!

The week after we did the Friday Slam with students from the entire Digital Design program, we did a DVD package design SLAM involving just my class for a film produced by the VFS film department, The Devil and Sarah Silverspoon.

To start, the class watched the film (a short 10 minutes) and were given an information package of materials we could choose to include in the packaging or read for inspiration. Then, we were divided into two teams (not our choice, unfortunately) and tasked with developing the entire DVD package in 8 hours (by 4 PM). My team, sadly, had a bit of a slow start.

For the project, I wanted to establish a united theme that would carry the same feel across the different presentation media (dvd cover, insert, label and menu). Unfortunately, we were unable to agree on one particular theme as a team. Thus, one person suggested we split into two groups; one handling the digital side and one handling the print side. I chose the print side with another student and we got to work.

First, we brainstormed ideas for the DVD cover as that would decide the theme for the rest of the print packaging. Of all the concepts we looked at (including ones that the team as a whole developed), the one that stood out for us was the concept of the “evil eye.” We really wanted to create something that got across the concept of the film; that of a rather offbeat and silly devil, while still keeping it fairly evil. So, we developed the idea of a wrap-around cover with the face of the devil going from the front around to the back. Thus, the main features of the front cover of the DVD would be the devil’s eye, nose and the title of the film itself. Originally, we intended to put a small cake in the eye of the devil (as the devil character had a sweet tooth for baked goods), but in the actual application, the cake weakened the strength of the packaging so significantly, we scrapped the idea.

We chose an illustrative style for the packaging because we felt it introduced an element of play. The film isn’t about a true evil, but a more wannabe evil and we thought that choosing not to use live-action or real photos on the case, we would steer away from that evil aspect of the film. The devil on the cover still gives off a slightly sinister look (especially with the teeth), but it is also kinder and friendlier.

To make the cover image, I took several photos from the web and amalgamated them, then traced the parts I wanted and made some detail edits to create the final piece.

Another aspect of the creation was to re-create the logo. Unfortunately for our team, we were not given a digital copy of the logo, so it was up to me to re-create it in a way that it mirrored (or got really close to) the original.

The original:

The vectorized version:

The process for creating this logo was a bit interesting. As a student, I was unable to identify which fonts were used for the “Devil” and the “Sarah” parts. So, I cropped out the letters from the screen capture and used a service called What the Font that will accept an image file and try to figure out what letters are used in the logo. Then, once you’ve confirmed which letters are which, it makes guesses as to which font was used for the text. In this case, it nailed both of them within a few guesses. So lucky me! From there, it was a process of imitating the devil tail and horns, which was a little troubling given the low quality of the film. Hopefully in a real life situation, we would be given a digital copy of the logo and wouldn’t have to remake it, but I’m glad that it is not an impossible task.

Finally, I designed a DVD insert. In the packet of materials for the film, we were given actor and crew bios and a statement about the film from the director. I asked my partner to rapidly type up the text for those items (as were not given digital copies of them either) as I developed the insert. For the insert, I wanted to make an imitation cookbook, given how central cooking is to the film. The first page of the insert was meant to draw the viewer in and make them interested in reading through the entire insert. Thus, I made it a recipe page:

There are a large number of in-jokes that one will more fully appreciate after watching the film the first time, but even without seeing the film, one gets a sense of the playfulness and evil present. After this first page, the insert continues with the character bios as a “ingredient description” and then “where this recipe came from” as the director statement. In the last 5 minutes before the project was due, I added in the little graphic at the bottom of the page. I felt that the page needed something and the normal Fleur-de-lis just didn’t cut it for the style of the film.

Overall, I’m happy with how my sections came out. I feel that they reflected the film well and brought a playful, yet evil look that would stand out among other DVDs, enticing viewers to watch the film.

However, I feel that the project as a whole was only marginally successful; primarily due to the split in the team. Due to the team dividing in half, the look and feel of the DVD menu did not reflect the DVD print packaging and visa-versa. As the pseudo-leader of the project, I felt that this reflected poorly on me since I was unable to bring focus to the team’s design. Over the last couple terms, this has been a continual issue where I’ve ended up with a team that didn’t want to come together and have tried my best, but things haven’t always gone the best. Good thing I’m still a student and learning! There’s still plenty of time to improve and practice before the working world.

Anyways, I’m rather proud of the work myself and my partner pulled off in the 8 hours, finishing our half of the work under the deadline.

For anyone who’s interested, I got 5 more invites for Skitch. So drop me a line if you are desirous!