Recitation: User Testing

Today’s recitation is about conducting user tests of your final projects. Please read the directions below for information on how to best conduct/participate in user testing.

If you are conducting a user test:

Present your project to the participants. Observe, record, and take notes of what interactions happen during the test. When you are conducting the test, do not try to sell your product. Limit your communication with the tester as much as possible and allow your participant to try and figure your project out. Do not explain how it works! If they have questions, do not simply provide an answer but try to guide them towards finding the solution on their own.

After they have tested your project, ask them about their experience. You may ask prepared questions but also ask about any occurrences you observed during the test. Take note of how their answers address your project’s interface, accessibility, predictability, learnability, etc. Take notes of their feedback and ideas about how your project can be improved.

If you are participating in the user test:

Your job is critical for providing the presenters with useful information about how their project can be improved. As you test their project, make sure to verbalize what you are doing and why you are doing it. If you stumble across something that is unclear, communicate this to the presenter.

When you have concluded the testing, please honestly answer any questions that the presenters ask and feel free to provide feedback about your user experience.

Documentation:

You should have the user testing properly documented and included in your Midterm report. 

Recitation 6: Processing Animation

Working individually, you will integrate the coding elements from this week’s classes to create an interactive animation in Processing. When you are done, screen-record a video of it.

You may animate your creation from Recitation 5, or draw and animate something completely new. Regardless of what you choose to animate, your Processing sketch should include a combination of at least 2 of these parameters:

    • Variables
    • Conditionals
    • Loops
    • Some level of interaction (i.e. keyboard or mouse).
Processing Reference Links:
Loops:

Variables:

Transform functions:

Keyboard interaction:

Mouse interaction:

Environmental variables:

Here are some animations you can get inspired by or you can try to replicate as many as you can. 

anim_1anim_4 anim_2anim_3anim_5anim_8 anim_11anim_anim_7

 

Documentation

Upload the screen recording (video) of your interactive animation along with your code (copy-as-HTML) to the documentation blog. Write some comments about what you learned during this recitation, for example, list the most interesting functions you used or what you struggled with. Be thorough so that you can refer to these notes in the future. 

Additional Homework

For each of the steps below, create a Processing sketch that satisfies the criteria in the description. Take a screenshot and a screen recoding video of the sketch after running it, and upload this to the blog along with your recitation exercise documentation.

Step 1

Create a Processing sketch with a circle or square at the center of the screen. Your canvas size should be 600 x 600.

Step 2

Next, modify that Processing sketch so that the circle or square periodically expands and contracts, like the circle in this gif.

Step 3

Then, modify the Processing sketch so that the outline changes color smoothly, as seen in the gif below. HINT: set the colorMode() to HSB.

Step 4

Finally, modify that Processing sketch so that the circle or square moves around the canvas based on your keyboard’s arrow key input.

As an added bonus, you may make your canvas’ edges a border that the circle or square cannot pass.


You can work on the assignment on your own, or join one of the Rainbow Study Sessions hosted by our amazing LAs to learn how to make this! 

rainbow study session

Rainbow Group Study Sessions

Dates:

Monday Nov 1st  | 5:45-6:45 pm

Wednesday Nov 3rd  | 12:00-1:00 pm

Location:

826 Studio