The Imagineer's Workshop

RMichael21

Well-Known Member
Trailers

Hey, everyone! I know that @englanddg was interesting in how I made this video:



So, I figured that I would explain it!

It's actually a lot simpler than one might think. It's made in iMovie and it is a template for one of their trailers.

I'll run you guys through the step by step process:

1) First, you have to download iMovie, which will only work on a Mac Computer or any other Apple Computer. Once you have it downloaded, open it. If you've never used iMovie, read through the short tutorial. However, with the newly updated software, I would read through anyways in order to catch yourself up.

2) Then, click on "Create" in the top left-hand corner. After that, click the "trailer" option.

3) Then, a selection of templates will come up. If you want to see a sample, click on the "play" button that appears when you hover your mouse over the template. To select the template you want to make your movie with, click the desired box and select "Create."

4) Then, you'll be able to tweak your trailer to however you want it!

If you want real footage in your trailer, make the different clips the same lengths as the available slots!

If you don't, then convert the trailer to a movie by selecting File > Convert Trailer to Movie. Then, you can click, copy and paste the purple lettering over the footage slots. This hides the weird gray footage and adds in a more desirable effect. But, make sure the new pasted lettering is the same length of the gray footage slots, or the pacing of the movie will be altered!

When your finished, click share! Then, you can upload to YouTube, download a file, post to Facebook or Vimeo or E-Mail it too yourself or a friend. The rest is easy to follow along.

Creating your trailer takes a little bit of practice, but it's extremely easy to use!


I apologize if this post is a bit vague, but I figured that it's all I needed to describe how to make it. :)
 

DinoInstitute

Well-Known Member
So, I figured I might as well post a Workshop post about how I made this video in my recent TSI presentation:


This is my first time ever making a video, so it's not the best, but it works. So, luckily for those of you out there who don't have great video skills like me, this is just about as simple and basic you can get!:p:D

This was made in Windows Live Movie Maker. To start, I just started a new project, and began.
First, you can click to insert new photo or video, and that's how I got the different images. This is what I worked from.
Next, to add text to each slide, you click "caption", where you can type up whatever you'd like with a small text editor.
The next thing I did to make it less like a slide show and more like a video was adding a transition between each image. This can be done by going to animations, and selecting the transition you like.
My final step was adding in music. I already owned the "You've got a friend in me" instrumental from the WDW Album from the Itunes store, so I don't know how to add any other music, but to add that, I clicked add music in the home tab. I think there was some option to fit the video length to match the music length, but I don't really remember:p

Anyways, that's it! If you have any questions, just ask! (And I will probably have some questions myself on how to make an improved video:p)
 

Zweiland

Well-Known Member
So, I figured I might as well post a Workshop post about how I made this video in my recent TSI presentation:


This is my first time ever making a video, so it's not the best, but it works. So, luckily for those of you out there who don't have great video skills like me, this is just about as simple and basic you can get!:p:D

This was made in Windows Live Movie Maker. To start, I just started a new project, and began.
First, you can click to insert new photo or video, and that's how I got the different images. This is what I worked from.
Next, to add text to each slide, you click "caption", where you can type up whatever you'd like with a small text editor.
The next thing I did to make it less like a slide show and more like a video was adding a transition between each image. This can be done by going to animations, and selecting the transition you like.
My final step was adding in music. I already owned the "You've got a friend in me" instrumental from the WDW Album from the Itunes store, so I don't know how to add any other music, but to add that, I clicked add music in the home tab. I think there was some option to fit the video length to match the music length, but I don't really remember:p

Anyways, that's it! If you have any questions, just ask! (And I will probably have some questions myself on how to make an improved video:p)

My one criticism is that the text is hard to read over a couple of the slides.

Great job!
 

Zweiland

Well-Known Member
So now I summon @Zweiland here. I'm curious, how did you do the interactive map on the weekly site if you don't mind sharing? I found that to be a really cool feature that was something like what I wanted to do but couldn't figure out.
Okay. Don't overuse this feature, but it's pretty cool, so I'll share it.
  • Go to https://www.mapbox.com/editor/#style
  • Click "save"
  • It will prompt you to sign in or make an account. Make an account.
  • Back in the editor, select a style for the map
  • Go to the "data" tab
  • Zoom in to the location you want to edit
  • Use the "polygon" and "line" tools to make shapes. You can change the stroke and fill.
  • Once you're done, click "save" again
  • Go to the "project" tab
  • Copy the text in the Embed box
  • Go to your Weebly site editor
  • Paste the text into the Custom HTML tool
There you have it! Your map will be embedded into the Weebly site! Any time you change your map, it will update automatically.
 

Sam Magic

Well-Known Member
Bump.

Englanddg and I are talking about smoothing out border and edges for pictures using Paint.NET.
Basically this:
Use the resize utility to resample it. You may find it resamples some of it a bit clunky and you'll need to then use the eraser tool to smooth out some of the lines.

But, that's how you do it. Pretty easy.

Here's a link (scroll down to the resize section)

http://www.getpaint.net/doc/latest/ImageMenu.html

You'll probably want this image, if you are going to make it a master that you work off of, at around 300+ PPI (pixels per inch)...

Most web graphics run at about 70 - 100 PPI, and look fine on a computer screen...but terrible when printed.

It will be massive, but scaling down it will look great (for use for things like websites, etc)

Scaling up always is clunky...because the software doesn't know how to calculate the adjusted color values as it scales down.

When softening it;
First, save yourself a copy. Then, I'd start with the radial blur tool (under the effects menu). Play with that a bit, until you think it looks good. Then under the adjustments menu, play with the curves tool. That should get what you want (though there are other ways). What's nice is that you can see the changes realtime if you zoom out.
2cgop3d.png


To this:
33wl9xd.png
 

spacemt354

Chili's
Bumping this thread for a few reasons:

I really like the concept of this thread as a place where we all can learn from each other. Going forward, I want to keep this active so we can teach each other and help one another out with imagineering in 2016. If anyone is seeing this thread for the first time, go back and look at some of the prior pages, some very creative stuff!

With that, I wanted to share with you all how I do the blueprints. It's not too hard and if anyone wanted to do this for their projects, feel free! (I would be honored actually:))

You only need a few things:
- Computer paper
- Sharpened pencil or Sharpie
- Ruler
- Phone or Camera with editing tools.

Step 1- Draw out your design


The final image below is taken from The Sorcerer's Apprentice Season 3 - Challenge 6. Probably my personal favorite concept of the year - I worked on this with Team Goofy (@JokersWild @DSquared @Matt7187 and @Sam4D23 ) and we designed a Tree of Life attraction called "Symbiosis"

Step 2 - Take a picture

For this I have a Samsung S6 Phone that I snapped an image of it with.

Step 3 - Edit

On a phone, once you take the picture there should be an edit option. Click on that. For me - I have 5 options: Auto-adjust, rotate, crop, photo editor, collage. Before you click on "photo editor" - make sure you've rotated and cropped the photo to your liking.

Step 4 - Photo Editor

Once you've clicked on photo editor - there should be a few more options. Click on "Effect" (you'll come to an Instagram type page) with an option for "Negative" Click on that one and "apply"

If it takes you back to the image...click "edit" again but this time go to "Tone" - in tone you'll see options for saturation. If you move the saturation tab to the right, you'll see the image glow more blue...just fiddle around with the saturation until you get the image to your liking and hit apply.

- Note: If the image is too dark, you can go back to the "Effect" option and click on "Blue Wash" - this will make it more "blueprinty" :p

Hit save...then I usually just upload my pictures to Photobucket and copy/paste them over to the thread...but if you have an option that works for you..go for it!

And tada! Your very own armchair-Imagineering blueprint!:D

2015-08-07-04-31-29-jpg.104638

Link to the Project: http://forums.wdwmagic.com/threads/the-sorcerers-apprentice-season-3.901352/page-18

Hopefully this was helpful...if you have any questions feel free to ask!

The other reason why I wanted to start this up again is because I think we could use this thread as a jumping off point for new members to guide newcomers along by helping them with the creative process. If some of the long-time members on here could perhaps post a paragraph or so...talking about how they approach projects and/or competition prompts...what the thought process is and how to get started...that could be really beneficial to all!

Thank you and enjoy!:)
 

MonorailRed

Applebees
Bumping this thread up, because I got asked how to do the nametags :D

@MonorailRed and @ThemeParkGuru , How do you make those name tags? You are both so good at them.

So... here's my first "How to" guide on the forums :hilarious:


How to Make an Imagineer Nametag Using Adobe Illustrator

Step 1: Pick a Background

Screen Shot 2016-11-18 at 8.35.21 PM.png



I usually do the black background, but you can pick whatever picture you'd like and it'd work just as well!

Step 2: Make the Nametag Shape

Screen Shot 2016-11-18 at 8.35.26 PM.png

I like to think of it as two ovals... Though I just sketched this looking at Cast tag.

Step 3: Draw some definition lines around the top and sides


Screen Shot 2016-11-18 at 8.35.50 PM.png


This is where it can get fancy.... I use the charcoal feather option for the brush definition. The stroke weight of the top 3 dashes are 3pt, while the large one surrounding the tag is 7 pt. I usually make the stroke (line) color whatever compliments the icon chosen for the user.

Step 4: Draw Another Definition Line
Screen Shot 2016-11-18 at 8.35.54 PM.png

I usually add another line on top of the surrounding line seen by the name. This is done by just copy/paste-ing the previous one.


Step 5: Add Text

Screen Shot 2016-11-18 at 8.36.45 PM.png

The "Walt Disney" font is the "Waltograph" font... I'll get a link where I got it... it's free online.
The "World" (62.31 pt) and "Magic"(40.06 pt) is the Big Caslon Medium font.
Both have no stroke.

Step 6: Add Your Name and Location
Screen Shot 2016-11-18 at 8.37.12 PM.png

I used 142.31 pt for "Name"
60 pt for "Location"
System Font Regular for both

Step 7: Add a Cool Icon
Screen Shot 2016-11-18 at 8.38.57 PM.png


You can find a cool icon on Google images or make one! :D Be creative!
I suggest a vector image if using Google, with no background on the desired image - just makes the process easier :bookworm:
 

Attachments

  • Screen Shot 2016-11-18 at 8.35.42 PM.png
    Screen Shot 2016-11-18 at 8.35.42 PM.png
    233.5 KB · Views: 304
  • Screen Shot 2016-11-18 at 8.35.45 PM.png
    Screen Shot 2016-11-18 at 8.35.45 PM.png
    233.2 KB · Views: 320
  • Screen Shot 2016-11-18 at 8.35.50 PM.png
    Screen Shot 2016-11-18 at 8.35.50 PM.png
    242.7 KB · Views: 290
Last edited:

RMichael21

Well-Known Member
Bumping this thread up, because I got asked how to do the nametags :D



So... here's my first "How to" guide on the forums :hilarious:


How to Make an Imagineer Nametag Using Adobe Illustrator

Step 1: Pick a Background

View attachment 175638


I usually do the black background, but you can pick whatever picture you'd like and it'd work just as well!

Step 2: Make the Nametag Shape

View attachment 175639
I like to think of it as two ovals... Though I just sketched this looking at Cast tag.

Step 3: Draw some definition lines around the top and sides


View attachment 175652

This is where it can get fancy.... I use the charcoal feather option for the brush definition. The stroke weight of the top 3 dashes are 3pt, while the large one surrounding the tag is 7 pt. I usually make the stroke (line) color whatever compliments the icon chosen for the user.

Step 4: Draw Another Definition Line
View attachment 175654
I usually add another line on top of the surrounding line seen by the name. This is done by just copy/paste-ing the previous one.


Step 5: Add Text

View attachment 175655
The "Walt Disney" font is the "Waltograph" font... I'll get a link where I got it... it's free online.
The "World" (62.31 pt) and "Magic"(40.06 pt) is the Big Caslon Medium font.
Both have no stroke.

Step 6: Add Your Name and Location
View attachment 175656
I used 142.31 pt for "Name"
60 pt for "Location"
System Font Regular for both

Step 7: Add a Cool Icon
View attachment 175657

You can find a cool icon on Google images or make one! :D Be creative!
I suggest a vector image if using Google, with no background on the desired image - just makes the process easier :bookworm:
Thanks for bumping this thread, Red! There's some super valuable information in here. :)
 

Voxel

President of Progress City
Can anyone comment on how to make theme park maps, or ride map overviews? There were a couple in the recent creator games submissions that were amazing, but i have no idea what software was used to create them!
We use a lot of different software so I cant speak for everyone. I use google Sketchup or PowerPoint for maps. Red uses photoshop I believe. Some use paint. If you could tag the ppl or team who created that map I'm sure they will be more than willing to tell you want software was used
 

Pi on my Cake

Well-Known Member
In the Parks
Yes
Can anyone comment on how to make theme park maps, or ride map overviews? There were a couple in the recent creator games submissions that were amazing, but i have no idea what software was used to create them!
Haven't made detailed maps on this site yet, but for personal use I have built things just by dropping/editing shapes and lines in Power Point. The stuff I used in the One Sentence Comp was just quick pencil sketches.
 

spacemt354

Chili's
Haven't made detailed maps on this site yet, but for personal use I have built things just by dropping/editing shapes and lines in Power Point. The stuff I used in the One Sentence Comp was just quick pencil sketches.
Paint.net works very well for a quick and easy sketch.

Also if you want a more detailed look into maps - the opening post is very helpful!
I'm creating this thread for fellow Imagineers in the forum to post examples of their work, with a caveat.

You MUST describe the:

a) Process you went through to create it
b) The tools you used
c) Any tips or links to instructional videos for said tools

Think of this as a place where you can share and discuss graphic design, video design, the tools used to create it, and any tips you may have for others. The overall idea is that we not only get to show off a bit, but also get to help others learn to do things differently. After all, part of Imagination is learning how to express your ideas and share them with others!

I'll start.

I use Paint.NET as a graphics editor. For several reasons.

1) It's free
2) It's powerful (has filters, layers, etc.)
3) It's free
4) It's got a large community that supports it and has instructions on how to do all sorts of cool things here.

http://forums.getpaint.net/

Here's an example of a map for a competition that was done in Paint.NET

View attachment 62301

This was done with several layers. First, the far background layer is the actual layout of the area (Superhero Island at Universal Studios Florida) that was being redone.

Here's what it looks like without the Parchment layer, and the map layer set to a partial transparency to allow the drawn portions of the map to stand out.

View attachment 62304

The layers are in this order.

1) Bing Maps screenshot, using <CTRL PRINT SCR> and trimmed / cropped to suit my needs and placed as the bottom layer
2) Parchment background obtained from a google images search, touched up, and resized to fit my needs
3) Rovianion
4) Shire
5) Rohan and Gondor
6) Mordor

This allowed me to seamlessly integrate the areas, while also drawing them separately (over separate days) and still keep them in line with the real world map by removing the parchment layer.

The roads were hand drawn and shaped using the line tool.

The lake was filled in by doing a copy / paste of a small selection of the "sea" from a Tolkein map found with a google image search. Then cutting and pasting randomly to fill the area (if you look closely, you'll see what I did).

The lonely mountain map was taken off of a Tolkein map from the Hobbit (again found through google image search), opened up in another tab in Paint.NET, zoomed in and snipped it, then enlarged it to scale with my map.

The mountains and trees were obtained in a similar manner. For all of these, I had to make them transparent, so they didn't have a white blotch over the parchment, and that was done, by hand, using the eraser tool.

For the forests, I randomly pasted a section of the trees over and over again, and then erased any overlaps by hand with the eraser tool.

Also, I used very specific colors. I wrote them down (the RGB values) in Notepad and stored it, so when I would go to work on the map, I knew what my exact colors were.

You'll also notice the custom fonts. Those came from here:

http://tolkiengateway.net/wiki/Fonts

And the actual font was Tolkein.

This is downloadable as a TrueType Font (ttf), and is easily installed on a windows machine (not sure about a mac, though I'd imagine it's easy there, too). All you do is download the font, extract the zip file, right click on the ttf file and choose "Install". Then, it will show up in all your programs that access the windows font library.

The names of the regions were taken off of a Tolkein Map and rotated as needed.

So, there ya go! Feel free to ask questions of each other, this is a discussion, not a lecture thread, and join in with your own examples, tips and ideas!
 

MCParradox

Well-Known Member
Can anyone comment on how to make theme park maps, or ride map overviews? There were a couple in the recent creator games submissions that were amazing, but i have no idea what software was used to create them!

@MCParradox made the map for us last round! He would know what software it is :)

I did indeed! I started with a pen and paper sketch, based on a google maps screenshot of the area, just to get an idea of where we wanted to place everything:
xWkLTN9.jpg


Then, in Photoshop, I imported a google maps screenshot, and on a new layer traced around the important details with a thin black line:
iKzrs4U.jpg


Next, I blocked in the various colours on different layers, using the eraser to clean up the edges and make sure it fit within the lines:
gs1kFAe.png


Working from the pen and paper sketch, I began sketching out layouts of the new additions, before again outlining them in black:
5KZAujt.png

dLLx6pr.png


And then to finish it off, as before, I added the colours on multiple layers:
e53p931.png


Throughout the process, I worked a layer at a time, and most new additions were added on their own layer so they didn't interfere with anything else. This makes it very easy to clean up edges, and to toggle off things you don't need (such as to produce the images above for this post!). I worked with Photoshop CS6 and a Wacom tablet, but a while back I was able to produce very similar results (below) with Krita, an open source tool, and a cheap £20 tablet, so it's not about the tools, more about how much time and effort you're willing to sink into these things! Hope that helps :)

p71lyZJ.png
 

Voxel

President of Progress City
I did indeed! I started with a pen and paper sketch, based on a google maps screenshot of the area, just to get an idea of where we wanted to place everything:
xWkLTN9.jpg


Then, in Photoshop, I imported a google maps screenshot, and on a new layer traced around the important details with a thin black line:
iKzrs4U.jpg


Next, I blocked in the various colours on different layers, using the eraser to clean up the edges and make sure it fit within the lines:
gs1kFAe.png


Working from the pen and paper sketch, I began sketching out layouts of the new additions, before again outlining them in black:
5KZAujt.png

dLLx6pr.png


And then to finish it off, as before, I added the colours on multiple layers:
e53p931.png


Throughout the process, I worked a layer at a time, and most new additions were added on their own layer so they didn't interfere with anything else. This makes it very easy to clean up edges, and to toggle off things you don't need (such as to produce the images above for this post!). I worked with Photoshop CS6 and a Wacom tablet, but a while back I was able to produce very similar results (below) with Krita, an open source tool, and a cheap £20 tablet, so it's not about the tools, more about how much time and effort you're willing to sink into these things! Hope that helps :)

p71lyZJ.png
Well done, this is an amazing explanation.
 

spacemt354

Chili's
Agreed! Such a great explanation, MC.

While not a tech "how to", over the next few days I would like to try and go through tips and tricks to help begin the process of brainstorming, individually and in teams.

Many times the hardest part of a project is starting it, and in order to do that it requires imagination and creativity, which I've always thought of as two separate things. Imagination is the spark, and your creativity is how you use that spark in a reasonable way...I definitely don't have all the answers haha, but I will share my thought-process in both scenarios.
 

Register on WDWMAGIC. This sidebar will go away, and you'll see fewer ads.

Back
Top Bottom