00:00:12:19 - 00:00:15:22
In this tutorial
we will learn how to create clip art.

00:00:15:24 - 00:00:16:24
Sets within.

00:00:16:24 - 00:00:18:19
Invent for use in your.

00:00:18:19 - 00:00:21:02
MegaEdit products.

00:00:21:02 - 00:00:22:19
We will link the selected clip.

00:00:22:19 - 00:00:24:11
arts to a variable.

00:00:24:11 - 00:00:27:22
Which will appear as a selectable option
within our.

00:00:27:22 - 00:00:30:00
MegaEdit template.

00:00:30:23 - 00:00:33:00
The variable will
then be linked to an image.

00:00:33:00 - 00:00:35:11
Field located on our canvas.

00:00:36:23 - 00:00:37:25
So a couple of terms to.

00:00:37:25 - 00:00:40:00
Note that were mentioned in quite a. Bit.

00:00:40:00 - 00:00:41:09
The variables within.

00:00:41:09 - 00:00:44:11
Invent are used to create forms
for your products.

00:00:44:25 - 00:00:46:24
They can take the form of text.

00:00:46:24 - 00:00:49:03
That can be boolean. So true. Or false

00:00:49:20 - 00:00:54:06
Dropdown options and much more.

00:00:54:14 - 00:00:56:20
Another key term of note is resources.

00:00:57:01 - 00:00:58:08
So these are collections.

00:00:58:08 - 00:01:01:19
Of assets that can be used to help
create a MegaEdits product.

00:01:02:09 - 00:01:05:08
There are several forms of assets
available throughout Invent.

00:01:05:17 - 00:01:07:29
Including backgrounds, clip arts

00:01:08:06 - 00:01:10:21
And fonts.

00:01:13:10 - 00:01:15:20
So what we're going to start off
doing here is by creating.

00:01:15:20 - 00:01:17:26
A new resource set.

00:01:17:26 - 00:01:18:19
So if we've got.

00:01:18:19 - 00:01:22:03
InDesign launched and the Invent plugin.

00:01:22:26 - 00:01:23:14
Make sure you.

00:01:23:14 - 00:01:27:27
Navigate to your resources tab
and then click on Add resource set.

00:01:29:14 - 00:01:30:23
This gives you a pop up box.

00:01:30:23 - 00:01:34:04
Giving you a selection of different
resource set types that you can.

00:01:34:04 - 00:01:35:15
Choose from.

00:01:35:15 - 00:01:36:17
In this case, we're.

00:01:36:17 - 00:01:40:00
Going to go for a clip. Heart set.

00:01:40:00 - 00:01:44:06
So clip arts can be used as extra design
elements on a product, either as fixed.

00:01:44:06 - 00:01:46:19
Assets on the. Design or as options for.

00:01:46:19 - 00:01:50:08
Users to select
when personalizing their MegaEdit product.

00:01:51:10 - 00:01:52:13
Creating a clip art.

00:01:52:13 - 00:01:54:20
Set allows you to create a. Container.

00:01:54:20 - 00:01:57:26
To upload all of the image files
you want to make available.

00:01:58:15 - 00:02:01:07
These
then get created and included within.

00:02:01:07 - 00:02:03:18
MegaEdit as a clip arts category.

00:02:04:08 - 00:02:06:14
And then within that clip category,
there are.

00:02:06:14 - 00:02:08:24
The individual clip elements themselves.

00:02:14:04 - 00:02:15:22
So if I press select

00:02:15:22 - 00:02:25:20
and I'm going to type in a name,
we can set the accessibility level.

00:02:25:20 - 00:02:29:09
So whether it's only available
for administrators or both administrators

00:02:29:09 - 00:02:30:24
and users.

00:02:30:24 - 00:02:33:29
And then we want to add some images
or PDF.

00:02:33:29 - 00:02:42:14
Files to this particular set.

00:02:42:14 - 00:02:46:02
So that's just a case of selecting,
locating the files

00:02:46:02 - 00:02:47:23
that you want to upload

00:02:53:09 - 00:02:54:05
and clicking

00:02:54:05 - 00:03:00:29
open.

00:03:00:29 - 00:03:03:20
You can change the order
in which the resources within.

00:03:03:20 - 00:03:05:14
The clip set will. Appear.

00:03:05:14 - 00:03:08:01
And this will also change when they're

00:03:08:22 - 00:03:11:27
within MegaEdit as well.

00:03:17:04 - 00:03:18:29
You can consider creating.

00:03:18:29 - 00:03:22:05
A dropdown
variable automatically using this button.

00:03:22:05 - 00:03:25:03
Here. So dropdown variables are commonly.

00:03:25:03 - 00:03:28:03
Created to link
to a particular resource. Set.

00:03:29:01 - 00:03:32:07
We've added a function
which will automatic create.

00:03:32:07 - 00:03:35:09
A dropdown variable linked to
this clip art set.

00:03:35:28 - 00:03:37:03
Any variables can.

00:03:37:03 - 00:03:41:19
Also be created and modified
separately if required or if preferred.

00:03:45:27 - 00:03:48:02
So we're going to
check this on in this case and we'll make.

00:03:48:02 - 00:03:48:20
The variable.

00:03:48:20 - 00:03:49:28
Automatically.

00:03:49:28 - 00:03:52:21
And then I'm going to click Save.

00:03:52:21 - 00:03:54:15
So now we can see that that clip art set

00:03:54:15 - 00:03:57:29
has been created with two clip
art elements within it.

00:03:59:06 - 00:04:01:15
And if I navigate across
to my variables tab.

00:04:01:26 - 00:04:13:03
I can see that it's a drop down
variable has also been created for me.

00:04:13:03 - 00:04:13:17
So we can.

00:04:13:17 - 00:04:18:09
Amend this variable if we wish to do so,
and we can create new variables

00:04:18:09 - 00:04:21:01
by clicking on this add
variable button here.

00:04:21:29 - 00:04:23:22
These other icons set.

00:04:23:22 - 00:04:27:04
Up forms and sets of logic
will be covered in future tutorials.

00:04:28:21 - 00:04:29:08
But now we're just.

00:04:29:08 - 00:04:31:27
Going to edit our existing

00:04:31:27 - 00:04:33:05
variable,

00:04:33:21 - 00:04:35:29
which will bring up a separate pop up
window.

00:04:36:09 - 00:04:36:23
Where we can.

00:04:36:23 - 00:04:41:03
Modify
the behavior of that particular variable.

00:04:41:03 - 00:04:43:04
The first of all,
we're going to select a mode,

00:04:43:15 - 00:04:46:22
and this gives you a choice
between value or resource.

00:04:47:06 - 00:04:51:22
So value means that you can manually
add values for the user to select between.

00:04:52:14 - 00:04:54:01
You can see we could enter some things in.

00:04:54:01 - 00:04:58:20
There, or we could select resource
which selects between the resource.

00:04:58:20 - 00:05:01:12
Sets that we've created within Invent.

00:05:02:03 - 00:05:04:29
So you can see that if I select resource,

00:05:04:29 - 00:05:08:17
I have two options, which are the ones
I currently created in the resource tab,

00:05:09:16 - 00:05:10:25
the Academy logos

00:05:10:25 - 00:05:13:23
and our business card backgrounds.

00:05:14:22 - 00:05:17:19
If I select a resource
that you can select, which is considered

00:05:17:19 - 00:05:20:23
to be the default item,
so what the variable

00:05:20:23 - 00:05:24:16
will go to by default

00:05:28:06 - 00:05:28:28
and then we can hit

00:05:28:28 - 00:05:32:05
save to confirm those choices.

00:05:35:22 - 00:05:37:18
Next, we need to actually set.

00:05:37:18 - 00:05:39:18
Up a variable image field.

00:05:40:09 - 00:05:44:10
So we'll begin by loading up the.

00:05:44:10 - 00:05:47:17
Properties tab within the plugin.

00:05:49:04 - 00:05:50:12
And then selecting the field.

00:05:50:12 - 00:05:51:25
That we want to make variable.

00:05:51:25 - 00:05:54:15
Now there's only one major field on here,
which is this image.

00:05:55:03 - 00:05:56:29
I click on that you can see is.

00:05:56:29 - 00:06:00:02
Registered in the properties tab
that this is an image field

00:06:00:22 - 00:06:02:27
and if we hit enable over on the right
hand.

00:06:02:27 - 00:06:06:02
Side, that makes that a variable field.

00:06:06:02 - 00:06:12:14
So that's now going to be controlled
by Invent and subsequently MegaEdit.

00:06:13:03 - 00:06:19:24
And then we get access
to some additional options.

00:06:19:24 - 00:06:20:12
So the options.

00:06:20:12 - 00:06:25:11
That appear allow you to customize the
image settings and the general settings.

00:06:26:25 - 00:06:27:06
Image

00:06:27:06 - 00:06:30:08
settings that are modifications
to be made. Or.

00:06:30:09 - 00:06:32:16
Enabled or disabled in the.

00:06:32:16 - 00:06:35:12
Selected image itself.

00:06:35:12 - 00:06:37:21
And we'll cover a bit more about this

00:06:37:21 - 00:06:40:21
in a later part of this tutorial.

00:06:40:25 - 00:06:42:00
The general settings.

00:06:42:00 - 00:06:44:15
Covers modification of.
The image background.

00:06:44:25 - 00:06:46:22
As well as additional restrictions.

00:06:46:22 - 00:06:49:21
Such as. Disabling field deletion.

00:06:50:01 - 00:06:51:17
And. Configuring.

00:06:51:17 - 00:06:53:13
Transformation commands.

00:06:53:13 - 00:06:55:28
So if you're on the general tab
and you scroll down a little,

00:06:56:09 - 00:06:57:27
you'll see that
there's a lot of options close.

00:06:57:27 - 00:06:58:28
To the bottom.

00:06:58:28 - 00:07:01:18
Which allow you to enable
or disable certain

00:07:03:05 - 00:07:05:17
capabilities
of that particular image frame.

00:07:06:18 - 00:07:08:10
This just allows you to control what.

00:07:08:10 - 00:07:12:20
The end user will be able to do with this
frame.

00:07:12:20 - 00:07:13:28
The main thing we're going to control.

00:07:13:28 - 00:07:16:01
Here, though, is the actual image itself.

00:07:16:13 - 00:07:19:08
So if we go back to the image tab.

00:07:19:08 - 00:07:21:00
In order to dynamically change.

00:07:21:00 - 00:07:23:08
The image from our MegaEdit editor.

00:07:23:17 - 00:07:25:20
We need to map the. Image
field to either a.

00:07:25:20 - 00:07:26:12
Specified.

00:07:26:12 - 00:07:29:14
Variable or a specific resource set.

00:07:30:17 - 00:07:32:05
So in our example, we'll link it.

00:07:32:05 - 00:07:35:23
To our created dropdown variable,
which is going to appear in the form.

00:07:36:13 - 00:07:37:15
And we begin by.

00:07:37:15 - 00:07:42:08
Selecting variable from the type
dropdown list.

00:07:42:17 - 00:07:45:24
That will give us a list of all
of the variables that we have created.

00:07:45:25 - 00:07:48:03
In this case, there's only. One.

00:07:48:03 - 00:07:49:21
Which we can select.

00:07:51:21 - 00:07:55:01
Scrolling down a little bit,
we can select media and clip arts.

00:07:55:01 - 00:07:57:16
From the. Mode dropdown to enable the use.

00:07:57:16 - 00:08:01:18
Of both resource types.

00:08:01:18 - 00:08:04:04
So next, we're going to review the image
constraints.

00:08:04:23 - 00:08:06:29
Image constraints
can be used to control the way.

00:08:06:29 - 00:08:08:26
In which the end users interact with the.

00:08:08:26 - 00:08:10:20
Image field.

00:08:11:06 - 00:08:15:11
And as we saw previously with
the general tab, there are some similar.

00:08:15:11 - 00:08:19:26
Options available on the Image tab itself,
which will adjust the actual

00:08:19:26 - 00:08:23:28
image contained within the frame,
whereas the general tab will control

00:08:24:29 - 00:08:27:24
the frame itself.

00:08:30:09 - 00:08:32:18
So on the Images tab,
if I come to the constraints.

00:08:32:18 - 00:08:35:09
Right down at the bottom,
I could make some changes.

00:08:35:09 - 00:08:39:11
So for example,
I might want to limit some transformation.

00:08:39:11 - 00:08:42:00
Options such as. Flipping.

00:08:42:00 - 00:08:45:06
And rotation.

00:08:47:01 - 00:08:50:04
I can force the image to resize
within the frame.

00:08:50:04 - 00:08:52:07
Rather than being cropped to fit the frame

00:08:52:29 - 00:08:56:14
so that in that one
I can select allow fit without.

00:08:56:14 - 00:08:57:08
Cropping.

00:08:57:08 - 00:09:00:02
So that's good for something like a logo
where you need to make sure

00:09:00:02 - 00:09:04:11
you see the entire range.

00:09:04:11 - 00:09:08:06
And I could enable or disable effects
such as

00:09:09:18 - 00:09:12:05
effect adjustments, opacity changes

00:09:12:05 - 00:09:13:19
and that will probably do

00:09:13:19 - 00:09:16:08
for the selection right now.

00:09:16:28 - 00:09:19:21
So with all these changes made,
we actually need to.

00:09:19:21 - 00:09:23:18
Reexport the MEX file which we then import

00:09:23:18 - 00:09:27:01
into Infigo.

00:09:27:23 - 00:09:29:28
So first of all,
we go across. To the export tab.

00:09:30:27 - 00:09:31:26
And repeated.

00:09:31:26 - 00:09:34:08
Process from previous tutorials in the.

00:09:34:08 - 00:09:35:10
Series.

00:09:35:10 - 00:09:39:10
It's just a case of validating the design.

00:09:39:16 - 00:09:40:08
This will tell you

00:09:40:08 - 00:09:42:19
if there's any particular problem
you need to be aware of.

00:09:44:09 - 00:09:44:29
In this case, we.

00:09:44:29 - 00:09:47:01
Can see there's. A problem,
so we can say the.

00:09:47:01 - 00:09:48:19
Field does not have general.

00:09:48:19 - 00:09:52:08
Setting background set correctly.

00:09:52:08 - 00:09:53:10
Gives you an option to jump.

00:09:53:10 - 00:10:00:15
Straight to that property,
which in this case is the image field.

00:10:00:15 - 00:10:02:00
It said there was a background problem.

00:10:02:00 - 00:10:03:27
So I'll go to General

00:10:06:29 - 00:10:10:06
and then for background it's
saying that it's looking for a variable,

00:10:10:06 - 00:10:13:26
but we haven't linked anything,
so I can just change that to unlinked.

00:10:14:05 - 00:10:16:26
So it's not working to do anything
with the background

00:10:16:26 - 00:10:19:16
of that frame.

00:10:22:06 - 00:10:23:03
Back to export.

00:10:23:03 - 00:10:25:17
And we'll. Try validations again.

00:10:25:17 - 00:10:27:22
This time
it's just asking me to save the document

00:10:30:26 - 00:10:35:20
and export.

00:10:35:20 - 00:10:37:23
Next we'll navigate to our Infigo

00:10:37:23 - 00:10:41:26
admin area, locate the relevant product.

00:10:42:10 - 00:10:43:08
In our MegaEdit.

00:10:43:08 - 00:10:45:15
Products, screen. And edit.

00:10:46:14 - 00:10:48:27
And then as we've seen in previous
tutorials, we can.

00:10:48:27 - 00:11:09:16
Re-Import the file on the top right?

00:11:09:16 - 00:11:13:17
So now will launch the MegaEdit editor
with that product.

00:11:15:02 - 00:11:16:22
And what we see there is that we now.

00:11:16:22 - 00:11:18:11
Have our.

00:11:18:11 - 00:11:21:17
Logo available and it's filling
that particular image field.

00:11:22:06 - 00:11:22:26
And on the right.

00:11:22:26 - 00:11:26:16
Hand side we have a dropdown box
which is linked to those.

00:11:26:16 - 00:11:28:05
clip art

00:11:28:22 - 00:11:29:08
resource.

00:11:29:08 - 00:11:31:08
Sets that we defined.

00:11:31:08 - 00:11:32:23
So we now have the ability to change.

00:11:32:23 - 00:11:35:14
Between the utilised logo

00:11:36:15 - 00:11:38:08
if I just put a background selection
on there

00:11:38:08 - 00:11:40:16
from the previous tutorial
just so we can actually.

00:11:40:16 - 00:11:43:06
See that.

00:11:43:06 - 00:11:45:05
We can see that logo is being utilized.

00:11:52:20 - 00:11:55:21
Now in terms of what the end user
is able to do with.

00:11:55:21 - 00:11:57:16
This field.

00:11:57:16 - 00:11:59:18
We can verify that the same way we would.

00:11:59:18 - 00:12:03:22
As part of the general MegaEdit
capabilities where we can go

00:12:03:22 - 00:12:06:05
a menu and then emulate user mode.

00:12:07:22 - 00:12:10:02
From here
we can double click on any of the fields

00:12:11:20 - 00:12:13:13
and it will allow us to interact.

00:12:13:13 - 00:12:15:27
With them
in the same way that our end users can.

00:12:16:16 - 00:12:18:04
So in this case, because we've got do.

00:12:18:04 - 00:12:20:07
Not select enabled.

00:12:20:07 - 00:12:22:07
We're not able to interact with that
at all.

00:12:22:23 - 00:12:25:23
So our end user can't make any changes
apart from

00:12:26:28 - 00:12:30:24
the dropdown over on the right hand side.