Archive for the ‘flash’ Category

Articles

help files for widgets in adobe captivate 4…

In adobe,adobe captivate,adobe captivate new feature,e learning,flash on March 31, 2009 by rajeev kumar

if you are thinking of creating widgets in Adobe Captivate 4 the help files contain very relevant information. and they are very concise so it is good idea to go through them once so that you can get a feeling of where to search for when in problem.

I am listing below the links for reference. You can add comments to the online help also if you feel that you can add anything more or if the information is partial/wrong etc – 

Articles

use voice 2.0 in your eLearning projects…

In adobe,adobe captivate,adobe captivate new feature,collaborative elearning content creation,e learning,flash on March 30, 2009 by rajeev kumar

collaboration is new way of learning. We already know how chats and social networks are helping in this. It is all fun but everyone has to find their own way to learn, there is less flow and pattern. In most of cases one has to reinvent the wheel. Can there be a better way in which the learning flow can be decided by the content creator and he can pass on the knowledge to the learners. The learners still use all the fun things of web 2.0 world.

Since my world revolves around Adobe Captivate so my thought goes on to the ways in which we can use Adobe Captivate for this. In my view it can help by creating content which controls the flow of learning and all web 2.0 and collaboration is initiated, contained, guided, tracked and stopped by it. We have seen some example in form of youtube and google map widgets wherin we could use them inside Adobe Captivate content. And the content is restricted in terms of the information which is visible to users but more engaging and in the form they are comfortable. 

in view of all this one news caught my attention – this month ribbit opened itself to flash developers. According to them they help to “integrate voice and rich communication features into your website, application or community”. It means that you can add voice and telephony related features to your your flash content which includes eLearning content created by Adobe Captivate. It includes sms and transcription features. And with widgets feature of Adobe Captivate it is better poised to take advantage of the things happening. 

next two post we will see few scenarios wherin Adobe Captivate users can use it to add voice and sms collaboration features to their content and go through a tutorial to use ribbit APIs for flash .

Articles

use google maps in your adobe captivate projects…

In adobe,adobe captivate,adobe captivate new feature,collaborative elearning content creation,e learning,flash,technology on March 7, 2009 by rajeev kumar

gmapshybrid1

there are many eLearning projects with addresses and contact information. How would that look if we can insert a live map which will show a note about the address , can show directions to reach and user can pan,zoom and use it as he would do in any online map services and all within the Captivate project. No need to go to the browser and break the flow of users.

in this post we will go through some of the resources to use Adobe Flash CS4 to create a swf file which can be used inside adobe captivate projects. We will use Google maps Api to achieve this.

  1. Set up your development environment in Flash CS4. Read the whole process here.
  2. Sign up for google map API here. You will get a unique API key. You will need to specify a website or domain where you will be using it. You can give the link to your blogs also. Refer to step 10 as to how to use it.
  3. go through this post to create a simple application here. Note – The path for componets in Flash CS4 is C:\Program Files\Adobe\Adobe Flash CS4\Common\Configuration\Components
  4. Now we will create a swf file which will display the map of washington and show a overlay over that.
  5. Open Flash CS4. Create a Action Script 3.0 project
  6. During step number 1 you have copied maps swc file to Flash directory. If you have done it correctly than inside components window you can see and entry for “Google>GoogleMapsLibrary”. Drag drop it to stage. Dont worry about the position.
  7. The code is attached at the end of post for reference. Just copy the code to actionscript window and publish the project as swf file.
  8. In the begining of code we have use few import statements so that we can use the corresponding APIs.
  9. We will declare the map object – var map:Map = new Map();
  10. We will need to use the API key we generated in step 2. – map.key = “put the api key here“;
  11. Set the size of map – map.setSize(new Point(500, 400));
  12. add a event listener – map.addEventListener(MapEvent.MAP_READY, onMapReady);
  13. set the map area to the location you want to show – map.setCenter(new LatLng(38.8977, -77.0366), 14, MapType.NORMAL_MAP_TYPE); – Important thing are lattitude(38.8977) and longitude(-77.0366) – how should you find the one for your location – there are 3 ways – you know it already, use google geocoding apis  or use this page to find the one for your location. Behind the scenes it is using google map apis to do this.
  14. Play with replacing MapType.NORMAL_MAP_TYPE – Other values they can take are SATELLITE_MAP_TYPE, HYBRID_MAP_TYPE, and PHYSICAL_MAP_TYPE. SATELLITE_MAP_TYPE is the one you can use to get google earth type of map.
  15. Next we will create a marker and add it over the map. It will show your position on map
  16. Below is the action script code . Put it in your action script window and you are ready to go.

import com.google.maps.LatLng;

import com.google.maps.Map;

import com.google.maps.MapEvent;

import com.google.maps.MapType;

import com.google.maps.overlays.Marker;

import com.google.maps.overlays.MarkerOptions;

import com.google.maps.MapType;

import com.google.maps.LatLng;

import com.google.maps.styles.FillStyle;

import com.google.maps.styles.StrokeStyle;

//create a map object

var map:Map = new Map();

//specify the API key

map.key = “replace with your API key“;

//set the size of map

map.setSize(new Point(500, 400));

//add event listeners

map.addEventListener(MapEvent.MAP_READY, onMapReady);

this.addChild(map);

function onMapReady(event:Event):void {

//center the map to the lat, long

map.setCenter(new LatLng(38.8977, -77.0366), 14, MapType.NORMAL_MAP_TYPE);

//create a marker

         var markerA:Marker = new Marker(

             new LatLng(38.8977, -77.0366),

             new MarkerOptions({

                 strokeStyle: new StrokeStyle({color: 0x987654}),

                 fillStyle: new FillStyle({color: 0x223344, alpha: 1}),

                 radius: 15,

                 hasShadow: true

             })

         );

//add the marker to the map

map.addOverlay(markerA);

}

Publish it as swf and insert it to your Captivate project. Note – This is action script 3.0 swf so you can use it in Latest version of Adobe Captivate that is 4 . Publish the Captivate project. You have a fully functional map showing the location you provided. You can pan , go to any place in world . Find the directions etc. 

Keep an eye here for the future post to understand how widget feature of Adobe Captivate 4 gives a better solution than this. And use the endless capabilities of Google Maps service.

Update  – read this post to see how the google map widgets were created and download the file to be used with Adobe Captivate 4.

Articles

adobe captivate 4, learning 2.0 and the perpetual beta …..

In adobe captivate,e learning,flash,technology on March 6, 2009 by rajeev kumar

youtubewhile browsing the net for using various webservices like youtube,flickr,google maps etc and thinking how they are being used in eLearning world I chanced upon this ebook. I was late to notice this but still. The concept is called “e learning 2.0” and is explained as use of web technologies in education. This term is extension of more famous term web 2.0.

captivateLogoI am also thinking of how a eLearning tool like Adobe Captivate 4 can help in this phenomenon. You have already seen how youtube videos can be inserted in adobe captivate 4 slides. That was just the glimpse. More advanced things can be done like posting the comment, adding the rating, complains etc depending on how much they open for Flash. Similarly there could be ways to use flickr which is a photoshare service. Learning 2.0 also mentions it quite frequently but I am yet to find a broad use case in which a tool can help in creating content using Flickr. Ofcourse showing a set of photographs with predefined search string is the easiest of them but I am not sure if it will be used or practical courses. May be it is my ignorance of service which I have just began to use or may be the informal nature of these services. There are some interesting things which can be done with google maps which I will share shortly.

betaAnd this also reminds me one of the favourite terms of web 2.0 – perpetual beta which is a system in which a product never leaves development stage of beta and allows developers to consistently release new features which might not be fully tested. You see this trend in the “beta” logo which comes with many web 2.0 services. This also says users must be treated as co developers and they add to the product feature set also. Which again leaves me with thought that the features will never stop coming even after Adobe Captivate 4 is released and the users can be part of it also by developing such services on the tool. This is one of the contribution of Adobe Captivate to web 2.0 phenomenon.

Articles

use youtube videos inside adobe captivate

In adobe captivate,e learning,flash on January 15, 2009 by rajeev kumar Tagged: , ,

for Adobe Captivate 3 users one of the wishes would be how can they insert youtube videos inside their Captivate project file. Here are the ways you can do it.

  • this is based on the documentation YouTube ActionScript 2.0 Player API Reference. Visit this page for some more guidelines about using it for loading multiple videos and unloading etc.
  • Open a flash actionscript 2.0 file. Copy the code from the page mentioned  above under the example section and paste to the flash file you have just created. Make following changes –
    1. var ytplayer:MovieClip = _root.createEmptyMovieClip(“ytplayer”, 1);
      change this line to var ytplayer:MovieClip =  createEmptyMovieClip(“ytplayer”, 1); as captivate gives warning about using _root in the swf being inserted.
    2. go to www.youtube.com and locate the video you want to insert into Captivate project file.
    3. locate the url of that video – it will be in format of http://in.youtube.com/watch?v=SaBb8Wi25Pg
    4. copy the text marked in red – it uniquely identifies  the video on youtube
    5. switch to your actionscript code
    6. Replace the text copied in earlier step 4 with VIDEO_ID in the statement ytPlayerLoader.loadClip(“http://www.youtube.com/v/VIDEO_ID“, ytplayer);
    7. Save the flash file. Publish it to swf. For best results change the document size of flash to 480 x 385 pixels
    8. Open Captivate. Choose Insert – > Animation . Locate the swf file you published in previous step 7 and insert it.
    9. Now insert a button on the same slide so that Captivate movie will pause at that slide till the time user clicks. So that they can view the video before moving to next slide.
    10. Publish the Captivate project and you will see and can play the video

youtube

Pros –

  • totally seamless
  • you need not use those tools to download video files from youtube to your machine and probably face copyright issue
  • no copyright issue as video is being played from youtube site

Cons –

  • You have to manually specify the video ID and regenerate swf before using it in captivate.
  • this is just a proof of concept. It has many bugs like audio not stopping when you move to next slide, video in some stage when you rewind to the slide containing it and possibly many more. But it is all possible by changing the actionscript code by unloading the video properly.
  • you have to add button for slide to pause

ps : watch out for next posts –

  • use flickr apis to create slideshows which fetches data from flickr. Use Flash to create the animation which can be used inside captivate.
  • some improvemets on youtube sample
  • and wait you have a better and elegant solution waiting when Adobe Captivate 4 is released. Update 1 – read step by step guide to create youtube widget for Adobe Captivate 4

Read More »

Articles

business logic and products

In flash,random thoughts,solidworks on January 31, 2007 by rajeev kumar

one of the examples of how business logic defines any product was visible when I started playing with flash authoring tool after long familiarity with solidworks. Flash is used by creative professionals whose thoughts has no boundaries and does not have any constraints. They are limited only by their imagination. And the tool they will use should help them by not restraining them.On the other side solidworks is used by engineers and designers who are bound by many limitations like the part they are designing – can they be manufactured by available tools and in how much cost . If they follow some standard then parts can be manufactured easily or they can be bought off the shelf also reducing cost. In this case the tool should not allow them to go out of bound and create anything they want.

Taking simple example – A Line always remains a line in solidworks or in any cad modellar. If any end point of line is fixed at any place it will always remain there unless you remove the first constrain of fixed point. And all the following operations has to be based on previous constraints. And a circle will always remain a circle.

In flash select a line and drag it . It change its shape to something else ofcourse it is bound by some equations but still slight change in selection and completely new results which suit the artist mind who most of the time is not wanting any fixed result and is experimenting for new shapes. A circle can be changed to star depending on selected point and dragging. Create two intersecting lines and they become 4 line!!