AllCity

AllCity is a digital platform designed to give Cincinnati residents a broader awareness and richer appreciation for the city’s vibrant street art. The project served as my senior thesis (or capstone) project in DAAP’s Graphic Communication Design (GRCD) program. Read more…

The GRCD capstone project gives senior students the opportunity to single-handedly identify, research, and solve a communication project over the course of their final 2 semesters in the program. To meet these goals, students are expected to demonstrate their competencies in critical thinking, effective communication, social responsibility, and information literacy. A capstone is expected to serve as a DAAP student’s most significant contribution to their academic design portfolio.

During the first semester, I was challenged to identify a chosen problem space, and then to define and propose a project concept (or solution) that would serve stakeholders in that space. In the final week of the semester, I presented my refined capstone concept, including each solution component, to faculty.

The following problem statement became the driving idea behind AllCity and its design: “The opportunity for Cincinnati residents and visitors to learn from street art is hindered by the genre’s unadvertised presentation that lacks supporting information.”

Success criteria for the project were defined as follows:

• The platform should give members of Cincinnati’s downtown community immediate access to information necessary for appreciating works of street art as reflections of the city’s past, present, and future.
• The platform should promote a future in which Cincinnati’s citizens actively benefit from art not only as a medium for expression, but as an artifact that can widen their understanding of our local identity.
• The platform should foster an increased mutual awareness of sharing a single environment between diverse associations.

To overcome this problem, I proposed a set of two components—a desktop web platform and a mobile app—which could work together to make public street art more reachable and more informative for my audience.

The final semester’s efforts were dedicated to the development of the final solution components. This began with a research phase, which I used to better understand my solution’s audience, content, and competitors. I conducted a survey of existing digital platforms for curating art. Following these steps, I began exploring visual treatments for a brand, as well as the interplay between content (image) and supporting context (text) in information spaces that were highly visual. For my capstone, the striking visuals of street art needed to remain the dominant form of content, supported by contextual information that did not distract, obscure, or diminish the viewer’s experience.

The brand name “AllCity” was chosen as an homage to the early graffiti artists of the late 1980’s, who used the term “all-city” to describe a single artist’s achievement of completing pieces in every area of their city. Originally, this referred specifically to the five boroughs of New York City. Visual inspiration for the AllCity brand was taken from urban fashion and streetwear brands, city wayfinding and signage, and painted stencils and templates.

To exist in an ecosystem of striking visual content, the AllCity brand needed to be either (a) highly adaptable, such that it could re-manifest itself in different surroundings, or (b) highly defined, such that it was strongly divorced from surrounding content—spatially and/or aesthetically. Pen-and-paper ideations on brandmarks were selected and converted into vector forms. To reconcile the precise, rational, abstract vector forms with the physicality and imprecision of real street art, the final brandmark variations were combined with physical paint media to produce marks that were both well-defined and aesthetically aligned.

Alongside the development of my brand, I began designing the information system, composed of two components—a desktop web platform and a mobile app. Preliminary sketches for both components helped me to think through how I could present similar kinds of information, such as artist bios, on screens with different size constraints.

To get meaningful feedback on my ideas, I needed to translate them into concrete prototypes ready for testing. This helped me to validate not only the information I would present, but the manner in which it was presented. My first two clickable prototypes were designed to let users experience the process of searching for works of art on a desktop, in a geographically-oriented context.

Wireframe prototypes evolved into high-fidelity styleframes, created to explore and resolve the final visual aesthetic, as well as the final structural layouts and interaction model, for desktop and mobile.

The final desktop web prototype offered a set of 4 distinct application views:

• The landing view, designed to offer context for the platform’s purposes as well as features. The page is designed to familiarize new users with the platform, and communicate its potential.
• The search view, designed to present users with a set of works relevant to their search. A grid of large thumbnails maximize visual interest, while hover states provide supporting information (e.g., titles and locations) without cluttering the view.
• The explore view, which gives users an alternative method of searching through pieces of public art by placing a focus on one piece of art at a time.
• The exhibit view, which offers users a more in-depth look at a piece featured on the platform, and is the intended destination for users searching for a particular piece. The exhibit view contains several pieces of information relevant to the piece being exhibited, including a description of its subject matter and brief artist bios.

For an even deeper look at the project, check out the process book!

Tools

• Adobe Illustrator

• Adobe InDesign

• Axure RP

• AngularJS

• Google Maps API