Welcome to Art 202/302/702 - Design/Advanced Design! Here's what I would like to go over today:

  1. The Course Description
  2. Introductions (with a brief description of an app you love) 
  3. The Course Schedule
  4. The Course Resources
  5. Laws of UX
  6. Personae
  7. User Journeys
  8. Questions for the Bronx Children's Museum
  9. Intro to Figma

Homework – Due February 10

Before you begin the Figma Training, you'll need a Figma Account. Figma is an online and (mostly) free wireframing and prototyping tool. It is free for students and educators (i.e. us!) and allows us to collaborate in real-time on projects. [Click here] to create your account, and while you're there, be sure to get verified as a student to really make the most use out of it. Once you do this, I will add you to the design team.

  1. Our training begins in Figma Ninja!
  2. Finish this ninja training for homework!
  3. Complete this form to submit the homework:

NOTE: Next week we will be meeting at the Bronx Children's Museum. Below are directions for how to get there from Lehman:

Homework Part 2.)Create both a Pinterest and a Dribbble account if you have none – then create a board for UI/UX design or similar and begin collecting examples of things you find interesting. 

Homework Part 3.)Also, get a sketchbook!

 

User Personae

The first step to any UX (user experience) project is to humanize the design challenges. We do this not just by creating a type of person, but by actually creating an individual. In UX this is called a persona. Personae are instrumental in understanding how an actual, diverse group of people (our future user base) are going to interact with and experience our designs. Throughout the design process, we can keep referring back to them, asking how which choices they might make or how something might make them feel. Personae form the basis of UX design because they are the center of our story.

Let's create a three now based on the following design challenge and brief:

  • Unless you've already done it, it can be difficult to walk into the Fine Arts Building and find what you're looking for.
  • We will create a way-finding system and/or kiosk-based guide to help anyone entering the Fine Arts Building.

Though there are a bunch of different kinds of people who enter and exit the Fine Arts Building daily, a large number of personae are students at Lehman College who enrolled in an Art course. Let's start there! To create each persona, it may help to ask some basic questions about why a given person would do such a thing:

  • Why did they enroll?
  • What are their expectations with the course?
  • What is their major?
  • What is their level of studio art training?
  • Do they have any specific interests in art, for example, painting, digital media, printmaking, etc?
  • What is their level of competence with digital media tools, for example, Adobe Creative Cloud, Cinema 4D, etc? 
  • Do they know their Lehman or CUNY email address? Are they using it?
  • What are their pronouns?
  • How old are they?
  • Do they have any other interests?

This is enough to start a persona. All this information can be organized into three main categories: Info, Details, and Insights. I'll create one as an example: let's call them Stephanie! Stephanie (she/her) is a 34-year-old nursing student who is taking a ceramics class to chill and get her mind off of the stresses of nursing. 

So why is all this stuff important? Let's discuss this as a class...

User Task Models and User Journeys

Task Models (aka scenarios)

One of the next steps in defining user experience is to model all the different tasks – ie a series of steps need to obtain a specific objective – that each persona might need to complete. People come into the Fine Arts Building for a bunch of reasons:

  • to get to their class
  • to ask a question or fix an issue at the main Art Dept. office
  • to meet with a professor for advising or office hours
  • to work independently in the various studios
  • to use the computer lab
  • to get technical help with a project
  • to visit the Art Gallery

Let's create an example of a task model, which we will call "The First Day of Class." This will entail a series of steps that you are currently in the process of completing:

  1. Enter Fine Arts Building
  2. Find your classroom location (floor and room number)
  3. Find a seat
  4. Meet professor and fellow students
  5. Complete class
  6. Leave room
  7. Leave Fine Arts Building

Let's think of some more possible task models... 

User Journey Mapping

With our persona Stephanie in hand, we can take her through the above task model to map out how she might experience it. Here's a brief outline:

  1. Looks at her schedule and doesn't know where the Fine Arts building is
  2. Consults campus map
  3. Enters Fine Arts on the first floor
  4. Looks for room 029... looks up and down the hallway, but can't find it
  5. Asks someone
  6. Walks down to the ground level
  7. Walks in direction of Schuster Hall
  8. Walks back and takes a left at the staircase
  9. Arrives in 029 a few minutes late
  10. Completes class feeling chill AF, so mission accomplished
  11. Leaves room
  12. Takes the exit just to the left of 029 and exits to a somewhat unfamiliar spot on campus
  13. Asks someone how to get back to the subway.

Pain points

Ok... not the most relaxing experience. Let's identify the so-called 'pain points.'

  • doesn't know where the Fine Arts building is
  • can't find a room because there is no visible building map on the 1st floor.
  • initially walks away from her classroom because no way-finding system
  • exits the building to an unfamiliar zone on campus because no way-finding...

Phases

Let's  break down this user journey into phases:

 Phase 01: Finding the room

  1. Looks at her schedule and doesn't know where the Fine Arts building is
  2. Consults campus map
  3. Enters Fine Arts on the first floor
  4. Looks for room 029... looks up and down the hallway, but can't find it
  5. Asks someone
  6. Walks down to the ground level
  7. Walks in direction of Shuster Hall
  8. Walks back and takes a left at the staircase
  9. Arrives in 029 a few minutes late

Phase 02: The class

  1. Completes class feeling chill AF, so mission accomplished

Phase 03: Leaving Class

  1. Leaves room
  2. Takes the exit just to the left of 029 and exits to a somewhat unfamiliar spot on campus
  3. Asks someone how to get back to the subway.

Now that we have a chronological outline of Stephanie's goals and actionable steps for the first day of class, we can make a timeline of these events and map her emotional state during this time, and even make some really good guesses about what she's thinking and feeling. This is essentially a systematic way to create and document empathy for each persona we come up with:

As you can see, it didn't go all that well in the beginning, but started to get better in class, and then kinda subsided again. Not the best user journey...but certainly not the worst. Ideally, we would like to make the thoughts and emotions chart at the bottom look more like a lopsided mountain: starting low, reaching a peak just before the last phase, and then sort of gently level off, much higher than the beginning. This isn't always easy to achieve, but the User Journey Map can at least show us what we need to fix. Below is the same map, but with pain points resolved with

  • campus map integration with CUNYFirst schedule
  • outdoor signage and campus way-finding system
  • easily visible building maps on each floor, next to each doorway
  • bi-directional way-finding signs and guides within hallways
  • destination guides on outdoor way-finding system that assists with off-campus transportation

stephanie user journey Stephanie better user jounrey copy

So much better! With emotional curves like this, I think we may turn Stephanie into an Art Major!  The User Journey Maps make visible what we already prolly knew: Lehman's campus and building way-finding system either suck or are non-existent. Either way, this hurts user experience and now we know how to fix it! 

Questions for the Bronx Children's Museum

To create personae and user journeys for the Bronx Children's Museum, we need to ask them a bunch of questions about the kind of people they want to visit their institution and the kind of experience they want their visitors to have. Let's form some for next week's meet-up with them.

 Here are a few sample questions:

  1. Describe a typical visitor to your museum.
  2. What does each visitor want when visiting? Why would they come here? What are they looking for?
  3. What causes your visitors distress in their roles?
  4. How would you like them to feel? Think?
  5. How can visitors keep learning/exploring once leaving the BCM?