Svija VIBE

The power to create life.


WHAT IT DOES


Svija Vibe lets you take any element or group of elements on the page and give life to it — from a single rectangle to an entire page section.

Animations can be triggered by user interactions, scrolling or timing, and you can attach multiple triggers to multiple events.

Movement
click/name/+x275

Rotation
click/name/360>

Scaling
click/name/%800

Transparency
click/name/t0

Combinations
click/name/<315/%800/t100/+x200/-y110


NO PROGRAMMING

Svija Vibe is trivially simple to use.

Here's an example. We'll start with two rectangles in Illustrator: TRIGGER and EVENT (at right). We create an animation simply by naming the objects in the Layers panel:

TRIGGER / EVENT
click here - no, up here!

Triggers and events are connected by their name.

mouse/someName is a mouse-based trigger with name someName

click/someName/35> is an event with name someName that will be rotated 35° clockwise when the user clicks the trigger.

Once you've read this section, you can probably guess the the events above — click here to see if you're right!

It really is that simple.

Every animation is as simple as this example. But, you can create very elaborate effects by combining animations and by animating grouped objects at different levels of the hierarchy.


SCROLLING

Scroll triggers allow you to connect animations to the movement of the page.

They're popular right now, and they're extremely easy to create with Svija Vibe:

• when the page is scrolled to a given point
• when a given part of the page is visible
locked to the scroll position of the page

A GIVEN POINT
LOCKED TO SCROLLING
A VISIBLE ZONE

Show Triggers


SCROLL CANCELING


Scroll canceling enables you to animate objects that don't scroll with the page.

The event is locked to page scrolling, but a vertical offset cancels the actual scrolling.

We call it a scrub event. You can combine scrub events with different parts of your illustration to create amazing effects.

As you can see, it's a lot of fun — and we've only scratched the surface!

(Apart from preparing the images, this animation took about 15 minutes to create.)


EASY = TRANSFORMATIVE

It's nice that animating your web content has been made so easy, but there are bigger implications.

Right now, it's common to see sites that feature a few central animations in an overall design that's pretty uninteresting.

With Svija Vibe, it is so easy to add effects that you can bring life to even the smallest details of your site.

And you can still do that other thing.

Svija Vibe is based on the GreenSock Animation Platform. GSAP is a high-performance javascript animation library that enables transformative visual effects without slowing down your website.

· Get Acess to Svija · · · · Create Incredible Content · · What is Svija? · · Examples of Svija Sites · Svija FAQ · Svija give you creative freedom · Svija · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · Privacy Policy · Svija is Incredibly Fast · Terms & Conditions · · Svija Vibe ·
The power to create life. Combinations Combinations Transparency Transparency Scaling Scaling Rotation Rotation Movement Movement WHAT IT DOES Svija Vibe lets you take any element or group of elements on the page and give life to it — from a single rectangle to an entire page section.Animations can be triggered by user interactions, scrolling or timing, and you can attach multiple triggers to multiple events. Combinations Transparency Scaling Rotation Movement NO PROGRAMMING Svija Vibe is trivially simple to use. Here's an example.We'll start with two rectangles in Illustrator: TRIGGER and EVENT (below).We create an animation simply by naming the objects in the Layers panel: Triggers and events are connected by their name.mouse/someName is a mouse-based trigger with name someNameclick/someName/35> is an event with name someName that will be rotated 35° clockwise when the user clicks the trigger. It really is that simple. Every animation is as simple as this example. But, you can create very elaborate effects by combining animations and by animating grouped objects at different levels of the hierarchy. Once you've read this section, you can probably guess the the events above —  tap here then scroll up to see if you're right! tap here TRIGGER No, up here click/name/-x45click/name/<360click/name/x%250click/name/t100    click/name/t0click/name/270>/%500/t100/-x150/-y350 EVENT Scroll up and see the correct answer under each button… Scroll triggers allow you to connect animations to the movement of the page.They're popular right now, and they're extremely easy to create with Svija Vibe:• when the page is scrolled to a given point• when a given part of the page is visiblelocked to the scroll position of the page SCROLLING Show Triggers Show Triggers LOCKED TO SCROLLING A VISIBLE ZONE A GIVEN POINT Show Triggers Show Triggers Scroll canceling enables you to animate objects that don't scroll with the page.The event is locked to the vertical scroll position, but the animation doesn't scroll vertically.It's enjoyable for the user and gives them a sense of control over their experience — always a way to keep your visitors interested.As you can see, it's a lot of fun — and we've only scratched the surface! SCROLL CANCELING Scroll canceling enables you to animate objects that don't scroll with the page.The event is locked to page scrolling, but a vertical offset cancels the actual scrolling.We call it a scrub event. You can combine scrub events with different parts of your illustration to create amazing effects.As you can see, it's a lot of fun — and we've only scratched the surface! SCROLL CANCELING Apart from preparing the images, this animation took about 15 minutes to create. Created entirely in Adobe Illustrator with no programming. Just imagine what you could do with these tools… It's nice that animating your web content has been made so easy, but there are bigger implications. Right now, it's common to see sites that feature a few central animations in an overall design that's pretty uninteresting.With Svija Vibe, it is so easy to add effects that you can bring life to even the smallest details of your site.And you can still do that other thing: EASY = TRANSFORMATIVE Svija Vibe is based on the GreenSock Animation Platform. GSAP is a high-performance javascript animation library that enables transformative visual effects without slowing down your website. PRIVACY POLICYTERMS & CONDITIONS HELLO@SVIJA.COM TAP TO SEND Request Access How it Works Examples FAQ RICH CONTENT BLAZING SPEED ANIMATION