Up next in 10
Get the full source code of application here:
Show More Show Less View Video Transcript
0:00
Uh hello guys, welcome to this video. So
0:02
in this video I'll show you a
0:05
designing tool for designing your
0:08
applications specifically webgl
0:10
animations. So this is a unicorn.studio.
0:14
This is the actual name of the
0:16
application. Simply go to the browser
0:17
and simply type this address and this
0:20
will be a simple complete AI studio kind
0:24
of uh thing. It's completely open source
0:27
and here you can create your WebGL UI
0:29
for completely free. There is no limit
0:33
out there. You first of all create
0:35
account here. Click on the sign up
0:37
button
0:39
and this makes uh designing UIs pretty
0:42
awesome and uh automatically
0:46
it will generate the UI for you. So
0:50
simply loging in with your Google
0:52
account and after you do this
0:57
just wait let me just
1:15
need to log
1:24
So once you log in right here, you will
1:27
be redirected to the dashboard area.
1:33
So this is actually the dashboard right
1:35
here. And uh right here you simply
1:39
can create a new project or you can
1:42
start with a template as well. So if you
1:46
want to start it from scratch, you
1:49
basically can manipulate the background
1:51
here. So
1:54
using the color picker, you can just
1:56
select any color and this will be a
2:00
complete desktop
2:02
thing right here. And it has a full
2:05
editor right here. So right you can
2:07
actually control the speed of this.
2:13
Can add a 3D shape.
2:16
Can add some text as well.
2:41
So once you do this uh you can
2:49
let me just sign in with
2:56
you can start with any sort of template
2:59
you simply select any template that you
3:02
want to
3:03
change. So now you can see it actually
3:08
this
3:09
this is actually this webgl animation
3:12
and the nice thing about this is you can
3:14
click the export button to export this
3:19
to a PNG file or JPG file.
3:28
or webp file anything
3:41
and you can edit everything right simply
3:43
click on that and you can edit or add
3:46
elements right here
3:48
you can add images as
3:57
So this is the WebGL animation. So this
4:01
is a nice little designer tool here,
4:03
Unicorn. Studio. Definitely check out
4:05
this for building your WebGL animations
4:08
or UI design. It has a bunch of
4:10
templates here. You simply select any
4:14
template.
4:39
So you can even add your own text here
4:42
as well.
4:46
So it's a fully edited right here. You
4:48
can just add shapes or images as well.
4:51
Open your local media editor and upload
4:55
your own images as well. You can also
4:58
add SVG shapes right here as well.
5:02
So definitely check out this
5:04
unicorn.studio for building your UIs and
5:07
webg and animations. And also check out
5:10
my website freemediattools.com
5:15
uh which contains thousands of tools.