Created for ELHC #294, "Showcase Your Family Pets Using Common E-Learning Interactions"

A tabs-based interaction that combines multiple interaction types with photos featuring my Border Terrier, PJ

Link to demo


For this challenge, we had to create a tabs-based example using the format on the American Kennel Club (AKC)'s dog breeds pages. The format on the AKC website already had a very clean and minimalistic approach so I tried to take it a step further by adding a greater variety of interactive elements.

Each tab showcases a common but different e-learning interaction: A labeled graphic, a dial, and click-and-reveals. A series of animations and states were used to make this demo feel more dynamic as you explored each tab.

The easiest part about this demo was sourcing the images as there are no shortage of photos of my dog. I included a variety of them at different stages of my Border Terrier’s life to mimic what you might see on the AKC page when learning about the breed.