Beginners FileMaker 11 Tutorial Video – Training CD / DVD

FileMaker 11 Training Video

This Beginner FileMaker 11 Training Video is a great way to gain confidence and skill with the program, even if you have no previous experience with Filemaker or database design. As the initial course in a larger three-tutorial series, this training video introduces users to core concepts and the inner workings of the FileMaker interface, laying the groundwork for a solid understanding that will improve the efficiency with which you are able to work.
Written and narrated by longtime FileMaker power user and script developer John Mark Osborne, the course offers expert advice that even more experienced users will respond to. By walking users through the development of a dynamic Contacts solution point by point, Osbourne explains concepts such as data fields, tables, layouts, value lists, automated entry, container fields and reporting in an engaging hands-on fashion that simply makes sense. The project-based approach offered in the training is superior to traditional instruction methods because it lets you learn by doing, not just reading about it. The training can be ordered as one tutorial CD / DVD package or viewed through the online subscription service. Free demo videos are on the site. FileMaker 11 Training Videos

About FileMaker 11

FileMaker Pro has always carried the reputation of a data organization and management tool that lets users work more efficiently without a lot of the drawbacks and barriers to entry that come with other programs and platforms. With a number of smart enhancements in key user interface and functional areas, FileMaker 11 etches this practical emphasis into stone, defining itself as one of the most productivity-oriented database programs available in the professional and consumer markets.
Improved Inspector
The enhanced and consolidated Inspector tool palette now lets users access a wide range of layout objects and design properties in one place. This makes it faster and easier for users to add individual touches to their data design for the purposes of creative customization and functional differentiation.
Quick Find
While some form of searching has been an option in Filemaker for years, now a full featured search box is available right within the Browse mode. Searching all fields within a given layout, accessing data and content is fast, efficient, and more intuitive for beginning users.
Text Highlight Option
The addition of a straightforward way to highlight words that you want to stand out is a no-brainer as far as collaboration tools go. A button built into the Filemaker UI makes it easy to bring attention to important sections of text.
Invoice Starter Presets
Small business owners are sure to get excited over this addition. Now common invoicing fields such as shipping data and customer contact options are just a few clicks away in FileMaker Pro 11, with a workable template that can fulfill the basic needs of a variety of companies and clients.

These improvements just scratch the surface of what is possible with FileMaker 11. Approaching the software with a guided introduction is the absolute best way to learn what you can really accomplish.

Poser 8 Training Video – Tutorial

Poser 8 Training Video

This Poser 8 Training Video – Tutorial is a fast and effective way to learn the popular 3D software. By walking you through creative techniques point by point, the course explains even complex procedures in a way that non-technical users can follow.
The training begins with a basic overview of the concepts you need to know to work in 3D. This is especially helpful for those coming from more traditional graphic design backgrounds as well as those approaching digital art for the first time. After covering core concepts and breaking down the basics of Poser’s user interface, expert tutor Dwayne Ferguson shows users how to pose figures, work with props, and incorporate face, hair, cloth and materials for both photorealistic and more creative purposes. Lighting, morphing, animation and rendering are addressed next, with specific examples that address common challenges one step at a time.
Ferguson draws heavily from his background as a professional animator and art designer, and shows you how to express creative ideas with technical tools and effects. The training course also features four projects in which the concepts taught are put into practice, and different elements of Poser’s toolset are shown in use. What is best about the tutorials is that they take a refreshing, hands-on approach. Files are even provided that let you achieve the effects that are shown onscreen.
The training video lessons can be viewed on both Mac and Windows machines, and there are two convenient options for purchasing the course. You can order the tutorials on CD / DVD or watch them all online through a convenient subscription plan. These Poser tutorial videos are ideal for users who like to learn at their own pace.

Poser 8 Is Up to Date

Although it was one of the first 3D modeling and animation solutions available, Poser has failed in recent years to break significant new ground. Rival software Daz Studio has gained more users and critical praise, while the feature set in Poser basically stayed the same. Now this has changed.
Since acquiring the rights to the Poser franchise, software company Smith Micro has injected new energy into the product line. Because one of the main the strengths of Poser was its production ready content, this was one area where they invested even more attention. While Daz Studio provides two fully rigged, posable character models, Poser 8 offers eight distinct choices, with preconfigured actions and movements, including the ability to lip-sync specific sounds. Over 2.5 GB of content comes with the Poser application, including 1 Gig of material that is completely new. Smith Micro also offers a ‘Content Paradise’ online where additional props and models can be downloaded.
In addition to the impressive content offerings, the program has also seen a few needed speed boosts. Support for multiple processors means that rendering times are decreased, and small, thoughtful changes to the user interface will definitely speed up professional workflows.
With the improvements the program has seen to its core feature set, there’s never been a better time to learn the software. This Poser 8 Training Video series offers a smart place start.

Beginners Flash Tutorial MovieClips

Using MovieClips in Flash

This Flash tutorial introduces the use of MovieClip symbols in Flash and how they function within the main Timeline.

The Timeline is key to understanding how Flash movies work. If you open Flash and create a new document you should see the Timeline running across the top of the screen (choose Window > Timeline from the menubar if it isn’t visible):

When you create a .fla document and export a .swf movie from it, the .swf when opened will start at Frame 1 on the main Timeline and present the viewer with each successive frame with content on it (unless ActionScript code instructs it to do otherwise), looping back to the start each time it reaches the last frame. The frames are numbered on the header above the Timeline as you can see and all frames with content will be coloured in some way.

MovieClip symbols additionally have their own Timeline. When placed on the main Timeline in a Flash movie, a MovieClip will similarly start at its first frame and run continuously presenting all content on its frames (unless instructed otherwise by code).

To demonstrate this, choose Insert > New Symbol from the menubar (or CTRL+F8); give the symbol a name and choose Movie clip as the type:

Flash has now taken you inside the new MovieClip symbol:

The area at the top of the Timeline indicates your current location within the Flash movie (where it reads Scene1 and myclip). The cross in the centre of the stage is the position 0, 0 (x, y) within the new MovieClip.

To add some content to the clip, draw a shape and postion it at 0, 0 (x, y) – with the shape selected enter 0 into the X and Y fields on the Properties panel (Window > Properties > Properties or CTRL+F3 if it isn’t visible):

Still with the shape selected, Press F8 (or choose Modify > Convert to Symbol); choose a name and Graphic as the type:

We will use this shape to create a simple animation inside the MovieClip; select frame 10 on the Timeline by clicking on it. Make this frame a keyframe by pressing F6 or choosing Insert > Timeline > Keyframe:

Now, on this frame, move the shape to another position on the stage. Select Frame 1 again and create a Motion Tween by choosing Motion from the Tween drop-down list on the Properties panel or by right-clicking (or CTRL+click) on the frame and choosing Create Motion Tween:

The timeline now indicates the tween on the frames:

If you’re unfamiliar with tweening, what we have done here is position the shape on the first and tenth frames, then instructed Flash to create a transition between the two; the Motion Tween moving the shape along the distance between the two points so that it progresses evenly along its course. To see the effect, place the playhead on the first frame by clicking on it and press Enter; you should see the animation on the stage as the playhead moves along the timeline.

Now go back to the main Timeline by pressing the backward arrow button on the Timeline header:

All that we’ve done so far is create a MovieClip in the Flash document’s library, meaning that we’ve defined exactly what should happen within the clip and prepared it for use in our movie, but we haven’t actually placed it in the movie yet. To do this, select the MovieClip symbol in the library (Window > Library if it isn’t visible) and drag it onto the stage:


Now test your movie (press CTRL+Enter or choose Control > Test Movie); you should see the animation in your clip looping continuously. To make the clip play only once, we need to edit the MovieClip; to do this right-click (or CTRL+click) it in the Library and select edit, or double-click on the instance of the clip on the stage. Select frame 10 and open the Actions Panel (F9, click on the Actions tab or choose Window > Actions), enter the following code:

 stop(); 

Now test your movie again, the clip should play only once. By placing the stop action here, you have instructed only that particular MovieClip to stop; any other activity on the main Timeline will continue, as the MovieClip operates according to its own Timeline.

CSS Tutorial – Roll Over Button

Pre-loaded Hover-state Images

In this XHTML CSS tutorial you’ll learn how to create a button for a web page using Photoshop, XHTML and CSS. More specifically, you’ll learn how to create a button who’s hover state image is preloaded. The advantage to this technique is that upon hovering over your button, the user won’t have to wait for it’s hover state image to appear; there’ll be no ‘graphic-less’ moment while the image loads, all without a single line of JavaScript.

Open up a blank XHTML document with a style statement within the <head> tags. This is where we’ll place out CSS code.

We’ll begin by setting out the XHTML markup for our button, between the <body> tags:

Notice the button has been given the class of ‘button’.

Now we’ll set up some basic CSS to establish some styles in our document. Place the following between the <style> tags:

Now some attributes for what will be our button, identifiable by it’s class ‘button’. Firstly, it has a width of 100px, a height of 20px and some extra padding to increase it’s dimensions further.

The above statement dictates that the button has padding of 15px at the top, 20px on the right, 10px at the bottom and 45px on the left. This extra padding on the left will make room for an icon on our button. The total dimensions of our button are now 160px wide and 45px high. You’ll also see that I’ve given any text within the button a color of #666666, that it’s displayed as ‘block’ (making it adhere to the dimensions we’ve set) and that I’ve removed the default underline by stating that there will be no text decoration. Now lets make a graphic for it with Photoshop.

Open up a new document in Photoshop with the dimensions of our button.

Copy a design something along the lines of what you see below. I’ve chosen to use one of the many icons freely available from famfamfam.com and placed it on the left.

Now alter your canvas size (Image > Canvas Size…). Double it’s height to 90px from the top edge. This will give you the following result:

Now duplicate all the elements you’ve drawn and position them at the bottom of your canvas. This copy will be your button’s hover-state.

Your two button images need to be different in some way – perhaps a completely different color, different icon or perhaps something more subtle. I’ve chosen to alter the transparency of my top image making it fainter than the hover-state. The button will appear darker when hovered over.

When you’re satisfied with your image, save (File > Save for Web & Devices…) in whatever format you choose.

Now let’s use this image as a background for our button by further defining our ‘button’ class in the CSS.

This states that the image we’ve chosen will be used as the background for our button, that the image won’t be repeated (it won’t be tiled), that it will be positioned 0px from the left and 0px from the top. Of course, when the page is loaded and the button background is also loaded, the whole thing is placed in your browser’s cache, even the part of your button image which isn’t yet visible. Check your button in a web browser, it should look like this:

Now we need to add the final CSS statement, defining what happens when our button is hovered over.

This simple statement dictates that the hover-state of our ‘button’ link will have a slightly darker color of #333333 and that the background image will be our button.jpg. The difference this time is that the background position has been set at 0px from the left and -45px from the top – or, said in another way, that the background image is raised 45px. Our hover-state graphic will therefore instantly fill the button when hovered over. Try it yourself! Finished CSS Example

XHTML Tutorial CSS Tabbed Menu

Tabbed menu

One hugely useful way of displaying your menu items is in the form of tabs. The following tutorial will take you through some simple steps to build your own tabbed menu, without so much as a .gif or line of JavaScript in sight…

Open up a blank XHTML document with a style statement within the <head> tags. This is where we’ll place out CSS code.

Now let’s set out the XHTML markup for our menu, between the <body> tags:

This is a straight-forward unordered list which we’ve given the class of ‘menu_tabbed’. Within it are four list items, each one of which contains a link.

That’s it for the markup, now let’s set up some CSS to give our document some basic styles. Place the following between the <style> tags:

This just gives our document a default text color (#333333), font and font size. I’ve also just given the documents ‘body’ a padding of 30px in order for our menu to be held away from the page edges. This will make it all slightly easier to view on our part.

Now some attributes for our unordered list, identifiable by it’s class ‘menu_tabbed’. Firstly, it has no list-style. This removes the bullet points from the list items – in all circumstances, in all browsers. Secondly it has a solid border along it’s bottom edge of 1px and the color #999999. Lastly some padding at the bottom in order to hold the border away from our tabs as we’ll soon see.

Test it in a browser, your menu should now look something like this:

Now let’s style our list items, identifiable as ‘li’ within the ‘ul’ which has a class of ‘menu_tabbed’.

We’ll display the list items ‘inline’ which will distribute them horizontally across the page. Each one has a margin on the right of 5px in order to hold it away from the previous list item. Now your menu should now look something like this:

Having dealt with our list and the list items within it, we can now turn our attention to the links, identifiable as the ‘a’ within the ‘li’ within the ‘ul’ which has a class of ‘menu_tabbed’. Place the following within your CSS code:

}

There’s a little more styling involved here as most of the visual effects are tied to the links. First give the text a faint color of #999999 and remove the underline by stating no text-decoration. Then give a background of #f7f7f7 and a solid 1px border of #CCCCCC. There’ll be no border on the bottom, as this is catered for by the border on the bottom of our unordered list.

Lastly, give the links some padding; 10px at the top and bottom and 14px left and right. The 10px padding at the bottom will allow the links’ bottom edge to meet with the bottom edge of the unordered list which we also gave a padding of 10px.

Check your menu again in a browser:

Now let’s give our tabs some styling for their hover state, one simple line of CSS:

This padding overrides the padding for the links which we’ve previously set. It differs only by giving an extra 4px padding at the top which gives the tabs the impression of being lifted like so:

Finally we’re going add some style for when one of the menu items is selected. Add the class ’selected’ to your second list item:

Now let’s add some CSS to determine what the selected tab looks like:

We’ve darkened the text to make it stand out, the background is white, as is it’s bottom border. This will cover the bottom border of the unordered list giving the impression that the tab is ‘connected’ to the page underneath. The padding will match the padding we’ve given to the link hover state; slightly raising the tab.

That’s it! Check your final menu in a browser!