Interactive nature

Interactive nature

Step-by-step

Let's go

Welcome! This is a step by step guide to learn how to create your own interactive nature image! Are you ready?

Let's go!

First, you have to choose your favorite bird, or animal. He will be the protagonist of your interactive nature experience! We have chosen this cute European Robin. The scientific name for this bird is Erithacus rubecula. Have you picked your bird yet?

YES! I'm ready

Click on the image to interact with the final result you'll get, by following this tutorial.

Now the fun begins! Let's research about your birdie!

Click on the interactive elements below to find suggestions of information you can include. Consider these a little guide for your research!

Once you have gathered all the information you need, you can start giving life to the birdie, or animal you selected.

Continue

Let's find an image for your favorite friend. These are some options:

Once you have your image ready, make sure you know where in your computer is located. You are about to enrich your image and transform it in an amazing piece of interactive nature

Let's Continue

Let´s bring your image to life.

Log into Genially to begin!

I'm in!

How?

To access Genially, go to and click "Create your free account" to register for free.

www.genial.ly

I already have one account

What's next?

I need help

At the Genially homepage, fill out the sign-up form either by entering the requested information or by signing up using your Microsoft Account.

Tip: you'll receive an email to activate your account

Sign-up complete!

I need help

To access Genially, go to and enter the email and password you used to sign up and click enter.

www.genial.ly

I don't have an account

I need help

I'm in!

The first time you log in, you will you have to indicate your sector and profile.

Next, you will see your panel.

I need help.

I see my panel

From the Panel, click on and select the category "Interactive image"

Continue

It's time to load the image of nature you are going to enrich.

You have three options:

Then, click accept to enter the editor.

I've got my image

Before we begin editing our image, let's stop for a minute and think. We are about to add layers of information to our image, like the feeding habits of the robin, or its habitat. For this we will use buttons upon which we will apply a window interactivity.

What is a button?

What is a window?

Let's go to the editor!

Name your creation

Once inside the editor, we will name our creation from the top bar. The defect name of our image will always be "interactive image"

What's next?

You may have realized the image came with two buttons to get you started. These are interactive elements. You can edit them, add information, and add more of necessary.

Continue

What is an interactive element?

Let's choose which type of button to use.We are going to replace the buttons that appear by default.

1. Place your mouse over the element and click.
2. Choose the option: Replace.
3. The button menu will open so that you can choose your favorite. Let’s select the circle.
4. Once selected, click replace so that the changes take effect,
5. We will do the same with the other button.

Continue

Color and size

We can personalize the buttons by changing their color and size.

1. Select multiple elements by clicking on any part of the canvas and dragging the mouse over them without unclicking.
2. Unclick and then you will have both selected.
3. Click on the toolbar and select a color.
4. Pick a corner to shrink or enlarge.

Continue

Duplicate buttons

We are going to duplicate the buttons.

1. Hover over the button you want to copy and click.
2. Click copy and then paste as many times as you need.

Alternatively, you can right-click and click "duplicate".

Continue

Interactivity

We will introduce the information in windows, to explain the image.

1. Hover your mouse over the button and click. Drag it to the area you want to explain.
2. Click on interactivity and choose window.
3. Write or paste your content and edit it with the available options.
4. When you’re finished, click on save.
5. Repeat this process with each button.

You can add as much content as you like

Continue

Animation

Finally, we can apply animation effects to the buttons.

1. Select multiple elements by clicking anywhere on the canvas and dragging your mouse over them without unclicking.
2. Click on the animation icon that appears over the selected elements.
3. Preview the different types of animation and choose the one you like best.

Continue

GREAT! You have created your genially and are ready to send it out into the universe. It's time to publish! Let's discover the options for publishing.

Discover

Publish and share

We are going to be using the title bar for all of our publishing needs.

Have a look at the different published statuses for your creation.

DRAFT

PUBLIC

PRIVATE

Ready to publish!

Get inspired

Now you know how to create an interactive image quickly and easily. Take a look at these other interactive images with a nature theme. Click, explore and get inspired!

Finish

All done Great!