User guide flashonavigation


Published on

  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

User guide flashonavigation

  1. 1. User Guide: ---- Let’s make e-learning cheaper! ----- A Component for Flash 8 * Flash® is the registered trademark of Adobe Systems INC.
  2. 2. Developed by :Enterprise System Solutions Pvt. Ltd. (ESSPL)Infocity, Bhubaneswar, India – 751024www.esspl.comComponent Author:Samir K. Dash, Systems Consultant, ESSPLComponent Page URL : available at Adobe’s Flash Exchange URL: ion&authorid=0&page=0&scrollPos=0&subcatid=0&snid=sn111&itemnumber=- 1&extid=1035646&catid=50&avm=1Support InformationThis product is provided on as-is basis. For feedback/ suggestions please send your mails or ess@esspl.comLicense Agreement for Flash-O-NavigationFlash-O-Navigation is distributed by Enterprise System solutions Pvt. Ltd. (ESSPL) as iswithout any warranties whatsoever. By using this Flash component you accept the fact thatESSPL will not be liable for any damage it may cause. Disclaimer: ® Flash® is the registered trademark of Adobe Systems INC. All content/ information presented here is the exclusive property of Enterprise system solutions Pvt. Ltd. (ESSPL). The copyrights of trade marks/ logos of any other organizations/ companies/ vendors are under their respective copyright holders and are in no way linked to ESSPL or any of its subsidiaries. The content/ information contained here is correct at the time of its publishing. No material from here may be copied, modified, reproduced, republished, uploaded, transmitted, posted or distributed in any form without prior written permission from ESSPL.
  3. 3. Contents1. About Flash-O-Navigation2. Contents of the Component3. Features of the Component4. Install the Component5. Know the Component Parameters6. Listing Your Contents7. Getting additional informationAbout Flash-O-NavigationThis is a Macromedia Approved component for Flash 8. It is the ultimate a Component for ®Flash based e-Learning development. With this component: • No need to worry about the navigation interface for content arrangement. Everything is there if your training content/ simulations are created in Flash or just an image (jpeg/ gif/ png type). • No need to mention how many contents are there in each chapter (set of earning objects), you just list down the chapter names and individual file name in provided XML, rest is taken care of. • Change your content any time with the help of XML, and the table of content is ready Adding deleting items from table content is easy. • The internal controller helps you playing your swf contents just like a movie. You can reach any frame at any point of time. • Keep bookmark of the last visited page, and go to its exact point, even in the exact point of the swf content any ime you wish. • While studying found something worth for the notes…then just note it down using the provided note pad. You can keep notes for any specific point of the swf content and reach it at any other time . You can keep as many notes as you wish. • Can control volume of the content swf any time. • Change color of the lay out and the whole interface. • Add logo of your training kit at the header. • Highly customizable and easy to use. • There is the credit section to mention the developer name, year etc. • Just have some images to make a presentation, just mention the file names and you are ready for the show .Contents of the ComponentThe Flash-O-Navigation package contains the following: 1. flashonavigation.mxp 2. flashonav_list.xml (it is a sample XML. You have to modify to fit your needs) 3. Chapter1.xml, Chapter2.xml, Chapter3.xml -- all these are sample xmls you have to modify or create similar xmls to fit your needs.
  4. 4. The MXP file (with out XML files ) is available at the following link(s): MXP file with the XML files is available at the following link(s): these XML files (without the MXP file)will be available at the following link(s) : of the ComponentFlash-O-Navigation has the following features: 1. It provides you with an easy navigational interface for e-learning and slideshow/ presentational development. Just drag the component and your interface is ready ! 2. You can e-learning for two level content structures, which can be for example Chapter and Units, where the Chapter is first level of group and each chapter is made up of some units. Each Unit here can be made of just one slide image (made of either JPG/ GIF/ PNG/ SWF) or an animation created in SWF (in the _root timeline) or a simulation created in SWF (in the _root timeline) or just a quiz created in SWF (in the _root timeline). 3. The component lets the learner to move to any point of your learning tool using different buttons , and playback control. 4. They can keep notes for any point of your content (for example they can keep notes for any particular point of simulation they are viewing ) and can access it any time they want. They can keep any number of such notes.
  5. 5. 5. The users can keep bookmark 6. The component allows easy updation of the menu system through XML. Using the simple XML format anyone can change or re-arrange the content index to fit the need of the e- learning development.Install the ComponentDouble click on the flashONavigation.mxp file to run it. If you have Flash 8 orabove version installed in your system then it will open the Macromedia Extension manager andyou will be then asked to accept the terms. If you agree to the conditions then the extension willbe automatically installed.
  6. 6. Now open Flash 8 IDE and in components panel you will see the components underSamirComponents folder.Know the Component Parameterscolor:This parameter has 2 options – (1) defaultGray (2) dreamyWhite. Chossing either of theseoptions changes the interface color to any of these predefined color. In future versions more coroptions will be added.fullscreenThis option has two values – “True” or “False”. If you choose “True”, then on stand alone modethe Flash file will go to fullscreen mde. However if you publish it for web, (selecting forWebparameter to “True”, or just view the swf file through a browser like IE/ Netscape etc.) then thefullscreen won’t take effect, even if set to “True”)headerTitle:This string you will enter here will be the title of your e-Learning kit. The default value is “Flash-O-Navigation Training Kit”.
  7. 7. This will also be reflected in credits section.headerImage:Enter the path of your logo image (JPG/ GIF/ PNG/ SWF) with height equal to 38 px. to bedisplayed at the top of the header area. The header title will be displayed just after the width ofthe image ends in the header.headertitle_color:This sets the color of the text of your header title. The default value is 0x FFFFFF. For any othercolor please enter the HEX value after “0x”forWeb:If you intend to publish your flash e-learning to the web / intranet, then please select this option as“True” ( the default values is set to “False”) and publsish your HTML with the Flash withFSCommand template in publish setting
  8. 8. This will help you to close your interface (while inside browser )using the “Exit” button available atthe right bottom.Please note that some browsers having some restrictions to Javascript may not allow to close thewindow through Flash.developerNameHere enter the developer name of the e-learning kit , may be your name or your company name.This will appear in the creditssectionpublicationYearHere enter the year of publication/ development of your e-Learning tool. It will be reflected in thecreditssectionfirstlevelPrevIt shows the name that appears at the button which on click takes user to the previous first levelgroup (in our example “to the previous Chapter”). The default value is “Prev. Chapter”secondlevelPrevIt shows the name that appears at the button which on click takes user to the previous secondlevel group (in our example “to the previous Unit”). The default value is “Prev. Unit”
  9. 9. firstlevelNextIt shows the name that appears at the button which on click takes user to the next first level group(in our example “to the next Chapter”). The default value is “Next Chapter”secondlevelNextIt shows the name that appears at the button which on click takes user to the next second levelgroup (in our example “to the next Unit”). The default value is “Next Unit”Listing your contentsThere are two levels of groups that devide the whole contents that are to be used in your e-learning. The first one is first level (high level) high level and the other one is the second level(low level). For example we can consider the high levels as “Chapters” and the low levels as“Units”.In the following we’ll see how to list our contents for the menu system:Step 1: List the First Level GroupsAll the high level groups are listed in “flashonav_list.xml”In this XML file you list down all your high level groups as the following format: <?xml version="1.0" encoding="ISO-8859-1" ?> - <slideshow> <fon tab="Your first level group name goes here" /> </slideshow>For example, if you have a course structure containing three chapters namely “Chapter 1”,“Chapter 2” and “Chapter 3” , then you have to create the flashonav_list.xml as follows: <?xml version="1.0" encoding="ISO-8859-1" ?>
  10. 10. - <slideshow> <fon tab="Chapter 1" /> <fon tab="Chapter 2" /> <fon tab="Chapter 3" /> </slideshow>Now these will be reflected in your e-learning interface as shown in the following figure:Step 2: List the Second Level GroupsIn this step you need to create one XML files for each first level group you have defined in step 1.For example, if you have defined first level groups as “Chapter 1”, “Chapter 2” and “Chapter 3”,then you need to create three XML files with the similar file name, namely “Chapter 1.xml”,“Chapter 2.xml” and “Chapter 3.xml”. Note that your file name must match exactly to your groupsnames you have mentioned in the “flasonav_list.xml” file.Now each of these xml file will keep all the information about the contents thatcome under its higher level group. For example “Chapter 1.xml” will keep all theinformation such as how many topics will be there in this chpter alomng with theirname, related file name etc.Let’s see the format of such an xml: <?xml version="1.0" encoding="ISO-8859-1" ?>- <items> <item url="Give your file name here" desc="Give your label name here" info="Give here the description that will appear when the info button is pressed" playback_control="Write Yes or No, to either allow user to be able to use the play back control or not" /> </items>
  11. 11. For instance, lets say there will be 4 units inside Chapter 1, namely “Unit 1: Introduction”, “Unit 2:Need of Flash-O-Navigation”, “Unit 3: Features of Flash-O-Navigation”, and “Unit 4: GoingForward”, where you would present the first two content as animation where the user should beable to move across the animation using the playback control, where as in the other two casesthe playback control is disabled, then the following can be a sample xml for “Chapter 1”:<?xml version="1.0" encoding="ISO-8859-1" ?>- <items> <item url="file1.swf" desc="Unit 1: Introduction" info="This introduces Flash-O- Navigation." Playback_control="Yes" /> <item url="image.jpg" desc="Unit 2: Features" info="It provides information on the features of Flash-O_Navigation" playback_control="No" /> <item url="flashquiz.swf" desc="Unit 3: Quiz" info="A quiz for you !" playback_control="No" /> </items>You can see that there are 4 attributes in each item node , namely url, desc, info andplaybackcontrol. The attribute url represents the file (either SWF or any image format such asnon-progressive JPG, PNG, GIF). If the SWF has animation then its animation should be basedon the “ _root” timeline, so as to be controlled by the playback control of Flash-O-Navigation.The desc attribute represents what will be displayed as the name / label in the menu list. You cantake it as the Unit Name in our example where some units combine tpo form a Chapter.The info attribute keepsw additional data about the item and this appears when the learner clickson the info “i” button of Flash-O-Navigation.
  12. 12. The playbackcontrol is the attribute that has two values – either “Yes” or “No”. If you select“Yes”, then the user can drag the seek bar of the playback control provided in the Flash-O-Navigfation to view the simulation/ animation to any point on wish. But if you opted for “No”, thenthe seek bar will dissapear and the iusers won’t be able to move back and forth in that secondlevel group by dragging the seek bar. This is useful when you present a quiz or any interactivewhere you want the users to complete certain steps before moving forward to a particular point.General Information to be kept in mind1) Flash-O-navigation is designed for creating e-Learning application for 1024 x 768 screenresolutions. The minimum stage needed to place this component is 1000 x 700 px.So make sure you drag the component and place it on the stage of above mentioned or of greaterdimension.2) Note that after publishing you will need to place the related XML files (including“flashonav_list.xml) in the same folder where you have placed your flash elearning swf thatcontains the component.
  13. 13. About ESSPLESSPL offers a wide range of e-learning, m-Learning and interactive solutions, fromanimation, interface design, multimedia assessment need analysis, customizedcourseware design, simulations, interactive kiosks, online design solutions, Flash basedmobile content designing and development, to suit the wide range of client needs rangingfrom e-learning, m-learning to sales promotional campaign and presentation needs.For more details on ESSPL’s offerings in e-Learning and interactive design, refer toESSPL website at