Esports Controller Microinteractions

Summary

A motion study for Outcome showing colorful game controller icons on a dark grid that burst apart with particle effects when selected, demonstrating playful microinteraction design for an esports.

Visual description

A square near-black canvas with a faint dot grid holds a three by three grid of small game controller icons, each a different flat color (orange, green, yellow, blue, pink, teal, lime, cyan, red) with a white outline and a slight drop edge. The icons are evenly spaced and centered in the upper two thirds of the frame. A small logo wordmark with a glowing blue script annotation sits at the bottom center.

Key takeaway

Use one icon repeated across a spaced grid in a full rainbow of saturated fills on a dark background, so color alone carries the variation and each tile is ready to animate individually.

Reuse notes

Reach for this as a motion still reference. Pairs with playful directions. Original by Jumeh.