Kiki was a smart alarm clock designed for the home. She was designed for both a touch and voice user interface. I collaborated with team at Logitech to design the UX and user interface motion.

Kiki's visual UI was intentionally minimal. Her personality was brought to life through subtle eye transformations. Kiki's animations were designed to be quick and meaningful with bursts of personality mixed in. Sadly, Kiki was never manufactured. Her spirit lives on in After Effects source files and endlessly looping GIF's.

Kiki's various states

All of Kiki's personality comes from her two small circular eyes. In order to maintain the simplicity of UI we didn't want to introduce any other facial element like a smile or nose. Kiki's eyes animations were designed to not only provide feedback to the user, but also give Kiki a friendly expressive personality. The animations were designed to be feasible to implement in a variety of software languages.

Happy
Voice Command:
"Hi Kiki"
Nailed it
Voice Command:
"Thanks Kiki"
Try Again
Trigger:
Password Error
SUCCESS
Trigger:
Task Completed, example: "Turn off the lights"
Listening
Voice Command:
"Hey Kiki"
THINKING & TALKING
Voice Command:
"What's the weather today?"
SLEEPY
Trigger:
Display goes to sleep
confused
Voice Command:
"What's an alternative fact?"
ERROR
Trigger:
Error Performing Voice Command
SEAMLESS LOOPS

Kiki's eye transitions were designed on loops, always beginning and ending on the same frames. The After Effects plugin Lottie was used to export JSON files for each animation.

LEARN MORE ABOUT LOTTIE

VOICE UI

Because Kiki responded to voice commands, feedback in the form of UI animations was an integral piece of the experience.  

Responding to voice commands was also an ideal moment in the experience to inject Kiki's personality.

TOUCH UI

Kiki was designed to have a large touch screen as well.  

These UI animations demonstrate how a user would interact with Kiki using the large touch screen.

"Everyone who sees the UI animations loves Kiki more and more!"
MELISSA SHERMAN
Head of Design, HOME at Logitech
NEXT PROJECT

MARSHALL BREWING