Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
In this course, author James Fritz shows how to create HTML-based websites with Muse—a toolset familiar to anyone who has used Adobe Photoshop, InDesign, or Illustrator. The course covers the design process from start to finish, from setting up web pages and populating them with graphics and text, to creating dynamic menus and adding special features such as widgets, slideshows, animations, embedded video, social media integration, and more. James also explains how to create an alternate layout for display on mobile devices, publish and update your site, and view analytics on web traffic.
One of the more fun aspects of working with Web Design is the ability to add animations to your Web site. In this movie, we'll take a look at two different technologies, Flash and Animated Gifs, to see how we can incorporate them into your site. You can bring animation Assets into Muse the exact same way you bring normal assets into Muse, by going File > Place. And we'll start with an Animated Gif. So what we're looking for is animated-logo.gif. Here it is; we'll Press Select, and we'll click and put it on our page.
When we first place this graphic, it looks like a normal image with nothing special. But let's click on Preview to see what happens. In Preview mode we can see that each letter is slowly appearing one after another and then the name of the museum appears at the bottom. This is a frame-based animation that was built in either Photoshop or Fireworks. Let's go back to the Design view; you can see that the first frame of the animation is always sitting by itself in the Design view. In order to see the other frames we have to preview it in Preview mode or preview it in a Web Browser.
I'm going to delete this image and then let's bring in a Flash Asset. I'm going to go to File > Place and we're browsing for samoca-banner.swf; it has to be a .swf File. This is an export from Flash Professional or Adobe InDesign. You can't import a native Flash authoring asset. it has to be finished published movie, which is what SWF is. With this selected, I'll get my loaded cursor and put it on the page. Now the poster image for a Flash Movie is relatively boring, you really can't tell what it is.
In order to see the animation we have to go in to Preview mode. In Preview mode we can see this Animation and it's a little more impressive. In fact, one of the interesting aspects of Flash is this information is usually vector, which means we can scale it significantly larger. So if I go back into Design mode and I scale this image to almost fill the screen and press Preview, we can see the animation plays and it's still crisp and looks good. One word of warning is that Flash will not work on iOS devices.
So if you plan on viewing your web site on an iPhone or an iPad or other iOS device, it will not display and you'll get a warning asking for a plug-in. Well working with animations in Muse is fairly straightforward. Keep in mind that it isn't possible to edit the timing or other animation properties. If there's an issue with the animation, you'll need to go back to the original application to tweak the asset before you can publish it to your site.
Find answers to the most frequently asked questions about Muse Essential Training.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.