Microinteractions - IDM241

Alpha Build - Interactions

Drexel University - Westphal College

Shown is a view of the URBN Center, the main building for the Westphal College of Media Arts and Design.

Drexel University - Westphal College

Shown is a view of the lobby from Drexel University's Westphal College of Media Arts and Design.

Drexel University - Westphal College

Shown is a view of a lecture hall from Drexel University's Westphal College of Media Arts and Design.

Alpha Build - Information

Triggers

  • Hover over image

Rules

  • Cursor changes to pointer
  • Image darkens
  • Text opacity increases from 0 to 1, and slides up from the bottom, vertically centering itself on image
  • On off-hover text fades back out and image lightens

Feedback

  • Cursor changes to pointer
  • Image darkens
  • Text opacity increases from 0 to 1, and slides up from the bottom, vertically centering itself on image
  • On off-hover text fades back out and image lightens

Loops and Modes

  • While hovering over the image, extra information appears to describe the image (mode)