Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

Designing Interactions

Well done!

You have completed Designing Interactions!

Sign up for Treehouse Back to Library

Intro to Designing Interactions

1:48 with Hope Armstrong

In this video, I'll introduce the reasons why a designer may want to prototype interactions. Download the Project Files, and I'll see you in the next video for the demo.

Further Reading:

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

    Related Discussions

    Have questions about this video? Start a discussion with the community and Treehouse staff.

    Sign up

    [MUSIC] 0:00
    Hey, it's nice to see you again. 0:04
    Now that you have a grasp of the principles, 0:07
    let's design an app that includes a range of interactions. 0:10
    For the rest of this course I'll be demoing an app that teaches people how to 0:13
    sort their waste in to compost, recycling, and landfill bins. 0:17
    But first, let's understand the reason for prototyping interactions. 0:21
    Let's say you have designed a mock-up and you have all these grand visions of how 0:26
    the screens tie into one another, and how the user interacts with a static image. 0:31
    How do you convey that to others? 0:37
    That's why you need a prototype, 0:40
    and a detailed view of the various interaction states. 0:42
    That makes it clear to stakeholders and developers, what it will look and 0:45
    feel like when developed. 0:49
    Interactive prototypes can be shown to users so you can test and 0:52
    tweak until the interactions feel right. 0:56
    Interactions need to be experienced firsthand to get a sense of how they'll be 0:59
    perceived. 1:03
    You want to make sure animations are noticeable but not distracting. 1:04
    As web animation expert, Rachel Nabors points out small localized changes 1:09
    are at risk of being missed by the user via phenomenon known as change blindness. 1:15
    Increasing the prominence of the change can trigger the user to notice the change. 1:21
    On the flip side, make sure that animation isn't too distracting. 1:27
    Rachel recommends finding a sweet spot of just enough animacy so 1:32
    that your design will feel faster and more polished. 1:37
    All right, let's get into the project. 1:41
    Download the project files and I'll see you in the next video. 1:44

    You need to sign up for Treehouse in order to download course files.

    Sign up

      You need to sign up for Treehouse in order to set up Workspace

      Sign up