creative process - character

This project was heavily inspired by the work of artists like Nam Mac and Nana Miyata, as well as the chrometype movement. I hoped to center a human character in the work and ended up with the following model:

After imitating cel shading through compositing and intentionally lowering the output resolution:

I tried adding eyes but it ruined their mysterious aura. I decided they needed a friend!

creative process - manufacturing noise

I knew I wanted a maximalist design. After prototyping several layouts, I crowded the screen with iconography and experimented with producing noise textures through blending modes in several iterations:

creative process - chrometype

Metallic chrome elements were sculpted in Blender, and composited on top of the work for positioning and lighting. They were then rendered with an overhead camera and added to the final design.

art direction

The festival attracts an estimated 20,000 visitors a year, mostly families and children, but also artists and students. In considering the theme and audience, we established a natural brand direction: earthy (for the environment), playful (for the kids and the inner child), and weird (for the artists).

We settled on a loose palette of greens, browns, and yellows, with the door held open for other highlights. I wanted the graphics involved to have an arts-and-crafts, hand-made aura while still being professional and accessible.

creative process

To produce most of the work, I followed the same process to maintain a consistent style. Initial ideas and sketches were illustrated in ink on paper, after which I scanned the work to maintain the grittiness of the raw penstrokes. The sketches were then cleaned up in Photoshop and then finally ported to Illustrator where finishing touches were added.

I'm really pleased with how the graphics turned out! I think the results really managed to capture the grassroots origins of the festival.

Between the awesome people, the mission, and opportunity to produce fun work, WEF will always hold a special place in my heart.

technical overview

I built this project in-house using JavaScript and MapLibre, an open-source mapping library. Although we considered no-code services like Mapbox or Esri, they were determined to be too costly or too rigid for the project goals. Geography layers were obtained from OpenStreetMap.

While this DIY approach extended dev time, it granted greater control over the map's appearance, speed, and functionality, allowing design decisions specifically targeted towards exploring trees. I developed a map appearance that I felt was suitable and effective:

Feel free to compare my work to a similar project by San Francisco.

research

According to feedback provided by Fremont residents and contractors, existing processes for tree permitting were confusing, and residents in particular had trouble understanding how to make decisions involving trees. School teachers and administrators also wanted ways to integrate green learning into their curricula. I identified 2 priorities:

gathering landmark data

The city wanted to center its "landmark trees": especially large, unique and/or ecologically important trees with special protections. In order to obtain a complete and accurate dataset, we conducted over 50 site visits to confirm the location and health of landmark trees. This data was combined with an existing database of all street trees to form a complete tree set.

Me and Braeden (the other intern, pictured) surveyed some incredible trees!

technical optimizations

Visualizing 70,000+ data points, and doing it smoothly and entirely in-memory (as opposed to using a tile server) was a critical challenge; a laggy map will never be user-friendly no matter how well its UI is designed. I baked in a few vital optimizations:

solution and takeaways

This project is still being worked and improved upon, but I'm pleased with its current state.

Through this project I learned the following:

Urban Forestry / Young Tree Care

Night at the Simphony (Commission)

Urban Forestry / Discover Urban Cooling

damyentowne.com (Commission)

UC Davis Pride Festival

Associated Students Payroll Transparency

DES51 Shelf / Classwork

eduo