Organic Olivia is a Los Angeles-based herb and wellness company. I joined this project midway through its progress, but have been able to contribute to the UI and motion design for the project.
Utilizing After Effects in conjunction with Bodymovin/Lottie, I’ve created motion designs both as proof of concept, as well as development-ready assets.
This animation for the Testimonial block was created as a proof of concept to illustrate the motion, timing and effects desired.
Since the Testimonial block is tied into the CMS our Development team built, the animation only could serve as visual guidance of the desired interactions.
Both the Mega Menu (above) and the Anatomy of an Herb (below), are also animations that were created as concepts to illustrated the desired interactions for certain portions of the site.
The animation above was designed to be a screensaver that appears when the user is idle for a set period of time. The thumbnail image was a quick mockup to show the placement of the animation across the webpage.
I illustrated and drew all of the flowers and leaves directly in After Effects, and designed it to be a JSON hand-off to our Development team.
In order to create the actual motion, due to the technical restraints of the Bodymovin plugin, quite a few workarounds had to be made in order to create something that felt both fluid and could also export directly as code.