In this course
Elevate your website’s design using the advanced features in the Wix Editor. Engage and impress your site visitors with customized animations, interactive galleries, sticky videos, site frames and mobile welcome screens. Plus, you’ll learn how to add extra wow factors to your site like image-based navigation menus and illustrations, pictures and fold animations that reveal as your users scroll your page.
Learn how to
Customize and time your website’s animations
Custom-design elements like site frames and mobile welcome screens
Animate galleries, logos, illustrations, page folds and navigation menus
Make your website more interactive for visitors to navigate
Robbie is a user experience designer who honed her professional design mentality through a degree in architecture. She has been contributing products to the Editor platforms at Wix for 10 years.
Wix UX Designer
Who it’s for
Site owners looking to elevate their websites’ designs and capabilities
Emerging creatives who know the basics of design and want to build interactive and animated features into their websites
Designers looking to elevate their websites with impressive, advanced features and capabilities
Resources to help you grow
Get helpful articles, practical templates and more to put your skills to work.
Build an interactive gallery
Hi, I'm Robbie, and a designer here at Wix.
In this course, you're going to learn how to elevate your site design by using Editor features.
We're going to learn the unique scroll effects, and also animations.
We're going to make interactive images and more.
Are you ready to go?
In this lesson, we're going to teach you how to use the interactive gallery to add a playful feel to your website.
So let's go ahead and take a look.
You can see here on my published website, I have a gallery.
I can drag and drop all of these, what look like stickers.
I can also rotate them, I can resize them.
This is a really nice effect to give your visitors in the header of your website, when they first visit your site and they can play around.
So, let's go ahead and see how it's done.
All right. I'm in my Wix website editor.
Now, what I'm going to want to do is click on Add.
I have a section here called Gallery.
And then I have More Galleries.
So the gallery that's going to give us this effect is called the Freestyle Gallery.
Let's go ahead and add it to our website.
Because this is just a playful gallery, it's okay that we put it outside of our content gridlines.
So let's go and stretch it all the way to the left, all the way to the right, make it as wide as possible.
This way, when the users visit my site and they play around with my gallery, they'll have more room to drag it and drop it around the site.
All right, so let's go ahead and change the images.
Let's delete these temporary ones.
And I'm going to add my own images.
So just go ahead and select all of these...
and I'm going to add them to my gallery.
And click Done.
All right, cool.
So now I have all of my stickers here, from my gallery.
The way that I made them transparent so they look like stickers is I imported what's called a PNG file.
Now, I can export these in most design softwares, and it gives us this transparent background, to make them really look like stickers.
It makes it much more playful.
Under the Layout, I have an option here to set Randomize Layout.
So if I click it a few times, it'll give me the placement where my stickers are going to start when somebody visits my website.
okay, this looks good.
Let's go ahead and check it out.
So now I can drag and drop my stickers around, I can rotate them, resize them.
Now all I need to do is publish my website and let visitors play.
So in this lesson, I taught you how to use the interactive gallery to make a playful feel on your website.
Prep for your exam with free video courses and lessons