Octava – Visual Design

App Development | Fine Art | Performance | Professional Work

Octava, an app designed to augment live performance and arts events with contextual information in real-time, has been in development for 5 years, as a collaboration between myself, and composer Linda Dusman.The art production design process for Octava posed a unique challenge. Everything we learned from our user testing has shown us that users are highly receptive to supplemental materials, but the chosen delivery method for that information was key in minimizing distraction. If the visual experience of Octava was going to enrich the experience of live performance, the aesthetic of the app needed to match the elegance of the music, environment, and texts being perceived.

The core challenge visually was to provide a visual context for the experience of the live performance that enabled an ease of reception with regard to the annotation texts, all while minimizing distraction. Here is an example annotation from an Octava performance:

Oct_Anatomy

Method

As a designer/animator, motion needed play a key role in uniting the musical performance and the app into a single experience, so I designed the UI to accommodate animated frame sequences that would progress in concert with the release of each annotation. A breakdown of the how the Octava app produces the above image reveals the relationship between text, interface elements and animations composited with Octava:

OctavaMedia_Anatomy

As the orchestra plays, annotations are released to coincide with particular moments in the performance. Simultaneously with the release of each annotation, the visual themes shift as well, providing a sense of progression, especially through longer, more dense compositions.

Production

While ultimately interperative, this design work was not arbitrary, and based on researching musicological, historical, and cultural resources to produce colors and forms that complimented each symphony. I personally created or art directed/edited every animated animated sequence for Octava, acting both as the conceptual and technical director, as well as lead animator.Two methods were developed during production to facilitate varying level of animation.

1) Looping Method: 3-5 frame animated sequences were designed to loop endlessly within specific movements of a symphony. This method allowed for frame by frame deformation, as well as pan and scan methods. The image here showcases this approach as used for accompanying Dvorak’s “New World Symphony.”

image19

Dvorak2) Animation Scroll Method: As an alternative, the scroll method focuses on developing a single image across which a virtual camera will pan. With this method, the illusion of motion is created without the need for frame by frame animation. Below is an image of the animation scroll produced for Mahler’s 5th Symphony.

Mahler5_Final

Mahler5

During the height of production for our Phase I Maryland Innovation Initiative grant, I oversaw a team of 7 interdisciplinary artists working around the country. The result was a series of animated sequences for the 30 most performed works nationwide. Below you will find a .gif sampling of visual materials from some of the symphonies within our catalogue. These changes would occur almost subliminally over time, but have been sped up hear to reveal the motion design within.

CoriglianoCopelandAppSpringStraussRosenShostakovichOP83BartokBeethovenLaMerGershwinRhap Mussorgsky BernsteinShostakovich5HindemithMozart35HolstBrahms2

Technical Expertise

  • Adobe Creative Cloud

    • After Effects
    • Illustrator
    • InDesign
    • Photoshop
  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 2D Animation
  • FX & Compositing

    • Motion Graphics
  • Graphic Design

    • Digital Print Production
  • Management, Education and Research

    • Pipeline Development
    • Production Management
    • Technology Research

Titan

Fine Art

Desire breeds vision.
Sight with grasping hands,
And feed within arms reach.

Titan is the story of this cycle, illustrating the interplay between several of its permutations; a cloud of krill, a whale, fisherman, and their environment.

Currently in development, this film will combine traditional as well as 3D animation, 2D fx/compositing and digital illustration. It is the most recent product of my ongoing musical collaboration with programmer, musician and artist Walter Harris. What began solely as an attempt to rebuild a functional musical partnership through the internet eventually yielded the process by which Titan was imagined.

Interestingly, the inability to physically play in the same space, combined with the flexibility of digital audio production strengthened our desire to compose, and much more time was spent actually discussing the ideas and emotions to be expressed that traditionally would have been developed through jam sessions in a practice space.

This process lent itself to becoming increasingly visual as well as narrative to facilitate communication. We eventually found that developing narrative structures was a key motivator in our mode of production. Narrative inspired composition is certainly not new, as many bands have often cited such inspiration for their work. What may be unique for our process in this regard is that developing visual and thematic ideas outside of a practice space was the only way to energize the creative process over such a distance.

We needed to build the stories we wanted to play.

Before long, I started doodling:

This image was the first visual result of this collaboration, acting as a style frame for the rest of the project. The storyboard was finished at the beginning of 2012 resulting in the animatic above.

© Eric Smallwood 2012

Technical Expertise

  • A/V Software

    • Ableton
  • Adobe Creative Cloud

    • After Effects
    • Illustrator
    • Media Encoder
    • Photoshop
    • Premiere
  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 2D Animation
    • 3D Animation
    • 3D Modeling
    • 3D Printing Pre-Production
    • 3D Texturing
    • Character Animation
    • Rendering
    • Rigging
    • Storyboarding
  • A/V

    • Audio Composition
    • Audio Pre and Post Production
  • FX & Compositing

    • Color Correction

Special Effects and Compositing

ART 447

Student Work

ART 447, Special Effects and Compositing is aimed at developing the skills necessary to integrate 3D imagery and animation, 2D motion graphics, and still photography utilizing Adobe After Effects.

Technical Expertise

  • Adobe Creative Cloud

    • After Effects
    • Media Encoder
    • Photoshop
  • Animation Software

    • Maya

Skills and Abilities

  • Management, Education and Research

    • Curriculum Development

A Short Ride In The Fast Machine

Professional Work

A Short Ride In A Fast Machine is the working title of a new project by UMBC visual arts professor and experimental animator Eric Dyer that is currently in development with the National Film Board of Canada. I was fortunate to have the opportunity to produce a style frame to be included in his initial application. The process developed here utilized renders of 3D models built in Dyer’s unique “cinetrope” style as background templates upon which I illustrated the foreground characters and planes shown above.

Technical Expertise

  • Adobe Creative Cloud

    • After Effects
    • Photoshop
  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 2D Animation
    • 3D Animation
    • 3D Modeling
    • Rendering
    • Storyboarding
  • FX & Compositing

    • Color Correction
  • Graphic Design

    • Digital Print Production

See Intuit Booth

National Academy of Sciences

App Development | Exhibition | Professional Work | Sound Design | Videography

The See Intuit booth was commissioned by the Cultural Programs of the National Academy of Science for the first annual USA Science and Engineering Festival at the National Mall in Washington D.C. The booth was designed with two goals in mind, to highlight contemporary scientific research on intuition, and as an interactive puzzle to help realize the implications of said research. More information can be found here.
.
.
.
.
.
.
.
.

Personal Contribution

– Technical Direction

Professional Screenings

  • See Intuit – Graphics & Animation
    USA Science and Engineering Festival 2010

Technical Expertise

  • Adobe Creative Cloud

    • After Effects
    • Media Encoder
  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 2D Animation
    • 3D Animation
    • 3D Modeling
    • 3D Texturing
    • Rendering
    • Storyboarding
  • A/V

    • Audio Pre and Post Production
    • Camera Operation
    • DSLR Photography
    • Photo Editing/Retouching
    • Video Pre and Post Production
  • FX & Compositing

    • Color Correction
    • Motion Graphics
  • Management, Education and Research

    • Pipeline Development

Augmented Reality

App Development | Professional Work

The Imaging Research Center participated in the visualization of the UMBC Campus Master Plan Update process and presentation. Using an extensive 3D model of campus which I help manufacture several years before, we created three visualizations: a highly rendered animation showing future buildings; video motion tracking showing future buildings in live video settings, and a cutting-edge augmented reality display of the campus to illustrate over-arching campus planning themes.

Technical Expertise

  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 3D Modeling
    • 3D Texturing
    • Rendering
  • A/V

    • Live Video Production
  • FX & Compositing

    • Color Correction
  • Management, Education and Research

    • Pipeline Development
  • UX/UI

    • App Development

Speak Health

Professional Work | Sound Design | Videography

Speak Health was a media blog and research compendium designed to foster meaningful public discourse about holistic health perspectives developed at the Imaging Research Center. As part of the partnership between the IRC and The Institute for Integrative Health, I helped produce a short film about an interesting study that focused on the lower rates of heart disease found within a neighborhood that had developed and maintained a strong sense of community. I modeled and animated a giant human heart that acted as the central metaphor in the film documented in the videos posted here. Learn is more about the project here.

Technical Expertise

  • Adobe Creative Cloud

    • After Effects
    • Photoshop
  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 3D Modeling
    • 3D Texturing
    • Rendering
    • Rigging
    • Storyboarding
  • A/V

    • Video Pre and Post Production
  • FX & Compositing

    • Color Correction
    • Motion Graphics
    • Motion Tracking

JCET/GEST

Hurricane Life Cycle

Professional Work

UMBC/JCET Earth scientist Jeff Halverson and GEST Producer David Stroud collaborated with the Imaging Research Center and Pearson publishing to develop a new generation of online textbooks. The pilot initiative developed a module focusing on understanding the origin and life cycle of hurricanes. More information can be found here.

Personal Contributions

-Technical Direction

Technical Expertise

  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 3D Animation
    • 3D Modeling
    • 3D Texturing
    • Rendering
  • A/V

    • Audio Pre and Post Production
    • Video Pre and Post Production
  • FX & Compositing

    • Color Correction
    • Motion Graphics

Visualizing Washington DC

Professional Work

An ongoing initiative in the Imaging Research Center during the past five years has been the historical reconstruction of Washington DC as it looked at the turn of the nineteenth century. There is an alarming lack of information on this period, and it has been in large part due to the efforts of IRC Director and artist turn historical compiler Dan Bailey that a more accurate visualizations of this period can now be built. The earliest phase of this project centered around producing cinematic sequences utilizing this newly compiled data set. I worked on this project intensely during this period now referred to as “Phase 1”. This culminated in a few key visualizations that verified the research methodology. Aside from project management and the development of intern curriculum, my single largest contribution was producing the animated shot above. Much more information can be found here.

Personal Contributions

-Technical Direction

Technical Expertise

  • Adobe Creative Cloud

    • After Effects
    • Photoshop
  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 2D Animation
    • 3D Animation
    • 3D Modeling
    • 3D Texturing
  • FX & Compositing

    • Color Correction
  • Management, Education and Research

    • Curriculum Development
    • Program Development

The Bellows March

Production Development

Professional Work

The Bellows March was at one time a pilot initiative between UMBC visual arts faculty Eric Dyer and the Imaging Research Center. The goal was develop a production pipeline that would successfully allow Dyer and his production assistants to build animated sculptures in 3D space with the goal of physically printing them by utilizing rapid prototyping technology. I partnered directly with Dyer to develop the specific techniques and overall production design. The goal was to produce one of these kinetic sculptures or “cinetropes” as a proof of concept. The clip here showcases an excerpt from his finished film, The Bellows March, that include animation that I designed. I also developed the unique character rigging for the interesting concertina character central to the film. Additional information can be found here.

Personal Contribution

-Technical Direction

Technical Expertise

  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 3D Animation
    • 3D Printing Pre-Production
    • Character Animation
    • Rigging
  • Management, Education and Research

    • Curriculum Development
    • Program Development

Cone Virtual Tour v3.0

App Development | Professional Work

This project meticulously reconstructs the early 20th century apartments as they were and gives a glimpse of how the sisters, Etta and Claribel Cone, incorporated their vast collection of incomparable holdings of work by Henri Matisse and major examples of Picasso, Cezanne, van Gogh, and Renoir, into their everyday life. This virtual rendition of these original apartments allows viewers to “walk-through” the collection as the Cone sisters did daily, by tapping the interactive monitor.

Currently, the Virtual Tour of the Cone Sisters’ Apartments is presented at the Baltimore Museum of Art as a real time interactive simulation. In 2010 the IRC to upgraded the tour to take advantage of new technologies and discoveries about the Cone Collection. With increased graphics memory available, each frame and sculpture could be constructed with a higher degree of detail in its polygonal mesh and texturing. Sculptures that were initially two-dimensional representations were scanned in three dimensions to become full polygonal models, as seen in the “before and after” images in the gallery bellow. Click here to read more about this project.

Technical Expertise

  • Animation Software

    • Cyslice
    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 3D Animation
    • 3D Modeling
    • 3D Texturing
    • Laser Scan Decimation
    • Rendering

Matisse

Painter As Sculptor

App Development | Professional Work

This project was a collaboration between the Imaging Research Center @ UMBC and the Baltimore Museum of Art as part of a traveling show of the sculptural works of Henri Matisse. Both pieces, a short film about the sculptural process as well as an interactive kiosk were designed to better inform the public about how to understand, approach and discuss sculpture in general.
Several sculptures by Matisse were digitally scanned in order to obtain high-resolution polygonal models that were processed and then animated as either part of the film or the interactive kiosk. Further information can be found here.

Exhibitions

  • Matisse: Painter As Sculptor – Technical Director & Animation
    • Dallas Museum Of Art 2007
    • San Fransisco Museum Of Modern Art 2007
    • Baltimore Museum Of Art 2007

Technical Expertise

  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 3D Animation
    • 3D Modeling
    • 3D Texturing
    • Laser Scan Decimation
    • Rendering
    • Storyboarding
  • A/V

    • Video Pre and Post Production
  • FX & Compositing

    • Color Correction
  • UX/UI

    • App Development

Noetic

XBOX XNA Prototype

App Development | Professional Work

Noetic was a pilot initiative launched by the Imaging Research Center in 2007. Developed around Howard Gardener’s notion of “multiple intelligences”, users were required to function in teams towards a given solution, relying on game play mechanics designed to test and respond to the real-world strength of users. More information can be found here.

Technical Expertise

  • Adobe Creative Cloud

    • Photoshop
  • Animation Software

    • Maya
  • Content Managment

    • Tortoise SVN

Skills and Abilities

  • 2D/3D Animation

    • 3D Animation
    • 3D Modeling
    • 3D Texturing
    • Character Animation
    • Rigging
    • Storyboarding
  • Management, Education and Research

    • Content Management
    • Curriculum Development
    • Program Development
  • UX/UI

    • App Development
    • Game Design

Digital Puppetry

App Development | Performance | Professional Work

During my tenure at the Imaging Research Center, I have spent significant time devoted to the development of digital puppetry. This was initiated by a collaboration between the IRC and the political cartoonist Kevin “Kal” Kallagher in 2005 to re-envision illustrated satire for an increasingly interconnected and mobile world. A team of four, including myself as lead animator, brought Kal’s illustrations of former President Bush to life as a 3D caricature, translating his signature style by digitally scanning and animating a bust made by Kal himself. After personally working with Kal to ensure all additional shapes and expressions modeled met his personal vision, I animated the two shots below as a proof of concept. Once we were sure Kal’s sensibility could be maintained, this data set was nested within a programming environment that allowed users to control the model as a puppet through the use of flight simulator joy sticks. Bush v1.0 was debuted at the Walters Art Museum as part of the opening night celebration of a retrospective show of Kal’s work entitled Mightier Than the Sword: The Satirical Pen of Kal. Much more about the project can be found here.

Years later this same technology and process was utilized when working with the Center for Women in Information Technology @ UMBC to develop avatars for their yearly festival Computer Mania Day. I worked directly with Collette Searles of UMBC Theater, who expertise in puppetry elevated the performative aspect of our system immensely by enlisting undergraduate theater majors to perform as a developed character named Jennifer Webb. More about the project can be found here.

Technical Expertise

  • Adobe Creative Cloud

    • After Effects
    • Photoshop
  • Animation Software

    • Cyslice
    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 3D Animation
    • 3D Modeling
    • 3D Texturing
    • Character Animation
    • Laser Scan Decimation
    • Rendering
    • Rigging
  • FX & Compositing

    • Color Correction
  • UX/UI

    • App Development

Euphoria

Professional Work

The Euphoria project is a fresh approach to a longstanding problem: substance abuse among teenagers. Instead of yet another short public service announcement telling people what NOT to do, it is a feature length film about how to get what everyone DOES want: happiness. And, instead of creating yet another clear and competent educational film that teenagers will sleep through, Euphoria uses dozens of improbable visual metaphors to draw people into connecting some ideas for themselves. These play against narration describing neuroscience, history and the social sciences related to happiness.

Personal Contribution

– Lead Animator

Technical Expertise

  • Adobe Creative Cloud

    • After Effects
    • Photoshop
  • Animation Software

    • Maya

Skills and Abilities

  • 2D/3D Animation

    • 3D Animation
    • 3D Modeling
    • 3D Texturing
    • Character Animation
    • Rendering
    • Rigging
    • Storyboarding
  • FX & Compositing

    • Color Correction
    • Motion Graphics
    • Motion Tracking