10¥

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.

This entry was posted on Sunday, November 4th, 2007 at 4:33 pm and is filed under Final Project, Flash, Graphics, Work Journal. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.