Challenge: Design at least 3 cultural map “skins” for the iPhone using the theme of Personal and Family Life

As the holidays approach, joy and grief blend into rich experiences full of potential empathy. Rather than purchase new materials, create innovative maps that bring meaning into personal and family life.

Manipulate variables of a d.Maps function to guide you:

Track(s) + Dimension(s) + Media = Cultural Maps Expression

For example, I can build on the track of art and saturate myself with examples that represent emotion. While gaining empathy through interviews and observations, I eventually define the following POV:

Ben is my fictitious brother who needs a better way of coping with emotional events in his life because it’s difficult for him to visualize how they are related over time.

From this POV I can ideate around a number of potential solutions and prototype them rapidly. After several rounds of feedback and testing, I design a multimedia map like the iPhone web app pictured above based on inspiration from monitors with oscillating graphs.

Requirements:
*Optimize and test your maps on the iPhone/iPhone simulator
*Showcase at least three distinct final maps that are uniquely different (eg practical, abstract, conceptual, futuristic)
*Reference a geo-location in every map
*Make every map accessible by a short and unique url culturalmaps.org/xxxx.html (DO NOT OVERWRITE THE FILES OF OTHERS!)

Learning Goals:
* Complete the entire design process including multiple rounds of testing (get through multiple cycles)
* Practice different empathy research techniques and define clear POV(s)
* Effectively brainstorm fluent (a wide range of non-obvious) and flexible ideas (uniqueness you can build on in many directions)
* Gain competency prototyping and confidence testing rapidly
* Creatively use different media types
* Creatively use different dimensions

Dates & Deliverables:
*Share 3 paper prototypes on Thursday 11/19
*Post 3 digital prototypes to culturalmaps.org with the tag “Final Project” by Tuesday 11/24
*Prepare to test and work on your maps on Monday 11/30
*Post a summary of your Core Project including documentation of the design process, your POV(s) and a final representation of your maps with the tag “Final Project” to culturalmaps.org by Thursday 12/3
* Post inspirational media to culturalmaps.backlight.org before by Thursday 12/3
* Prepare to persuasively discuss your project in less than 5 minutes in front of the d.school community on Thursday 12/3

Directions & Resources:

*Login to the Cultural Maps server via FTP (username and password sent via email)

*Store the final link to your maps in the root html folder eg accessible at culturalmaps.org/XXXX.html. All sub-pages and media should be stored in your personal file labeled by your name

*Copy and past sample code from my example, http://culturalmaps.org/emotiontest.html into an editor like Dreamweaver. On the Firefox browser go View > Page Source.

*Note that the above example is intentionally bare bones and you can use packages like http://code.google.com/p/iui/ and http://iphone.hohli.com/ for more functionality

*Google My Maps allows you to create and embed custom maps. Click “link” > “Customize and preview embedded map” > format map accordingly to show primary point of interest. Don’t necessarily be constrained to Google, there are other mapping options available like OpenStreetMap.

*The Adobe Photoshop Slice Tool can help you get the coordinates for your image map. Remember that origin (0,0) is the upper left corner of your image map and the rect attribute takes in the coordinates of the top left and bottom right coordinates of a rectangle. Drag the tool in the left corner above the area you want hyperlinked (make sure your clickable area is large enough for a finger) > Control/right click on the slice > Select “Edit Slice Options” >Use these these x and y coordinates as the first pair in the coords attribute and add a standard # to get the coordinates of the lower right corner eg (x,y, x + #, Y + #).

*iPhone web application metrics, layout guidlines, and tips

*More Safari references from Apple

Share on Facebook

Last night started with brief check-ins about non work related activities. It’s great to hear tidbits about the lives of fellow students that I would otherwise not know about.

To warm up I showed a couple private prototypes, one I made for Project 1 and the other as an example for Project 2 by Zeen Labs.

Next, I mixed things up with a surprise challenge to get students active:

Design an audio map of art on campus in 1 hour

The instructions were to assume an initial round of need finding and definition of the following POV:

Alex (Stanford Class of 2000) is coming back for alumni weekend and needs a map of art on campus for a night tour adventure.

I created this POV because I assumed students had notions of Stanford alumni and could easily imagine empathizing with “Alex.” I also wanted them to focus on ideating and prototyping quickly.

I tried to step away completely and let students self organize. In less than 10 minutes, Brian stepped up to lead the initial brainstorm and helped the group conceptualize a map that showcased different sound hints by “banging on art.”

Students broke up into groups to capture these art sounds and came back 45 minutes later to test the prototype below.

Map of Sculptures on Stanford Campus

Imagine this map was dynamic and after clicking on an icon you hear the corresponding sounds below:

A1:
D2:
F1:
G3:
G4:
M2:
P4:
R1:

Then, I asked students to treat me like a Stanford alumnus and test the prototype. Initially, the entire interface was explained to me but I reminded students to fight the urge to talk and listen to the mental model of users without biasing them. We reviewed sample go-to questions like, “What are you thinking?” during tasks and reflected on any inconsistencies between the assumptions of the prototype listed below:

I stressed the importance of comparing your assumptions and hypotheses with feedback from testing in a systematic way. For instance, if you believe curiosity is a driver for making a decision to view a piece of art in this design, what elements of curiosity are surfaced during testing? How would you isolate variables of curiosity in future prototypes? Part of the goal of this exercise is to train students to be intentional about the effects of their design on users.

Finally, we reflected on this challenge in the following format:

“I tried…”

“I learned…”

“I felt…”

Here are some quotes from students:

Share on Facebook

Map of Sculptures on Stanford Campus

As part of our lab challenge, we went all over campus and captured the sound of various sculptures on campus.  Without seeing the actual sculptures, visitors can use the map above and sound to determine if they are interested in visiting the different sculptures.

G3

M2

P4

Share on Facebook

Challenge: Design a cultural map using routing and audio

Manipulate variables of a d.Maps function to guide you:

Track(s) + Routing + Audio = Cultural Maps Expression

For example, I can build on the track of Urban Studies and saturate myself with the differences between city development in Menlo Park, Palo Alto, and East Palo Alto. While gaining empathy through interviews and observations, I eventually define the following POV:

Wes is a Stanford undergraduate that loves to run in new places and needs a better way to study urban audio making because he wants to compare the differences between running sounds in cities.

From this POV I can ideate around a number of potential solutions and prototype them rapidly. After several rounds of feedback and testing, I design something that maps running sounds from Freesound.org for cities.

Listen to my audio from running to see the Peace Mural across the borders of Menlo Park and East Palo Alto:

My initial idea was to route the running sounds between my house and the Peace mural created by the Mural Music & Arts Project. As I ran, the differences in landscape between Menlo Park and East Palo Alto became shockingly different (smooth roads to pot holes essentially) and I was curious how my footsteps created new sounds along my route. From an urban studies perspective, this may hint at the disparities between the city development of roads. Independent of the other design modes like empathy and need finding, making this prototype took about a half-hour to make…

Learning Goals:

• Complete the entire design process including multiple rounds of testing (focus on getting through the whole cycle)
  
• Practice different empathy research techniques and define clear POV(s)
• Effectively brainstorm fluent (a wide range of non-obvious) and flexible ideas (uniqueness you can build on in many directions)
• Gain competency prototyping and confidence testing rapidly
• Creatively use audio to create and share a unique cultural experience
• Creatively use routing to create and share a unique cultural experience

Dates & Deliverables:

• Post a summary of Project 2 including documentation of the design process, your POV(s) and a final representation of your map to culturalmaps.org before Lab 4 on Thursday 10/15
• Post inspirational media to culturalmaps.backlight.org before Lab 4 on Thursday 10/15
• Prepare to discuss your project in less than 5 minutes

–Enrique Allen

Share on Facebook