subtitles for in5 + Tumult Webinar, April 7th, 2021 - https://www.youtube.com/watch?v=eV2tsFR-qhs

gistfile1.txt

1
00:00:05,440 --> 00:00:09,279
thank you for joining the webinar

2
00:00:07,359 --> 00:00:12,960
we're going to talk about putting hype

3
00:00:09,279 --> 00:00:16,559
into indesign and exporting within five

4
00:00:12,960 --> 00:00:19,1000
so that you can create really

5
00:00:16,559 --> 00:00:20,639
really cool interactive and animated

6
00:00:20,000 --> 00:00:22,879
pieces

7
00:00:20,640 --> 00:00:24,079
inside your digital magazines and other

8
00:00:22,879 --> 00:00:25,517
projects

9
00:00:24,079 --> 00:00:27,198
and we've actually got the people from

10
00:00:25,518 --> 00:00:30,639
hype today to

11
00:00:27,199 --> 00:00:33,200
to show it directly to you

12
00:00:30,640 --> 00:00:35,920
let me go through what we're going to

13
00:00:33,200 --> 00:00:35,920
talk about

14
00:00:37,600 --> 00:00:41,120
we're going to do a quick introduction

15
00:00:40,079 --> 00:00:45,039
of everybody

16
00:00:41,119 --> 00:00:46,718
on here and then i'll show you the

17
00:00:45,039 --> 00:00:48,398
the live examples of the actual

18
00:00:46,719 --> 00:00:49,759
documents we're gonna work with really

19
00:00:48,399 --> 00:00:52,319
quickly

20
00:00:49,759 --> 00:00:54,717
and then i'm going to hand it off to

21
00:00:52,320 --> 00:00:56,480
jonathan at hype and he's actually gonna

22
00:00:54,719 --> 00:00:57,920
gonna show you hype if you haven't seen

23
00:00:56,479 --> 00:00:59,519
it before

24
00:00:57,920 --> 00:01:01,279
so if you're new to hype it's going to

25
00:00:59,520 --> 00:01:03,680
be a great introduction

26
00:01:01,280 --> 00:01:05,600
and if you're new to indesign or excuse

27
00:01:03,679 --> 00:01:05,839
me in five i'll try and give you a sense

28
00:01:05,599 --> 00:01:07,998
of

29
00:01:05,840 --> 00:01:09,599
of what in five does and how it works

30
00:01:08,000 --> 00:01:12,240
with hype

31
00:01:09,599 --> 00:01:14,158
and we'll actually show the the process

32
00:01:12,239 --> 00:01:16,399
of embedding the hype content

33
00:01:14,159 --> 00:01:17,920
into indesign and then we're going to

34
00:01:16,400 --> 00:01:19,520
have a q a

35
00:01:17,920 --> 00:01:22,240
and we're going to roll pretty quickly

36
00:01:19,519 --> 00:01:24,078
it's basically going to be an overview

37
00:01:22,239 --> 00:01:26,078
if you have questions at any point you

38
00:01:24,079 --> 00:01:28,798
can put them in the chat pod

39
00:01:26,079 --> 00:01:30,157
or the q a and we've got people in there

40
00:01:28,799 --> 00:01:32,479
answering them and we're going to have

41
00:01:30,159 --> 00:01:33,199
of course this time at the end to talk

42
00:01:32,478 --> 00:01:36,718
about that

43
00:01:33,200 --> 00:01:37,600
as well um so let me stop sharing for a

44
00:01:36,719 --> 00:01:41,438
moment and

45
00:01:37,599 --> 00:01:43,709
we'll just say

46
00:01:41,438 --> 00:01:45,438
hi to everybody um

47
00:01:43,709 --> 00:01:47,199
[Music]

48
00:01:45,438 --> 00:01:49,758
i'm switching to the gallery so i can

49
00:01:47,200 --> 00:01:49,759
see them all

50
00:01:50,078 --> 00:01:53,437
why don't i i'll introduce the people

51
00:01:52,640 --> 00:01:56,640
from

52
00:01:53,438 --> 00:01:59,918
ajar first we've got uh erica gamet

53
00:01:56,640 --> 00:02:02,960
on and you want to say hi erica

54
00:01:59,920 --> 00:02:09,038
hey everybody how's it going and

55
00:02:02,959 --> 00:02:12,718
we got myra ferguson and i think

56
00:02:09,038 --> 00:02:14,877
i'm muted sorry typing and multitasking

57
00:02:12,719 --> 00:02:16,318
hi everybody she's she's already working

58
00:02:14,878 --> 00:02:19,439
in there answering your questions

59
00:02:16,318 --> 00:02:21,598
and april clark hello good to see

60
00:02:19,439 --> 00:02:23,679
everybody

61
00:02:21,598 --> 00:02:25,199
and they're all going to be uh answering

62
00:02:23,680 --> 00:02:28,640
questions as we're going through

63
00:02:25,199 --> 00:02:33,199
and then we have we have jonathan from

64
00:02:28,639 --> 00:02:36,478
hype hello thanks for having us

65
00:02:33,199 --> 00:02:40,479
and we also have daniel from hype

66
00:02:36,479 --> 00:02:42,878
yeah all right and

67
00:02:40,479 --> 00:02:44,318
they will be obviously showing their

68
00:02:42,878 --> 00:02:47,597
very cool product and you'll have a

69
00:02:44,318 --> 00:02:49,598
chance to ask questions of them as well

70
00:02:47,598 --> 00:02:51,118
and let me go back to sharing and i will

71
00:02:49,598 --> 00:02:53,359
show you

72
00:02:51,120 --> 00:02:56,318
the document that we're going to be

73
00:02:53,360 --> 00:02:56,319
basically working on

74
00:03:01,039 --> 00:03:05,758
so if you are new to n5

75
00:03:04,158 --> 00:03:07,839
this will kind of give you a sense of

76
00:03:05,759 --> 00:03:09,439
what it does first of all this

77
00:03:07,840 --> 00:03:13,359
presentation was actually made in

78
00:03:09,439 --> 00:03:16,799
indesign and exported within five so

79
00:03:13,360 --> 00:03:18,959
i want to give you a sense of just

80
00:03:16,800 --> 00:03:21,120
the the broadness of the type of content

81
00:03:18,959 --> 00:03:23,439
you can create so starting with that

82
00:03:21,120 --> 00:03:24,798
um then this is the the document that

83
00:03:23,439 --> 00:03:28,317
we're really going to be taking

84
00:03:24,799 --> 00:03:30,159
a look at most and

85
00:03:28,318 --> 00:03:32,478
it's designed with these simple

86
00:03:30,158 --> 00:03:36,158
animations this navigation this is all

87
00:03:32,479 --> 00:03:37,919
built in indesign within five

88
00:03:36,158 --> 00:03:40,558
and then this much more sophisticated

89
00:03:37,919 --> 00:03:44,877
piece was made with hype

90
00:03:40,560 --> 00:03:48,079
and it has animation that plays but also

91
00:03:44,878 --> 00:03:48,958
it can be manually navigated it's pretty

92
00:03:48,080 --> 00:03:53,120
cool and there's got

93
00:03:48,959 --> 00:03:54,878
you've got a video in here as well um

94
00:03:53,120 --> 00:03:56,399
and just give you a sense of the the

95
00:03:54,878 --> 00:03:57,518
whole piece but really we're going to be

96
00:03:56,400 --> 00:04:00,159
focused

97
00:03:57,519 --> 00:04:02,400
on this this page with the

98
00:04:00,159 --> 00:04:05,359
[Music]

99
00:04:02,400 --> 00:04:07,039
with the height piece here um again if

100
00:04:05,360 --> 00:04:07,360
you're new to n5 i'm just going to show

101
00:04:07,039 --> 00:04:09,438
you

102
00:04:07,360 --> 00:04:11,840
i spent a little time with this document

103
00:04:09,438 --> 00:04:13,358
and reworked it just to

104
00:04:11,840 --> 00:04:15,040
create different versions to show you

105
00:04:13,360 --> 00:04:17,919
the variety so this is a

106
00:04:15,039 --> 00:04:19,598
kind of a flip book version with

107
00:04:17,918 --> 00:04:23,757
basically the same content but

108
00:04:19,600 --> 00:04:23,758
reworked for for different page sizes

109
00:04:27,040 --> 00:04:32,959
and i'm just waiting for the

110
00:04:30,319 --> 00:04:33,839
the user interface zoom to disappear to

111
00:04:32,959 --> 00:04:36,398
show this one

112
00:04:33,839 --> 00:04:37,359
okay so this is a kind of a website

113
00:04:36,399 --> 00:04:40,799
version

114
00:04:37,360 --> 00:04:43,919
it's got this parallax image um

115
00:04:40,800 --> 00:04:46,960
just go to top button and

116
00:04:43,918 --> 00:04:47,599
navigation items here and then i also

117
00:04:46,959 --> 00:04:50,637
made it

118
00:04:47,600 --> 00:04:51,199
responsive so there's a a separate

119
00:04:50,639 --> 00:04:53,599
version

120
00:04:51,199 --> 00:04:54,800
for a smaller screen like a phone or a

121
00:04:53,600 --> 00:04:58,478
vertical tablet

122
00:04:54,800 --> 00:04:58,478
and here's our our high piece in there

123
00:04:59,279 --> 00:05:05,679
so that those are the the documents

124
00:05:02,478 --> 00:05:07,838
that i created just to show you

125
00:05:05,680 --> 00:05:08,720
kind of what we can do but again we're

126
00:05:07,839 --> 00:05:10,637
going to be

127
00:05:08,720 --> 00:05:12,960
largely focusing on the one that's in

128
00:05:10,639 --> 00:05:12,960
here

129
00:05:15,839 --> 00:05:19,198
and that's basically what we're looking

130
00:05:17,600 --> 00:05:20,800
at and then a very quick plug if you

131
00:05:19,199 --> 00:05:21,759
were interested in that scrolling

132
00:05:20,800 --> 00:05:24,800
website

133
00:05:21,759 --> 00:05:27,520
we just put out a course

134
00:05:24,800 --> 00:05:28,400
by keith gilbert that walks you through

135
00:05:27,519 --> 00:05:30,798
how to make

136
00:05:28,399 --> 00:05:32,559
that type of scrolling website to make

137
00:05:30,800 --> 00:05:35,359
the fixed menu at the top

138
00:05:32,560 --> 00:05:36,960
and to make the responsive version so

139
00:05:35,360 --> 00:05:39,360
you can you can check that out on the

140
00:05:36,959 --> 00:05:42,159
jar academy

141
00:05:39,360 --> 00:05:43,279
now let's let's take a a look at hype

142
00:05:42,160 --> 00:05:46,560
i'm going to

143
00:05:43,279 --> 00:05:49,519
stop sharing and hand everything

144
00:05:46,560 --> 00:05:51,758
over to jonathan and he is going to show

145
00:05:49,519 --> 00:05:55,679
you hype so let me

146
00:05:51,759 --> 00:05:59,600
get back to the right screen

147
00:05:55,680 --> 00:06:01,199
and i'm gonna make jonathan the host

148
00:05:59,600 --> 00:06:03,199
and he should be able to drive from

149
00:06:01,199 --> 00:06:05,280
there okay

150
00:06:03,199 --> 00:06:07,038
uh good morning or good afternoon or

151
00:06:05,279 --> 00:06:10,158
good evening to

152
00:06:07,038 --> 00:06:14,238
everyone so as justin said

153
00:06:10,160 --> 00:06:17,679
i am one of the creators of tumult hype

154
00:06:14,240 --> 00:06:17,999
hype is a software that allows you to

155
00:06:17,680 --> 00:06:21,280
make

156
00:06:18,000 --> 00:06:23,519
animated and interactive html5 content

157
00:06:21,279 --> 00:06:24,399
as such the output can be put in many

158
00:06:23,519 --> 00:06:27,038
places

159
00:06:24,399 --> 00:06:27,599
including an indesign document and then

160
00:06:27,038 --> 00:06:30,159
output

161
00:06:27,600 --> 00:06:32,080
to the web or for other digital

162
00:06:30,160 --> 00:06:34,160
publications from there

163
00:06:32,079 --> 00:06:35,838
so what i thought i would do is give a

164
00:06:34,160 --> 00:06:37,519
brief overview of the software

165
00:06:35,839 --> 00:06:39,278
show some of the ins and outs with a

166
00:06:37,519 --> 00:06:42,318
demo um and then

167
00:06:39,279 --> 00:06:44,559
uh give a few details on the

168
00:06:42,319 --> 00:06:46,400
document that justin was just showing

169
00:06:44,560 --> 00:06:49,840
let me go ahead and

170
00:06:46,399 --> 00:06:49,838
share my screen

171
00:06:54,639 --> 00:06:58,400
okay can everyone at least on the panel

172
00:06:56,560 --> 00:07:01,680
see my screen right now

173
00:06:58,399 --> 00:07:04,317
that good okay great um

174
00:07:01,680 --> 00:07:06,160
so hype should be pretty familiar if

175
00:07:04,319 --> 00:07:09,599
you've used tools like

176
00:07:06,160 --> 00:07:12,400
keynote or after effects it's really

177
00:07:09,598 --> 00:07:13,998
um similar to slideshow software with a

178
00:07:12,399 --> 00:07:15,758
timeline interface

179
00:07:14,000 --> 00:07:18,559
if you've used indesign at least the

180
00:07:15,759 --> 00:07:22,318
canvas part will be pretty familiar

181
00:07:18,560 --> 00:07:24,880
from there um let me show a couple just

182
00:07:22,319 --> 00:07:27,360
demo documents to show some of the

183
00:07:24,879 --> 00:07:30,478
things that people have made

184
00:07:27,360 --> 00:07:32,239
with hype um

185
00:07:30,478 --> 00:07:33,998
so hype range is the gamut of doing

186
00:07:32,240 --> 00:07:35,918
everything from like advertisements to

187
00:07:34,000 --> 00:07:37,039
infographics people have done children's

188
00:07:35,918 --> 00:07:40,719
books

189
00:07:37,038 --> 00:07:41,839
uh this is a infographic i like this one

190
00:07:40,720 --> 00:07:44,559
has a lot of info

191
00:07:41,839 --> 00:07:47,037
information um it's kind of about the

192
00:07:44,560 --> 00:07:49,039
solar system or the sun

193
00:07:47,038 --> 00:07:50,638
now of course the problem with showing

194
00:07:49,038 --> 00:07:51,998
animated content over

195
00:07:50,639 --> 00:07:54,079
zoom is you're probably not getting the

196
00:07:52,000 --> 00:07:55,279
whole frame rate effect so you'll have

197
00:07:54,079 --> 00:07:57,038
to bear with me and

198
00:07:55,279 --> 00:07:59,597
and believe that it looks uh pretty

199
00:07:57,038 --> 00:08:01,518
fantastic at least on my screen

200
00:07:59,598 --> 00:08:04,239
you can download these demo documents on

201
00:08:01,519 --> 00:08:05,278
our site if you're interested

202
00:08:04,240 --> 00:08:07,679
but you can see that there's a lot of

203
00:08:05,279 --> 00:08:10,078
sophisticated animation um

204
00:08:07,680 --> 00:08:11,119
even animating along different paths

205
00:08:10,079 --> 00:08:15,519
doing morphs

206
00:08:11,120 --> 00:08:17,360
of those paths having interactivity

207
00:08:15,519 --> 00:08:18,638
and so this is the type of document that

208
00:08:17,360 --> 00:08:22,318
you can make with

209
00:08:18,639 --> 00:08:25,119
tumult hype and even though this one's

210
00:08:22,319 --> 00:08:26,400
pretty complex the basics of working

211
00:08:25,120 --> 00:08:30,240
with hype are

212
00:08:26,399 --> 00:08:32,958
simple so you have a typical canvas view

213
00:08:30,240 --> 00:08:34,560
and let's say we wanted to build maybe

214
00:08:32,958 --> 00:08:35,598
some sort of infographic about the

215
00:08:34,559 --> 00:08:38,079
lifecycle b's

216
00:08:35,599 --> 00:08:39,839
these are commonly animated we can do

217
00:08:38,080 --> 00:08:42,158
that so you can add

218
00:08:39,839 --> 00:08:44,398
elements to the stage let's say we want

219
00:08:42,158 --> 00:08:48,079
some sort of sky background we can

220
00:08:44,399 --> 00:08:51,278
add a rectangle maybe remove a border

221
00:08:48,080 --> 00:08:51,278
set a specific color

222
00:08:52,240 --> 00:08:55,839
so this can be our of background

223
00:08:56,080 --> 00:08:59,600
of course you can also add text-based

224
00:08:58,480 --> 00:09:04,480
elements

225
00:08:59,600 --> 00:09:04,479
so we can say b whoops life cycle

226
00:09:04,559 --> 00:09:09,679
like so um and there's a lot of

227
00:09:07,839 --> 00:09:10,480
sophistication here you can add google

228
00:09:09,679 --> 00:09:12,239
fonts

229
00:09:10,480 --> 00:09:15,680
if you'd like so you can choose a

230
00:09:12,240 --> 00:09:15,679
different font that you want

231
00:09:17,120 --> 00:09:22,560
scale it up and this is all powered by

232
00:09:19,919 --> 00:09:23,838
html5 so if we want we can actually go

233
00:09:22,559 --> 00:09:26,079
in

234
00:09:23,839 --> 00:09:29,760
and modify this so if we wanted to add

235
00:09:26,080 --> 00:09:29,760
let's say html tags

236
00:09:29,839 --> 00:09:36,239
we could do something like that

237
00:09:34,480 --> 00:09:39,920
and so you can see this is all live as i

238
00:09:36,240 --> 00:09:39,920
type and it's just html

239
00:09:43,839 --> 00:09:49,279
of course hype also supports adding

240
00:09:46,480 --> 00:09:52,480
various assets so if i want

241
00:09:49,278 --> 00:09:53,678
let's say i have a b image in here i can

242
00:09:52,480 --> 00:09:56,640
do that

243
00:09:53,679 --> 00:09:57,919
and the heart of hype is being able to

244
00:09:56,639 --> 00:10:00,239
animate content

245
00:09:57,919 --> 00:10:01,999
and so in hype we try to make this as

246
00:10:00,240 --> 00:10:03,999
easy as possible

247
00:10:02,000 --> 00:10:05,200
the main way to do it is through a

248
00:10:04,000 --> 00:10:08,240
record button

249
00:10:05,200 --> 00:10:10,879
so you can just hit record uh set

250
00:10:08,240 --> 00:10:12,720
the timeline playhead wherever you want

251
00:10:10,879 --> 00:10:14,798
and just drag and drop

252
00:10:12,720 --> 00:10:17,200
and uh just like that you have an

253
00:10:14,799 --> 00:10:19,678
animation

254
00:10:17,200 --> 00:10:20,559
and so hype uses a key frame based

255
00:10:19,679 --> 00:10:22,478
animation system

256
00:10:20,559 --> 00:10:24,318
so you can see um at the bottom there's

257
00:10:22,480 --> 00:10:26,319
various keyframes that indicated the

258
00:10:24,320 --> 00:10:28,560
start which is where i recorded

259
00:10:26,320 --> 00:10:29,679
and the end you can of course create

260
00:10:28,559 --> 00:10:32,478
keyframes

261
00:10:29,679 --> 00:10:34,558
manually if you'd like and that'll make

262
00:10:32,480 --> 00:10:36,480
the animation as well

263
00:10:34,559 --> 00:10:38,159
but really the record flow i think

264
00:10:36,480 --> 00:10:39,839
handles most cases because that'll

265
00:10:38,159 --> 00:10:42,718
automatically make the keyframes from

266
00:10:39,839 --> 00:10:44,159
point a to point b

267
00:10:42,720 --> 00:10:45,440
uh one of the other things that you can

268
00:10:44,159 --> 00:10:47,199
do it's a little hard to see because my

269
00:10:45,440 --> 00:10:51,119
background's blue so why don't i try

270
00:10:47,200 --> 00:10:51,119
when i make that a little bit lighter

271
00:10:55,360 --> 00:10:59,040
is that we have the motion path that

272
00:10:57,919 --> 00:11:01,999
represents where the b

273
00:10:59,039 --> 00:11:03,439
is flying to and so with hype it's very

274
00:11:02,000 --> 00:11:04,480
easy let's say we wanted this to be a

275
00:11:03,440 --> 00:11:06,799
little bit more

276
00:11:04,480 --> 00:11:09,680
of a curve flight pattern all you need

277
00:11:06,799 --> 00:11:11,518
to do is drag that path out

278
00:11:09,679 --> 00:11:13,518
and it's like a bezier curve so you can

279
00:11:11,519 --> 00:11:15,039
adjust however you'd like

280
00:11:13,519 --> 00:11:16,958
you can even do things like make sure

281
00:11:15,039 --> 00:11:20,319
that the rotation of the b follows

282
00:11:16,958 --> 00:11:21,679
the flight of the path and so just like

283
00:11:20,320 --> 00:11:24,239
that we have

284
00:11:21,679 --> 00:11:24,719
a nice curved animation and we can

285
00:11:24,240 --> 00:11:27,999
preview

286
00:11:24,720 --> 00:11:29,1000
this in the browser this is all html5

287
00:11:28,000 --> 00:11:32,000
so we have individual elements

288
00:11:30,000 --> 00:11:34,078
selectable text it's accessible

289
00:11:32,000 --> 00:11:35,439
um you can go ahead and inspect if you

290
00:11:34,078 --> 00:11:38,318
really want to get into

291
00:11:35,440 --> 00:11:40,480
debugging at all the elements uh so just

292
00:11:38,320 --> 00:11:44,480
like that you have a pretty basic

293
00:11:40,480 --> 00:11:46,079
animation but that was easy to create

294
00:11:44,480 --> 00:11:47,839
hype is also about a lot of

295
00:11:46,078 --> 00:11:50,879
interactivity um

296
00:11:47,839 --> 00:11:52,560
so let's say you wanted to perhaps go to

297
00:11:50,879 --> 00:11:54,398
a different scene which is kind of like

298
00:11:52,559 --> 00:11:57,999
a different slide in keynote

299
00:11:54,399 --> 00:12:03,120
so we'll just say scene two here

300
00:11:58,000 --> 00:12:03,120
on the first scene we can simply add a

301
00:12:08,839 --> 00:12:13,119
button

302
00:12:10,078 --> 00:12:14,637
and now for interactivity we have this

303
00:12:13,120 --> 00:12:17,440
action inspector and so we can do

304
00:12:14,639 --> 00:12:19,518
something like say on mouse click

305
00:12:17,440 --> 00:12:20,638
uh we could jump to the next scene for

306
00:12:19,519 --> 00:12:24,560
example uh

307
00:12:20,639 --> 00:12:26,320
maybe do a swap transition

308
00:12:24,559 --> 00:12:27,679
and so now if we hit that it transitions

309
00:12:26,320 --> 00:12:28,560
to the next scene

310
00:12:27,679 --> 00:12:30,957
but there's a lot of different

311
00:12:28,559 --> 00:12:32,559
interactivity that we can do for example

312
00:12:30,958 --> 00:12:36,158
we can run javascript

313
00:12:32,559 --> 00:12:37,438
if there's added programming like logic

314
00:12:36,159 --> 00:12:39,278
that you want to do

315
00:12:37,440 --> 00:12:43,440
we provide an api to control a lot of

316
00:12:39,278 --> 00:12:46,159
the basics of the animated elements

317
00:12:43,440 --> 00:12:46,480
this can also be used to control some of

318
00:12:46,159 --> 00:12:48,638
uh

319
00:12:46,480 --> 00:12:50,319
n5's output for example you can move to

320
00:12:48,639 --> 00:12:51,679
different pages

321
00:12:50,320 --> 00:12:53,679
that's in the document that'll be shown

322
00:12:51,679 --> 00:12:55,438
a little bit later but there's other

323
00:12:53,679 --> 00:12:56,478
interactivity such as starting different

324
00:12:55,440 --> 00:12:58,160
timelines

325
00:12:56,480 --> 00:13:00,560
so one of the neat things about hype and

326
00:12:58,159 --> 00:13:02,397
interactivity is that not everything is

327
00:13:00,559 --> 00:13:04,958
just on this main timeline so if you

328
00:13:02,399 --> 00:13:06,559
wanted animations to run in parallel

329
00:13:04,958 --> 00:13:08,958
which can give you pretty sophisticated

330
00:13:06,559 --> 00:13:11,999
effects you can do that as well

331
00:13:08,958 --> 00:13:13,679
so let's say let me move this b down

332
00:13:12,000 --> 00:13:16,639
you want to have some clouds in the

333
00:13:13,679 --> 00:13:18,837
background well you may want to

334
00:13:16,639 --> 00:13:20,320
first draw out that cloud so i'll create

335
00:13:18,839 --> 00:13:21,919
a

336
00:13:20,320 --> 00:13:23,679
i'll use the pencil to draw a vector

337
00:13:21,919 --> 00:13:27,758
shape

338
00:13:23,679 --> 00:13:27,759
we'll make this just white

339
00:13:28,799 --> 00:13:31,919
and i'm using the mouse so you'll have

340
00:13:30,240 --> 00:13:34,320
to forgive my pretty terrible

341
00:13:31,919 --> 00:13:35,039
artwork right there and so now i have a

342
00:13:34,320 --> 00:13:36,958
cloud

343
00:13:35,039 --> 00:13:38,078
and maybe i want this cloud to move

344
00:13:36,958 --> 00:13:41,837
across the sky

345
00:13:38,078 --> 00:13:43,837
so what i can do is make a new timeline

346
00:13:41,839 --> 00:13:45,519
and now i can animate this moving slowly

347
00:13:43,839 --> 00:13:47,920
over the course of several seconds

348
00:13:45,519 --> 00:13:50,799
so i'll hit record again and just kind

349
00:13:47,919 --> 00:13:50,798
of move that across

350
00:13:53,440 --> 00:13:56,879
and so now we have two different

351
00:13:54,958 --> 00:13:58,239
timelines the main timeline always gets

352
00:13:56,879 --> 00:14:00,479
triggered automatically

353
00:13:58,240 --> 00:14:01,440
the secondary timeline will just say on

354
00:14:00,480 --> 00:14:03,680
scene load

355
00:14:01,440 --> 00:14:04,959
uh what we'll do is we'll start that

356
00:14:03,679 --> 00:14:08,238
timeline

357
00:14:04,958 --> 00:14:09,999
and so now we have these two items

358
00:14:08,240 --> 00:14:12,398
i started the main timeline there start

359
00:14:10,000 --> 00:14:16,078
the untitled timeline

360
00:14:12,399 --> 00:14:17,759
so now we have the cloud moving like so

361
00:14:16,078 --> 00:14:19,198
that's a pretty static cloud first of

362
00:14:17,759 --> 00:14:22,239
all it's a little odd

363
00:14:19,198 --> 00:14:23,118
that it kind of moves slowly moves

364
00:14:22,240 --> 00:14:25,679
quickly and then

365
00:14:23,120 --> 00:14:26,639
slows down again so to make this look a

366
00:14:25,679 --> 00:14:28,638
little bit better

367
00:14:26,639 --> 00:14:31,440
uh we'll do a couple things with it oh

368
00:14:28,639 --> 00:14:34,639
let's go back here

369
00:14:31,440 --> 00:14:35,359
so first of all we'll change the timing

370
00:14:34,639 --> 00:14:37,839
function from

371
00:14:35,360 --> 00:14:39,199
ease in ease out that's what let it go

372
00:14:37,839 --> 00:14:40,959
slow to begin with

373
00:14:39,198 --> 00:14:43,039
and fast at the end we can change this

374
00:14:40,958 --> 00:14:46,478
just to be linear

375
00:14:43,039 --> 00:14:49,598
um so oops that means it moves

376
00:14:46,480 --> 00:14:51,920
at the same rate all the way across

377
00:14:49,600 --> 00:14:53,1000
and for a little bit more fun what we'll

378
00:14:51,919 --> 00:14:54,479
do is make another timeline that has the

379
00:14:54,000 --> 00:14:57,198
cloud

380
00:14:54,480 --> 00:14:58,399
change shape a little bit so we'll call

381
00:14:57,198 --> 00:15:01,198
this

382
00:14:58,399 --> 00:15:01,198
cloud shape

383
00:15:02,639 --> 00:15:05,839
and so what we'll do here is we'll

384
00:15:04,240 --> 00:15:07,920
actually do a vector shape morph so

385
00:15:05,839 --> 00:15:09,759
we'll go and edit the shape

386
00:15:07,919 --> 00:15:12,558
we'll change to the pencil tool and

387
00:15:09,759 --> 00:15:16,558
we'll just record

388
00:15:12,559 --> 00:15:16,559
going into another shape

389
00:15:17,839 --> 00:15:22,159
like so and so now we can see that

390
00:15:20,399 --> 00:15:23,838
there's actually a shape morph

391
00:15:22,159 --> 00:15:25,759
of this cloud going from one shape to

392
00:15:23,839 --> 00:15:26,799
another and this is something we just

393
00:15:25,759 --> 00:15:29,439
like to

394
00:15:26,799 --> 00:15:30,957
loop back and forth a little bit so for

395
00:15:29,440 --> 00:15:32,560
this timeline we can actually have some

396
00:15:30,958 --> 00:15:35,919
more interactivity

397
00:15:32,559 --> 00:15:36,559
in the case of timeline actions so this

398
00:15:35,919 --> 00:15:39,119
time

399
00:15:36,559 --> 00:15:40,879
line will run forward and now what we

400
00:15:39,120 --> 00:15:43,198
can do is we can just go ahead and

401
00:15:40,879 --> 00:15:45,039
add a timeline action on the timeline

402
00:15:43,198 --> 00:15:46,158
that gets triggered at specific points

403
00:15:45,039 --> 00:15:49,999
in time

404
00:15:46,159 --> 00:15:51,518
and we can say continue play in reverse

405
00:15:50,000 --> 00:15:53,680
and so that means then it'll start

406
00:15:51,519 --> 00:15:53,999
looping back this way and we'll want one

407
00:15:53,679 --> 00:15:55,518
more

408
00:15:54,000 --> 00:15:59,040
just to keep this infinitely looping to

409
00:15:55,519 --> 00:16:00,959
say continue running forward

410
00:15:59,039 --> 00:16:02,078
and so likewise we will want to kick

411
00:16:00,958 --> 00:16:06,719
this off we can chain

412
00:16:02,078 --> 00:16:09,837
another action to say start timeline

413
00:16:06,720 --> 00:16:09,839
with our cloud shape

414
00:16:10,720 --> 00:16:13,839
and so just like that you have a shape

415
00:16:12,720 --> 00:16:15,759
morphing

416
00:16:13,839 --> 00:16:17,600
repeating cloud timeline in the

417
00:16:15,759 --> 00:16:20,159
background the beam moving

418
00:16:17,600 --> 00:16:21,1000
everything like that so hopefully that's

419
00:16:20,159 --> 00:16:24,159
a basic idea of

420
00:16:22,000 --> 00:16:26,000
some of the main constructs with hype

421
00:16:24,159 --> 00:16:27,598
and how easy it is to make relatively

422
00:16:26,000 --> 00:16:29,359
sophisticated

423
00:16:27,600 --> 00:16:30,639
animations with a degree of

424
00:16:29,360 --> 00:16:32,480
interactivity

425
00:16:30,639 --> 00:16:34,839
so i really marries those two things

426
00:16:32,480 --> 00:16:39,440
together

427
00:16:34,839 --> 00:16:41,518
um so let me open up the document that

428
00:16:39,440 --> 00:16:43,198
justin showed in the beginning and just

429
00:16:41,519 --> 00:16:46,879
give a quick walk through

430
00:16:43,198 --> 00:16:49,198
on that one so this one's a little bit

431
00:16:46,879 --> 00:16:51,678
more complex but uses the same basic

432
00:16:49,198 --> 00:16:54,478
building block principles screen is a

433
00:16:51,679 --> 00:16:54,478
little crowned

434
00:17:01,919 --> 00:17:05,838
bear with me while i try to move all the

435
00:17:04,480 --> 00:17:08,558
zoom controls getting in the way of

436
00:17:05,838 --> 00:17:08,558
working with this

437
00:17:08,720 --> 00:17:14,958
so in this document there's

438
00:17:11,759 --> 00:17:17,119
a few different areas of animation uh

439
00:17:14,959 --> 00:17:19,039
one is that it's building in vector

440
00:17:17,119 --> 00:17:22,399
shape based paths

441
00:17:19,038 --> 00:17:25,119
as i go across as part of the build up

442
00:17:22,400 --> 00:17:27,279
another area is that there's this

443
00:17:25,119 --> 00:17:29,918
timeline that actually builds the graph

444
00:17:27,279 --> 00:17:32,319
and shows the various different states

445
00:17:29,919 --> 00:17:35,600
and so if we look closely um

446
00:17:32,319 --> 00:17:36,798
at this animation you can see it's doing

447
00:17:35,599 --> 00:17:38,079
an effect like it's blurring the

448
00:17:36,798 --> 00:17:40,718
background

449
00:17:38,079 --> 00:17:43,519
of the lake to show that it's building

450
00:17:40,720 --> 00:17:43,519
in this graph

451
00:17:44,798 --> 00:17:52,798
and then also this uh control right here

452
00:17:48,960 --> 00:17:56,400
actually has drag actions so this will

453
00:17:52,798 --> 00:17:59,439
bind how the user drags the element

454
00:17:56,400 --> 00:18:01,440
to the control of the timeline so if i

455
00:17:59,440 --> 00:18:03,760
actually preview this document

456
00:18:01,440 --> 00:18:06,400
you can see the graph builds in but at

457
00:18:03,759 --> 00:18:07,839
any point i can go ahead and drag this

458
00:18:06,400 --> 00:18:10,480
and that's bound to the timeline so

459
00:18:07,839 --> 00:18:13,358
that's a lot of

460
00:18:10,480 --> 00:18:15,039
interactivity right there as well and

461
00:18:13,359 --> 00:18:16,638
you can see i have is similar to the

462
00:18:15,038 --> 00:18:18,159
cloud a little bit of a repeating loop

463
00:18:16,640 --> 00:18:19,280
with the boat right there

464
00:18:18,160 --> 00:18:21,360
and you can see that it looks like the

465
00:18:19,279 --> 00:18:22,158
boat's um going up and down with the

466
00:18:21,359 --> 00:18:23,918
waves

467
00:18:22,160 --> 00:18:26,320
this is actually using the physics

468
00:18:23,919 --> 00:18:29,600
engine in hype so i can drag the boat

469
00:18:26,319 --> 00:18:31,439
and drop it um and it'll go up and down

470
00:18:29,599 --> 00:18:33,358
and interact with the waves

471
00:18:31,440 --> 00:18:35,359
unfortunately the boat has capsized

472
00:18:33,359 --> 00:18:39,038
hopefully this is not

473
00:18:35,359 --> 00:18:40,639
the suez canal um

474
00:18:39,038 --> 00:18:42,399
so that's a lot of the that's the

475
00:18:40,640 --> 00:18:44,399
general document that we're working with

476
00:18:42,400 --> 00:18:47,440
so hopefully you saw from the basic b

477
00:18:44,400 --> 00:18:48,400
example to this lake example how you can

478
00:18:47,440 --> 00:18:50,640
use the

479
00:18:48,400 --> 00:18:51,759
building blocks of hype to create very

480
00:18:50,640 --> 00:18:55,039
advanced uh

481
00:18:51,759 --> 00:18:57,839
documents that can go into your indesign

482
00:18:55,038 --> 00:18:57,839
digital publication

483
00:18:57,919 --> 00:19:04,399
so hopefully uh you were able to

484
00:19:01,038 --> 00:19:06,079
follow a lot of that um i think i'll

485
00:19:04,400 --> 00:19:10,159
hand it over to justin to show

486
00:19:06,079 --> 00:19:12,319
the next steps on this document now

487
00:19:10,160 --> 00:19:14,559
awesome nice job jonathan that's really

488
00:19:12,319 --> 00:19:14,557
cool

489
00:19:15,038 --> 00:19:19,999
uh okay oops okay

490
00:19:18,480 --> 00:19:22,160
let's get your hooks down grab it i'm

491
00:19:20,000 --> 00:19:24,080
gonna share my screen

492
00:19:22,160 --> 00:19:26,480
one thing uh that you're reminding me of

493
00:19:24,079 --> 00:19:28,718
jonathan that i i forgot to show

494
00:19:26,480 --> 00:19:30,720
was that you did create this button and

495
00:19:28,720 --> 00:19:32,639
we did discover in the process of of

496
00:19:30,720 --> 00:19:35,918
doing this if you want to have

497
00:19:32,640 --> 00:19:37,600
hype interact with the the in five

498
00:19:35,919 --> 00:19:39,839
document on the outside that you do need

499
00:19:37,599 --> 00:19:43,198
to put it on a server so you notice

500
00:19:39,839 --> 00:19:45,037
this one is on a live url but this

501
00:19:43,200 --> 00:19:46,799
this learn more on page five button when

502
00:19:45,038 --> 00:19:48,399
i click it actually takes us to page

503
00:19:46,798 --> 00:19:51,198
five in the document so that's

504
00:19:48,400 --> 00:19:51,759
that's another pretty pretty darn cool

505
00:19:51,200 --> 00:19:53,599
thing

506
00:19:51,759 --> 00:19:55,759
in terms of uh working with the two

507
00:19:53,599 --> 00:19:58,879
products together

508
00:19:55,759 --> 00:19:59,999
um let me go into indesign so this is

509
00:19:58,880 --> 00:20:02,799
going to be

510
00:20:00,000 --> 00:20:04,000
uh quite a bit shorter than than looking

511
00:20:02,798 --> 00:20:05,119
at hype because there's so many cool

512
00:20:04,000 --> 00:20:07,919
things to look at hype

513
00:20:05,119 --> 00:20:10,958
and putting it into indesign is actually

514
00:20:07,919 --> 00:20:13,359
really really straightforward

515
00:20:10,960 --> 00:20:14,158
this is this is my my document and i

516
00:20:13,359 --> 00:20:18,479
just created

517
00:20:14,159 --> 00:20:21,280
a placeholder for the hype piece

518
00:20:18,480 --> 00:20:22,239
and i made it gray so i'm going to get

519
00:20:21,279 --> 00:20:23,917
rid of

520
00:20:22,240 --> 00:20:25,760
that background i'm just going to change

521
00:20:23,919 --> 00:20:27,760
it to none

522
00:20:25,759 --> 00:20:29,598
and then i'm going to go up to file

523
00:20:27,759 --> 00:20:32,638
place

524
00:20:29,599 --> 00:20:35,999
and hype is able to export

525
00:20:32,640 --> 00:20:38,640
the the raw html uh but it also will

526
00:20:36,000 --> 00:20:40,719
create this package file which is an oam

527
00:20:38,640 --> 00:20:42,159
now you can actually put either of those

528
00:20:40,720 --> 00:20:45,519
uh into

529
00:20:42,159 --> 00:20:48,080
indesign using n5 but the oam is just so

530
00:20:45,519 --> 00:20:49,839
simple because it's built into

531
00:20:48,079 --> 00:20:51,358
indesign's functionality so all i have

532
00:20:49,839 --> 00:20:54,797
to do is select that om

533
00:20:51,359 --> 00:20:56,719
file and click open to place it on the

534
00:20:54,798 --> 00:20:59,359
selected item i have

535
00:20:56,720 --> 00:21:01,279
and indesign will attempt to render

536
00:20:59,359 --> 00:21:01,999
render preview this time it did it

537
00:21:01,279 --> 00:21:05,359
perfectly which

538
00:21:02,000 --> 00:21:07,360
i'm kind of amazed at um but it

539
00:21:05,359 --> 00:21:08,479
sometimes you know i just see like gray

540
00:21:07,359 --> 00:21:10,157
box there

541
00:21:08,480 --> 00:21:11,839
don't worry about that it'll be fine

542
00:21:10,159 --> 00:21:15,519
when it exports it's just

543
00:21:11,839 --> 00:21:17,199
indesign's html renderer is a little bit

544
00:21:15,519 --> 00:21:20,398
outdated

545
00:21:17,200 --> 00:21:20,959
and it didn't change the the size so but

546
00:21:20,400 --> 00:21:22,719
that is

547
00:21:20,960 --> 00:21:24,640
one thing to watch out for because the

548
00:21:22,720 --> 00:21:27,519
first time i placed this

549
00:21:24,640 --> 00:21:29,279
um it it edited the size the renderer

550
00:21:27,519 --> 00:21:31,358
got a little confused

551
00:21:29,279 --> 00:21:34,319
and so i just had to make sure that i

552
00:21:31,359 --> 00:21:35,037
went and set this back to 800 by 678

553
00:21:34,319 --> 00:21:37,519
which is the

554
00:21:35,038 --> 00:21:38,958
the size of the height piece that i

555
00:21:37,519 --> 00:21:41,519
wanted to show up

556
00:21:38,960 --> 00:21:42,158
and from that point all i have to do is

557
00:21:41,519 --> 00:21:44,398
export

558
00:21:42,159 --> 00:21:45,1000
so i'm gonna go ahead and save it before

559
00:21:44,400 --> 00:21:47,1000
i export

560
00:21:46,000 --> 00:21:49,678
and then i would go up to in five now

561
00:21:48,000 --> 00:21:52,879
the easiest way to do it

562
00:21:49,679 --> 00:21:53,679
is the easy export wizard and that way i

563
00:21:52,880 --> 00:21:55,360
can just

564
00:21:53,679 --> 00:21:56,880
choose the type of document that i'm

565
00:21:55,359 --> 00:21:58,959
creating this one i

566
00:21:56,880 --> 00:22:00,158
i want it to have sort of that modern

567
00:21:58,960 --> 00:22:01,678
digital look or

568
00:22:00,159 --> 00:22:03,840
like an app look either one of those

569
00:22:01,679 --> 00:22:06,159
will work i'll click next

570
00:22:03,839 --> 00:22:07,678
say that i want pixel perfect text click

571
00:22:06,159 --> 00:22:11,120
next give it a title

572
00:22:07,679 --> 00:22:14,480
and i can export um now there is a more

573
00:22:11,119 --> 00:22:15,279
advanced editor if you uh or excuse me

574
00:22:14,480 --> 00:22:17,200
export

575
00:22:15,279 --> 00:22:18,479
if you go up to file and choose export

576
00:22:17,200 --> 00:22:20,400
html5

577
00:22:18,480 --> 00:22:22,558
then you can get all these types of

578
00:22:20,400 --> 00:22:25,600
options

579
00:22:22,558 --> 00:22:26,399
and and have like granular detail so the

580
00:22:25,599 --> 00:22:28,878
difference

581
00:22:26,400 --> 00:22:30,880
uh here you'd see like this is the

582
00:22:28,880 --> 00:22:34,719
slider fade in format that's

583
00:22:30,880 --> 00:22:36,240
that's the look uh of the the main piece

584
00:22:34,720 --> 00:22:38,639
um but then there's also borderless

585
00:22:36,240 --> 00:22:41,440
scroll which is like the website look

586
00:22:38,640 --> 00:22:42,880
there's the flip book look um you don't

587
00:22:41,440 --> 00:22:44,640
really need to know all these but i

588
00:22:42,880 --> 00:22:45,1000
wanted to show you the export dialogue

589
00:22:44,640 --> 00:22:47,840
if you haven't seen it

590
00:22:46,000 --> 00:22:49,600
there's just a lot of a lot of detail

591
00:22:47,839 --> 00:22:52,797
that you can put in here

592
00:22:49,599 --> 00:22:56,639
you can have it its scale to the window

593
00:22:52,798 --> 00:22:58,399
which we do have but that's that's the

594
00:22:56,640 --> 00:22:59,760
basic process and if you want to do the

595
00:22:58,400 --> 00:23:01,279
quick and dirty version you just go to

596
00:22:59,759 --> 00:23:03,439
the easy export wizard

597
00:23:01,279 --> 00:23:04,319
and choose one of these options and and

598
00:23:03,440 --> 00:23:07,520
just go through

599
00:23:04,319 --> 00:23:10,158
and and export it

600
00:23:07,519 --> 00:23:11,759
and then what you have on the other end

601
00:23:10,159 --> 00:23:14,960
is this piece right here which i'll

602
00:23:11,759 --> 00:23:15,279
refresh um and i'll just show you we've

603
00:23:14,960 --> 00:23:18,719
got

604
00:23:15,279 --> 00:23:20,838
some simple animations uh coming in here

605
00:23:18,720 --> 00:23:23,599
as part of the document and some

606
00:23:20,839 --> 00:23:25,199
navigation but again if you want this

607
00:23:23,599 --> 00:23:27,839
this super nifty thing and i didn't even

608
00:23:25,200 --> 00:23:31,600
know about the the physics piece

609
00:23:27,839 --> 00:23:33,037
that went away um that might that might

610
00:23:31,599 --> 00:23:34,639
have something to do with the fact of

611
00:23:33,038 --> 00:23:36,719
the two playing together that we'll have

612
00:23:34,640 --> 00:23:39,678
to look at um

613
00:23:36,720 --> 00:23:40,880
but you can see that this is just this

614
00:23:39,679 --> 00:23:45,039
is beyond

615
00:23:40,880 --> 00:23:46,639
what you can do in indesign

616
00:23:45,038 --> 00:23:48,158
in terms of like you can't have an

617
00:23:46,640 --> 00:23:49,999
animation playing and then

618
00:23:48,159 --> 00:23:52,798
stop it and say hey i want to adjust

619
00:23:50,000 --> 00:23:56,000
this uh can i roll that back

620
00:23:52,798 --> 00:23:58,958
um just crazy cool stuff

621
00:23:56,000 --> 00:24:00,080
and and so if you didn't know about hype

622
00:23:58,960 --> 00:24:03,519
now you do

623
00:24:00,079 --> 00:24:05,998
and if it looks complicated for you

624
00:24:03,519 --> 00:24:08,078
um you know there's always a possibility

625
00:24:06,000 --> 00:24:09,600
of having somebody else

626
00:24:08,079 --> 00:24:11,438
uh work on the animation if you've got

627
00:24:09,599 --> 00:24:14,158
somebody else on your team who's

628
00:24:11,440 --> 00:24:15,919
more comfortable with that or who likes

629
00:24:14,159 --> 00:24:16,558
getting into code wants to make custom

630
00:24:15,919 --> 00:24:18,240
stuff

631
00:24:16,558 --> 00:24:19,998
then you have the opportunity to

632
00:24:18,240 --> 00:24:21,519
collaborate with them

633
00:24:20,000 --> 00:24:23,278
because you can see how these these

634
00:24:21,519 --> 00:24:24,878
workflows could be essentially

635
00:24:23,278 --> 00:24:28,239
completely independent you can

636
00:24:24,880 --> 00:24:29,918
agree on a on a size frame uh

637
00:24:28,240 --> 00:24:32,240
let me go back and forward again we'll

638
00:24:29,919 --> 00:24:34,558
just reset everything

639
00:24:32,240 --> 00:24:36,079
you can agree on on a size frame and and

640
00:24:34,558 --> 00:24:38,078
they can work on their content

641
00:24:36,079 --> 00:24:39,599
and you know you know what colors you're

642
00:24:38,079 --> 00:24:41,438
working with and then

643
00:24:39,599 --> 00:24:43,038
once once they're done with a piece all

644
00:24:41,440 --> 00:24:45,039
they have to do is is

645
00:24:43,038 --> 00:24:47,358
export it to an oam and all you have to

646
00:24:45,038 --> 00:24:50,079
do is place it in your indesign document

647
00:24:47,359 --> 00:24:51,759
and so you know it could be a tool for

648
00:24:50,079 --> 00:24:55,119
you to level up your animation

649
00:24:51,759 --> 00:24:57,119
interactivity in these types of pieces

650
00:24:55,119 --> 00:24:58,797
or you know it could be an opportunity

651
00:24:57,119 --> 00:25:01,838
to collaborate with somebody who has

652
00:24:58,798 --> 00:25:01,838
those skills

653
00:25:01,919 --> 00:25:07,439
so let's now uh let me

654
00:25:06,079 --> 00:25:09,918
check my notes and make sure i'm not

655
00:25:07,440 --> 00:25:12,799
missing anything

656
00:25:09,919 --> 00:25:14,079
i think we are just we're to the q a

657
00:25:12,798 --> 00:25:17,439
portion and i see there's

658
00:25:14,079 --> 00:25:20,558
been a lot of questions in there um

659
00:25:17,440 --> 00:25:23,678
if you want to ask a question uh

660
00:25:20,558 --> 00:25:26,157
live you can raise your hand

661
00:25:23,679 --> 00:25:28,240
from the the menu at the bottom there's

662
00:25:26,159 --> 00:25:31,200
a raise hand button and

663
00:25:28,240 --> 00:25:33,119
uh i can unmute you and uh you you can

664
00:25:31,200 --> 00:25:36,079
feel free to ask the question live

665
00:25:33,119 --> 00:25:36,958
um you can also put it in the chat and

666
00:25:36,079 --> 00:25:42,239
uh

667
00:25:36,960 --> 00:25:44,879
i will i'll open up now to um

668
00:25:42,240 --> 00:25:45,599
to everybody who's myra and erica and

669
00:25:44,880 --> 00:25:47,1000
april if

670
00:25:45,599 --> 00:25:48,719
you guys have uh running questions that

671
00:25:48,000 --> 00:25:50,080
uh

672
00:25:48,720 --> 00:25:52,559
that you want to ask as people are

673
00:25:50,079 --> 00:25:54,878
gathering their their final questions or

674
00:25:52,558 --> 00:25:57,838
if anybody wants to raise their hand in

675
00:25:54,880 --> 00:25:57,840
in the meantime

676
00:25:58,480 --> 00:26:04,159
there is a question from doug in the q a

677
00:26:02,159 --> 00:26:06,240
what multimedia file formats can you use

678
00:26:04,159 --> 00:26:09,120
with hype

679
00:26:06,240 --> 00:26:10,400
okay i can take that um so in general

680
00:26:09,119 --> 00:26:13,439
there's uh

681
00:26:10,400 --> 00:26:14,558
various different categories um so if

682
00:26:13,440 --> 00:26:17,760
you're talking about

683
00:26:14,558 --> 00:26:19,439
image file formats um hype generally is

684
00:26:17,759 --> 00:26:20,959
targeted towards the web so nearly

685
00:26:19,440 --> 00:26:22,799
anything you could use on the web you

686
00:26:20,960 --> 00:26:25,038
can use within hype so

687
00:26:22,798 --> 00:26:26,798
of course standard image formats would

688
00:26:25,038 --> 00:26:30,398
be jpeg or

689
00:26:26,798 --> 00:26:32,719
gif or gif if you so desire

690
00:26:30,400 --> 00:26:36,079
you can also bring in svgs they're

691
00:26:32,720 --> 00:26:36,079
treated as an image

692
00:26:36,240 --> 00:26:40,079
and there's probably you know various

693
00:26:37,839 --> 00:26:42,319
other web image formats

694
00:26:40,079 --> 00:26:43,838
from a audio and video perspective you

695
00:26:42,319 --> 00:26:47,599
can bring in

696
00:26:43,839 --> 00:26:48,157
video when you do um you have the option

697
00:26:47,599 --> 00:26:51,518
to

698
00:26:48,159 --> 00:26:54,159
add different sources so it's less of an

699
00:26:51,519 --> 00:26:56,719
issue nowadays but originally on the web

700
00:26:54,159 --> 00:26:58,798
uh various browsers or platforms

701
00:26:56,720 --> 00:27:00,479
supported different video format types

702
00:26:58,798 --> 00:27:03,519
so safari would support

703
00:27:00,480 --> 00:27:07,359
mp4 which you can bring into height but

704
00:27:03,519 --> 00:27:10,557
um firefox liked ogv videos

705
00:27:07,359 --> 00:27:11,198
and chrome like webm videos and so when

706
00:27:10,558 --> 00:27:13,438
you bring in

707
00:27:11,200 --> 00:27:15,600
let's say a video format you get slots

708
00:27:13,440 --> 00:27:18,319
to bring in the various different

709
00:27:15,599 --> 00:27:19,199
types uh and it's the same story with

710
00:27:18,319 --> 00:27:22,557
audio

711
00:27:19,200 --> 00:27:23,999
in that regard um so hopefully that

712
00:27:22,558 --> 00:27:25,917
answered it it's basically anything

713
00:27:24,000 --> 00:27:28,158
available that you could do on the web

714
00:27:25,919 --> 00:27:29,359
are the formats that hype supports

715
00:27:28,159 --> 00:27:31,440
importing

716
00:27:29,359 --> 00:27:32,557
uh because of the specific web view if

717
00:27:31,440 --> 00:27:36,079
you were to bring in like an

718
00:27:32,558 --> 00:27:38,157
og an ogg video or audio

719
00:27:36,079 --> 00:27:39,199
hype won't play that back natively

720
00:27:38,159 --> 00:27:40,799
because it uses

721
00:27:39,200 --> 00:27:42,959
webkit and that's more of a firefox

722
00:27:40,798 --> 00:27:44,318
thing but if you preview in firefox then

723
00:27:42,960 --> 00:27:45,919
that will show up so it's always

724
00:27:44,319 --> 00:27:48,798
important to think about

725
00:27:45,919 --> 00:27:50,319
what you see in hype but also what your

726
00:27:48,798 --> 00:27:52,798
target is

727
00:27:50,319 --> 00:27:54,878
and hype provides some guidance in that

728
00:27:52,798 --> 00:27:57,118
regard so if you only have one format

729
00:27:54,880 --> 00:27:58,960
it'll actually say oh on this browser

730
00:27:57,119 --> 00:28:00,797
you're missing this video format for

731
00:27:58,960 --> 00:28:03,759
example it'll give a little bit of a

732
00:28:00,798 --> 00:28:04,879
warning there um to guide you along the

733
00:28:03,759 --> 00:28:07,999
way

734
00:28:04,880 --> 00:28:11,200
so hopefully that answers the question

735
00:28:08,000 --> 00:28:12,799
yeah thank goodness uh firefox seems to

736
00:28:11,200 --> 00:28:14,559
have caught up because

737
00:28:12,798 --> 00:28:15,999
i think we're generally pretty safe

738
00:28:14,558 --> 00:28:18,158
these days just using mp4

739
00:28:16,000 --> 00:28:19,600
and mp3 which is great it's so much

740
00:28:18,159 --> 00:28:22,798
simpler

741
00:28:19,599 --> 00:28:24,639
yeah i think um you know every

742
00:28:22,798 --> 00:28:26,479
release of hype we kind of update the

743
00:28:24,640 --> 00:28:28,240
what are we going to show warnings for

744
00:28:26,480 --> 00:28:29,1000
and we also kind of boost things but if

745
00:28:28,240 --> 00:28:31,760
you're trying to deploy to some

746
00:28:30,000 --> 00:28:33,439
really old browser you'll be able to see

747
00:28:31,759 --> 00:28:35,518
a lot of those older warnings but for

748
00:28:33,440 --> 00:28:38,640
most of them nowadays yeah mp4 is

749
00:28:35,519 --> 00:28:40,959
good enough awesome

750
00:28:38,640 --> 00:28:42,479
i'm going to take a question from

751
00:28:40,960 --> 00:28:45,038
somebody who has their hand up uh

752
00:28:42,480 --> 00:28:46,558
i said carolyn had your hand up uh but

753
00:28:45,038 --> 00:28:47,118
has dropped away if you still want to

754
00:28:46,558 --> 00:28:49,917
ask your

755
00:28:47,119 --> 00:28:51,599
question um go ahead and now i see i'm

756
00:28:49,919 --> 00:28:54,159
going to go ahead and let carolyn talk

757
00:28:51,599 --> 00:28:57,038
because she was first in line

758
00:28:54,159 --> 00:28:59,840
and you just need to unmute yourself hi

759
00:28:57,038 --> 00:29:00,397
um uh thank you for this this is amazing

760
00:28:59,839 --> 00:29:03,678
um

761
00:29:00,398 --> 00:29:05,838
so i sort of manage a group of about 40

762
00:29:03,679 --> 00:29:08,879
30 or 40 designers and i'm wondering

763
00:29:05,839 --> 00:29:10,638
what how hard would this be to implement

764
00:29:08,880 --> 00:29:13,120
i mean we would have to change our

765
00:29:10,640 --> 00:29:14,960
entire way of doing things which is a

766
00:29:13,119 --> 00:29:18,239
little bit i think my job

767
00:29:14,960 --> 00:29:20,158
to introduce new you know

768
00:29:18,240 --> 00:29:21,999
advances to show the client like the

769
00:29:20,159 --> 00:29:23,440
idea of wowing the client with some of

770
00:29:22,000 --> 00:29:24,960
these things because we are we're a

771
00:29:23,440 --> 00:29:28,159
packaging firm

772
00:29:24,960 --> 00:29:31,200
and to be able to show you know like

773
00:29:28,159 --> 00:29:34,880
uh labels that that rotate and

774
00:29:31,200 --> 00:29:36,240
animate and um and to be able to show we

775
00:29:34,880 --> 00:29:38,399
do a lot of stuff with

776
00:29:36,240 --> 00:29:39,360
multimedia showing you know interactive

777
00:29:38,398 --> 00:29:41,599
multimedia

778
00:29:39,359 --> 00:29:43,439
and all those kinds of things we tried

779
00:29:41,599 --> 00:29:45,599
initially doing some of these things in

780
00:29:43,440 --> 00:29:46,960
indesign and exporting to pdf and it was

781
00:29:45,599 --> 00:29:50,158
a nightmare

782
00:29:46,960 --> 00:29:53,1000
um and even so much so as i had

783
00:29:50,159 --> 00:29:55,1000
a long long you know run in with adobe

784
00:29:54,000 --> 00:29:57,200
on how to fix it and they sort of fixed

785
00:29:56,000 --> 00:29:59,120
it but not enough

786
00:29:57,200 --> 00:30:01,520
to be able so we stopped doing all those

787
00:29:59,119 --> 00:30:04,798
things so this looks like that could be

788
00:30:01,519 --> 00:30:07,599
cool but um i just wondered i mean

789
00:30:04,798 --> 00:30:09,118
how hard is this if i was this would be

790
00:30:07,599 --> 00:30:12,158
probably a headache for me but

791
00:30:09,119 --> 00:30:14,718
how hard would this be to roll out as a

792
00:30:12,159 --> 00:30:17,120
new format to teach people

793
00:30:14,720 --> 00:30:18,798
you know here's this cool new technology

794
00:30:17,119 --> 00:30:21,678
we could be the cutting edge of

795
00:30:18,798 --> 00:30:22,079
of presentations with this kind of stuff

796
00:30:21,679 --> 00:30:25,038
right

797
00:30:22,079 --> 00:30:27,199
how how hard is it be and could i even

798
00:30:25,038 --> 00:30:29,759
maybe potentially create templates

799
00:30:27,200 --> 00:30:31,759
that people could customize you know

800
00:30:29,759 --> 00:30:33,198
like if i had a rotating bottle i think

801
00:30:31,759 --> 00:30:36,478
someone had asked that

802
00:30:33,200 --> 00:30:38,320
uh before like if you placed an object

803
00:30:36,480 --> 00:30:40,720
in indesign and then you just replaced

804
00:30:38,319 --> 00:30:42,798
it would it automatically update

805
00:30:40,720 --> 00:30:44,960
you know does is it linked is it like a

806
00:30:42,798 --> 00:30:46,557
linked file situation

807
00:30:44,960 --> 00:30:48,080
i'm just i'm sorry i have a lot of

808
00:30:46,558 --> 00:30:48,558
questions but i'm just trying to figure

809
00:30:48,079 --> 00:30:50,319
out

810
00:30:48,558 --> 00:30:51,917
is this something that my company could

811
00:30:50,319 --> 00:30:53,678
use and how hard would it be

812
00:30:51,919 --> 00:30:55,278
to implement a whole change in

813
00:30:53,679 --> 00:30:59,440
technology

814
00:30:55,278 --> 00:31:01,917
i i think uh jonathan you guys have a

815
00:30:59,440 --> 00:31:03,120
like a demo or a trial version of hype

816
00:31:01,919 --> 00:31:05,919
available

817
00:31:03,119 --> 00:31:07,359
that they can use yeah so i mean i would

818
00:31:05,919 --> 00:31:09,919
definitely recommend doing

819
00:31:07,359 --> 00:31:11,517
um testing out and seeing how it works

820
00:31:09,919 --> 00:31:12,879
for your workflow i think one of the

821
00:31:11,519 --> 00:31:16,158
neat things about

822
00:31:12,880 --> 00:31:18,479
the integration

823
00:31:16,159 --> 00:31:20,079
at least here i it sounds like maybe you

824
00:31:18,480 --> 00:31:22,399
already do use

825
00:31:20,079 --> 00:31:24,319
in design is that you can just use hype

826
00:31:22,398 --> 00:31:25,677
for very small specific interactive

827
00:31:24,319 --> 00:31:28,397
pieces and then

828
00:31:25,679 --> 00:31:29,679
expand it out as you need so i would

829
00:31:28,398 --> 00:31:32,638
definitely recommend

830
00:31:29,679 --> 00:31:33,679
trying with hype right now we have a 14

831
00:31:32,640 --> 00:31:35,278
day

832
00:31:33,679 --> 00:31:37,919
fully functional trial it doesn't

833
00:31:35,278 --> 00:31:40,879
watermark or anything so you can

834
00:31:37,919 --> 00:31:41,519
use hype to your heart's content and try

835
00:31:40,880 --> 00:31:43,759
it out there

836
00:31:41,519 --> 00:31:44,798
if you need a little bit more time feel

837
00:31:43,759 --> 00:31:46,959
free to contact

838
00:31:44,798 --> 00:31:49,517
me or daniel um just go to to our

839
00:31:46,960 --> 00:31:52,399
website and there's a support link

840
00:31:49,519 --> 00:31:55,278
there and that's probably the best way

841
00:31:52,398 --> 00:31:58,398
to kind of figure it out

842
00:31:55,278 --> 00:32:00,239
i would say yeah trying small amounts

843
00:31:58,398 --> 00:32:03,439
and growing from there would be my

844
00:32:00,240 --> 00:32:05,679
a little bit more general advice and

845
00:32:03,440 --> 00:32:05,678
um

846
00:32:07,119 --> 00:32:11,038
yeah i think that's probably the way i

847
00:32:08,880 --> 00:32:14,240
would go about doing it

848
00:32:11,038 --> 00:32:14,879
yeah i i think so in5 also offers a

849
00:32:14,240 --> 00:32:16,799
trial but

850
00:32:14,880 --> 00:32:18,960
it's sort of the inverse where it's an

851
00:32:16,798 --> 00:32:20,318
unlimited time but it is feature limited

852
00:32:18,960 --> 00:32:23,360
and watermarked

853
00:32:20,319 --> 00:32:25,277
um so i i would suggest

854
00:32:23,359 --> 00:32:27,198
you know trying a trial of both of them

855
00:32:25,278 --> 00:32:29,518
i think the main difference

856
00:32:27,200 --> 00:32:30,959
you might experience versus the formats

857
00:32:29,519 --> 00:32:32,640
you're used to

858
00:32:30,960 --> 00:32:34,799
is that it's not something you can

859
00:32:32,640 --> 00:32:36,720
easily send over in an e

860
00:32:34,798 --> 00:32:38,958
you don't send it in an email like as a

861
00:32:36,720 --> 00:32:41,1000
file like you would with a pdf

862
00:32:38,960 --> 00:32:44,559
um generally this is not the

863
00:32:42,000 --> 00:32:45,120
only way to deliver it uh but generally

864
00:32:44,558 --> 00:32:46,318
you might

865
00:32:45,119 --> 00:32:48,478
you're probably going to be delivering

866
00:32:46,319 --> 00:32:49,439
it by putting it on the web like how i

867
00:32:48,480 --> 00:32:50,879
put the

868
00:32:49,440 --> 00:32:53,359
the piece on the web and you can see the

869
00:32:50,880 --> 00:32:54,239
url which just means uploading it to a

870
00:32:53,359 --> 00:32:56,557
web server

871
00:32:54,240 --> 00:32:57,279
and then sharing the url so you're

872
00:32:56,558 --> 00:33:00,718
emailing

873
00:32:57,278 --> 00:33:03,999
the url instead of uh a pdf file

874
00:33:00,720 --> 00:33:08,319
now with the pdf format um i mean

875
00:33:04,000 --> 00:33:11,200
you know we hear this a lot and so

876
00:33:08,319 --> 00:33:13,118
you know it's just like just i almost

877
00:33:11,200 --> 00:33:15,278
have an eye roll because it's like yes

878
00:33:13,119 --> 00:33:17,119
unfortunately pdf we have this

879
00:33:15,278 --> 00:33:18,798
expectation that pdf is going to support

880
00:33:17,119 --> 00:33:22,157
interactivity like this and it just

881
00:33:18,798 --> 00:33:24,158
doesn't um not any way shape or form

882
00:33:22,159 --> 00:33:26,240
and uh and it's fortunate that like

883
00:33:24,159 --> 00:33:29,279
adobe does just say that up front but

884
00:33:26,240 --> 00:33:30,720
um the the pdf format just doesn't do it

885
00:33:29,278 --> 00:33:33,198
but html does

886
00:33:30,720 --> 00:33:34,398
um as you can see uh with both of these

887
00:33:33,200 --> 00:33:37,999
technologies they're both

888
00:33:34,398 --> 00:33:40,398
based on html and you really

889
00:33:38,000 --> 00:33:42,559
you're you're now it's it's like cutting

890
00:33:40,398 --> 00:33:43,677
edge kind of still but it's like it's

891
00:33:42,558 --> 00:33:45,678
also

892
00:33:43,679 --> 00:33:48,079
really well established so you're not

893
00:33:45,679 --> 00:33:50,320
going out on a limb using these formats

894
00:33:48,079 --> 00:33:51,518
i think the biggest difference is is

895
00:33:50,319 --> 00:33:54,078
gonna be

896
00:33:51,519 --> 00:33:55,919
uh learning to probably to put it on a

897
00:33:54,079 --> 00:33:57,518
web server and share a url that's gonna

898
00:33:55,919 --> 00:33:58,480
be your difference in process but in

899
00:33:57,519 --> 00:33:59,999
terms of

900
00:33:58,480 --> 00:34:01,678
your workflow i don't think that's gonna

901
00:34:00,000 --> 00:34:02,720
change much you can use indesign

902
00:34:01,679 --> 00:34:05,038
templates

903
00:34:02,720 --> 00:34:06,798
um you can update the stuff and then you

904
00:34:05,038 --> 00:34:09,039
just have to re-export it like you would

905
00:34:06,798 --> 00:34:11,038
re-export a pdf

906
00:34:09,039 --> 00:34:12,958
and then you know if the files are going

907
00:34:11,039 --> 00:34:14,798
online you have to replace those files

908
00:34:12,960 --> 00:34:17,759
online

909
00:34:14,800 --> 00:34:19,519
but your workflow can i mean there's

910
00:34:17,760 --> 00:34:21,359
definitely no problem working with large

911
00:34:19,519 --> 00:34:23,438
teams and as you're seeing with the

912
00:34:21,358 --> 00:34:25,039
these two products it's it's really easy

913
00:34:23,440 --> 00:34:26,638
to segment the pieces that you're

914
00:34:25,039 --> 00:34:28,318
working on and have one person working

915
00:34:26,639 --> 00:34:29,760
on something in parallel

916
00:34:28,320 --> 00:34:31,280
uh with somebody else you know one

917
00:34:29,760 --> 00:34:32,240
person working on layout another person

918
00:34:31,280 --> 00:34:34,399
working on

919
00:34:32,239 --> 00:34:36,638
an interactive piece with animation that

920
00:34:34,398 --> 00:34:39,039
then goes into the layout

921
00:34:36,639 --> 00:34:41,280
um so hopefully that that answers most

922
00:34:39,039 --> 00:34:42,878
of the questions

923
00:34:41,280 --> 00:34:45,280
yes thank you very much i mean i have a

924
00:34:42,878 --> 00:34:47,038
million but i don't want to take a bite

925
00:34:45,280 --> 00:34:48,639
okay well we'll let we'll let a few

926
00:34:47,039 --> 00:34:49,118
people more answer questions you can

927
00:34:48,639 --> 00:34:52,159
also

928
00:34:49,119 --> 00:34:53,838
email um our support anytime and then

929
00:34:52,159 --> 00:34:55,760
maybe we'll we'll come back around to

930
00:34:53,838 --> 00:34:57,838
you now if uh once everybody else has a

931
00:34:55,760 --> 00:35:01,200
chance to ask questions

932
00:34:57,838 --> 00:35:04,879
um i'm going to

933
00:35:01,199 --> 00:35:08,319
let kareem talk here karine please

934
00:35:04,880 --> 00:35:11,439
unmute and go ahead uh yes i

935
00:35:08,320 --> 00:35:14,959
i put my my question on the chat also

936
00:35:11,440 --> 00:35:14,960
and uh i had a

937
00:35:15,440 --> 00:35:22,560
from a form machine in uh in brussels

938
00:35:18,880 --> 00:35:26,078
in hype and uh in five uh so

939
00:35:22,559 --> 00:35:30,478
i'm trying to to use them and i was

940
00:35:26,079 --> 00:35:32,720
um i wanted to do as a sort of a book

941
00:35:30,480 --> 00:35:34,800
and

942
00:35:32,719 --> 00:35:35,759
drawing through the page through the

943
00:35:34,800 --> 00:35:40,078
pages

944
00:35:35,760 --> 00:35:43,519
but i didn't get um through it too

945
00:35:40,079 --> 00:35:47,680
in hype

946
00:35:43,519 --> 00:35:51,038
how can can do how can i do

947
00:35:47,679 --> 00:35:54,318
the the interactivity without the button

948
00:35:51,039 --> 00:35:54,318
through uh the scene

949
00:35:54,400 --> 00:35:58,720
if it's possible i don't know i don't

950
00:35:57,519 --> 00:36:02,719
know if

951
00:35:58,719 --> 00:36:05,679
my english is good enough and if you

952
00:36:02,719 --> 00:36:07,199
got my question um it sounded like you

953
00:36:05,679 --> 00:36:08,719
were trying to do interactivity

954
00:36:07,199 --> 00:36:10,799
not through a button i didn't quite

955
00:36:08,719 --> 00:36:14,398
catch um how you wanted

956
00:36:10,800 --> 00:36:17,200
to i have several scenes and i wanted to

957
00:36:14,400 --> 00:36:20,959
have a sort of uh

958
00:36:17,199 --> 00:36:23,998
like uh like an opening book uh

959
00:36:20,960 --> 00:36:28,400
very fast okay

960
00:36:24,000 --> 00:36:31,759
um animation but i didn't

961
00:36:28,400 --> 00:36:33,999
so there may be uh ways on the infi

962
00:36:31,760 --> 00:36:35,280
side to do this i'll answer from if you

963
00:36:34,000 --> 00:36:38,879
were thinking about it more of

964
00:36:35,280 --> 00:36:41,358
a hype majority document

965
00:36:38,880 --> 00:36:42,480
it's just an uh an animation a sort of

966
00:36:41,358 --> 00:36:45,518
uh to show

967
00:36:42,480 --> 00:36:47,999
very quickly the the inside of the book

968
00:36:45,519 --> 00:36:49,358
so you're like you're like opening up a

969
00:36:48,000 --> 00:36:52,160
book

970
00:36:49,358 --> 00:36:52,559
and then the pages you have the pages uh

971
00:36:52,159 --> 00:36:56,239
uh

972
00:36:52,559 --> 00:37:00,559
two or four two four pages uh

973
00:36:56,239 --> 00:37:00,559
uh going quite quite fast

974
00:37:01,039 --> 00:37:08,638
so one thing that we saw um

975
00:37:05,280 --> 00:37:10,480
happened frequently was that

976
00:37:08,639 --> 00:37:11,837
for let's say ibooks author which is

977
00:37:10,480 --> 00:37:14,319
where we saw a lot of

978
00:37:11,838 --> 00:37:16,078
books coming from the kind of packaging

979
00:37:14,320 --> 00:37:16,719
format was easy to use and you just

980
00:37:16,079 --> 00:37:21,119
export

981
00:37:16,719 --> 00:37:24,478
as a widget and so hype itself has

982
00:37:21,119 --> 00:37:26,399
a few various ways of making book-like

983
00:37:24,480 --> 00:37:28,560
experiences um probably not as good as

984
00:37:26,400 --> 00:37:29,598
the book itself but one is like you can

985
00:37:28,559 --> 00:37:33,278
swipe

986
00:37:29,599 --> 00:37:34,799
on pages it also has a 3d effect so

987
00:37:33,280 --> 00:37:37,358
we've seen some page turns

988
00:37:34,800 --> 00:37:38,880
there's some issues with there being a

989
00:37:37,358 --> 00:37:43,199
lot of perspective

990
00:37:38,880 --> 00:37:45,280
on that another thing that you can do is

991
00:37:43,199 --> 00:37:47,439
hype has the notion of symbols

992
00:37:45,280 --> 00:37:49,598
so if you're repeating content you can

993
00:37:47,440 --> 00:37:50,480
actually place all that content into a

994
00:37:49,599 --> 00:37:52,720
symbol

995
00:37:50,480 --> 00:37:54,319
and then let's say on the first page you

996
00:37:52,719 --> 00:37:56,239
can have a duplicate

997
00:37:54,320 --> 00:37:58,078
of that symbol so it's the exact same

998
00:37:56,239 --> 00:37:59,598
content ultimately

999
00:37:58,079 --> 00:38:01,119
but you can animate that in a different

1000
00:37:59,599 --> 00:38:03,039
way so let's say you wanted to have

1001
00:38:01,119 --> 00:38:04,800
certain effects like a flipping if

1002
00:38:03,039 --> 00:38:05,357
everything was a symbol later on you

1003
00:38:04,800 --> 00:38:07,280
could

1004
00:38:05,358 --> 00:38:08,479
do or you could copy those symbols just

1005
00:38:07,280 --> 00:38:11,680
have a different instance

1006
00:38:08,480 --> 00:38:14,640
and do some sort of quick animation

1007
00:38:11,679 --> 00:38:15,518
the question okay so have to do it with

1008
00:38:14,639 --> 00:38:19,118
symbols

1009
00:38:15,519 --> 00:38:20,879
it would be uh easier

1010
00:38:19,119 --> 00:38:22,960
that's probably the approach i would

1011
00:38:20,880 --> 00:38:24,400
take um there's of course with a

1012
00:38:22,960 --> 00:38:26,079
tool like hype there's a lot of

1013
00:38:24,400 --> 00:38:27,839
different ways to do

1014
00:38:26,079 --> 00:38:29,358
the main to do different things i mean

1015
00:38:27,838 --> 00:38:31,758
it could be something as

1016
00:38:29,358 --> 00:38:32,798
you take screenshots of the scene and

1017
00:38:31,760 --> 00:38:34,400
then put those in

1018
00:38:32,800 --> 00:38:36,400
also depending on how you want to work

1019
00:38:34,400 --> 00:38:40,400
with it okay

1020
00:38:36,400 --> 00:38:40,400
thank you thank you

1021
00:38:41,199 --> 00:38:48,399
all right thanks green i'm going to

1022
00:38:44,320 --> 00:38:50,879
now uh have robert talk you can

1023
00:38:48,400 --> 00:38:51,440
unmute when you're ready robert yeah uh

1024
00:38:50,880 --> 00:38:53,598
thank you

1025
00:38:51,440 --> 00:38:55,760
so uh having never heard of indesign

1026
00:38:53,599 --> 00:38:59,358
before uh i'm currently using hype

1027
00:38:55,760 --> 00:39:01,760
to uh to build uh web interactives um

1028
00:38:59,358 --> 00:39:02,959
how how would i integrate indesign into

1029
00:39:01,760 --> 00:39:04,720
my workflow like

1030
00:39:02,960 --> 00:39:07,200
i'm still not sure exactly what that can

1031
00:39:04,719 --> 00:39:07,199
do for me

1032
00:39:08,559 --> 00:39:12,159
um

1033
00:39:09,050 --> 00:39:14,639
[Music]

1034
00:39:12,159 --> 00:39:15,837
it really depends uh i would say it's

1035
00:39:14,639 --> 00:39:17,918
kind of like down to

1036
00:39:15,838 --> 00:39:18,959
what what is the difference in purpose

1037
00:39:17,920 --> 00:39:22,240
between the files

1038
00:39:18,960 --> 00:39:24,479
um indesign's initial reason for

1039
00:39:22,239 --> 00:39:27,598
existing is to create print documents

1040
00:39:24,480 --> 00:39:29,839
um infive extends it to

1041
00:39:27,599 --> 00:39:31,200
being more of an interactive tool but i

1042
00:39:29,838 --> 00:39:35,038
would say it's still

1043
00:39:31,199 --> 00:39:37,357
um it's still of a document nature

1044
00:39:35,039 --> 00:39:38,478
um so there's a wide variety as you saw

1045
00:39:37,358 --> 00:39:40,479
with the

1046
00:39:38,480 --> 00:39:42,239
the pieces so i created the the

1047
00:39:40,480 --> 00:39:45,598
presentation slides

1048
00:39:42,239 --> 00:39:47,279
uh in there but then there was um

1049
00:39:45,599 --> 00:39:49,759
our initial experience which has those

1050
00:39:47,280 --> 00:39:51,358
like fade in transitions then there's a

1051
00:39:49,760 --> 00:39:52,639
flip book with the page peels and then

1052
00:39:51,358 --> 00:39:53,519
there's one that looks like a scrolling

1053
00:39:52,639 --> 00:39:55,518
website

1054
00:39:53,519 --> 00:39:56,559
um but they're all essentially the ideas

1055
00:39:55,519 --> 00:39:59,519
you have these

1056
00:39:56,559 --> 00:40:00,639
pages and you're navigating through them

1057
00:39:59,519 --> 00:40:03,679
and so

1058
00:40:00,639 --> 00:40:06,799
um you know it doesn't have the the

1059
00:40:03,679 --> 00:40:08,837
precise dials that hype does in terms of

1060
00:40:06,800 --> 00:40:10,480
you creating super sophisticated

1061
00:40:08,838 --> 00:40:12,159
animation

1062
00:40:10,480 --> 00:40:15,279
and you can create interactivity but

1063
00:40:12,159 --> 00:40:15,279
it's kind of limited to

1064
00:40:15,920 --> 00:40:21,679
what is in indesign right manipulating

1065
00:40:18,559 --> 00:40:24,078
the things that are in indesign

1066
00:40:21,679 --> 00:40:26,558
but then on the flip side it's it has

1067
00:40:24,079 --> 00:40:29,119
this this sort of document set up

1068
00:40:26,559 --> 00:40:30,799
so it might just be a little natural

1069
00:40:29,119 --> 00:40:33,200
more natural or fluid

1070
00:40:30,800 --> 00:40:34,880
to create something that you know has a

1071
00:40:33,199 --> 00:40:36,399
lot of pages to it if it's not it

1072
00:40:34,880 --> 00:40:39,519
doesn't make sense for it to be

1073
00:40:36,400 --> 00:40:42,239
scenes you know um then

1074
00:40:39,519 --> 00:40:43,438
and it's more like page page page than

1075
00:40:42,239 --> 00:40:45,279
maybe

1076
00:40:43,440 --> 00:40:46,799
i'm sorry is that more in like a

1077
00:40:45,280 --> 00:40:49,119
navigation sense

1078
00:40:46,800 --> 00:40:50,880
like is it like like more robust

1079
00:40:49,119 --> 00:40:53,519
navigations in a sense

1080
00:40:50,880 --> 00:40:54,400
um it certainly has the navigation i i

1081
00:40:53,519 --> 00:40:57,837
think

1082
00:40:54,400 --> 00:40:59,598
i think if you i think

1083
00:40:57,838 --> 00:41:01,679
based on my knowledge of hype you could

1084
00:40:59,599 --> 00:41:03,358
create very similar things in hype that

1085
00:41:01,679 --> 00:41:04,478
you're creating in indesign in five but

1086
00:41:03,358 --> 00:41:06,719
it's you're gonna have

1087
00:41:04,480 --> 00:41:08,640
an easier time creating certain things

1088
00:41:06,719 --> 00:41:11,039
with indesign and infibe just because

1089
00:41:08,639 --> 00:41:12,078
they're oriented toward that so yes if

1090
00:41:11,039 --> 00:41:14,078
it's if it's a

1091
00:41:12,079 --> 00:41:16,559
like a page based thing that's mostly

1092
00:41:14,079 --> 00:41:18,960
page navigation

1093
00:41:16,559 --> 00:41:20,719
then indesign might be easier to set

1094
00:41:18,960 --> 00:41:21,759
that up just because it's geared toward

1095
00:41:20,719 --> 00:41:23,838
that

1096
00:41:21,760 --> 00:41:25,280
gotcha gotcha yeah okay thank you very

1097
00:41:23,838 --> 00:41:28,479
much

1098
00:41:25,280 --> 00:41:31,598
yeah you bet thanks for your question

1099
00:41:28,480 --> 00:41:35,199
um do we have any uh questions from the

1100
00:41:31,599 --> 00:41:37,599
q a or chat pod we should

1101
00:41:35,199 --> 00:41:39,598
yeah there are a few in the q a a couple

1102
00:41:37,599 --> 00:41:42,640
uh there are a lot in the chat also

1103
00:41:39,599 --> 00:41:42,960
yeah exactly okay people don't be shy

1104
00:41:42,639 --> 00:41:44,958
about

1105
00:41:42,960 --> 00:41:46,560
uh about raising your hand we'd be happy

1106
00:41:44,960 --> 00:41:47,359
to talk to you and answer the questions

1107
00:41:46,559 --> 00:41:49,918
too

1108
00:41:47,358 --> 00:41:51,199
um erica can we get one from yeah one of

1109
00:41:49,920 --> 00:41:53,440
the questions was um

1110
00:41:51,199 --> 00:41:54,958
does hype support responsive page design

1111
00:41:53,440 --> 00:41:56,879
the example didn't seem to play nice

1112
00:41:54,960 --> 00:41:58,960
when the window was resized

1113
00:41:56,880 --> 00:42:02,719
so and uh if it does can that be handed

1114
00:41:58,960 --> 00:42:05,599
over to n5

1115
00:42:02,719 --> 00:42:06,158
i i'm gonna i want to let you guys talk

1116
00:42:05,599 --> 00:42:08,079
about that

1117
00:42:06,159 --> 00:42:10,239
because it is your product but i can say

1118
00:42:08,079 --> 00:42:14,079
yes when i was playing around with this

1119
00:42:10,239 --> 00:42:16,559
um so the initial uh piece was was

1120
00:42:14,079 --> 00:42:17,760
not necessarily responsive and when i

1121
00:42:16,559 --> 00:42:20,959
was playing around

1122
00:42:17,760 --> 00:42:24,479
and i had these different page sizes

1123
00:42:20,960 --> 00:42:26,160
like this one

1124
00:42:24,480 --> 00:42:28,319
i actually went in and i was like i'm

1125
00:42:26,159 --> 00:42:30,559
curious how do i make this responsive

1126
00:42:28,318 --> 00:42:32,238
and you know it took me a few minutes of

1127
00:42:30,559 --> 00:42:34,799
like looking up documentation

1128
00:42:32,239 --> 00:42:35,998
but if you look at this as i shrink the

1129
00:42:34,800 --> 00:42:39,359
page down

1130
00:42:36,000 --> 00:42:42,400
um oops

1131
00:42:39,358 --> 00:42:45,518
it's gone it's gone fully responsive um

1132
00:42:42,400 --> 00:42:46,959
this does this does shrink down

1133
00:42:45,519 --> 00:42:48,239
maybe this isn't the best example

1134
00:42:46,960 --> 00:42:48,960
actually because n5 is doing this

1135
00:42:48,239 --> 00:42:52,719
response

1136
00:42:48,960 --> 00:42:54,719
but um how can i show this

1137
00:42:52,719 --> 00:42:56,399
this piece is a different size than the

1138
00:42:54,719 --> 00:42:58,399
original anyway i had to make it

1139
00:42:56,400 --> 00:43:01,680
responsive in order to do that

1140
00:42:58,400 --> 00:43:03,760
um but but i'm realizing that the

1141
00:43:01,679 --> 00:43:05,438
scaling is all being done by n5 so

1142
00:43:03,760 --> 00:43:07,519
it's not a great example to share but

1143
00:43:05,440 --> 00:43:08,719
yes i it took me about 10 minutes and i

1144
00:43:07,519 --> 00:43:10,159
figured out how to do it so i just

1145
00:43:08,719 --> 00:43:12,879
wanted to say that as somebody who's

1146
00:43:10,159 --> 00:43:13,759
using hype for basically the first time

1147
00:43:12,880 --> 00:43:16,078
um

1148
00:43:13,760 --> 00:43:19,200
but uh yeah why don't i why don't i let

1149
00:43:16,079 --> 00:43:19,200
the guys from hype answer

1150
00:43:21,599 --> 00:43:24,720
do you wanna answer daniel sure yeah the

1151
00:43:24,159 --> 00:43:26,558
the

1152
00:43:24,719 --> 00:43:28,478
quick answer is yes it does we have lots

1153
00:43:26,559 --> 00:43:30,078
of features for making different layouts

1154
00:43:28,480 --> 00:43:33,279
for

1155
00:43:30,079 --> 00:43:37,519
mobile design i can quickly share

1156
00:43:33,280 --> 00:43:40,879
a quick version um

1157
00:43:37,519 --> 00:43:42,479
in the chat let me use it

1158
00:43:40,880 --> 00:43:44,560
i can make you host if you want to share

1159
00:43:42,480 --> 00:43:46,640
your screen too daniel oh that's fine

1160
00:43:44,559 --> 00:43:48,398
well i can share something that actually

1161
00:43:46,639 --> 00:43:52,158
i made for kickstarter

1162
00:43:48,400 --> 00:43:55,199
that has a mobile and desktop version

1163
00:43:52,159 --> 00:43:58,077
and yeah i basically said okay

1164
00:43:55,199 --> 00:43:58,958
if you're looking at a tall uh phone

1165
00:43:58,079 --> 00:44:00,959
screen

1166
00:43:58,960 --> 00:44:03,440
show this layout but if you're on a

1167
00:44:00,960 --> 00:44:06,559
desktop and the ratio is a little wider

1168
00:44:03,440 --> 00:44:08,640
show this so yeah we can

1169
00:44:06,559 --> 00:44:10,559
post some documentation links in the

1170
00:44:08,639 --> 00:44:13,999
chat to answer that question

1171
00:44:10,559 --> 00:44:15,837
yeah yeah and it's uh

1172
00:44:14,000 --> 00:44:17,599
well go ahead please i was just going to

1173
00:44:15,838 --> 00:44:18,959
say that there's two basic systems one

1174
00:44:17,599 --> 00:44:22,160
is that you can

1175
00:44:18,960 --> 00:44:23,599
decide how you want items to rearrange

1176
00:44:22,159 --> 00:44:25,837
and then the others like you can make

1177
00:44:23,599 --> 00:44:30,560
entirely different layouts

1178
00:44:25,838 --> 00:44:32,719
also and then i assume they fit into

1179
00:44:30,559 --> 00:44:35,759
indesign in like a web view so based on

1180
00:44:32,719 --> 00:44:37,679
that size then it will just inherit

1181
00:44:35,760 --> 00:44:40,160
the responsiveness and do the right

1182
00:44:37,679 --> 00:44:40,558
thing yeah that and that's exactly what

1183
00:44:40,159 --> 00:44:43,199
i

1184
00:44:40,559 --> 00:44:44,879
what i ran into is when i started

1185
00:44:43,199 --> 00:44:46,478
designing those alternate ones because i

1186
00:44:44,880 --> 00:44:48,239
thought well it'd be nice to just

1187
00:44:46,480 --> 00:44:50,640
if people were showing up and they'd

1188
00:44:48,239 --> 00:44:51,439
never seen infibe before i could show

1189
00:44:50,639 --> 00:44:52,479
that you can

1190
00:44:51,440 --> 00:44:54,078
you know you've got these different

1191
00:44:52,480 --> 00:44:55,440
types of content it doesn't always look

1192
00:44:54,079 --> 00:44:59,040
like this and so

1193
00:44:55,440 --> 00:45:00,720
i i was you know reworking my indesign

1194
00:44:59,039 --> 00:45:01,999
file so instead of having these nice

1195
00:45:00,719 --> 00:45:05,199
wide portrait file

1196
00:45:02,000 --> 00:45:08,318
uh pages i had these you know thin

1197
00:45:05,199 --> 00:45:11,918
uh letter size pages for the flip book

1198
00:45:08,318 --> 00:45:12,399
and um and what i did was go into hype

1199
00:45:11,920 --> 00:45:14,960
and

1200
00:45:12,400 --> 00:45:16,400
basically grouped all the stuff together

1201
00:45:14,960 --> 00:45:19,040
and i was just able to say

1202
00:45:16,400 --> 00:45:20,560
i just want this to to shrink as the

1203
00:45:19,039 --> 00:45:23,039
piece shrinks

1204
00:45:20,559 --> 00:45:25,118
and so then when i placed it in the

1205
00:45:23,039 --> 00:45:28,077
indesign in a different size container

1206
00:45:25,119 --> 00:45:28,960
it just fit the container for me which

1207
00:45:28,079 --> 00:45:31,200
was great it was

1208
00:45:28,960 --> 00:45:32,640
it was really straightforward and i did

1209
00:45:31,199 --> 00:45:34,239
see that there was also the option to

1210
00:45:32,639 --> 00:45:34,879
have like break points and actually have

1211
00:45:34,239 --> 00:45:36,799
it

1212
00:45:34,880 --> 00:45:39,519
you know have a more dramatic shift if i

1213
00:45:36,800 --> 00:45:41,519
wanted it to change in a mobile layout

1214
00:45:39,519 --> 00:45:43,438
so those were those are both really cool

1215
00:45:41,519 --> 00:45:44,878
and it only took me a few minutes to

1216
00:45:43,440 --> 00:45:46,400
figure out not even

1217
00:45:44,880 --> 00:45:48,799
knowing if i could do it i just looked

1218
00:45:46,400 --> 00:45:49,440
it up and they had good documentation on

1219
00:45:48,800 --> 00:45:50,960
it and

1220
00:45:49,440 --> 00:45:53,520
and figured it out pretty quickly so

1221
00:45:50,960 --> 00:45:53,520
that was cool

1222
00:45:55,199 --> 00:46:00,718
all right uh myra do we have any

1223
00:45:58,880 --> 00:46:03,920
questions from chat we should

1224
00:46:00,719 --> 00:46:06,398
address yes there are several questions

1225
00:46:03,920 --> 00:46:07,279
and you might i was trying to um watch

1226
00:46:06,400 --> 00:46:09,359
the chat too so

1227
00:46:07,280 --> 00:46:10,559
you may have covered these um someone

1228
00:46:09,358 --> 00:46:12,798
asked um

1229
00:46:10,559 --> 00:46:15,198
about the learning curve talk about the

1230
00:46:12,800 --> 00:46:18,078
learning curve that's involved

1231
00:46:15,199 --> 00:46:19,519
for for which product for i i don't

1232
00:46:18,079 --> 00:46:19,839
actually i don't know i think it was for

1233
00:46:19,519 --> 00:46:22,878
a

1234
00:46:19,838 --> 00:46:23,998
hype part but i'm not sure

1235
00:46:22,880 --> 00:46:26,480
because i think it was during the hype

1236
00:46:24,000 --> 00:46:28,480
demonstration

1237
00:46:26,480 --> 00:46:29,599
uh well i'll talk to my apartment maybe

1238
00:46:28,480 --> 00:46:32,880
justin you can talk about

1239
00:46:29,599 --> 00:46:34,560
your learning curve um so in general it

1240
00:46:32,880 --> 00:46:37,1000
depends on your background

1241
00:46:34,559 --> 00:46:40,158
if you have a background in animation um

1242
00:46:38,000 --> 00:46:42,160
then about there's not that much

1243
00:46:40,159 --> 00:46:44,559
learning curve because it uses

1244
00:46:42,159 --> 00:46:45,759
keyframe animation system so if you've

1245
00:46:44,559 --> 00:46:48,719
used products like

1246
00:46:45,760 --> 00:46:49,679
um where motion graphics or video like

1247
00:46:48,719 --> 00:46:52,638
after effects

1248
00:46:49,679 --> 00:46:53,518
adobe animate um then you should be

1249
00:46:52,639 --> 00:46:56,639
relatively

1250
00:46:53,519 --> 00:46:57,999
at home in hype's interface if you

1251
00:46:56,639 --> 00:46:59,438
haven't there's some animation

1252
00:46:58,000 --> 00:47:01,759
principles that you'll need

1253
00:46:59,440 --> 00:47:02,879
to learn but ultimately we wanted to

1254
00:47:01,760 --> 00:47:05,359
make the product as

1255
00:47:02,880 --> 00:47:06,239
easy to use as like keynote or

1256
00:47:05,358 --> 00:47:08,559
powerpoint

1257
00:47:06,239 --> 00:47:09,838
plus this timeline and interactive

1258
00:47:08,559 --> 00:47:12,078
element

1259
00:47:09,838 --> 00:47:13,597
it's also pretty gentle cycle where

1260
00:47:12,079 --> 00:47:16,800
doing simple animations

1261
00:47:13,599 --> 00:47:17,839
is pretty easy and as you explore more

1262
00:47:16,800 --> 00:47:20,078
hopefully those

1263
00:47:17,838 --> 00:47:21,998
open up you'll say oh how would i go

1264
00:47:20,079 --> 00:47:24,079
about doing this

1265
00:47:22,000 --> 00:47:25,680
and then maybe be able to figure it out

1266
00:47:24,079 --> 00:47:26,720
based on the building blocks you've had

1267
00:47:25,679 --> 00:47:29,438
in the past

1268
00:47:26,719 --> 00:47:30,799
so we haven't gotten too much feedback

1269
00:47:29,440 --> 00:47:33,199
on it being

1270
00:47:30,800 --> 00:47:34,558
hard to use aside from one or two

1271
00:47:33,199 --> 00:47:36,399
concepts

1272
00:47:34,559 --> 00:47:38,318
but if you do have difficulty the good

1273
00:47:36,400 --> 00:47:41,039
news is we have um

1274
00:47:38,318 --> 00:47:41,519
pretty active support forums online

1275
00:47:41,039 --> 00:47:44,639
you'll see

1276
00:47:41,519 --> 00:47:47,519
me and daniel there quite a bit we're

1277
00:47:44,639 --> 00:47:49,999
also happy to answer emails and help out

1278
00:47:47,519 --> 00:47:51,039
we have tutorial videos um there's a few

1279
00:47:50,000 --> 00:47:53,599
courses

1280
00:47:51,039 --> 00:47:55,519
as well um and with that there there is

1281
00:47:53,599 --> 00:47:57,440
a trial so i definitely recommend um

1282
00:47:55,519 --> 00:47:59,438
just trying it trying to animate and

1283
00:47:57,440 --> 00:48:01,440
experiment play around with it

1284
00:47:59,440 --> 00:48:02,719
yeah i would add it's uh quick to pick

1285
00:48:01,440 --> 00:48:05,199
up but um

1286
00:48:02,719 --> 00:48:05,998
takes a lifetime to master that's all

1287
00:48:05,199 --> 00:48:07,998
you mentioned the free

1288
00:48:06,000 --> 00:48:09,680
trial someone also asked how long is the

1289
00:48:08,000 --> 00:48:13,359
free trial of height

1290
00:48:09,679 --> 00:48:13,357
14 days 14 days okay

1291
00:48:14,639 --> 00:48:20,398
yeah that's great and i i i must confess

1292
00:48:18,079 --> 00:48:21,280
so i was using it first first time but

1293
00:48:20,400 --> 00:48:23,759
uh i'm

1294
00:48:21,280 --> 00:48:24,480
i also spent a lot of time animating so

1295
00:48:23,760 --> 00:48:26,319
some of that stuff

1296
00:48:24,480 --> 00:48:28,239
might be more familiar to me than other

1297
00:48:26,318 --> 00:48:30,638
people but generally the

1298
00:48:28,239 --> 00:48:32,479
um the concepts are all stuff you're

1299
00:48:30,639 --> 00:48:34,799
going to be familiar with from using

1300
00:48:32,480 --> 00:48:35,919
any of these applications you know

1301
00:48:34,800 --> 00:48:39,200
grouping things

1302
00:48:35,920 --> 00:48:40,559
and uh and adjusting properties on

1303
00:48:39,199 --> 00:48:43,679
elements so

1304
00:48:40,559 --> 00:48:47,839
um i would i would encourage anybody to

1305
00:48:43,679 --> 00:48:49,837
to open up the trial and try it out

1306
00:48:47,838 --> 00:48:51,597
i like i said i was able to make the

1307
00:48:49,838 --> 00:48:52,959
thing responsive pretty quickly i just

1308
00:48:51,599 --> 00:48:54,400
opened it up and it's like oh what do i

1309
00:48:52,960 --> 00:48:55,920
need to do i'll group these things

1310
00:48:54,400 --> 00:48:56,640
together i figured out how to do that

1311
00:48:55,920 --> 00:48:59,040
and

1312
00:48:56,639 --> 00:48:59,679
um where's the responsive part and you

1313
00:48:59,039 --> 00:49:02,558
know with

1314
00:48:59,679 --> 00:49:04,078
like one help document i was able to to

1315
00:49:02,559 --> 00:49:05,680
kind of figure that out and it was

1316
00:49:04,079 --> 00:49:06,959
i mean it's that piece was pretty

1317
00:49:05,679 --> 00:49:08,958
sophisticated but it was also

1318
00:49:06,960 --> 00:49:11,599
straightforward so

1319
00:49:08,960 --> 00:49:13,200
yeah i would i would encourage people to

1320
00:49:11,599 --> 00:49:16,720
to try it out

1321
00:49:13,199 --> 00:49:19,519
um we still have

1322
00:49:16,719 --> 00:49:19,919
i have more questions if you okay um so

1323
00:49:19,519 --> 00:49:22,159
uh

1324
00:49:19,920 --> 00:49:23,520
how is hype different from lottie and

1325
00:49:22,159 --> 00:49:24,719
adobe after effects

1326
00:49:23,519 --> 00:49:26,639
and then i'll throw in there also

1327
00:49:24,719 --> 00:49:28,638
someone asked um

1328
00:49:26,639 --> 00:49:29,918
they already have animate from the

1329
00:49:28,639 --> 00:49:31,118
creative suite so what would be some

1330
00:49:29,920 --> 00:49:33,118
reasons that they should use hype

1331
00:49:31,119 --> 00:49:36,479
instead

1332
00:49:33,119 --> 00:49:38,559
okay um i can take that so

1333
00:49:36,480 --> 00:49:39,759
speaking strictly on adobe after effects

1334
00:49:38,559 --> 00:49:42,079
there's not really

1335
00:49:39,760 --> 00:49:44,160
and i'm saying this is like a a nod pro

1336
00:49:42,079 --> 00:49:45,200
user so there may be a few details i get

1337
00:49:44,159 --> 00:49:46,958
wrong first of all

1338
00:49:45,199 --> 00:49:48,719
i know hype i don't know after effects

1339
00:49:46,960 --> 00:49:51,118
as well but after effects

1340
00:49:48,719 --> 00:49:52,879
is geared towards um video production

1341
00:49:51,119 --> 00:49:55,200
and motion graphics

1342
00:49:52,880 --> 00:49:56,319
and therefore the two main differences

1343
00:49:55,199 --> 00:49:59,439
there is

1344
00:49:56,318 --> 00:50:02,718
its output is intended to originally be

1345
00:49:59,440 --> 00:50:04,558
video and there's no interactivity in

1346
00:50:02,719 --> 00:50:06,558
video formats

1347
00:50:04,559 --> 00:50:08,400
now where lottie comes into play is you

1348
00:50:06,559 --> 00:50:12,879
can take the various

1349
00:50:08,400 --> 00:50:15,680
um assets and shapes and export those to

1350
00:50:12,880 --> 00:50:16,400
a html5 player so it kind of takes the

1351
00:50:15,679 --> 00:50:20,398
data

1352
00:50:16,400 --> 00:50:21,520
and then re-renders and i believe lottie

1353
00:50:20,400 --> 00:50:25,199
even has hooks for

1354
00:50:21,519 --> 00:50:28,318
interactivity but in general those are

1355
00:50:25,199 --> 00:50:30,958
basic hooks and so hype

1356
00:50:28,318 --> 00:50:31,758
the original format is html5 so what you

1357
00:50:30,960 --> 00:50:33,520
see in height

1358
00:50:31,760 --> 00:50:35,280
is pretty much exactly what you're going

1359
00:50:33,519 --> 00:50:36,719
to get in the browser

1360
00:50:35,280 --> 00:50:38,960
and you're working with browser native

1361
00:50:36,719 --> 00:50:40,318
formats um in the first part of the demo

1362
00:50:38,960 --> 00:50:43,920
for example i showed

1363
00:50:40,318 --> 00:50:46,399
editing text with html tags i

1364
00:50:43,920 --> 00:50:47,839
don't know if you can do that in after

1365
00:50:46,400 --> 00:50:49,920
effects since it's not geared towards

1366
00:50:47,838 --> 00:50:51,439
that

1367
00:50:49,920 --> 00:50:53,359
there's also all the different

1368
00:50:51,440 --> 00:50:56,640
responsive capabilities

1369
00:50:53,358 --> 00:50:59,598
and interactivity built in

1370
00:50:56,639 --> 00:51:01,118
and you can extend interactivity with

1371
00:50:59,599 --> 00:51:03,039
code i think that's basically how you

1372
00:51:01,119 --> 00:51:03,920
have to do it in lottie but there's a

1373
00:51:03,039 --> 00:51:07,039
lot of

1374
00:51:03,920 --> 00:51:09,599
primitives in hype that allow you to do

1375
00:51:07,039 --> 00:51:10,798
interactivity without code

1376
00:51:09,599 --> 00:51:12,800
so i'd say those are the main

1377
00:51:10,800 --> 00:51:15,359
differences but it's really dealing with

1378
00:51:12,800 --> 00:51:17,679
a web native format that understands web

1379
00:51:15,358 --> 00:51:19,117
browsers and web technology versus

1380
00:51:17,679 --> 00:51:20,799
dealing with maybe a tool you're

1381
00:51:19,119 --> 00:51:21,440
familiar with which is adobe after

1382
00:51:20,800 --> 00:51:23,760
effects

1383
00:51:21,440 --> 00:51:25,598
and trying to shoehorn that into the web

1384
00:51:23,760 --> 00:51:28,399
um via lottie

1385
00:51:25,599 --> 00:51:29,919
so it it depends i would say um you know

1386
00:51:28,400 --> 00:51:30,880
if you're really familiar with after

1387
00:51:29,920 --> 00:51:34,880
effects

1388
00:51:30,880 --> 00:51:37,1000
and your types of documents

1389
00:51:34,880 --> 00:51:40,319
are not going to be interactive at all

1390
00:51:38,000 --> 00:51:41,839
then you may want to stick with that but

1391
00:51:40,318 --> 00:51:43,439
there's a lot of advantages to height

1392
00:51:41,838 --> 00:51:45,278
especially even file size

1393
00:51:43,440 --> 00:51:47,680
hype is optimized to deliver good file

1394
00:51:45,280 --> 00:51:47,679
sizes

1395
00:51:48,400 --> 00:51:51,679
and i guess the other one was compared

1396
00:51:50,318 --> 00:51:54,159
to adobe animate

1397
00:51:51,679 --> 00:51:55,199
and adobe animate is in many ways the

1398
00:51:54,159 --> 00:51:58,399
same basic

1399
00:51:55,199 --> 00:52:00,239
problem is in that adobe animate came

1400
00:51:58,400 --> 00:52:02,400
from the heritage of flash

1401
00:52:00,239 --> 00:52:03,358
which also is not really a web native

1402
00:52:02,400 --> 00:52:06,640
format in

1403
00:52:03,358 --> 00:52:08,558
exactly the same way and so um

1404
00:52:06,639 --> 00:52:10,639
adobe has been trying to kind of

1405
00:52:08,559 --> 00:52:12,719
shoehorn more and more web features into

1406
00:52:10,639 --> 00:52:14,959
animate since they cancelled

1407
00:52:12,719 --> 00:52:16,239
their other product which was edge

1408
00:52:14,960 --> 00:52:17,598
animate

1409
00:52:16,239 --> 00:52:20,239
but i think you'll find that there's a

1410
00:52:17,599 --> 00:52:22,400
lot of edges from

1411
00:52:20,239 --> 00:52:24,399
animate's heritage of being first of all

1412
00:52:22,400 --> 00:52:27,199
a hand-drawn

1413
00:52:24,400 --> 00:52:27,679
animation tool or a vector animation

1414
00:52:27,199 --> 00:52:29,439
tool

1415
00:52:27,679 --> 00:52:32,719
that got shoehorned into trying to

1416
00:52:29,440 --> 00:52:35,520
output to a web format which was

1417
00:52:32,719 --> 00:52:35,919
swift files and then to now being tried

1418
00:52:35,519 --> 00:52:38,479
to

1419
00:52:35,920 --> 00:52:39,759
exporting to html5 um so there are some

1420
00:52:38,480 --> 00:52:42,960
mismatches

1421
00:52:39,760 --> 00:52:44,399
there okay there's some more hype

1422
00:52:42,960 --> 00:52:46,079
questions

1423
00:52:44,400 --> 00:52:47,1000
in hype is it possible to have an

1424
00:52:46,079 --> 00:52:48,559
interaction between scenes without a

1425
00:52:48,000 --> 00:52:51,680
button

1426
00:52:48,559 --> 00:52:56,559
in order to turn the pages

1427
00:52:51,679 --> 00:52:58,398
um i guess my question is how are you

1428
00:52:56,559 --> 00:53:00,160
turning the page but if you mean doing

1429
00:52:58,400 --> 00:53:02,640
like a swipe action

1430
00:53:00,159 --> 00:53:03,679
um those do exist in hype so you can say

1431
00:53:02,639 --> 00:53:07,358
on swipe

1432
00:53:03,679 --> 00:53:10,159
um turn do a page turn action

1433
00:53:07,358 --> 00:53:11,598
so that's probably the easiest way if

1434
00:53:10,159 --> 00:53:14,239
you're talking more from the

1435
00:53:11,599 --> 00:53:15,999
i want something to kind of run on

1436
00:53:14,239 --> 00:53:17,998
another scene but i still want to see it

1437
00:53:16,000 --> 00:53:20,719
on the scene

1438
00:53:18,000 --> 00:53:21,839
there is a construct called a persistent

1439
00:53:20,719 --> 00:53:23,518
symbol

1440
00:53:21,838 --> 00:53:25,278
and a symbol is kind of like a mini

1441
00:53:23,519 --> 00:53:26,239
scene within a scene it's a reusable

1442
00:53:25,280 --> 00:53:28,240
content

1443
00:53:26,239 --> 00:53:29,518
and the persistent bit means it's always

1444
00:53:28,239 --> 00:53:31,759
running in the background where it's

1445
00:53:29,519 --> 00:53:34,238
running uh wherever it shows up

1446
00:53:31,760 --> 00:53:35,679
um and so you can keep using that and

1447
00:53:34,239 --> 00:53:37,439
that definitely i would recommend

1448
00:53:35,679 --> 00:53:38,799
looking at the documentation on that

1449
00:53:37,440 --> 00:53:42,159
because uh there's

1450
00:53:38,800 --> 00:53:43,838
quite a few things to get to that point

1451
00:53:42,159 --> 00:53:46,317
but there are various constructs

1452
00:53:43,838 --> 00:53:47,597
so hopefully that answers the question

1453
00:53:46,318 --> 00:53:50,077
so and actually that

1454
00:53:47,599 --> 00:53:51,680
goes into this next question um because

1455
00:53:50,079 --> 00:53:51,1000
kind of like the symbol idea someone

1456
00:53:51,679 --> 00:53:54,879
said

1457
00:53:52,000 --> 00:53:56,000
in the is the b like a smart object in

1458
00:53:54,880 --> 00:53:58,400
photoshop meaning that if

1459
00:53:56,000 --> 00:53:59,200
it if i did edits to the b in

1460
00:53:58,400 --> 00:54:02,078
illustrator

1461
00:53:59,199 --> 00:54:03,918
i could swap it out with a new b after

1462
00:54:02,079 --> 00:54:04,319
the animation was created basically can

1463
00:54:03,920 --> 00:54:06,640
i

1464
00:54:04,318 --> 00:54:08,638
create all the objects in illustrator

1465
00:54:06,639 --> 00:54:11,679
and update as smart objects

1466
00:54:08,639 --> 00:54:14,158
if there were updates so the answer is

1467
00:54:11,679 --> 00:54:15,999
yes and no it's a smart object in so

1468
00:54:14,159 --> 00:54:18,317
much that

1469
00:54:16,000 --> 00:54:19,439
the original reference to the image is

1470
00:54:18,318 --> 00:54:23,358
always there so you can

1471
00:54:19,440 --> 00:54:26,400
scale it and not worry about the losing

1472
00:54:23,358 --> 00:54:30,077
bits when you do the scaling

1473
00:54:26,400 --> 00:54:33,680
if it's a single image file um

1474
00:54:30,079 --> 00:54:34,319
if you edit that image then go back to

1475
00:54:33,679 --> 00:54:35,998
hype

1476
00:54:34,318 --> 00:54:38,879
hype will say hey it looks like your

1477
00:54:36,000 --> 00:54:40,960
original was updated do you want to

1478
00:54:38,880 --> 00:54:42,799
update hype's copy of the image or do

1479
00:54:40,960 --> 00:54:45,519
you want to keep hypes copy

1480
00:54:42,798 --> 00:54:47,198
of it so it can you can choose to

1481
00:54:45,519 --> 00:54:48,958
automatically replace or not which is

1482
00:54:47,199 --> 00:54:51,998
nice for a workflow

1483
00:54:48,960 --> 00:54:54,160
the area where it's not is that

1484
00:54:52,000 --> 00:54:56,559
um hype doesn't really import like an

1485
00:54:54,159 --> 00:54:59,598
illustrator file or a photoshop file

1486
00:54:56,559 --> 00:55:01,680
as a layered image format right now um

1487
00:54:59,599 --> 00:55:04,559
so you would need to do the export to

1488
00:55:01,679 --> 00:55:05,038
a flat file in those applications for it

1489
00:55:04,559 --> 00:55:08,160
to be

1490
00:55:05,039 --> 00:55:08,558
imported uh properly into hype at this

1491
00:55:08,159 --> 00:55:10,797
point

1492
00:55:08,559 --> 00:55:11,838
it's of course a great feature if we had

1493
00:55:10,798 --> 00:55:14,639
um

1494
00:55:11,838 --> 00:55:16,318
layered image imports but we don't at

1495
00:55:14,639 --> 00:55:18,478
this point

1496
00:55:16,318 --> 00:55:20,159
johnny there's another question about

1497
00:55:18,480 --> 00:55:22,399
that can people

1498
00:55:20,159 --> 00:55:23,679
just copy and paste from illustrator

1499
00:55:22,400 --> 00:55:27,039
into hype

1500
00:55:23,679 --> 00:55:31,278
and other vector apps as well can you

1501
00:55:27,039 --> 00:55:34,638
uh will it accept vectors paste it in

1502
00:55:31,280 --> 00:55:36,400
so yes ish again there's always a caveat

1503
00:55:34,639 --> 00:55:38,317
here and there so if you were

1504
00:55:36,400 --> 00:55:39,520
in illustrator and copied and pasted it

1505
00:55:38,318 --> 00:55:43,279
would paste as

1506
00:55:39,519 --> 00:55:44,158
a svg image file um so you can copy and

1507
00:55:43,280 --> 00:55:45,520
paste but it

1508
00:55:44,159 --> 00:55:48,798
kind of does the flattening

1509
00:55:45,519 --> 00:55:51,999
automatically to be an svg file

1510
00:55:48,798 --> 00:55:55,278
hype i showed some shape tools

1511
00:55:52,000 --> 00:55:56,078
so hide does have a basic vector shape

1512
00:55:55,280 --> 00:55:58,880
editor

1513
00:55:56,079 --> 00:56:00,960
and that actually outputs svg but it

1514
00:55:58,880 --> 00:56:03,838
does not currently have the ability to

1515
00:56:00,960 --> 00:56:05,599
edit svg files directly so hype kind of

1516
00:56:03,838 --> 00:56:06,878
has its own view of shapes and there's

1517
00:56:05,599 --> 00:56:08,799
svg files

1518
00:56:06,880 --> 00:56:10,558
and hypezone view will output an svg

1519
00:56:08,798 --> 00:56:12,879
file if that makes sense

1520
00:56:10,559 --> 00:56:13,838
but you can't take an svg file currently

1521
00:56:12,880 --> 00:56:16,719
in hype

1522
00:56:13,838 --> 00:56:17,117
and edit that directly but of course

1523
00:56:16,719 --> 00:56:18,798
that's

1524
00:56:17,119 --> 00:56:20,639
that would be another very nice feature

1525
00:56:18,798 --> 00:56:23,198
for hype to have

1526
00:56:20,639 --> 00:56:25,278
and does hype uh support or allow for

1527
00:56:23,199 --> 00:56:28,317
drag and drop interactive

1528
00:56:25,280 --> 00:56:31,440
yes uh specifically out of the box

1529
00:56:28,318 --> 00:56:33,199
hype supports dragging um so in the

1530
00:56:31,440 --> 00:56:35,760
action inspector you can have

1531
00:56:33,199 --> 00:56:37,199
an on drag action and there's a few

1532
00:56:35,760 --> 00:56:38,159
different things that you can do with

1533
00:56:37,199 --> 00:56:41,118
that

1534
00:56:38,159 --> 00:56:43,199
one is the ability to control the

1535
00:56:41,119 --> 00:56:45,599
timeline which is what we saw in the

1536
00:56:43,199 --> 00:56:47,439
lake mead demo document of i took that

1537
00:56:45,599 --> 00:56:49,200
little

1538
00:56:47,440 --> 00:56:51,440
scroll thumb and i moved that across and

1539
00:56:49,199 --> 00:56:53,598
so that was controlling the timeline

1540
00:56:51,440 --> 00:56:55,040
you can also control the element

1541
00:56:53,599 --> 00:56:56,799
position so you can just kind of move it

1542
00:56:55,039 --> 00:56:59,357
wherever which is i think what this

1543
00:56:56,798 --> 00:57:00,879
question is about and then you can also

1544
00:56:59,358 --> 00:57:04,077
have javascript run

1545
00:57:00,880 --> 00:57:05,599
on every movement of a drag and so

1546
00:57:04,079 --> 00:57:07,200
that's how you would implement

1547
00:57:05,599 --> 00:57:09,039
dropping behaviors that you would need a

1548
00:57:07,199 --> 00:57:11,838
little bit of code to

1549
00:57:09,039 --> 00:57:13,279
figure out what you want to drop on hype

1550
00:57:11,838 --> 00:57:16,318
doesn't have the drop

1551
00:57:13,280 --> 00:57:18,159
part of it um built in but if you look

1552
00:57:16,318 --> 00:57:19,597
on the forums there are some pretty

1553
00:57:18,159 --> 00:57:20,958
canonical ways

1554
00:57:19,599 --> 00:57:22,639
of doing this where i think you just

1555
00:57:20,960 --> 00:57:23,598
drag in like a script or something and

1556
00:57:22,639 --> 00:57:26,078
then you can

1557
00:57:23,599 --> 00:57:28,400
add a couple properties to the um

1558
00:57:26,079 --> 00:57:31,359
element and get drag and drop behavior

1559
00:57:28,400 --> 00:57:32,078
through that okay and then someone also

1560
00:57:31,358 --> 00:57:35,199
asked is

1561
00:57:32,079 --> 00:57:37,838
hype available for windows no no

1562
00:57:35,199 --> 00:57:38,239
okay but it's good to know that there's

1563
00:57:37,838 --> 00:57:41,998
uh

1564
00:57:38,239 --> 00:57:44,479
people wanting that okay let's see

1565
00:57:42,000 --> 00:57:46,160
just a second i just want to just a

1566
00:57:44,480 --> 00:57:48,640
broadcasting note here we're

1567
00:57:46,159 --> 00:57:49,199
we're at an hour i'm perfectly happy to

1568
00:57:48,639 --> 00:57:51,438
stay on

1569
00:57:49,199 --> 00:57:52,318
we have over 100 people still in on

1570
00:57:51,440 --> 00:57:54,239
there so

1571
00:57:52,318 --> 00:57:55,999
clearly there's interest in people

1572
00:57:54,239 --> 00:57:59,598
getting their questions answered

1573
00:57:56,000 --> 00:58:00,879
i don't know um jonathan and daniel what

1574
00:57:59,599 --> 00:58:02,639
your availability is but

1575
00:58:00,880 --> 00:58:03,1000
i'm i'm happy to stay on answer

1576
00:58:02,639 --> 00:58:05,679
questions and i'm happy to keep the

1577
00:58:04,000 --> 00:58:06,798
webinar going so long as people have

1578
00:58:05,679 --> 00:58:08,879
questions

1579
00:58:06,798 --> 00:58:10,077
yep definitely happy to keep going and

1580
00:58:08,880 --> 00:58:13,118
answer questions yep

1581
00:58:10,079 --> 00:58:14,239
awesome well if anybody has to leave uh

1582
00:58:13,119 --> 00:58:17,359
we'll say goodbye

1583
00:58:14,239 --> 00:58:18,317
thank you for joining and uh but if you

1584
00:58:17,358 --> 00:58:19,758
have questions

1585
00:58:18,318 --> 00:58:22,159
or you just want to stay on and hear

1586
00:58:19,760 --> 00:58:23,039
more answers um we'll we'll keep going

1587
00:58:22,159 --> 00:58:25,518
for a bit

1588
00:58:23,039 --> 00:58:27,279
so i think you said justin the recording

1589
00:58:25,519 --> 00:58:28,878
will be available after also right

1590
00:58:27,280 --> 00:58:31,999
yes and we will make the recording

1591
00:58:28,880 --> 00:58:31,1000
available great

1592
00:58:32,400 --> 00:58:35,679
and i would also say if people if we

1593
00:58:33,838 --> 00:58:38,798
haven't gotten to your question maybe

1594
00:58:35,679 --> 00:58:39,518
go ahead and put it in the q a pod or or

1595
00:58:38,798 --> 00:58:41,758
in the chat

1596
00:58:39,519 --> 00:58:42,878
um either one so that we can make sure

1597
00:58:41,760 --> 00:58:44,558
to get them because

1598
00:58:42,880 --> 00:58:46,719
when there was a lot of questions it's

1599
00:58:44,559 --> 00:58:48,479
easy to miss things yep

1600
00:58:46,719 --> 00:58:49,919
and i see alan's got his hand raised

1601
00:58:48,480 --> 00:58:51,200
we'll get to myra go ahead with the

1602
00:58:49,920 --> 00:58:51,599
question you were about to start and

1603
00:58:51,199 --> 00:58:55,038
then

1604
00:58:51,599 --> 00:58:57,520
alan we'll get to you after that okay

1605
00:58:55,039 --> 00:58:58,958
can animated image sequences import into

1606
00:58:57,519 --> 00:59:04,158
hype and create swiping

1607
00:58:58,960 --> 00:59:07,440
a swiping effect similar to n5

1608
00:59:04,159 --> 00:59:09,279
um i have not used in five's feature on

1609
00:59:07,440 --> 00:59:12,880
that so just maybe you can um

1610
00:59:09,280 --> 00:59:13,440
let me know what where things are

1611
00:59:12,880 --> 00:59:16,839
different

1612
00:59:13,440 --> 00:59:18,480
but you can import um animated image

1613
00:59:16,838 --> 00:59:20,639
sequences

1614
00:59:18,480 --> 00:59:23,358
into hype um actually let me is the

1615
00:59:20,639 --> 00:59:26,158
question written out

1616
00:59:23,358 --> 00:59:27,838
it's in the chat okay do you mind

1617
00:59:26,159 --> 00:59:31,038
repeating the questions right okay

1618
00:59:27,838 --> 00:59:31,679
can animated image sequences import into

1619
00:59:31,039 --> 00:59:35,279
height

1620
00:59:31,679 --> 00:59:37,597
and create swiping effect similar to n5

1621
00:59:35,280 --> 00:59:38,639
so i i think what this is referring to

1622
00:59:37,599 --> 00:59:40,799
jonathan is

1623
00:59:38,639 --> 00:59:42,719
um there is this ability to have a

1624
00:59:40,798 --> 00:59:45,118
smooth swiping experience and so

1625
00:59:42,719 --> 00:59:46,399
you can create what looks kind of like

1626
00:59:45,119 --> 00:59:50,319
3d animations

1627
00:59:46,400 --> 00:59:53,199
like 360 um through a swipe

1628
00:59:50,318 --> 00:59:54,638
okay um so the answer is yes there's not

1629
00:59:53,199 --> 00:59:56,879
like a built-in like

1630
00:59:54,639 --> 00:59:58,558
this is the exact way to do that but

1631
00:59:56,880 --> 00:59:59,359
it's very easy with a couple of the

1632
00:59:58,559 --> 01:00:02,240
constructs

1633
00:59:59,358 --> 01:00:03,518
so hype supports importing animated

1634
01:00:02,239 --> 01:00:06,798
image sequences

1635
01:00:03,519 --> 01:00:09,837
um and then the second thing it does

1636
01:00:06,798 --> 01:00:11,278
is it puts that on the timeline as an

1637
01:00:09,838 --> 01:00:14,238
actual animation

1638
01:00:11,280 --> 01:00:15,119
and so if you use the answer from the

1639
01:00:14,239 --> 01:00:17,998
other question is

1640
01:00:15,119 --> 01:00:20,798
which is does type support dragging you

1641
01:00:18,000 --> 01:00:24,960
can set up a on drag action to control

1642
01:00:20,798 --> 01:00:28,238
the timeline which is then bound to that

1643
01:00:24,960 --> 01:00:31,759
so by basically doing a drag on

1644
01:00:28,239 --> 01:00:36,239
your scene you are controlling the

1645
01:00:31,760 --> 01:00:38,160
um animated image sequence cool

1646
01:00:36,239 --> 01:00:40,078
and similar similar to that one kind of

1647
01:00:38,159 --> 01:00:41,357
a going the other direction instead of

1648
01:00:40,079 --> 01:00:44,079
from hype to in five

1649
01:00:41,358 --> 01:00:45,758
and five back to hype someone wanted to

1650
01:00:44,079 --> 01:00:48,960
know is it possible to import

1651
01:00:45,760 --> 01:00:51,439
indesign files into hype to work on them

1652
01:00:48,960 --> 01:00:51,440
in hype

1653
01:00:53,280 --> 01:00:59,999
it probably depends how you output them

1654
01:00:56,480 --> 01:00:59,1000
would be my answer

1655
01:01:01,039 --> 01:01:04,639
i would be curious about your use case

1656
01:01:03,679 --> 01:01:07,438
there because

1657
01:01:04,639 --> 01:01:08,317
indesign is kind of a much bigger here's

1658
01:01:07,440 --> 01:01:10,719
your whole

1659
01:01:08,318 --> 01:01:11,597
document and hype tends to be here is a

1660
01:01:10,719 --> 01:01:13,919
animation i mean

1661
01:01:11,599 --> 01:01:15,759
it definitely can go in reverse so i'd

1662
01:01:13,920 --> 01:01:19,838
be curious about that

1663
01:01:15,760 --> 01:01:22,880
uh the basic way maybe justin you have

1664
01:01:19,838 --> 01:01:24,479
more thoughts on it is that one of the

1665
01:01:22,880 --> 01:01:28,319
elements hype does provide

1666
01:01:24,480 --> 01:01:30,239
being a web format is a html widget

1667
01:01:28,318 --> 01:01:32,558
which is basically an iframe if you're

1668
01:01:30,239 --> 01:01:33,518
familiar with that for the html tag it's

1669
01:01:32,559 --> 01:01:36,400
um

1670
01:01:33,519 --> 01:01:37,039
just a kind of window on the page that

1671
01:01:36,400 --> 01:01:39,359
points to

1672
01:01:37,039 --> 01:01:40,558
another web page and so you could

1673
01:01:39,358 --> 01:01:43,278
potentially

1674
01:01:40,559 --> 01:01:45,039
use that widget either pointing to a url

1675
01:01:43,280 --> 01:01:48,079
for something that you had exported

1676
01:01:45,039 --> 01:01:48,958
from indesign or you could potentially

1677
01:01:48,079 --> 01:01:52,079
bring in

1678
01:01:48,960 --> 01:01:54,479
some of the html um that way that's

1679
01:01:52,079 --> 01:01:55,920
probably how i would go about doing it

1680
01:01:54,480 --> 01:01:58,079
yeah that's the only way i could imagine

1681
01:01:55,920 --> 01:01:59,839
doing is if you export with within five

1682
01:01:58,079 --> 01:02:00,400
and then you import it into a container

1683
01:01:59,838 --> 01:02:03,439
in hype

1684
01:02:00,400 --> 01:02:04,640
but that but actually like taking all

1685
01:02:03,440 --> 01:02:07,279
the artwork or like

1686
01:02:04,639 --> 01:02:08,398
bringing all the indesign stuff in into

1687
01:02:07,280 --> 01:02:11,839
hype as like

1688
01:02:08,400 --> 01:02:14,480
uh editable artwork i don't think so

1689
01:02:11,838 --> 01:02:16,399
like and just knowing the uh the

1690
01:02:14,480 --> 01:02:18,160
complexity of the indesign format i

1691
01:02:16,400 --> 01:02:19,440
i don't i don't think uh they would want

1692
01:02:18,159 --> 01:02:21,679
to take that on

1693
01:02:19,440 --> 01:02:23,039
that's just like a mess but if you're

1694
01:02:21,679 --> 01:02:24,879
talking about do i want

1695
01:02:23,039 --> 01:02:26,400
just a p i want to make a bigger height

1696
01:02:24,880 --> 01:02:27,759
piece and do i want just something

1697
01:02:26,400 --> 01:02:28,640
that's like a little flip book or

1698
01:02:27,760 --> 01:02:31,838
something that

1699
01:02:28,639 --> 01:02:32,398
is unique to n5 and put it in there yeah

1700
01:02:31,838 --> 01:02:33,519
yeah

1701
01:02:32,400 --> 01:02:35,1000
sounds like you should be able to do

1702
01:02:33,519 --> 01:02:37,999
that um i'm gonna

1703
01:02:36,000 --> 01:02:39,759
give alan a chance to talk because he's

1704
01:02:38,000 --> 01:02:41,119
been waiting patiently with his hand up

1705
01:02:39,760 --> 01:02:42,639
here

1706
01:02:41,119 --> 01:02:45,680
and alan just go ahead and unmute

1707
01:02:42,639 --> 01:02:48,557
yourself i'll have them

1708
01:02:45,679 --> 01:02:49,438
all right we can hear you great um the

1709
01:02:48,559 --> 01:02:51,439
only question i

1710
01:02:49,440 --> 01:02:53,680
i got i wondered about i'm relatively

1711
01:02:51,440 --> 01:02:56,720
new to n5 and i'd heard of

1712
01:02:53,679 --> 01:02:57,357
um hype but didn't know that much about

1713
01:02:56,719 --> 01:02:59,679
it

1714
01:02:57,358 --> 01:03:00,878
um when you were talking earlier you

1715
01:02:59,679 --> 01:03:02,399
were mentioning about when you'd

1716
01:03:00,880 --> 01:03:05,759
finished the animation

1717
01:03:02,400 --> 01:03:09,199
and then just exporting it as an oam

1718
01:03:05,760 --> 01:03:11,519
i just wanted to check how easy

1719
01:03:09,199 --> 01:03:14,958
is it a one-click export or are there a

1720
01:03:11,519 --> 01:03:18,479
bunch of options that you have to

1721
01:03:14,960 --> 01:03:20,400
sort out before you export the oam file

1722
01:03:18,480 --> 01:03:21,1000
specifically in hype it's one click um

1723
01:03:20,400 --> 01:03:23,679
it's one click i guess technically it's

1724
01:03:22,000 --> 01:03:27,359
in a sub menu it's in

1725
01:03:23,679 --> 01:03:29,278
file export is html5 om um and then

1726
01:03:27,358 --> 01:03:30,878
yeah but there's no there's no options

1727
01:03:29,280 --> 01:03:32,159
that you have to find that that was the

1728
01:03:30,880 --> 01:03:33,118
thing i wanted to check because

1729
01:03:32,159 --> 01:03:34,797
obviously

1730
01:03:33,119 --> 01:03:36,240
the the thing that i really like about

1731
01:03:34,798 --> 01:03:38,958
n5 is

1732
01:03:36,239 --> 01:03:41,279
there's the the idiot approach to

1733
01:03:38,960 --> 01:03:43,200
exporting the html which is the

1734
01:03:41,280 --> 01:03:44,639
the predefined settings which i think

1735
01:03:43,199 --> 01:03:46,239
are great and then when you get a little

1736
01:03:44,639 --> 01:03:48,078
bit more confident you can go into the

1737
01:03:46,239 --> 01:03:49,598
individual settings and i wondered how

1738
01:03:48,079 --> 01:03:53,519
similar it was

1739
01:03:49,599 --> 01:03:56,559
with uh hype arguably even easier

1740
01:03:53,519 --> 01:03:58,639
yeah it's just file export oam right

1741
01:03:56,559 --> 01:04:00,400
it's really straightforward

1742
01:03:58,639 --> 01:04:02,558
brilliant that's lovely thank you very

1743
01:04:00,400 --> 01:04:05,839
much yeah

1744
01:04:02,559 --> 01:04:05,838
yeah thanks for your question alan

1745
01:04:06,318 --> 01:04:10,318
all right um carolyn has another

1746
01:04:08,798 --> 01:04:11,597
question she's just been waiting so

1747
01:04:10,318 --> 01:04:12,558
patiently i want to give her a chance

1748
01:04:11,599 --> 01:04:15,440
and then we'll go back to

1749
01:04:12,559 --> 01:04:17,680
chat questions from uh erica let us know

1750
01:04:15,440 --> 01:04:19,520
if you have q a questions but uh

1751
01:04:17,679 --> 01:04:21,357
i know myra's got more questions waiting

1752
01:04:19,519 --> 01:04:24,719
so we'll do

1753
01:04:21,358 --> 01:04:26,239
let's see let me carolyn you go ahead

1754
01:04:24,719 --> 01:04:28,797
i didn't realize my hand was still

1755
01:04:26,239 --> 01:04:32,479
raised that's funny um

1756
01:04:28,798 --> 01:04:33,998
so uh i'm new to both uh

1757
01:04:32,480 --> 01:04:35,839
in five is that how you're pronouncing

1758
01:04:34,000 --> 01:04:39,118
it in five yes

1759
01:04:35,838 --> 01:04:40,078
and this new part of height so that's

1760
01:04:39,119 --> 01:04:43,439
kind of cool i'm not

1761
01:04:40,079 --> 01:04:45,359
new to illustrator photoshop all adobe

1762
01:04:43,440 --> 01:04:46,879
animation like i've done all of those

1763
01:04:45,358 --> 01:04:50,558
things websites

1764
01:04:46,880 --> 01:04:53,118
i'm not a big i'm not a big you know

1765
01:04:50,559 --> 01:04:54,079
knowledge base for coding uh especially

1766
01:04:53,119 --> 01:04:57,359
javascript that

1767
01:04:54,079 --> 01:05:01,920
made me like just like want to cry um

1768
01:04:57,358 --> 01:05:04,399
but uh so what i guess if i was to

1769
01:05:01,920 --> 01:05:05,920
get the if maybe if i bought one copy

1770
01:05:04,400 --> 01:05:07,759
and played around with it maybe one or

1771
01:05:05,920 --> 01:05:10,240
two people i mean

1772
01:05:07,760 --> 01:05:11,1000
how so what if if i was to work on this

1773
01:05:10,239 --> 01:05:13,279
document right i mean i can't really

1774
01:05:12,000 --> 01:05:14,720
share it with anybody because then they

1775
01:05:13,280 --> 01:05:16,719
wouldn't have the plugins right

1776
01:05:14,719 --> 01:05:18,719
if i needed to because i don't i'm not

1777
01:05:16,719 --> 01:05:20,318
the designer in the company i just do

1778
01:05:18,719 --> 01:05:22,558
all the production

1779
01:05:20,318 --> 01:05:24,399
so i would have to i mean it might be

1780
01:05:22,559 --> 01:05:26,719
something worth

1781
01:05:24,400 --> 01:05:28,480
you know having one or two people try it

1782
01:05:26,719 --> 01:05:30,558
and then we could buy it maybe you

1783
01:05:28,480 --> 01:05:32,079
have some sort of pricing system for for

1784
01:05:30,559 --> 01:05:33,920
the whole company kind of thing

1785
01:05:32,079 --> 01:05:36,160
are you are you talking about uh hype or

1786
01:05:33,920 --> 01:05:37,759
in five right either way i'm not sure

1787
01:05:36,159 --> 01:05:39,918
now that i've seen them both for the

1788
01:05:37,760 --> 01:05:41,440
first time demo i'm not sure what one

1789
01:05:39,920 --> 01:05:42,160
does and what the other does i'm sorry

1790
01:05:41,440 --> 01:05:45,279
to say

1791
01:05:42,159 --> 01:05:47,279
gotcha well yeah i certainly certainly

1792
01:05:45,280 --> 01:05:49,440
with our licensing you can

1793
01:05:47,280 --> 01:05:50,480
you can move up at any point and it like

1794
01:05:49,440 --> 01:05:51,520
prorates you so

1795
01:05:50,480 --> 01:05:54,160
you should you've got a lot of

1796
01:05:51,519 --> 01:05:56,398
flexibility there um and so it

1797
01:05:54,159 --> 01:05:58,078
it can make sense to to sign up and try

1798
01:05:56,400 --> 01:06:01,279
it out um

1799
01:05:58,079 --> 01:06:03,119
the uh to your question about

1800
01:06:01,280 --> 01:06:04,960
you know are other people locked out

1801
01:06:03,119 --> 01:06:07,119
like can we pass the file around well

1802
01:06:04,960 --> 01:06:08,960
you know there are some esoteric

1803
01:06:07,119 --> 01:06:11,038
challenges that come up with

1804
01:06:08,960 --> 01:06:12,799
people you're kind of working on the

1805
01:06:11,039 --> 01:06:14,640
same file

1806
01:06:12,798 --> 01:06:15,838
and having version management stuff like

1807
01:06:14,639 --> 01:06:19,118
that um

1808
01:06:15,838 --> 01:06:19,519
the file in terms of what you might you

1809
01:06:19,119 --> 01:06:21,280
might

1810
01:06:19,519 --> 01:06:23,278
have experienced with indesign with

1811
01:06:21,280 --> 01:06:27,358
plugins in the past where you open

1812
01:06:23,280 --> 01:06:29,598
a file that has a plugin used in it and

1813
01:06:27,358 --> 01:06:31,919
it gives you a warning

1814
01:06:29,599 --> 01:06:33,119
that may be what you're referring to in

1815
01:06:31,920 --> 01:06:35,118
five doesn't do that

1816
01:06:33,119 --> 01:06:36,960
and if you have hype content embedded in

1817
01:06:35,119 --> 01:06:40,319
there as an oam it's not gonna do that

1818
01:06:36,960 --> 01:06:41,359
you can you can you can have people work

1819
01:06:40,318 --> 01:06:44,399
on pieces

1820
01:06:41,358 --> 01:06:46,077
and or pass the file around and so long

1821
01:06:44,400 --> 01:06:48,400
as they have all the assets

1822
01:06:46,079 --> 01:06:49,119
you know you do like a file package and

1823
01:06:48,400 --> 01:06:50,480
or

1824
01:06:49,119 --> 01:06:52,159
you have a links folder in there that

1825
01:06:50,480 --> 01:06:54,880
has everything um

1826
01:06:52,159 --> 01:06:56,159
you should be good um the it's not gonna

1827
01:06:54,880 --> 01:06:57,598
give you a warning there's plenty of

1828
01:06:56,159 --> 01:06:59,279
things you can work on

1829
01:06:57,599 --> 01:07:00,639
um but there will be interactive

1830
01:06:59,280 --> 01:07:02,880
elements in indesign

1831
01:07:00,639 --> 01:07:04,239
that if people don't have n5 they might

1832
01:07:02,880 --> 01:07:06,159
not be able to edit

1833
01:07:04,239 --> 01:07:07,998
but they'll certainly be able to work on

1834
01:07:06,159 --> 01:07:08,719
open indesign and work on the indesign

1835
01:07:08,000 --> 01:07:10,559
elements

1836
01:07:08,719 --> 01:07:12,318
i'm just saying like if i did the in

1837
01:07:10,559 --> 01:07:14,559
five part

1838
01:07:12,318 --> 01:07:16,159
uh you know i could have somebody else

1839
01:07:14,559 --> 01:07:18,318
do the other part

1840
01:07:16,159 --> 01:07:19,759
uh that would be cool because if they oh

1841
01:07:18,318 --> 01:07:21,519
if it they try to open it and they

1842
01:07:19,760 --> 01:07:22,558
wouldn't let them open it at all that's

1843
01:07:21,519 --> 01:07:24,719
that's the drive

1844
01:07:22,559 --> 01:07:25,680
right no you shouldn't run into anything

1845
01:07:24,719 --> 01:07:28,638
like that with

1846
01:07:25,679 --> 01:07:29,598
with either product or the products

1847
01:07:28,639 --> 01:07:32,797
integrated

1848
01:07:29,599 --> 01:07:35,440
i'm seeing a few uh uh

1849
01:07:32,798 --> 01:07:35,999
links i it would be great if you could

1850
01:07:35,440 --> 01:07:37,839
even

1851
01:07:36,000 --> 01:07:38,960
just do a transcript of this chat

1852
01:07:37,838 --> 01:07:39,999
because there's a lot of great

1853
01:07:38,960 --> 01:07:41,920
information here

1854
01:07:40,000 --> 01:07:43,759
and i started trying to like open some

1855
01:07:41,920 --> 01:07:45,039
of them to say the urls i was like oh my

1856
01:07:43,760 --> 01:07:46,558
god overwhelmed

1857
01:07:45,039 --> 01:07:48,160
um it'd be great if we could get a

1858
01:07:46,559 --> 01:07:50,879
transcript that would be so cool

1859
01:07:48,159 --> 01:07:52,639
um so now so because now i need to i

1860
01:07:50,880 --> 01:07:54,799
feel like i need to separate

1861
01:07:52,639 --> 01:07:57,278
like hype is the animation part i

1862
01:07:54,798 --> 01:08:00,078
thought n5 did some of that too no

1863
01:07:57,280 --> 01:08:00,480
n5 does do some animation so i think

1864
01:08:00,079 --> 01:08:02,240
where

1865
01:08:00,480 --> 01:08:03,839
you would where you would see that that

1866
01:08:02,239 --> 01:08:06,557
tipping point is when you start to get

1867
01:08:03,838 --> 01:08:09,118
into really sophisticated stuff like

1868
01:08:06,559 --> 01:08:10,400
the thing that indesign is so good at is

1869
01:08:09,119 --> 01:08:12,799
really easy

1870
01:08:10,400 --> 01:08:14,640
predefined animation because you're just

1871
01:08:12,798 --> 01:08:16,157
selecting a preset from a drop down i

1872
01:08:14,639 --> 01:08:19,278
just want this to fly in from the left

1873
01:08:16,158 --> 01:08:20,959
boom got three or four things okay i can

1874
01:08:19,279 --> 01:08:23,198
animate all those and i can set the

1875
01:08:20,960 --> 01:08:25,278
timing so they go boom boom boom

1876
01:08:23,198 --> 01:08:27,198
um and then when you start to get into

1877
01:08:25,279 --> 01:08:28,960
something more sophisticated like i want

1878
01:08:27,198 --> 01:08:29,919
this to animate based on like you saw

1879
01:08:28,960 --> 01:08:32,960
that dragging

1880
01:08:29,920 --> 01:08:35,198
of the the graph or

1881
01:08:32,960 --> 01:08:37,040
i want something to animate on a really

1882
01:08:35,198 --> 01:08:39,278
complicated path

1883
01:08:37,039 --> 01:08:41,838
um those those kind of things where

1884
01:08:39,279 --> 01:08:43,439
you're going to reach a point where

1885
01:08:41,838 --> 01:08:45,039
you're like kind of maybe going to be

1886
01:08:43,439 --> 01:08:46,079
able to hack it in in design and then

1887
01:08:45,039 --> 01:08:46,958
you're going to cross the threshold

1888
01:08:46,079 --> 01:08:48,639
where it's just like

1889
01:08:46,960 --> 01:08:50,560
you you can't create something that

1890
01:08:48,640 --> 01:08:52,399
sophisticated that the

1891
01:08:50,560 --> 01:08:55,1000
thing you did was that in in five what

1892
01:08:52,399 --> 01:08:55,999
was that that was hype

1893
01:08:56,079 --> 01:09:00,399
because that was cool yeah all right so

1894
01:08:58,719 --> 01:09:03,039
i guess what i'll do is i'm gonna

1895
01:09:00,399 --> 01:09:04,798
try just doing some maybe i saw the

1896
01:09:03,039 --> 01:09:06,398
youtube channels i'm gonna just go

1897
01:09:04,798 --> 01:09:08,157
through the youtube channel because you

1898
01:09:06,399 --> 01:09:09,197
can understand now i'm completely

1899
01:09:08,158 --> 01:09:12,959
confused

1900
01:09:09,198 --> 01:09:15,678
as to which does what right right

1901
01:09:12,960 --> 01:09:16,718
uh yeah so i mean hype is specifically

1902
01:09:15,679 --> 01:09:17,920
animation

1903
01:09:16,719 --> 01:09:19,839
and then it's got a lot of great

1904
01:09:17,920 --> 01:09:20,400
interactivity in there and and then

1905
01:09:19,838 --> 01:09:22,959
think of

1906
01:09:20,399 --> 01:09:25,677
indesign is is goes within five so think

1907
01:09:22,960 --> 01:09:27,599
about the document level

1908
01:09:25,679 --> 01:09:29,520
okay all right great i appreciate it

1909
01:09:27,600 --> 01:09:29,919
thank you so much yeah you bet and i

1910
01:09:29,520 --> 01:09:32,640
think

1911
01:09:29,920 --> 01:09:34,080
myra if you would um put together notes

1912
01:09:32,640 --> 01:09:35,838
with the links from the chat

1913
01:09:34,079 --> 01:09:37,119
i will i'll share those out when i share

1914
01:09:35,838 --> 01:09:39,919
out the replay so

1915
01:09:37,119 --> 01:09:41,277
everybody who's on here i'll make sure

1916
01:09:39,920 --> 01:09:43,279
that to send out an email with the

1917
01:09:41,279 --> 01:09:44,880
replay and we'll we'll send some notes

1918
01:09:43,279 --> 01:09:47,439
out as well with links

1919
01:09:44,880 --> 01:09:49,519
yeah i want to show i might edit some of

1920
01:09:47,439 --> 01:09:51,119
it to show some of my co-work to say hey

1921
01:09:49,520 --> 01:09:52,879
this is what you can do

1922
01:09:51,119 --> 01:09:55,038
this is this is some pretty cool stuff

1923
01:09:52,880 --> 01:09:55,840
let's be the studio that does this cool

1924
01:09:55,039 --> 01:09:57,999
stuff

1925
01:09:55,840 --> 01:09:59,440
you know sounds great yeah yeah and then

1926
01:09:58,000 --> 01:10:02,320
the burden would be me to learn it and

1927
01:09:59,439 --> 01:10:03,919
teach it to everybody so like

1928
01:10:02,319 --> 01:10:05,359
all right great thank you so much really

1929
01:10:03,920 --> 01:10:06,960
appreciate it you bet thanks for your

1930
01:10:05,359 --> 01:10:08,479
questions carolyn what i'll do right now

1931
01:10:06,960 --> 01:10:11,120
carolyn is i'm going to put in

1932
01:10:08,479 --> 01:10:11,677
um the main link to the hype website

1933
01:10:11,119 --> 01:10:14,398
where it

1934
01:10:11,679 --> 01:10:16,400
says specifically what hype does and a

1935
01:10:14,399 --> 01:10:18,399
main link to the n5 page

1936
01:10:16,399 --> 01:10:20,799
and it tells you specifically what in

1937
01:10:18,399 --> 01:10:21,519
five does so should i copy these or will

1938
01:10:20,800 --> 01:10:25,519
you make the

1939
01:10:21,520 --> 01:10:27,279
notes oh we'll have them in both but

1940
01:10:25,520 --> 01:10:28,718
you can look in the chat right now and i

1941
01:10:27,279 --> 01:10:30,479
just tagged you

1942
01:10:28,719 --> 01:10:32,639
all right yeah what i usually do with

1943
01:10:30,479 --> 01:10:34,959
these things is seminars is i

1944
01:10:32,640 --> 01:10:36,239
i copy them as i'm going along but i

1945
01:10:34,960 --> 01:10:38,640
didn't because i'm

1946
01:10:36,238 --> 01:10:40,157
crazy busy today so with i'm actually

1947
01:10:38,640 --> 01:10:41,760
working and listening at the same time

1948
01:10:40,158 --> 01:10:43,439
as i'm sure we all do right

1949
01:10:41,760 --> 01:10:45,1000
absolutely well we appreciate you

1950
01:10:43,439 --> 01:10:47,519
joining oh no it was awesome i i meant

1951
01:10:46,000 --> 01:10:49,198
to join these things sooner i just

1952
01:10:47,520 --> 01:10:50,560
didn't have a chance so i appreciate it

1953
01:10:49,198 --> 01:10:53,438
thank you so much

1954
01:10:50,560 --> 01:10:55,199
yeah you bet hey justin building on that

1955
01:10:53,439 --> 01:10:57,039
and incorporating a couple questions

1956
01:10:55,198 --> 01:10:59,839
that we've had throughout the

1957
01:10:57,039 --> 01:11:00,237
webinar is can you just basically give

1958
01:10:59,840 --> 01:11:02,239
the

1959
01:11:00,238 --> 01:11:03,519
really brief overview of what the

1960
01:11:02,238 --> 01:11:05,519
workflow

1961
01:11:03,520 --> 01:11:07,439
is and like what each thing accomplishes

1962
01:11:05,520 --> 01:11:07,1000
like if you start with hype and you get

1963
01:11:07,439 --> 01:11:10,798
this

1964
01:11:08,000 --> 01:11:12,799
you put it into indesign which then with

1965
01:11:10,800 --> 01:11:13,119
n5 exports becomes this because there's

1966
01:11:12,800 --> 01:11:15,520
been

1967
01:11:13,119 --> 01:11:16,319
like questions about what each thing

1968
01:11:15,520 --> 01:11:18,640
outputs and

1969
01:11:16,319 --> 01:11:20,718
and and how it fits together those are

1970
01:11:18,640 --> 01:11:24,319
those are great questions so

1971
01:11:20,719 --> 01:11:25,039
um i mean you saw from from the initial

1972
01:11:24,319 --> 01:11:27,118
pieces that

1973
01:11:25,039 --> 01:11:28,398
that jonathan was showing that that hype

1974
01:11:27,119 --> 01:11:31,758
is capable of

1975
01:11:28,399 --> 01:11:34,318
of doing entire standalone pieces so

1976
01:11:31,760 --> 01:11:35,679
um there are cases where you'd just be

1977
01:11:34,319 --> 01:11:36,158
creating something in hype and you'd

1978
01:11:35,679 --> 01:11:39,999
export

1979
01:11:36,158 --> 01:11:40,879
html and and that that end result is

1980
01:11:40,000 --> 01:11:42,560
basically the same

1981
01:11:40,880 --> 01:11:43,920
end result you get within five like in

1982
01:11:42,560 --> 01:11:44,320
all these cases we're talking about

1983
01:11:43,920 --> 01:11:46,718
getting

1984
01:11:44,319 --> 01:11:48,559
html because that's the format that's

1985
01:11:46,719 --> 01:11:50,400
viewable on all browsers

1986
01:11:48,560 --> 01:11:52,319
um that's going to work across all these

1987
01:11:50,399 --> 01:11:53,999
places so that's that's our end point

1988
01:11:52,319 --> 01:11:56,238
with all of those things

1989
01:11:54,000 --> 01:11:58,480
now there are cases where um you're

1990
01:11:56,238 --> 01:11:58,799
working on a document so in indesign say

1991
01:11:58,479 --> 01:12:01,439
you're

1992
01:11:58,800 --> 01:12:02,159
creating uh a digital magazine or

1993
01:12:01,439 --> 01:12:04,639
something

1994
01:12:02,158 --> 01:12:05,279
let me uh let me share my screen again

1995
01:12:04,640 --> 01:12:06,640
just

1996
01:12:05,279 --> 01:12:08,879
just to make it crystal clear what we're

1997
01:12:06,640 --> 01:12:09,679
talking about so this this is the height

1998
01:12:08,880 --> 01:12:12,799
piece this

1999
01:12:09,679 --> 01:12:15,039
this um this dark gray background uh

2000
01:12:12,800 --> 01:12:17,840
with the slider this is the height piece

2001
01:12:15,039 --> 01:12:19,197
this is the website version and the this

2002
01:12:17,840 --> 01:12:21,440
container

2003
01:12:19,198 --> 01:12:23,678
is in five right this is created in

2004
01:12:21,439 --> 01:12:26,158
indesign same here this is

2005
01:12:23,679 --> 01:12:27,280
this is the height piece um but we have

2006
01:12:26,158 --> 01:12:30,398
these multiple pages

2007
01:12:27,279 --> 01:12:32,559
this is all indesign within five so

2008
01:12:30,399 --> 01:12:34,479
i've got this border at the bottom and

2009
01:12:32,560 --> 01:12:37,359
same with this piece which is just

2010
01:12:34,479 --> 01:12:39,038
a different design right but same same

2011
01:12:37,359 --> 01:12:41,677
basic content

2012
01:12:39,039 --> 01:12:42,798
and the output again in this case is

2013
01:12:41,679 --> 01:12:46,079
html

2014
01:12:42,800 --> 01:12:47,519
so in this particular workflow um i mean

2015
01:12:46,079 --> 01:12:49,998
this this works i think

2016
01:12:47,520 --> 01:12:51,760
the way it works for a lot of real world

2017
01:12:50,000 --> 01:12:53,839
pieces is that

2018
01:12:51,760 --> 01:12:56,718
daniel and jonathan had this piece and

2019
01:12:53,840 --> 01:13:00,559
they handed it off to me as an oam

2020
01:12:56,719 --> 01:13:01,199
and you know then we had a designer work

2021
01:13:00,560 --> 01:13:02,879
on

2022
01:13:01,198 --> 01:13:05,358
on the indesign document and they

2023
01:13:02,880 --> 01:13:05,840
created this and i went in and added

2024
01:13:05,359 --> 01:13:08,157
some

2025
01:13:05,840 --> 01:13:09,599
some animations like that start button

2026
01:13:08,158 --> 01:13:11,519
and some interactivity

2027
01:13:09,600 --> 01:13:14,319
animations of things coming in and on

2028
01:13:11,520 --> 01:13:16,480
the page that's all done in indesign

2029
01:13:14,319 --> 01:13:18,078
and we we have lots of videos on doing

2030
01:13:16,479 --> 01:13:21,118
that and what i did was

2031
01:13:18,079 --> 01:13:24,079
place this this hype document in there

2032
01:13:21,119 --> 01:13:25,439
and so what we have which is you know we

2033
01:13:24,079 --> 01:13:27,279
we've kind of talked about a little bit

2034
01:13:25,439 --> 01:13:29,519
is we have the circular nature of

2035
01:13:27,279 --> 01:13:30,479
html you can always put html inside of

2036
01:13:29,520 --> 01:13:32,158
html

2037
01:13:30,479 --> 01:13:33,677
and just because you're using html

2038
01:13:32,158 --> 01:13:34,799
doesn't mean you're doing any code

2039
01:13:33,679 --> 01:13:36,559
whatsoever

2040
01:13:34,800 --> 01:13:38,559
so this overall workflow is that we have

2041
01:13:36,560 --> 01:13:41,760
one team working on the animation

2042
01:13:38,560 --> 01:13:42,800
another team uh working on this indesign

2043
01:13:41,760 --> 01:13:45,599
piece which is

2044
01:13:42,800 --> 01:13:46,800
which is the overall document and so we

2045
01:13:45,600 --> 01:13:49,600
we worked on the layout

2046
01:13:46,800 --> 01:13:50,719
independent of this interactive piece

2047
01:13:49,600 --> 01:13:53,840
and then

2048
01:13:50,719 --> 01:13:56,640
put them together and once that was

2049
01:13:53,840 --> 01:13:56,880
once all the content was ready then i go

2050
01:13:56,640 --> 01:14:01,359
up

2051
01:13:56,880 --> 01:14:04,399
and i export and i choose my options

2052
01:14:01,359 --> 01:14:04,959
and and go to export and once i do that

2053
01:14:04,399 --> 01:14:08,157
i then

2054
01:14:04,960 --> 01:14:09,198
have html now i can view that locally

2055
01:14:08,158 --> 01:14:11,999
like these

2056
01:14:09,198 --> 01:14:13,358
these files are you can see this is on

2057
01:14:12,000 --> 01:14:15,439
the

2058
01:14:13,359 --> 01:14:16,559
this is a file path so this is just on

2059
01:14:15,439 --> 01:14:18,878
my computer

2060
01:14:16,560 --> 01:14:20,640
uh this file is on the web i can view it

2061
01:14:18,880 --> 01:14:21,120
either way this one's on the web so that

2062
01:14:20,640 --> 01:14:22,959
this

2063
01:14:21,119 --> 01:14:24,799
um this interaction between the two

2064
01:14:22,960 --> 01:14:28,479
works just because

2065
01:14:24,800 --> 01:14:29,439
it's a it's an intricacy of how browsers

2066
01:14:28,479 --> 01:14:30,959
work in terms of

2067
01:14:29,439 --> 01:14:33,119
having one piece be able to talk to

2068
01:14:30,960 --> 01:14:35,759
another piece um

2069
01:14:33,119 --> 01:14:37,359
but those but the basic the workflow of

2070
01:14:35,760 --> 01:14:40,718
the larger document

2071
01:14:37,359 --> 01:14:42,639
is all built in indesign the animation

2072
01:14:40,719 --> 01:14:45,520
interactivity in this piece so you think

2073
01:14:42,640 --> 01:14:48,399
of this as as its own separate piece

2074
01:14:45,520 --> 01:14:49,279
but then we integrated it into indesign

2075
01:14:48,399 --> 01:14:53,439
and exported

2076
01:14:49,279 --> 01:14:56,958
within five so hopefully

2077
01:14:53,439 --> 01:14:57,519
that that helps explain that larger

2078
01:14:56,960 --> 01:14:59,279
piece so

2079
01:14:57,520 --> 01:15:00,799
you can imagine that you have somebody

2080
01:14:59,279 --> 01:15:02,078
who's doing layout

2081
01:15:00,800 --> 01:15:04,639
and then you have somebody who is more

2082
01:15:02,079 --> 01:15:06,958
of a specialist in animation

2083
01:15:04,640 --> 01:15:07,760
and and and possibly the they're

2084
01:15:06,960 --> 01:15:09,759
comfortable

2085
01:15:07,760 --> 01:15:11,280
doing code so they could they could add

2086
01:15:09,760 --> 01:15:12,719
some really sophisticated stuff so if

2087
01:15:11,279 --> 01:15:15,998
you want to have

2088
01:15:12,719 --> 01:15:18,400
you know a really detailed infographic

2089
01:15:16,000 --> 01:15:19,520
um that that might be something that

2090
01:15:18,399 --> 01:15:21,359
you're doing in hype that you're

2091
01:15:19,520 --> 01:15:22,238
integrating into this larger document

2092
01:15:21,359 --> 01:15:23,919
that says like

2093
01:15:22,238 --> 01:15:25,118
an annual report right and then you're

2094
01:15:23,920 --> 01:15:26,238
going to have you want to animate a

2095
01:15:25,119 --> 01:15:27,839
bunch of your numbers

2096
01:15:26,238 --> 01:15:29,519
well some of that you can do in indesign

2097
01:15:27,840 --> 01:15:32,800
but if you want to get

2098
01:15:29,520 --> 01:15:34,480
you know really if you really want to

2099
01:15:32,800 --> 01:15:36,960
want to wow the people reading it then

2100
01:15:34,479 --> 01:15:38,479
you'd go over to hype you can hype and

2101
01:15:36,960 --> 01:15:40,480
just import in your document you can

2102
01:15:38,479 --> 01:15:42,079
have people working on it independently

2103
01:15:40,479 --> 01:15:43,519
or you could if you're comfortable doing

2104
01:15:42,079 --> 01:15:46,958
all of it you can do all of it

2105
01:15:43,520 --> 01:15:49,359
integrate it so there's

2106
01:15:46,960 --> 01:15:50,560
it's not like there's one way to do it

2107
01:15:49,359 --> 01:15:51,999
but

2108
01:15:50,560 --> 01:15:53,600
you have a lot of options but that's

2109
01:15:52,000 --> 01:15:55,198
kind of the workflow we're talking about

2110
01:15:53,600 --> 01:15:57,359
it's the workflow i've seen

2111
01:15:55,198 --> 01:15:58,638
uh customers using where you know

2112
01:15:57,359 --> 01:16:00,319
they've got a hype piece that they're

2113
01:15:58,640 --> 01:16:04,080
bringing into indesign

2114
01:16:00,319 --> 01:16:05,678
so hopefully that helps clarify um

2115
01:16:04,079 --> 01:16:08,399
jonathan do you want to add anything to

2116
01:16:05,679 --> 01:16:11,119
that or daniel

2117
01:16:08,399 --> 01:16:12,479
i think one thing to think about on like

2118
01:16:11,119 --> 01:16:14,398
when hype is the right

2119
01:16:12,479 --> 01:16:16,237
tool is if you're doing a lot of

2120
01:16:14,399 --> 01:16:20,639
animation or interactivity

2121
01:16:16,238 --> 01:16:22,718
if you are not doing those

2122
01:16:20,640 --> 01:16:24,880
then hype might not even be the right

2123
01:16:22,719 --> 01:16:27,520
tool because there are other tools

2124
01:16:24,880 --> 01:16:30,320
for the web that probably can be more

2125
01:16:27,520 --> 01:16:32,718
effective so i would say

2126
01:16:30,319 --> 01:16:34,639
if you think about what is your overall

2127
01:16:32,719 --> 01:16:35,759
document is it a

2128
01:16:34,640 --> 01:16:37,840
if it's something in the digital

2129
01:16:35,760 --> 01:16:39,599
publication realm then starting with

2130
01:16:37,840 --> 01:16:42,080
indesign may be the right choice

2131
01:16:39,600 --> 01:16:43,439
and it may be a matter of well but i

2132
01:16:42,079 --> 01:16:44,639
want these parts to be really

2133
01:16:43,439 --> 01:16:46,798
interactive or to

2134
01:16:44,640 --> 01:16:48,640
have very sophisticated animations

2135
01:16:46,800 --> 01:16:51,920
that's when you reach for height

2136
01:16:48,640 --> 01:16:54,239
and pull it in um would be my general

2137
01:16:51,920 --> 01:16:56,238
thought on the matter

2138
01:16:54,238 --> 01:16:58,157
yeah so there was another question that

2139
01:16:56,238 --> 01:17:01,359
was kind of related to what you were

2140
01:16:58,158 --> 01:17:03,759
talk you started at the answer with um

2141
01:17:01,359 --> 01:17:05,998
hype is delivered as html

2142
01:17:03,760 --> 01:17:06,880
um and the question and i'm not sure if

2143
01:17:06,000 --> 01:17:09,759
they are saying

2144
01:17:06,880 --> 01:17:12,080
um there's they ask is the exported file

2145
01:17:09,760 --> 01:17:15,599
with hype and i don't know if they mean

2146
01:17:12,079 --> 01:17:16,559
just with hype or the n5 export with

2147
01:17:15,600 --> 01:17:19,519
hype

2148
01:17:16,560 --> 01:17:20,479
as an oam file and so you guys can both

2149
01:17:19,520 --> 01:17:23,520
answer that

2150
01:17:20,479 --> 01:17:25,998
um with all the assets so it can open

2151
01:17:23,520 --> 01:17:29,119
and run in a browser not connected to

2152
01:17:26,000 --> 01:17:32,719
the internet like in a kiosk

2153
01:17:29,119 --> 01:17:34,718
so from the hype side um so

2154
01:17:32,719 --> 01:17:35,840
generally what we've been talking about

2155
01:17:34,719 --> 01:17:38,239
is exporting as

2156
01:17:35,840 --> 01:17:40,880
an oam widget which is kind of like a

2157
01:17:38,238 --> 01:17:42,398
self-contained module which adobe

2158
01:17:40,880 --> 01:17:44,400
at least i'm pretty sure was adobe

2159
01:17:42,399 --> 01:17:46,157
originally developed to

2160
01:17:44,399 --> 01:17:48,238
get animations from one product to

2161
01:17:46,158 --> 01:17:51,119
another and we're just hijacking

2162
01:17:48,238 --> 01:17:51,758
this format that is under the hood like

2163
01:17:51,119 --> 01:17:53,438
a zip

2164
01:17:51,760 --> 01:17:55,760
and yeah it's got the html but you

2165
01:17:53,439 --> 01:17:58,479
wouldn't do that hype standard exports

2166
01:17:55,760 --> 01:17:59,599
does export to a dot html file and you

2167
01:17:58,479 --> 01:18:03,519
can double click that

2168
01:17:59,600 --> 01:18:06,479
and open it so the answer is basically

2169
01:18:03,520 --> 01:18:08,319
yes but not really for the oam part

2170
01:18:06,479 --> 01:18:10,318
because that's intended to share to a

2171
01:18:08,319 --> 01:18:12,639
product like

2172
01:18:10,319 --> 01:18:13,359
indesign but hype has a lot of different

2173
01:18:12,640 --> 01:18:16,479
options

2174
01:18:13,359 --> 01:18:18,958
um it can not only export as just a

2175
01:18:16,479 --> 01:18:20,639
html file with its associated assets it

2176
01:18:18,960 --> 01:18:22,640
can also do video export

2177
01:18:20,640 --> 01:18:24,640
or animated gif export so there's a lot

2178
01:18:22,640 --> 01:18:29,760
of different ways to get your content

2179
01:18:24,640 --> 01:18:33,360
um either offline and use it that way

2180
01:18:29,760 --> 01:18:36,639
or into different applications

2181
01:18:33,359 --> 01:18:37,599
nice well i'm answering about the kiosk

2182
01:18:36,640 --> 01:18:40,399
portion too

2183
01:18:37,600 --> 01:18:41,199
because because both products export

2184
01:18:40,399 --> 01:18:43,677
html

2185
01:18:41,198 --> 01:18:44,879
as an endpoint um there are several

2186
01:18:43,679 --> 01:18:47,919
kiosk apps

2187
01:18:44,880 --> 01:18:48,639
that will just take html um and then

2188
01:18:47,920 --> 01:18:50,400
they do the

2189
01:18:48,640 --> 01:18:51,760
the wrapping and create the kiosk for

2190
01:18:50,399 --> 01:18:54,559
you um

2191
01:18:51,760 --> 01:18:55,199
so so either one or creating from hype

2192
01:18:54,560 --> 01:18:58,399
or

2193
01:18:55,198 --> 01:18:58,959
within five basically you're you're

2194
01:18:58,399 --> 01:19:00,798
ready

2195
01:18:58,960 --> 01:19:02,879
for a kiosk like you just take that

2196
01:19:00,800 --> 01:19:03,760
format and and then you just need the

2197
01:19:02,880 --> 01:19:05,920
the product that

2198
01:19:03,760 --> 01:19:07,599
that wraps it and makes it into a kiosk

2199
01:19:05,920 --> 01:19:09,359
app so you're good with either one of

2200
01:19:07,600 --> 01:19:12,718
those products to

2201
01:19:09,359 --> 01:19:12,718
to go through to a kiosk

2202
01:19:14,399 --> 01:19:19,519
uh i see that ed has his hand raised so

2203
01:19:17,679 --> 01:19:21,119
ed you are good to unmute when you're

2204
01:19:19,520 --> 01:19:23,840
ready

2205
01:19:21,119 --> 01:19:25,038
oh thanks everybody um yeah i just this

2206
01:19:23,840 --> 01:19:29,120
question is probably for

2207
01:19:25,039 --> 01:19:30,479
the hype crew um i'm a video editor and

2208
01:19:29,119 --> 01:19:31,038
i've been working in premiere in after

2209
01:19:30,479 --> 01:19:32,479
effects

2210
01:19:31,039 --> 01:19:35,999
and we're deploying a little bit more

2211
01:19:32,479 --> 01:19:39,198
interactivity to our lessons

2212
01:19:36,000 --> 01:19:41,919
they are delivered via html5

2213
01:19:39,198 --> 01:19:43,358
um i've been able to kind of start

2214
01:19:41,920 --> 01:19:46,559
creating some interactions and

2215
01:19:43,359 --> 01:19:49,118
have some pretty good success so far but

2216
01:19:46,560 --> 01:19:50,159
is there a good resource and i'm i don't

2217
01:19:49,119 --> 01:19:51,678
know javascript

2218
01:19:50,158 --> 01:19:54,078
at all but i want to add a little bit

2219
01:19:51,679 --> 01:19:56,159
more complexity to these

2220
01:19:54,079 --> 01:19:57,358
for instance you know i choose all the

2221
01:19:56,158 --> 01:19:58,879
things that apply and

2222
01:19:57,359 --> 01:20:00,559
you can only move forward once all the

2223
01:19:58,880 --> 01:20:03,679
things are selected

2224
01:20:00,560 --> 01:20:04,560
type of deal um is there a good resource

2225
01:20:03,679 --> 01:20:06,960
um

2226
01:20:04,560 --> 01:20:07,760
being a javascript newbie that i can go

2227
01:20:06,960 --> 01:20:09,759
to

2228
01:20:07,760 --> 01:20:11,039
and find maybe some i don't know

2229
01:20:09,760 --> 01:20:12,480
shortcuts or

2230
01:20:11,039 --> 01:20:14,798
if this is what you want to do this is

2231
01:20:12,479 --> 01:20:17,038
the code snippet you need type of thing

2232
01:20:14,800 --> 01:20:19,840
um and i'll shut up and let you guys

2233
01:20:17,039 --> 01:20:19,838
answer

2234
01:20:20,719 --> 01:20:24,320
um i would say probably the a good

2235
01:20:23,359 --> 01:20:26,879
starting point

2236
01:20:24,319 --> 01:20:28,319
is our forums um they're pretty active

2237
01:20:26,880 --> 01:20:31,198
it's a good community of people

2238
01:20:28,319 --> 01:20:33,678
and there's um often folks who have

2239
01:20:31,198 --> 01:20:36,319
asked like how do i do this

2240
01:20:33,679 --> 01:20:37,440
and in general our dividing line on

2241
01:20:36,319 --> 01:20:39,758
interactivity

2242
01:20:37,439 --> 01:20:41,519
with code versus not code is doesn't

2243
01:20:39,760 --> 01:20:42,159
require logic and if it requires some

2244
01:20:41,520 --> 01:20:43,760
logic

2245
01:20:42,158 --> 01:20:45,359
then that's going to be something on the

2246
01:20:43,760 --> 01:20:48,399
javascript code side

2247
01:20:45,359 --> 01:20:51,998
that you're going to need to do um

2248
01:20:48,399 --> 01:20:54,399
you know the problem with uh

2249
01:20:52,000 --> 01:20:55,359
the creative field is every creative

2250
01:20:54,399 --> 01:20:57,758
endeavor

2251
01:20:55,359 --> 01:20:58,879
is a little bit different and sometimes

2252
01:20:57,760 --> 01:21:01,199
what is seemingly

2253
01:20:58,880 --> 01:21:02,319
minut but vitally important to the

2254
01:21:01,198 --> 01:21:04,718
creators

2255
01:21:02,319 --> 01:21:06,479
um and goals and so that's always a

2256
01:21:04,719 --> 01:21:07,280
problem with like is there a javascript

2257
01:21:06,479 --> 01:21:09,677
code snippet

2258
01:21:07,279 --> 01:21:10,879
um there very well could be depending on

2259
01:21:09,679 --> 01:21:14,320
what you want to do

2260
01:21:10,880 --> 01:21:15,1000
but often the devil's in the details and

2261
01:21:14,319 --> 01:21:18,559
you may want to say well this does most

2262
01:21:16,000 --> 01:21:21,198
of what i want but

2263
01:21:18,560 --> 01:21:22,080
i need it to display this message

2264
01:21:21,198 --> 01:21:23,678
differently or

2265
01:21:22,079 --> 01:21:25,838
jump to the scene and it didn't provide

2266
01:21:23,679 --> 01:21:26,480
for it um the good news is there's

2267
01:21:25,840 --> 01:21:29,119
people on

2268
01:21:26,479 --> 01:21:30,717
on the forums who are coders and

2269
01:21:29,119 --> 01:21:31,678
generally will help or point you in the

2270
01:21:30,719 --> 01:21:35,360
right direction

2271
01:21:31,679 --> 01:21:37,520
but coding is of course like a big field

2272
01:21:35,359 --> 01:21:39,519
yeah and you'll definitely find a lot of

2273
01:21:37,520 --> 01:21:41,1000
downloadable examples not just

2274
01:21:39,520 --> 01:21:43,760
long strings of code so you could see

2275
01:21:42,000 --> 01:21:45,198
exactly how people put them together too

2276
01:21:43,760 --> 01:21:46,480
yeah

2277
01:21:45,198 --> 01:21:48,879
great thanks guys i'll just hit the

2278
01:21:46,479 --> 01:21:48,878
forums

2279
01:21:49,039 --> 01:21:51,918
great thanks ed

2280
01:21:52,158 --> 01:21:57,358
uh erica or myra is there anything

2281
01:21:55,439 --> 01:21:59,039
popping up there's a couple questions

2282
01:21:57,359 --> 01:22:02,399
about how um

2283
01:21:59,039 --> 01:22:03,119
how the hype oms in indesign play with

2284
01:22:02,399 --> 01:22:06,559
uh

2285
01:22:03,119 --> 01:22:09,519
msos they don't

2286
01:22:06,560 --> 01:22:10,718
basically they you can put them in no i

2287
01:22:09,520 --> 01:22:14,239
mean you can put them

2288
01:22:10,719 --> 01:22:16,560
in msos um but um but uh

2289
01:22:14,238 --> 01:22:17,758
i'm sorry i was being glib in terms of

2290
01:22:16,560 --> 01:22:19,760
interactivity they can't

2291
01:22:17,760 --> 01:22:20,880
right they can't really talk to each

2292
01:22:19,760 --> 01:22:23,039
other i mean you

2293
01:22:20,880 --> 01:22:24,480
could maybe write some javascript that

2294
01:22:23,039 --> 01:22:27,598
would work once you

2295
01:22:24,479 --> 01:22:30,717
put it online but um but i don't think

2296
01:22:27,600 --> 01:22:31,840
that it i wouldn't expect to be able to

2297
01:22:30,719 --> 01:22:34,959
like click something

2298
01:22:31,840 --> 01:22:37,439
in a hype piece and interact and

2299
01:22:34,960 --> 01:22:39,198
and create interactivity in a

2300
01:22:37,439 --> 01:22:40,878
multi-state object so it could appear it

2301
01:22:39,198 --> 01:22:41,598
could appear in one you can have it

2302
01:22:40,880 --> 01:22:43,759
appear

2303
01:22:41,600 --> 01:22:45,439
through mso but then you can't interact

2304
01:22:43,760 --> 01:22:47,440
with it because it's an image correct i

2305
01:22:45,439 --> 01:22:49,439
mean oh no you can interact with it

2306
01:22:47,439 --> 01:22:51,039
i guess what i'm saying is you can't put

2307
01:22:49,439 --> 01:22:53,039
a button in hype that then

2308
01:22:51,039 --> 01:22:54,478
tells your mso to go to a different

2309
01:22:53,039 --> 01:22:57,119
state not easily

2310
01:22:54,479 --> 01:22:58,717
anyway right but you could have an mso

2311
01:22:57,119 --> 01:22:59,998
that like let's say it's empty and you

2312
01:22:58,719 --> 01:23:01,599
click a button and then it comes up and

2313
01:23:00,000 --> 01:23:03,120
there's your height piece

2314
01:23:01,600 --> 01:23:04,560
and then you click another button and it

2315
01:23:03,119 --> 01:23:05,119
goes to state two there's a different

2316
01:23:04,560 --> 01:23:06,400
height piece

2317
01:23:05,119 --> 01:23:08,238
and then you click a button and it goes

2318
01:23:06,399 --> 01:23:09,919
back to your original state and it's

2319
01:23:08,238 --> 01:23:13,359
empty and it hides the height

2320
01:23:09,920 --> 01:23:15,599
yes you should be able to do all of that

2321
01:23:13,359 --> 01:23:16,798
but i yeah so i just don't know but yeah

2322
01:23:15,600 --> 01:23:18,879
but but

2323
01:23:16,800 --> 01:23:20,960
blending interactivity between them

2324
01:23:18,880 --> 01:23:22,400
probably not you should think of it

2325
01:23:20,960 --> 01:23:24,080
sort of like jonathan was just

2326
01:23:22,399 --> 01:23:26,318
describing earlier about a container

2327
01:23:24,079 --> 01:23:27,759
like it lives in a container and you can

2328
01:23:26,319 --> 01:23:29,758
you know hide and show the container

2329
01:23:27,760 --> 01:23:31,679
with object states

2330
01:23:29,760 --> 01:23:32,960
um and if you really want to dig into it

2331
01:23:31,679 --> 01:23:35,760
you're doing something

2332
01:23:32,960 --> 01:23:37,120
sophisticated and it has to be just so

2333
01:23:35,760 --> 01:23:38,159
you could change that i mean the other

2334
01:23:37,119 --> 01:23:39,998
option is

2335
01:23:38,158 --> 01:23:41,439
to actually you can create something

2336
01:23:40,000 --> 01:23:44,320
akin to states and height

2337
01:23:41,439 --> 01:23:44,798
so if you need interactivity blending

2338
01:23:44,319 --> 01:23:47,039
with

2339
01:23:44,800 --> 01:23:48,880
the view changing maybe that should just

2340
01:23:47,039 --> 01:23:49,438
be a hype piece instead of a multi-state

2341
01:23:48,880 --> 01:23:51,678
object

2342
01:23:49,439 --> 01:23:53,998
so hopefully that that gives you some

2343
01:23:51,679 --> 01:23:53,1000
ideas

2344
01:23:57,760 --> 01:24:02,399
okay this last comment in the chat just

2345
01:24:00,639 --> 01:24:06,400
i think that was to clarify

2346
01:24:02,399 --> 01:24:09,439
um so if you click uh an n5 indesign

2347
01:24:06,399 --> 01:24:10,799
button then can you get the hype piece

2348
01:24:09,439 --> 01:24:15,118
to start or stop

2349
01:24:10,800 --> 01:24:17,599
etc it it should um

2350
01:24:15,119 --> 01:24:18,319
so if you if it's in a multi-state

2351
01:24:17,600 --> 01:24:21,600
object

2352
01:24:18,319 --> 01:24:24,958
and you go from let's say an empty state

2353
01:24:21,600 --> 01:24:25,600
to a state with a hype uh container in

2354
01:24:24,960 --> 01:24:27,920
it

2355
01:24:25,600 --> 01:24:30,718
it should it should reload the iframe

2356
01:24:27,920 --> 01:24:31,198
when that happens i believe um and which

2357
01:24:30,719 --> 01:24:34,879
would

2358
01:24:31,198 --> 01:24:37,999
cause the hype to start again um

2359
01:24:34,880 --> 01:24:39,439
so i believe that's the case um

2360
01:24:38,000 --> 01:24:41,279
and if it's not we could certainly

2361
01:24:39,439 --> 01:24:42,878
something we can look at

2362
01:24:41,279 --> 01:24:44,399
and there was a similar question from

2363
01:24:42,880 --> 01:24:47,120
earlier too so i don't know if this was

2364
01:24:44,399 --> 01:24:49,038
uh from the same person or not um can

2365
01:24:47,119 --> 01:24:53,038
different scenes be fired

2366
01:24:49,039 --> 01:24:53,039
in different slides in an iframe

2367
01:24:54,000 --> 01:24:58,559
okay so i feel like there's probably

2368
01:24:58,158 --> 01:25:01,038
more

2369
01:24:58,560 --> 01:25:02,718
information that i need um but

2370
01:25:01,039 --> 01:25:03,677
ultimately speaking the answer is

2371
01:25:02,719 --> 01:25:07,119
probably going to be a

2372
01:25:03,679 --> 01:25:10,159
yes um it may require a little bit

2373
01:25:07,119 --> 01:25:13,359
of um code

2374
01:25:10,158 --> 01:25:15,598
to do that because it sounds like

2375
01:25:13,359 --> 01:25:17,677
you have maybe your hype this is how i'm

2376
01:25:15,600 --> 01:25:21,199
imagining it set up that you have your

2377
01:25:17,679 --> 01:25:23,119
hype document in an iframe and then some

2378
01:25:21,198 --> 01:25:23,919
other things that are outside and it

2379
01:25:23,119 --> 01:25:26,638
could be the

2380
01:25:23,920 --> 01:25:27,120
hype document is within an iframe within

2381
01:25:26,639 --> 01:25:29,440
a

2382
01:25:27,119 --> 01:25:31,119
in five exported document or it could be

2383
01:25:29,439 --> 01:25:34,399
a regular web page

2384
01:25:31,119 --> 01:25:36,399
um but ultimately you have your

2385
01:25:34,399 --> 01:25:37,599
iframe which is the self-contained kind

2386
01:25:36,399 --> 01:25:38,838
of web view

2387
01:25:37,600 --> 01:25:41,199
and then something coming from the

2388
01:25:38,840 --> 01:25:44,239
outside so inside the iframe

2389
01:25:41,198 --> 01:25:45,518
hype has an api and that api does allow

2390
01:25:44,238 --> 01:25:48,959
you to

2391
01:25:45,520 --> 01:25:50,800
change scenes um as you would like and

2392
01:25:48,960 --> 01:25:53,519
so it's kind of a matter of getting

2393
01:25:50,800 --> 01:25:54,159
the code from the outside to go into the

2394
01:25:53,520 --> 01:25:56,319
iframe

2395
01:25:54,158 --> 01:25:57,519
to receive it there's a few different

2396
01:25:56,319 --> 01:26:00,319
ways to do it

2397
01:25:57,520 --> 01:26:02,079
um some of which depends on how the

2398
01:26:00,319 --> 01:26:03,678
domain is being hosted

2399
01:26:02,079 --> 01:26:05,678
because you actually have security

2400
01:26:03,679 --> 01:26:06,239
concerns on like a parent talking to a

2401
01:26:05,679 --> 01:26:09,839
child

2402
01:26:06,238 --> 01:26:11,438
and vice versa so you may have to do

2403
01:26:09,840 --> 01:26:12,960
like some javascript code that does a

2404
01:26:11,439 --> 01:26:16,078
post message

2405
01:26:12,960 --> 01:26:17,280
um you may be able to talk to it more

2406
01:26:16,079 --> 01:26:20,237
directly

2407
01:26:17,279 --> 01:26:20,718
there is one solution that comes to mind

2408
01:26:20,238 --> 01:26:23,278
i think

2409
01:26:20,719 --> 01:26:25,360
daniel may have written the original

2410
01:26:23,279 --> 01:26:27,519
code for it or the forum post

2411
01:26:25,359 --> 01:26:28,959
and it's that you can have there's a

2412
01:26:27,520 --> 01:26:31,279
little code snippet

2413
01:26:28,960 --> 01:26:33,839
that allows you to change scenes based

2414
01:26:31,279 --> 01:26:35,998
on the anchor tag in the url so you know

2415
01:26:33,840 --> 01:26:39,439
there's the little um like pound sign

2416
01:26:36,000 --> 01:26:40,960
anchor tag um so what you could actually

2417
01:26:39,439 --> 01:26:44,158
do in that regard

2418
01:26:40,960 --> 01:26:47,040
is you could say oh have the iframe

2419
01:26:44,158 --> 01:26:49,119
change its source or its url to

2420
01:26:47,039 --> 01:26:50,079
basically the same url but an anchor tag

2421
01:26:49,119 --> 01:26:52,079
with a scene name

2422
01:26:50,079 --> 01:26:53,759
and so if you adopt that inside then you

2423
01:26:52,079 --> 01:26:55,599
could automatically change things

2424
01:26:53,760 --> 01:26:57,360
hopefully that answers the question and

2425
01:26:55,600 --> 01:26:58,159
that's what you were going for but there

2426
01:26:57,359 --> 01:27:00,238
are

2427
01:26:58,158 --> 01:27:02,799
different ways to do the communication

2428
01:27:00,238 --> 01:27:04,398
to kind of drive hype documents

2429
01:27:02,800 --> 01:27:07,280
changing scenes is one of the ways in

2430
01:27:04,399 --> 01:27:07,278
which you can drive it

2431
01:27:08,560 --> 01:27:12,718
all right we are i think we're at the

2432
01:27:11,198 --> 01:27:15,118
half hour how are we doing on

2433
01:27:12,719 --> 01:27:17,440
questions are we we're through them all

2434
01:27:15,119 --> 01:27:18,158
um with the exception of people asking

2435
01:27:17,439 --> 01:27:21,998
for

2436
01:27:18,158 --> 01:27:25,598
um can you share these examples um

2437
01:27:22,000 --> 01:27:28,320
so maybe we can make things available

2438
01:27:25,600 --> 01:27:29,678
or for the people asking about examples

2439
01:27:28,319 --> 01:27:30,718
if you could just write in the chat are

2440
01:27:29,679 --> 01:27:32,719
you wanting like

2441
01:27:30,719 --> 01:27:33,1000
the original files or you wanting the

2442
01:27:32,719 --> 01:27:35,040
output files

2443
01:27:34,000 --> 01:27:36,480
i'm guessing you probably want the

2444
01:27:35,039 --> 01:27:38,318
original files but if you could go ahead

2445
01:27:36,479 --> 01:27:40,318
and put that in

2446
01:27:38,319 --> 01:27:42,479
the two questions were can you send me

2447
01:27:40,319 --> 01:27:43,678
an example of a digital magazine that is

2448
01:27:42,479 --> 01:27:45,677
truly responsive

2449
01:27:43,679 --> 01:27:47,280
my team won't let me use this for our

2450
01:27:45,679 --> 01:27:49,119
magazine because of ada

2451
01:27:47,279 --> 01:27:50,718
issues and the other one was could you

2452
01:27:49,119 --> 01:27:53,918
please share the indesign example

2453
01:27:50,719 --> 01:27:53,920
file for your demo

2454
01:27:57,679 --> 01:28:01,280
sorry i was just writing down the

2455
01:27:59,198 --> 01:28:03,118
responsive magazine

2456
01:28:01,279 --> 01:28:05,038
and what was the very last thing you

2457
01:28:03,119 --> 01:28:08,319
said um could you please share the

2458
01:28:05,039 --> 01:28:10,638
indesign example file of your demo

2459
01:28:08,319 --> 01:28:12,559
so i guess the one that you did today

2460
01:28:10,639 --> 01:28:15,280
indesign file of demo today

2461
01:28:12,560 --> 01:28:16,560
okay uh we'll we'll look into that we'll

2462
01:28:15,279 --> 01:28:19,918
see if that's

2463
01:28:16,560 --> 01:28:23,040
possible to share um

2464
01:28:19,920 --> 01:28:24,400
uh somebody had their hand up and uh if

2465
01:28:23,039 --> 01:28:26,079
you want to put your hand back up we can

2466
01:28:24,399 --> 01:28:26,879
make sure to answer but it sounds like

2467
01:28:26,079 --> 01:28:28,398
we're

2468
01:28:26,880 --> 01:28:30,239
we're kind of winding down we're getting

2469
01:28:28,399 --> 01:28:32,799
most of the questions answered

2470
01:28:30,238 --> 01:28:35,039
uh there we go isaiah i see you uh go

2471
01:28:32,800 --> 01:28:37,920
ahead and unmute when you're ready

2472
01:28:35,039 --> 01:28:38,478
thank you i just had a question about

2473
01:28:37,920 --> 01:28:41,1000
either

2474
01:28:38,479 --> 01:28:44,879
product and if any company was willing

2475
01:28:42,000 --> 01:28:46,320
to mention some exciting opportunities

2476
01:28:44,880 --> 01:28:49,519
in the future on the pro

2477
01:28:46,319 --> 01:28:51,439
product roadmap um or

2478
01:28:49,520 --> 01:28:52,799
if not that's okay but something that

2479
01:28:51,439 --> 01:28:55,278
maybe excites um

2480
01:28:52,800 --> 01:28:56,079
both of your teams about what's coming

2481
01:28:55,279 --> 01:28:57,919
down the pipeline

2482
01:28:56,079 --> 01:28:59,918
in the future maybe not for your company

2483
01:28:57,920 --> 01:29:02,719
but for the web in general and

2484
01:28:59,920 --> 01:29:02,718
presentations

2485
01:29:04,800 --> 01:29:11,120
all right uh so we do not publicly

2486
01:29:08,319 --> 01:29:14,878
um talk about our roadmap unfortunately

2487
01:29:11,119 --> 01:29:14,878
so i'm sorry about that but i think

2488
01:29:17,840 --> 01:29:23,1000
i would say in general that

2489
01:29:21,439 --> 01:29:24,798
i've been really pleased with in our

2490
01:29:24,000 --> 01:29:28,080
last version

2491
01:29:24,800 --> 01:29:30,239
the amount of vector shape adoption

2492
01:29:28,079 --> 01:29:32,237
and so i think that's a feature that

2493
01:29:30,238 --> 01:29:35,198
we'll continue to get some love

2494
01:29:32,238 --> 01:29:35,599
and i think also um one thing that we've

2495
01:29:35,198 --> 01:29:37,759
been

2496
01:29:35,600 --> 01:29:39,039
working with with some partners is

2497
01:29:37,760 --> 01:29:41,519
improving

2498
01:29:39,039 --> 01:29:42,958
some workflow and extensibility and so

2499
01:29:41,520 --> 01:29:44,879
that's always a direction that we're

2500
01:29:42,960 --> 01:29:47,440
going to go forward

2501
01:29:44,880 --> 01:29:48,638
in um so that's kind of my non-answer

2502
01:29:47,439 --> 01:29:50,717
answer

2503
01:29:48,639 --> 01:29:52,239
we're excited about some very specific

2504
01:29:50,719 --> 01:29:55,119
things yeah

2505
01:29:52,238 --> 01:29:55,919
but yeah you know i like to uh surprise

2506
01:29:55,119 --> 01:29:58,238
and delight

2507
01:29:55,920 --> 01:29:59,920
and i think when you say what you're

2508
01:29:58,238 --> 01:30:01,839
going to do there's always

2509
01:29:59,920 --> 01:30:05,040
sometimes engineering issues get in the

2510
01:30:01,840 --> 01:30:07,199
way or sometimes

2511
01:30:05,039 --> 01:30:09,598
various random things where work gets

2512
01:30:07,198 --> 01:30:11,919
reprioritized gets in the way so uh

2513
01:30:09,600 --> 01:30:13,920
we've kind of learned that uh we don't

2514
01:30:11,920 --> 01:30:15,359
reveal our roadmap but we do listen to

2515
01:30:13,920 --> 01:30:16,799
feedback and feedbacks taken

2516
01:30:15,359 --> 01:30:19,118
seriously so if you have feature

2517
01:30:16,800 --> 01:30:22,080
requests feel free to shoot us an email

2518
01:30:19,119 --> 01:30:22,478
and um those always get log prioritized

2519
01:30:22,079 --> 01:30:23,839
and

2520
01:30:22,479 --> 01:30:25,519
it's always the type of thing where when

2521
01:30:23,840 --> 01:30:26,800
we get a feature request it's like back

2522
01:30:25,520 --> 01:30:28,399
to the top of mind and maybe that's

2523
01:30:26,800 --> 01:30:31,120
something that we can uh

2524
01:30:28,399 --> 01:30:31,119
do immediately

2525
01:30:31,840 --> 01:30:35,840
yeah that's that's great i and i i

2526
01:30:34,158 --> 01:30:38,238
totally get that we certainly

2527
01:30:35,840 --> 01:30:39,360
run into those things um i want to echo

2528
01:30:38,238 --> 01:30:42,398
your sentiment about

2529
01:30:39,359 --> 01:30:46,078
um feedback well we we just

2530
01:30:42,399 --> 01:30:49,839
thrive on feedback um completely driven

2531
01:30:46,079 --> 01:30:52,319
um to that extent i don't have um an eta

2532
01:30:49,840 --> 01:30:54,080
on on this particular feature but i know

2533
01:30:52,319 --> 01:30:54,718
one thing that people have been asking

2534
01:30:54,079 --> 01:30:58,399
for a lot

2535
01:30:54,719 --> 01:31:01,600
is uh search um within documents and so

2536
01:30:58,399 --> 01:31:03,998
we that is probably our highest priority

2537
01:31:01,600 --> 01:31:06,159
right now in terms of new features

2538
01:31:04,000 --> 01:31:07,678
hoping to introduce it this year but

2539
01:31:06,158 --> 01:31:09,439
like jonathan said i'd

2540
01:31:07,679 --> 01:31:11,520
i'd like to under promise and over

2541
01:31:09,439 --> 01:31:13,358
deliver so we'll see and it's going to

2542
01:31:11,520 --> 01:31:14,879
require a lot of feedback so actually if

2543
01:31:13,359 --> 01:31:15,677
you're on our email list at some point

2544
01:31:14,880 --> 01:31:17,600
i'll be

2545
01:31:15,679 --> 01:31:19,440
asking to do a session like this where

2546
01:31:17,600 --> 01:31:21,039
we can talk through some of the

2547
01:31:19,439 --> 01:31:22,637
things like should it be searching

2548
01:31:21,039 --> 01:31:23,759
through hidden content and multi-state

2549
01:31:22,639 --> 01:31:25,360
objects you know there's going to be

2550
01:31:23,760 --> 01:31:27,039
weird stuff like that

2551
01:31:25,359 --> 01:31:28,718
that we need to figure out in order to

2552
01:31:27,039 --> 01:31:30,798
actually implement it

2553
01:31:28,719 --> 01:31:32,480
i will say generally one thing we we

2554
01:31:30,800 --> 01:31:35,040
sort of touched upon

2555
01:31:32,479 --> 01:31:35,519
um at one point in the webinar that that

2556
01:31:35,039 --> 01:31:37,677
i

2557
01:31:35,520 --> 01:31:38,799
i'm just really loving about web

2558
01:31:37,679 --> 01:31:41,360
technology is that

2559
01:31:38,800 --> 01:31:41,1000
um you know there was this this growing

2560
01:31:41,359 --> 01:31:45,519
pain of

2561
01:31:42,000 --> 01:31:47,519
of kind of switching the web from being

2562
01:31:45,520 --> 01:31:48,879
you know largely dependent on flash to

2563
01:31:47,520 --> 01:31:50,639
non-flash and

2564
01:31:48,880 --> 01:31:53,198
and we used to have all these fallback

2565
01:31:50,639 --> 01:31:55,280
formats uh during the transition and

2566
01:31:53,198 --> 01:31:57,919
and now the fact that we have a semi

2567
01:31:55,279 --> 01:31:59,599
standardization of of media in terms of

2568
01:31:57,920 --> 01:32:01,839
pretty much everything supports mp4

2569
01:31:59,600 --> 01:32:04,479
video pretty much everything supports

2570
01:32:01,840 --> 01:32:06,239
mp3 audio which is it's a lot less

2571
01:32:04,479 --> 01:32:09,919
thought required

2572
01:32:06,238 --> 01:32:11,518
microsoft is has completely sunsetted

2573
01:32:09,920 --> 01:32:13,440
internet explorer which was always a

2574
01:32:11,520 --> 01:32:16,319
pain and edge

2575
01:32:13,439 --> 01:32:16,717
is built on um chromium or blink or

2576
01:32:16,319 --> 01:32:19,039
whatever

2577
01:32:16,719 --> 01:32:20,719
like it's it's they're they're largely

2578
01:32:19,039 --> 01:32:21,999
much more standard than they used to be

2579
01:32:20,719 --> 01:32:25,280
it doesn't mean there aren't

2580
01:32:22,000 --> 01:32:28,400
specific browser quirks um

2581
01:32:25,279 --> 01:32:31,519
but the but the playing field is

2582
01:32:28,399 --> 01:32:33,038
is a lot less bumpy um and so that

2583
01:32:31,520 --> 01:32:34,959
that means it opens up a lot of

2584
01:32:33,039 --> 01:32:37,359
opportunity to create

2585
01:32:34,960 --> 01:32:38,319
really cool content that can be reliably

2586
01:32:37,359 --> 01:32:40,718
displayed on

2587
01:32:38,319 --> 01:32:42,399
everybody's device and with these two

2588
01:32:40,719 --> 01:32:46,400
tools you have the ability to

2589
01:32:42,399 --> 01:32:48,158
make them pieces responsive too so that

2590
01:32:46,399 --> 01:32:49,599
you know you can adjust to the person's

2591
01:32:48,158 --> 01:32:51,118
device so

2592
01:32:49,600 --> 01:32:54,880
i think that's that's a pretty nice

2593
01:32:51,119 --> 01:32:57,359
development overall in the industry

2594
01:32:54,880 --> 01:32:58,319
thanks for your questions isaiah uh all

2595
01:32:57,359 --> 01:33:00,959
right

2596
01:32:58,319 --> 01:33:01,359
unless i hear this is gonna be like last

2597
01:33:00,960 --> 01:33:02,800
call

2598
01:33:01,359 --> 01:33:05,359
anybody who wants to raise their hand

2599
01:33:02,800 --> 01:33:07,678
and ask a question go for it now

2600
01:33:05,359 --> 01:33:11,519
uh or or we'll see you on the next

2601
01:33:07,679 --> 01:33:11,520
webinar sometime in the in the future

2602
01:33:13,520 --> 01:33:19,119
all right i think that's it uh thank you

2603
01:33:16,639 --> 01:33:21,600
everybody for staying on so long thanks

2604
01:33:19,119 --> 01:33:23,678
thanks to jonathan and daniel for coming

2605
01:33:21,600 --> 01:33:26,080
on and showing hype

2606
01:33:23,679 --> 01:33:27,360
uh it was it was exciting to get to see

2607
01:33:26,079 --> 01:33:28,079
that and i know there were a lot of

2608
01:33:27,359 --> 01:33:31,118
people

2609
01:33:28,079 --> 01:33:33,598
getting a cool introduction to it and uh

2610
01:33:31,119 --> 01:33:35,678
hopefully everybody learned something or

2611
01:33:33,600 --> 01:33:38,880
got some inspiration

2612
01:33:35,679 --> 01:33:42,639
and i will just i'll say

2613
01:33:38,880 --> 01:33:44,080
stay safe keep staying safe and

2614
01:33:42,639 --> 01:33:51,840
what we'll hope to see you again in the

2615
01:33:44,079 --> 01:33:51,838
future thanks a lot everybody

2616
01:33:57,840 --> 01:33:59,920
you