Skip to content

A replica of a template built whilst working at Mobkoi. Tap and reveal image shows a product image when the user hovers with the mouse or taps and drags their finger over the hotspots on the screen. It also changes the call to action based on the user’s last clicked product.

Notifications You must be signed in to change notification settings

laura-dumitru/tap-reveal-image

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

53 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Tap/reveal image

An interactive project built with JavaScript and GSAP animation.

This is a replica of a project built while working at Mobkoi. Tap and reveal image displays an image when the user hovers over a hotspot with the mouse or drags their finger across the hotspots. Another feature is the button CTA link changes based on the user’s last clicked product.

The problem it solves

The original template addressed limitations in the company’s ad software, thus expanding their product offerings. This engaging functionality is particularly effective for mobile advertising campaigns, as it encourages users to actively explore and interact with ad content. By dynamically updating the link to the last product viewed by the user, it enhances the possiblity of a product purchase. It was used to build adverts for clients such as Swarovski, Laneige, Burberry and more.

User instructions

Wait for the initial instructions animation to complete. On desktop hover over the grid/hotspots with your mouse to reveal an image. On mobile drag your finger across the grid to reveal an image.

Developer instructions

git clone https://laura-dumitru.github.io/tap-reveal-image/

Since this is an example project I would encourage you to clone and rename it so that you can use it for your own purposes.

Employers

You can see the original code I built while working at Mobkoi here: Link to my gist

About

A replica of a template built whilst working at Mobkoi. Tap and reveal image shows a product image when the user hovers with the mouse or taps and drags their finger over the hotspots on the screen. It also changes the call to action based on the user’s last clicked product.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages