Blocto SDK
Background
Blocto SDK enables developers to integrate Web3 features into their applications with minimal effort. The marketing team needed a clean, engaging landing page visual to showcase the SDK’s capabilities, aligning with the brand’s existing identity while adding motion for extra impact.
Role & Scope
-
Role: Visual Designer
-
Collaboration: Visual Design Manager, Front‑end Developer
-
Deliverables: Lottie animations for 4 features of Blocto SDK
Project Overview
Goal
Create visuals that clearly communicate Blocto SDK’s functions while adding subtle animation to enhance engagement without distracting from the message.
Problem
The static visuals in the feature section lacked energy and didn’t fully convey the innovative, developer‑friendly nature of the SDK.
Solution
Developed 4 looping Lottie animations for the features, adding movement to key elements while keeping performance lightweight. This was my first hands‑on project with Lottie, which helped me learn JSON export and web integration.
Visual Highlights
Lottie Animation
Created smooth, scalable animation exported from After Effects
Brand Consistency
Developed graphics to match Blocto’s brand style
Performance Consideration
Balanced motion with load speed to ensure good UX
Reflection
This project was my introduction to working with Lottie animations in a live product environment. This entry focuses on the feature section visuals and the Lottie animations. Though my role was focused on the feature section visuals and motion, it gave me valuable experience in animation export workflows and collaborating with developers for web integration.
Key Takeaways
-
Learned the process of exporting and optimizing Lottie JSON animations
-
Gained insight into balancing visual impact and performance
-
Experienced in integrating motion into a live landing page