How to Make a Portfolio in Flash

Flash can create truly interactive, digital portfolios for online viewing.

If you are an artist, having a portfolio is a prerequisite to land a job. Employers want to see demonstrated ability. Having an online portfolio is common for today's artist. The Flash program is capable of making portfolios into an interactive experience--whether you are showing off paintings, works of text or digital graphics, or websites.

Instructions

Prepare your Images

1. Use a scanner to digitize your images. If you have very large works such as paintings on a canvas, have them professionally scanned or take digital photographs of them. If you wish to have high-quality (large file) representations of your artwork available, create two separate file copies of the image using a graphics-editing program. One file is for a thumbnail--no more than 600x400 resolution--and one file is for the larger, original image.

2. Use File > Import > Import to Library in Flash to import all of your (thumbnail) images.

3. Press Ctrl + L to open your library and drag your first thumbnail out onto the stage. Press F8 to turn it into a movie clip image. Make sure you set the registration point for your symbol to the upper-left hand corner by clicking on the graphical representation in the Symbol dialog box. Give the symbol any name you like and press "OK". Delete the movie clip from the stage.

Create a Portfolio of Thumbnails

1. Drag your first movie clip symbol onto the stage. In the Properties Inspector, give it an instance name of "thumbnail_01" and re-size it to be small enough to fit on the stage with all of your other thumbnails.

2. Drag your second movie clip symbol onto the stage and give it an instance name of "thumbnail_02". Re-size the thumbnail to sit next to the first one. Continue adding and naming thumbnails until they are all on the stage. Re-size the document in the Properties Inspector if needed. Your stage should be large enough to show off your images full-size when clicked on.

3. Left-click on the first keyframe of your movie and press F9 to open the actions panel. Paste the following code, duplicating it as needed for all of your thumbnails.:

   thumbnail_01.onRollOver = over;

   thumbnail_01.onRollOut = out;

   var myX:Number

   var myY:Number

   function over(){

   myY = this._y;

   myX = this._x;

   this._x = 0;

   this._y = 0;

   this._xscale += 400;

   this._yscale += 400;

   }

   function out(){

   this._x = myX

   this._y = myY

   this._xscale -= 400;

   this._yscale -= 400;

   }

Create a Portfolio that Links to External Images or Web Pages

1. Follow steps 1 and 2 of Section 2 above to prepare and arrange your thumbnail images.

2. Left-click on the first keyframe of your movie and press F9 to open the actions panel. Paste the following code, duplicating it as needed for all of your thumbnails.:

   thumbnail_01.onRelease = release_01;

   function release_01(){

   getURL("http://yourImageURLHERE");

   }

3. Press Ctrl+Enter to test your movie, clicking on all of the thumbnails in order to make sure that the web page with the full-size image is opening properly.

References

• GotoAndLearn: Flash Tutorials
• Kirupa: Flash Tutorials

Resources

• Adobe: Macromedia Flash and Director Resource Center