| Ricci Street
< Digital Wares < Lantern Lane < GEN 230
|| search | sitemap | help gazette | theater | bistro |
| | |
 |
|
Because the video
editors and the web pages depend on a stable file structure, this course will
test your file management skills.
My best advice to you is to set up a structure very much like this one and then freeze it for the duration of the semester.
Harvest media into the half dozen sub-folders in the media folder. Leave them there unless you want to further divide the sub-folders, for example into different kinds of video clips or different still photo sets.
In the "mash1" folder, put the instructions files (.mswmm, .psp, .aup files) and the various drafts or versions of your edited pieces as well as the final .wmv files.
What are instruction files?
It is important that the video, image, and audio editors that you use not destroy the original media assets. Thus, even though you use Movie Maker to "cut" a video clip into two pieces, all you have done is add to the instructions file (.mswmm file). The .mswmm file is a small text file that contains the instructions for how to treat the media when you finally render (aka compile or save) it as a movie that can be played in a video player.
The rendering can take a while, depending on how complicated the instructions are. Fancy transitions and special effects can take a longer time to render. At no point is the original media file actually "cut" into two pieces.
However, to work the next time you return to edit some more, the instructions file that you saved needs to be able to find the media in the same place. You will thus save yourself a lot of tedium by 1) creating a file structure, 2) putting all your assets into it, and 3) leaving them there so that the instructions files can always find them.
It follows that giving someone the .mswmm file is pointless unless you also give them all the media asset files in the file structure where the .mswmm file expects to find them.
file types
file conversions
We're going to discuss the arts and their parts. The best way for you to understand this is to make a concept map. A concept map is a way for you to organize relationship graphically.
We could use paper and pencil or even post-it notes on a board, but we're going to use some software. Microsoft's Word and Excel come with a drawing toolbar that has the shapes and lines we need. Word limits you to a printable space, but Excel gives a map plenty of room to grow. So open Excel and look for the drawing toolbar, probably at the bottom. If you don't see it, pull down the View menu, select Toolbars, and make sure Drawing is checked.
You will note AutoShapes and lines, expanded below. You're going to need a couple of different shapes in a couple of different colors. The line, the one-way arrow, and the two-way arrow will all be useful, and you can make them different colors, too.
 |
 |
You're going to make a box for each of the words below and type the word into the box. You can use different colors to communicate relationships. For example, all the text-related words could be one color, the image-related words another color. You can use different shapes for the same purpose. The arts could be one shape, and the arts parts could be another shape.
You're going to arrange all these boxes on the spreadsheet and then put lines between them. Again, different types of lines/arrows and different colors can help you to communicate.
Feel free to add more terms to your concept map. Your map does not have to include all the terms here. Just grapple with what you can manage.
text editor
You use a text editor to write the text that will be displayed in other media, such as images and videos.
Notepad is on every Windows computer (Start | Programs | Accessories)
I recommend NoteTab Light (free).
To format text for
printing, use a word processor or desktop publisher. Microsoft Word is a
common word processor and low-end desktop publisher. I recommend
OpenOffice (free).
To format text for the web, use a web page editor and site manager. Microsoft's FrontPage is on the school Windows computers. Dreamweaver is a similar product, and is similarly expensive. I recommend Nvu (n-view) (free).
See the webmaking section below.
media: where to get texts and lyrics
Paint is on every Windows computer (Start | Programs | Accessories)
PaintShop Pro - made by Jasc, owned by Corel, installed on all Dell computers
Photoshop or Photoshop Elements on the school computers
GIMP - GNU Image Manipulation Program - on the H215 and NMI computers
I recommend that you download GIMP for Windows to your own laptop or PC -- it's free of charge -- install it, and use it yourself. Use the Download links below. It's a professional tool at an unbeatable price.
The GIMP for Windows (version 2.2.13, fixed installer) - Download
If this is the first time you're installing The GIMP, you will also need GTK+ 2 Runtime Environment (version 2.10.6, for Windows 2000 and newer) - Download
 |
Wikipedia summary GIMP documentation | tutorials | help | beginner's tips Talk - Community - discussion forum with lots of tutorials and tips That's Wilber the Wizard himself there on the left. |
  |
There is a difference between the "full size" or "natural size" of an image and the size at which it is being displayed.
When images open, they are resized to fit the screen space available. The percentage of "full size" at which it is being displayed shows on the bottom left.
If you are going to combine images or parts of them, they will combine at their "natural sizes", not the display sizes.
To resize, pull down the Image menu and select Scale Image .... Note the chain link to the right of the size measurement. Clicking the link will uncouple it and let you manipulate the aspect ratio (height and width). You can stretch the image either horizontally or vertically. To preserve the aspect ratio, leave the chain link connected.
Image Cropping, Resizing, and Saving in JPEG Format: resizing
Image Cropping, Resizing, and Saving in JPEG Format: cropping
Pull down the Filters menu. Explore and discover.
tutoriall: Filters
layer opacity
transparent backgrounds
media: where to get images
capturing spoken word, rearranging and combining audio, esp. music
creating and editing voice, music, beats and tracks
Adobe's Audition is installed on the middle eight PC's in H215 and on a couple of PC's in H209, the open computer lad.
loop-based music production tool ... the industry standard for professional music creation on the PC. With ACID software you can quickly and easily create original songs, remix tracks, produce 5.1 surround mixes, develop music beds, score videos, and create music for Web sites and Flash™ animations.
Audacity - A Free, Cross-Platform Audio Editor - on the H215 and NMI computers
I recommend that you download Audacity for Windows to your own laptop or PC -- it's free of charge -- install it, and use it yourself. Use the Download links below. It's a professional tool at an unbeatable price.
Wikipedia's Audacity
list of features
Free, easy-to-use audio editor and recorder:
Record live audio.
Convert tapes and records into digital
recordings or CDs.
Edit MP3, and WAV sound files.
Cut, copy, splice, and mix sounds together.
Change the speed or pitch of a recording.
Audacity documentation | quick reference guide | tutorials
online tutorials on basics, for beginners
online tutorial on cutting and basic effects
online tutorial on mixing tracks and adjusting to match the beats
Two MP3s
and a Microphone
by Eliot Van Buskirk| Also by this reporter
Wired, August 7, 2006
DJs are highly skilled artists who can read minds. They
create new songs out of others on the fly and they can use records (or CDs) as
instruments, thanks to years of practice and dedication to their craft. This
column is not for them.
Instead, I want to address anyone with a bunch of digital music who might like
to start "spinning" music at parties, bars, weddings and the like.
media: where to get audio
featured site: ccMixter - sample packs
Sampling, Mashing, Sharing
This is a community music site featuring remixes licensed under Creative
Commons, where you can listen to, sample, mash-up, or interact with music in
whatever way you want.
Remixers If you're into sampling, remixing and mash-ups grab the sample packs
and a cappellas for download and you can upload your version back into ccMixter,
for others to enjoy and re-sample. All legal.
Podcasters, directors and music lovers If you're into music, browse this site to
hear some of the great remixes people have built from sampling music on this
site.
how to get it off YouTube and Google Video
Neoretix's TubeHunter
TubeHunter downloads videos from YouTube, MySpace, Photobucket, Metacafe, Dailymotion, iFilm, Flurl, Bebo, Break, VSocial, Grouper, TopFreeMusicDownloads, Bolt, Yikers, Revver, Guba, Vidilife and Blip.tv, and saves them on your computer or directly to your iPOD. All downloaded videos can be converted by TubeHunter to other video formats including MPEG, MPEG4 AVI, DivX, iPOD MP4, MOV, Flash SWF, M4A, Sony PSP, MP3, WAV, OGG, 3GP and 3G2.
With this software, you can download the first minute of any video (or the whole video if it is under one minute). If you want to download the rest, you must pay $19.95. I'll keep looking for a free piece of software that does the same thing.
moving up a step in editing power from MovieMaker: ULead's VideoStudio. I use ULead's MediaStudio.
Windows Movie Maker
Windows Movie Maker 2.1 makes home movies amazingly fun. With Movie Maker 2.1, you can create, edit, and share your home movies right on your computer. Build your movie with a few simple drag-and-drops. Delete bad shots and include only the best scenes. Then share your movie via the Web, e-mail, or CD.
Where to find Movie Maker
Start | Programs
C:\Program Files\Movie Maker\MOVIEMK.EXE
download from
Microsoft
The information below is also on the Toolkit's Video page.
Structure of a generic video
opening credits, music, and titles
narrative introducing your presentation
a series of quick clips from your presentation accompanied by titles,
stills, and voice-overs where appropriate, and accompanied by music throughout
closing credits, optional narration
Basically, you're going to add some features to video that you either made yourself or downloaded. In fact, your movie can have all of the features in the tutorial below: transitions, video effects, titles, credits, audio, narration, and, of course, music. Note that these topics are all on the right-hand side of the list of tutorials. On the left-hand side are the tutorials that deal with file management.
The steps below will work most smoothly if you already have all of your media assets, your text for titles and credits, your music, your narration, and your still images. To the extent that you have thought through how all those assets will be used -- many people use paper storyboarding for that purpose -- then the steps below will rapidly become mechanical.
However, if you're like most people, you'll use MovieMaker for brainstorming, for experimenting, and for creating something that you didn't expect to have when you sat down. Learning MovieMaker at the same time will feel a little too much, and it probably is. You may well make a mess. Frequently saving a projejct under a slightly different name can give you some insurance.
However, bear with it, and I think you'll be happy when you finish your first movie and can look back on the whole process. In other words, when you're lost in the trees it feels like you'll never get home. But once you get to the mountaintop and look back down, it will all be worth it.
Checklist of steps
Copy your raw video file and put it into your
MyVideos folder. Put your other media assets in appropriate folders. Don't move
them after that.
After opening Movie Maker to a New Project, import your video, images,
audio, etc. into a
Collection.
Chop your video into segments,
perhaps a dozen or two, called clips. Delete most of the clips.
Arrange the clips on the timeline in any order you want to.
Between each, try a variety of transitions and effects.
Add text as titles and credits.
Add some narration to the opening credits.
Add music.
Save the project as a .mswmm instructions file often as you work.
Save it as a .wmv playable movie file when you're ready to show it to others.
Then you can burn it to a CD with Windows Media Player.
Atomic Learning's Windows Movie Maker 2 tutorial
a selection of the More Useful Tutorials
average two minutes each
|
A. Getting Started |
E. Working with Clips |
media: where to get video clips
In addition to the comfortable skills of formatting text and images to be printed (ink on paper), you need to know how to format text and images for the web
Conceptually, there are three big differences between formatting for print and for the web.
The software for web formatting gives you access
to the "source code" in a useful way that Word and other word processors
don't give you.
The images are separate files from the "page"
and need to stay in the same file-structure relationship with the HTML file.
This is the difficult one. On the web, a
document's content, structure (headings, paragraphs, placement of images)
and style (look and feel) are separate and can be edited separately.
You can view the HTML code of any web page in your browser by pulling down the View menu or Page menu, depending on your browser and selecting Source Code or View Source or something to that effect. You can also right-click on any non-image part of a web page and select View Source.
What you are viewing is the simple text file that gets sent from the server to your browser. Your browser then interprets the HTML code and displays what you see in your browser.
Note that the images are separate files. They are stored separately on the server, they are requested individually by the browser and sent individually by the server, and they are stored separately in your browser cache. If you "save" the web page to your desktop, the images (along with any scripts) are saved into a subfolder in the same folder with the .htm file that you saved.
The content is the text and images that the browser displays for the user to read and look at. The text and images can be "hot" and the page can contain forms so that the user can interact with the content.
The structure is what the HTML code is all about. Every chunk of text and every image on a page is tagged with an HTML tag pair -- H for heading, P for paragraph, IMG for image.
The style, aka the presentation or the look and feel, can accompany every HTML tag. For example, if every P tag had the font, size, and color specified, then to change any of those attributes, you would have to change every tag. Just think if I wanted to change this font for Ricci Street and I had to make the change on every paragraph. Not likely!
Because the style is a separate layer of information, I can specify the font for all of Ricci Street in one place. Then all I have to do is change one line in one file -- a file that all the HTML pages link to -- in order to change the font for all of Ricci Street.
Learn more at Gizmos Toolkit Webmaking Style Sheets.
Reading the web
Go up one level in Ricci Street.
Right now, you're viewing the software.htm file in the gen230/ folder. Look at the URL in your browser's address space:
http://RicciStreet.net/dwares/lane/gen230/software.htm
This is a URL, uniform resource locator. The http part, hypertext transport protocol, distinguishes this protocol from others, such as ftp and smtp. The RicciStreet.net part is the domain name registered with the domain name system (DNS) to correspond to one and only one computer somewhere on the Internet. In this case, it's in North Carolina and is owned by Advanced Internet Technologies. The domain name is not case-sensitive. The rest of the URL is the file path on the hard drive on the computer in North Carolina. It uses the Linux operating system and the folder names -- dwares/lane/gen230/ -- and file name -- syllabus.htm -- are case-sensitive.
Note that the gen230/ folder is in the lane/ folder, which in turn is nested in the dwares/ folder. So let's go up one level to the Lantern Lane home page.
http://RicciStreet.net/dwares/lane/index.html
View source, i.e., view
the source code of this web page.
Two methods: 1) right click on open area of a web page and select View Source; 2) pull down the browser's View menu and select Source.
As opposed to, for example, a Microsoft Word file in .doc format, the source code of which is proprietary, an HTML file in .htm format is open source. This HTML source code is the text file that gets sent from the server to your computer. (The images are separate files.)
The source code tells the browser what to do. So that you can view and edit it, it will open in Notepad, the text editor that comes with Windows.
Parse the HTML - Hypertext Markup Language
All the HTML codes are between angle braces: < and >. In HTML, case doesn't matter but spelling and spacing are crucial.
We're going to isolate the parts of the HTML document index.html and then delete them until all we have remaining is the bare bones structure common to (almost) every web page.
hierarchy of a web page
The html tag pair -- think of it as a "container" -- is parent to two children: the head and the body. The head tag pair contains -- is parent to -- the title tag and various meta tags and tags to include extra information like style sheets and scripts. The body tag pair contains -- is parent to -- the headings, subheadings, paragraphs, images, and lists that display on the page n the browser.
Working backward, the stuff that displays on the page is child to the body which is sibling with the head. They are children to the html container -- some call all these containers "objects".
Follow the directions, step-by-step:
Ricci Street Gizmos Toolkit's Webmaking section
|
||||||||||||||||||||||||||||||||||||
