TrouDigital - Creative Studio Walkthrough
-
Upload
lee-gannon -
Category
Software
-
view
40 -
download
0
Transcript of TrouDigital - Creative Studio Walkthrough
www.troudigital.com 1
Creative Studio Walkthrough
A TrouDigital Guide:
www.troudigital.com 2
Go to www.troudigital.com
and look for the ‘TRY IT
FREE’ button in the top
right hand corner.
www.troudigital.com 3
You will open this page
where you have two options:
1. You can click for ‘Instant
Access’ if you’re on a PC.
2. Or sign up with your
contact details if you’re
using a mobile device.
www.troudigital.com 4
If you’re registering for the
first time, you will need to
enter at least an email
address and a password to
set up an account.
www.troudigital.com 5
Once you have joined and
logged in. You will see this
screen. The ‘CREATIVE’ tab
is where your screen
designs are kept.
To create a new one, you
will need to select
‘compose’.
www.troudigital.com 6
The new ‘creative’ page
looks like this. You will
need to give your new
screen a name and
description.
You can also select the
dimensions of the screen.
When you’re finished,
click ‘create’.
www.troudigital.com 7
This suite is where
content creation happens.
From the menu of widgets
on the left hand side, you
can drag and drop
different types of content
into your screen template.
www.troudigital.com 8
To begin, we’ve selected
the ‘label’ widget at the
top.
www.troudigital.com 9
The ‘label’ widget opens a
text box in your template.
In here, you can type your
desired text and move the
box where you want it.
www.troudigital.com 10
The ‘label’ editing menu is
on the right hand side.
Using this, you can edit
your text as you would in
a Word Processor.
Changing the font, size,
colour etc.
www.troudigital.com 11
From the main ‘Creative’
menu, you can also
change the background
fill colour of your screen
display.
www.troudigital.com 12
White is a popular choice.
www.troudigital.com 13
Moving onto another widget,
this time we want to add an
image to our screen…
The ‘image’ widget is
represented with a camera.
(We’ve skipped the ‘text’
widget as it works the same
as the ‘label’ one.)
www.troudigital.com 14
When you drag and drop the
‘camera’ widget, this media
menu opens.
From here, you can choose
an existing image (from the
list on the right), or ‘Upload’
a new one.
www.troudigital.com 15
Now we’ve uploaded our
logo, let’s move onto using
the ‘slideshow’ widget,
represented by multiple
pictures.
(We’ve skipped the ‘video’
widget as it works the
same as uploading an
image.)
www.troudigital.com 16
The ‘slideshow’ widget
works in a similar way to
the ‘image’ one.
The only difference is that
you can add multiple
images, videos and text.
These options have green
‘plus’ signs in the right hand
menu.
www.troudigital.com 17
I want a slideshow of images
so I’ve selected the ‘camera’
button in the ‘slide show
properties’ menu.
From here I can select
multiple existing images or
upload new ones as before.
www.troudigital.com 18
As you can see, the first image in
my new slideshow appears in my
template.
The images are listed in the menu
on the right. Next to each file is a
box for entering the duration each
will play for.
We can have images play for
different periods of time - I’ve
chosen 3 seconds for each.
www.troudigital.com 19
Now that our ‘creative’ is
starting to take shape, it’s
important to remember to
save! This button is clearly
marked in the top left corner.
The other useful tool is the
ability to ‘preview’ your
screen. This lets us see the
Slideshow in action.
www.troudigital.com 20
This is our preview so far.
To return to the editing
suite, click the ‘X’ in the
top right hand corner.
www.troudigital.com 21
Moving onto another
dynamic widget, we have the
‘ticker’, represented on the
menu with a capital T.
The ticker lets you add
scrolling text to your screen.
It’s ideal for displaying
notices or a welcome
message.
www.troudigital.com 22
Unlike a standard
text box, a ‘ticker’
requires a ‘title’ and
‘text’.
www.troudigital.com 23
In the ‘ticker properties’
menu, you also get to
customise qualities such
as the speed and
direction of your scrolling
text.
For example, I would like
mine to read left to right.
www.troudigital.com 24
As with a standard text box,
you can change your ticker’s
font, size and colour in the
format submenu.
You will need to edit your
‘title’ and ‘content’ text
separately.
www.troudigital.com 25
We skipped the ‘video’
widget earlier because I
want to add a ‘YouTube’
video instead.
(This is often an easier
alternative if you don’t have
your own video content.)
www.troudigital.com 26
There are some default
videos to choose from (such
as of an astronaut) but you’ll
probably want to choose
your own.
You can do this by copy and
pasting the ‘id’ of any
YouTube video (the ‘id’ is
found at the end of its url).
www.troudigital.com 27
Once you enter the ‘id’ of
your desired YouTube video,
you’ll see it in your template.
From here, you can move,
increase or decrease the size
of the window it plays in.
www.troudigital.com 28
I think our screen has room
for one last widget...
Let’s go back and add an RSS
feed to make our screen
look even more dynamic.
www.troudigital.com 29
In the ‘RSS properties’ menu
you can copy and paste the
url of any RSS feed you find
on the internet.
To help we’ve pre-loaded
some popular news feeds
for you. You can find these
in the drop down box.
www.troudigital.com 30
As with any text box, you
can change the font, size
and colour of the feed to
match the rest of your
design.
www.troudigital.com 31
Our slide design is looking
pretty full now.
Let’s take a closer look with
the ‘preview’ tool…
www.troudigital.com 32
Our design preview looks
pretty good…
But as we’ve tried to show you
a lot of different widgets, it is
looking a little cramped.
Playing around with the
spacing of each element
should help with this.
www.troudigital.com 33
Returning to the suite, we
can select any of our
elements to alter its ‘size
and position’ in its property
menu.
I’d like to move our original
label further into the corner
to neaten things up…
www.troudigital.com 34
The ‘size and position’
element editor works as a
% in relation to the overall
dimensions of the screen.
For example, ‘left = 10%’
would move your element
1/10 into the screen. ‘Top
= 50%’ would move it half
way down the page. The
same works for width and
height.
www.troudigital.com 35
After playing around with
the positions of our
elements, our screen
preview looks like this.
www.troudigital.com 36
There you have it… One
dynamic screen created
using just a handful of
widgets.
Let’s make sure we save our
work before closing the
editor!
www.troudigital.com 37
Now we’ve closed the editor,
you can see that our new
‘creative’ has been added to
our ‘creative folder’.
www.troudigital.com 38
With content creation done,
there are a couple of quick
stages left in order to get
content from the studio
onto your screens.
www.troudigital.com 39
We move now to the
‘PLAYLIST’ tab of the menu.
Here we want to ‘Add
Playlist’, imagining that we’re
setting up content for a new
screen, or a group of
screens.
www.troudigital.com 40
As with a ‘creative’, you will need
to enter a ‘playlist title’ and text
description.
The new playlist will be empty
until you ‘Add Creative’.
Having selected our new
‘creative’, I can edit the duration it
will show in a playlist by typing in
its corner.
www.troudigital.com 41
Next to the duration button in
the ‘creative’ is a calendar.
Clicking on this I can set a
schedule for the ‘creative’ to
show within my playlist.
You can set it to play on loop
forever, choose particular
times or days, or even give
your content an expiry date.
www.troudigital.com 42
The whole point of a
playlist is having multiple
‘creatives’ you can play in
an order and loop.
Selecting ‘Add Creative’
again, I can choose
another from my library.
www.troudigital.com 43
With two ‘creatives’ now in
my playlist, I’ve changed their
duration to 30 seconds each.
This means they will play for
an equal length of time and
rotate between one another.
www.troudigital.com 44
Our new ‘playlist’ is ready to go!
Now I just need to assign that
playlist to a screen by connecting
it to the player plugged into the
back.
To do this, we need to move over
to the ‘players’ tab.
www.troudigital.com 45
Again, you need to set a
name and description for
your player folder.
To assign your player folder
to one of your real players,
you need to enter the ‘player
key’ found on the device
itself.
Finally, ‘Add Playlist’ in the
top right.
www.troudigital.com 46
I’ve chosen my new playlist
from the library by dragging
and dropping it into the box.
With my new content loaded
in my player folder, and my
player key assigned, my
screen is ready to go!
www.troudigital.com 47
Returning to the ‘Players’
menu, I can find a list of all
the players I have registered.
If I wanted to show different
content on different screens, I
would need a device for each
screen and hence a player
folder for each one.
www.troudigital.com 48
If you’re looking for inspiration, here are a few
screens our clients have put together recently…
www.troudigital.com 49
www.troudigital.com 50
www.troudigital.com 51
www.troudigital.com 52