2022-06-01

Adding Animations to Shopify with Replo

Yuxin Zhu

Yuxin Zhu

Animation controls in Replo

Replo’s animations framework enables marketing and design teams to bring their e-commerce content to life without any code. Animation and transitions can help make content more dynamic, and help information on your page become more memorable.

Today we’re going to talk about how you can add animations to you pages with just a few clicks.

To add animations to any component on a Replo project, click on a component and navigate to the Interactions tab on the right side of the editor, and click on Add Animation.

Animations in Action

Adjusting Timing and Delay

You have complete control over the animation. Choose from our most popular animations, from a simple slide-in to shrinking and growing animations. For each animation, you can also choose the speed and duration. Once you've made your adjustments, just click Preview to view the animation live on the canvas.

About Replo

Today there are millions of e-commerce businesses built on platforms like Shopify, but developing websites for them is still a terrible experience. Marketing, design, and engineering teams all have to collaborate together to create content, but complex code and 15+ year old tech on platforms like Shopify create huge headaches for teams.

Replo is a new visual web development platform for high-performance, brand-driven teams on Shopify. Replo empowers brands and agencies to create beautiful pixel-perfect landing pages on Shopify - without developers. The product is an easy to use drag-and-drop editor that allows you to visually build React applications, starting with e-commerce. It’s backed by our super-flexible content management system and commerce APIs which integrate with 3rd-party platforms, including product, subscription, and user-defined data.

Replo is light years ahead of other page builders for customizability and page speed, and used by a ton of Shopify Plus brands and agencies. Replo’s template library has hundreds of proven landing pages and sections that anyone can use, as well as certified Experts that help build brand new landing pages in just a few days.

The Replo founders have worked together for 10+ years and previously held principal engineer + management roles at companies like Uber, Plangrid, Autodesk, and Yelp. Replo is backed by Y Combinator and folks in the e-commerce and open-source community, including the creator of NextJS.

Built for serious e-commerce teams

Replo is built for e-commerce teams, serious e-commerce teams. Whether you’re a performance marketer or a designer at an agency, iterating quickly and staying on-brand is key. In Replo, you can copy and paste sections or entire pages with one keyboard shortcut, and save and re-use any section on any page. Brands use Replo’s saved template system to create new pages quickly while keeping their content on-brand.

Power of the web in the palm of your hands.

Replo is bringing the full power of HTML/CSS in an intuitive user interface. Existing apps stop at “good enough”, but it’s never quite exactly there. Every marketing and design team has been there — there’s a certain icon that you can’t set the color on, or an image that you can’t get to animate, or a button that can add a product to the cart but can’t go straight to checkout. Every headache deteriorates the user experience and brand. Replo takes a fundamentally different approach and enables every component to have customizable styles, interactions, and animations.

Designed for Shopify.

No solution exists in a vacuum. Teams today use more and more 3rd-party services for analytics, merchandising, and subscriptions to help drive their business. Any solution that’s useful in this space must integrate seamlessly with tools that brands already love. When you build something on Replo, you have access to all the data you have in Shopify, like product and collection data. When you publish content, pages live directly on Shopify, so your analytics and conversion tracking works out of the box.

Get started with Replo today at https://replo.app

Get the Latest

E-commerce interviews and tips delivered weekly

We will never send you spam. Read ourPrivacy Policy.