Thesis Statement
Accessible to all, street art and murals can help connect a community through art. By documenting the artwork unique to the community, it can help educate, start meaningful conversation, and involve more patrons into the art around their city. I propose to make a resource in which community members can actively participate in identifying, discovering and learning more about the art around them. Along with helping identify, inspire and discover new art, this platform will also encourage users to actively participate in their community.
Project Goals
I wanted to encourage community involvement in street art all the while educating the public on the art around them in order to inspire and start meaningful discussion that is extremely relevant in today’s culture and society. I aim to target artists and community members who appreciate street art and would like to preserve it and let the art’s story be heard.
Research
To begin my research, I started looking at apps that had solved problems that I knew I would come across in my app design. I looked at Yelp to see how to better showcase all the art in a limited map setting. While researching I knew I wanted the information on my app to be generated by the community so I looked to Waze to see how they keep user generated information up to date and legitimate.
Design Process
Early in my design process I knew I wanted the name to be Street SmART so I started sketching app icons that played off the alteration of the title. I wanted to make the “S” on the icon abstract enough were it hinted back to the stenciling style that is found in street art while reminding recognizable enough to still represent a S.
Icon Development
Once I added color to my most successful icon sketches, I decided to use a color palette that represented a grittiness and urban feel like the yellow, dark grey and black evoked.
I knew I wanted the word mark and app icon to live separately but feel like they were a family. In order to successfully do so, I made the negative space in the icon equal to the negative space in the custom stencil type.
I started out using a very literal stencil then transitioned to a more dramatic and abstract stencil. The two still didn't feel right so I went back to sketching and made my own stencil typeface to accent the type used in the identity. The word mark was made to reflect the edginess and urban feel that street art has. A custom stencil typeface was designed specifically for the identity.
Wire Framing
While sketching the screens for the app, the first problem I knew I would have to tackle was the map design. A cluster map was the most efficient way for me to display all the art work in their most accurate location.
Map progression as the user zooms in.
I knew I wanted the art to be the star of the show so that meant keeping the screens clear of clutter. In order to do this, I developed an icon system in order to have less text cluttering the screen. By keeping the interface color clean by using the off-white it let the images of the art pop off the screen.
Making sure the information was legitimate and up to date was another challenged I was faced with. A "checks and balance" system is set in place similar to other community forms. Users are rewarded with points for every contribution or edit they make. A point and level system was developed in order to encourage the user to see the art in person.
Promotional Poster Design
In order to promote the app, a poster was made. Since street art has a lot of anti-advertisement themes it only made sense to make a poster that focused on the art rather than the “selling point”. After many composition revisions I was able to compose a poster that let the art take center stage. The poster is intended to be pasted up so that it becomes street art.
Final promotional poster.
Conclusion
Through this process I learned a lot about user experience design. As a designer you must predict your users next move along with understanding the unwritten rules of user experience. Now that apps have become a part of our everyday life there are trends and motions that a user expects and you must follow in order to have a seamless user experience.
Sources
Benton, Dave. “What's the Difference Between UX + UI Design?” Eye on Design, Eye on Design, 16 June 2017, eyeondesign.aiga.org/whats-the-difference-between-ux-ui-design/.
Brown, Dan M. Communicating Design . New Riders, 2007.
Moukarbel, C. (Director). (2014). Banksy Does New York [Motion picture]. United States: HBO.
Shum, A., Kruzeniski, M., & Holmes, K. (Producers). (2013, January 23). Connecting - Trends in UI, Interaction, & Experience Design [Video file]. Retrieved January 11, 2019, from https://www.youtube.com/watch?v=lciYKwVLTuk
Gibbs, M. (2005, April 11). All About Wikis [Editorial]. Network World. Retrieved January 11, 2019, from https://www.networkworld.com/article/2319940/software/all-about-wikis.html
Jones, M., Marsden, G., & Robinson, S. (2014). There's Not an App for That. Waltham, MA: Morgan Kaufmann.
Lewisohn, C., & Chalfant, H. (2009). Street Art: The Graffiti Revolution. London: Tate Publishing.
Mattanza, Alessandra/ Versteeg Chris (INT). Street Art: Famous Artists Talk about Their Vision. Sterling Pub Co Inc, 2017.
McCormick, C., Seno, E., Schiller, M., & Schiller, S. (2015). Trespass: A history of uncommissioned urban art. Köln: Taschen.
Moll, J. (Director), & E., A., & T. (Producers). (2017). Obey Giant: The Art and Dissent of Shepard Fairey [Motion picture]. United States: Hulu.
Moggridge, Bill, and Yuling Xu. Guan Jian She Ji Bao Gao: Gai Bian Guo Qu Ying Xiang Wei Lai De Jiao Hu She Ji Fa Ze =Designing Interactions. Zhong Xin Chu Ban She, 2011.
Surviving UX with Eric Reiss [Audio blog interview]. (2017, November 10). Retrieved January 11, 2019, from https://uxpodcast.com/171-surviving-ux-eric-reiss/
Saffer, D. (n.d.). Designing for Interaction: Creating Innovative Applications and Devices (Second ed.). Berkeley, CA: New Riders.
Schwartz, B. (2004). The Paradox of Choice: Why More is Less (Fist ed.). New York: Harper Collins.
The Hacking UI Podcast: Victor Yocco (UX researcher & Author) on applying psychological theory to digital design [Audio blog interview]. (2016, August 31). Retrieved January 11, 2019, from http://hackingui.com/podcast/victor-yocco-applying-psychological-theory-to-digital-design/
Young, A. (2016). Street Art World. London: Reaktion Books.
Viranel Clerard. (2015) Detroit Mural Project Archive https://detroitmurals.com/murals/
Murals in the Market, 1550 Winder Street https://www.muralsinthemarket.com/contact/
