Page 1


edia Production is the first multi-media magazine in the Middle East. Our aim is to introduce young creatives, as well as experienced professionals, to a new way to look at media. In a sector where the boundaries between the different media sectors seem to vanish, we offer a wholesome publication which provides information to individuals and companies from the full range of media sectors, not only in the UAE but in the GCC and the rest of the Middle East. In this manner we make information more accessible and more accurate, to keep our readers updated and informed about graphic design, audio production, video/ broadcasting, animation, new media and the multi media industry in general. But we don’t stop there. The main philosophy of Media Production is “Information followed by education”.

Content Media Production is aiming to give its readership an exclusive insight into the world of creative design.


Regular features

nterviews will introduce

key figures and new talents in


the audio, graphic design and video/broadcasting industry.

- Interviews

We will visit them in their

- Reviews

offices, studios and during

- Image retouching - Compositing - Digital art

- Previews

their work schedule to get a

- Photography

- News

detailed, inside view of how

- Typography

- Events


they work and report on what


they do exactly. The articles will showcase their work and thereby

- 2D animation

- Recording

promote their capabilities. The main target

- 3D animation

- Mixing

of the interview section is to promote talent and to inspire talent. The person being interviewed will therefore be introduced to

- Motion graphics

- Editing

- Special effects

- Remixing


- Effect programming

the entire media industry in the Gulf region! Tutorials will teach specific software and production techniques which creatives can apply in their day to day business. At the

- Production techniques

- Camera

- Post production

- Lighting techniques

- Composing techniques

- Production techniques

- Mastering

- Editing software

same time it will enhance their creativity and motivate readers to try new techniques.

- Encoding

Graphic - Illustration - Layout

- Compression

Audience D

ifferent from other

Graphic designers

available publications, Media

Film makers

Production targets professionals, semi professionals and students. Tutorials, showcases and interviews provide information about who, where, how and why things are done the way they are done. Media Production is not just another coffee table magazine; it is the encyclopaedia for everyone interested in media.

Video editors Audio engineers Sound designers 2D and 3D animators Web designer Page makers Photographers Media students Media business owners Advertising agencies Creative houses Illustrators Song writers Arrangers Creative directors Digital artists

Design TUTORIALTUTORIAL Drop Down Menu Drop Down Menu

Issue #00 - Dummy

Masking >> The next st the animation for the

Flash CS4 Flash CS4

DropDrop Down Down Menu Menu Using Actionscript 4 Using Actionscript 4

Ryan Stokes Ryan shows Stokesyou shows howyou to use howflto ash use CS4 flash to CS4 to build a Drop build Down a Dropmenu Downusing menuthe using timeline the timeline and and Actionscript Actionscript 3. 3.





Import a suitable button Import graphic a suitable to thebutton stage,graphic Go to Modify to the >stage, Convert Go to Modify Select> the Convert button graphic Selectand theconvert button graphic it to a Movie and convert Clip Symbol it to a(like Movie Clip Symbol (like to Symbol. Name it mainBtns to Symbol. and Name choose it mainBtns Button for and Type. choose Button for Type. we did in step 1) andwe name did in it btnBG. step 1) and name it btnBG.




Create a new layer and name it Sub Buttons. Import or draw a suitable sub-button graphic (here we use a simple black rectangle with a grey stroke), Convert it to a Button Symbol and name it subBtn.



Select the first button, go to the Properties window and give it an Instance Name of main1Btn . Name the other 3 buttons main2Btn, main3Btn, main4Btn accordingly.

. Select the rectangle tool an rectangle large enough to mask 4 Convert it to a Movie Clip Symbol it mask_mc. Position it just above main1Btn button.

This approachThis to creating approach a drop to creating down menu a dropisdown straight menu forward is straight but there forward arebut many there are many steps so pay close stepsattention. so pay close Theattention. first stepThe is toficreate rst stepand is to arrange createthe andbuttons. arrange the buttons.

ButtonsButtons >> >> Education:

Lets get started! LetsOpen get started! a New Actionscript Open a Newdocument Actionscript and document set its and set its 550 x 400px. size to 550 x 400px.

Education: size to

MA in Design for Interactive MA in Design for Interactive Media




Ryan Stokes

Ryanwatch?v=ZemzxxlCvcg Stokes


New Media editor on MediaNew Media editor on Media Production Magazine

SkillsMagazine Skills Production Interactive Media Developer Interactive Media Developer - specializes in designing - specializes in designing tangible and touch screen tangible and touch screen user interfaces.



Name the first timeline Name layer theMenu. first timeline Go to layer Menu. Go to Insert > New Symbol.Insert > New Symbol. Name it menu_mc and Name choose it menu_mc movie forand Type. choose movie for Type.





Open mainBtns fromOpen the library, mainBtns copy from thethe Up library, Keyframe copy to the Over Up Keyframe Key- Go to to theWindows Over Key> Library, Go toopen Windows the menu > Library, movie open clipthe andmenu drag 3 movie instancclip and drag 3 instancframe. Go to Window frame. > Properties, Go to Window open Colour > Properties, Effect, select open Colour Bright-Effect,esselect of mainBtns Bright- onto es theofstage. mainBtns Select onto thethe Text stage. Tool Select and create the Text button Tool and create button ness for Style and increase ness forBright Style to and + 20. increase Bright to + 20. labels . labels .

Create 11 copies of subBtn and arrange them as shown. Note: The sub buttons must line up exactly so there are no spaces between them.

Select the Text Tool and create appropriate text labels for all of the Sub Buttons.


. Insert a frame at frame 41 Buttons and Sub Buttons Layer.

user interfaces.

Feature Feature Interactive surfaces Interactive surfaces

Every year we are inundated Every yearwith we new are inundated gadgets screen with new terminal gadgets was a screen standard terminal plasmawas screen a standard with plasma screen with that allow us to deliver that allow contentus and to deliver let users content an attached and letinfra users red touch an attached frame. infra red touch frame. interact with it in innovative interact ways with and it in interactive innovative ways and interactive surface computing (think surface touch computing screens, (think walls etc) touch The screens, crucial walls question etc) The whichcrucial must question be askedwhich when must be asked when is now becoming a popular is now choice becoming of technology a popularfor choice designing of technology such afor system designing is how such does athe system interface is how does the interface

and you’ll get the picture). Thanks to the advent of

companies who want tocompanies impress their whocustomers. want to impress their improve customers. the users experience? improve the To fiusers nd this experience? out you To find this out you

to interact with the interface. Microsoft states that

a much longer life span. The tracking software is very

for setting up the interface are avai

such technologies as the iphone users are becoming

this functionality will eventually include the ability

impressive - it can identify hands and the specific and there is

Nowadays, touch screen Nowadays, systemstouch can screen be found systems mustcan consider be found what advantages must consider the interface what advantages offers the interface offers

more familiar with multiple touch gestures which

to transfer digital content.

everywhere from kiosks everywhere in mallsfrom to exhibitions kiosks in malls over to other exhibitions mediums at over your other disposal? mediums The at Ventuz your disposal? The Ventuz

means developers have a lot more headroom in terms

and showrooms but itand is still showrooms possible but to use it issuch still possible system,toapart use such from being system, a crowd apart from puller,being offersa crowd puller, offers

of how complex they want to make the system. It

for our ipods or pay for our meals at restaurants but don’t get too excited yet - Microsoft is only selling the

Wow! Imagine a 20 meter wide interactive wall

API for free, allowing you to buy your


starting to sound all a bit minority report for some

systems to selective public and private corporations

display - thats going to attract some attention! The

and set it up as you see fit.


presented at any one given presented time at without any one thegiven screen time without the screen

Object Recognition -Object physical Recognition objects can - physical be content objectsthey can are be interested content in quickly they arewhile interested avoiding in quickly while avoiding recognized and used torecognized interact with andthe used interface. to interact with any that the interface. might not interest any that them. might The not end interest result is them. an The end result is an

in the US, estimates that it will be available to the

displays are not cheap however, but thankfully there

public within 3 - 5 years and many have estimated

are options for those on a tight budget - if you’re

The mention of C++ may have cause

that its price tag will be in the $5 to $10K range. So

willing to roll up your sleeves and do some of the

in despair but, if you are up to sp

what can you get your hands on now?

work yourself.

>> Flexible Systems

>> DIY

One of the most flexible systems available at present

Thankfully the hardware used for FTIR based Multi-

>> Surface

Lets begin by exploring Lets abegin recent by project exploringthat a recent project that

If you have been keeping track of the news in the

incorporated a single touch incorporated user interface a single that touch really user interface Companies that andreally even many Companies developers and often even many shy away developers often shy away

field you will know that Microsoft released their

impressed its users andimpressed us. its users and us.

Surface interface last April. The Surface is a Multi-

>> Masdaar

>> Masdaar

from such systems because fromthey suchbelieve systemsthat because it is too they believe that it is too

though - you can download its trackin

but the technology has been around for a number of years and is now becoming affordable.

intuitive and immersiveintuitive experience. and immersive experience.

UAE Edition 60 AED, 5 KD

C++. There is no need to buy the comp

also opens up the possibility of a system that can be used simultaneously by multiple users. This may be

Multi Touch - multiple fiMulti ngersTouch can be - multiple detectedfingers can view, be detected which is empowering view,aswhich he or is she empowering can get to the as he or she can get to the

Information and Education from the Middle East for the Middle East

designers can exchange ideas and

creating their own applications, whic

in any formation required.

technology to stand out technology from the to crowd. standThere out from are thebenefi crowd. ts over There more aretraditional benefits linear over based more traditional interfaces.linear based interfaces.

becoming cluttered. Secondly becoming thecluttered. system offers Secondly users the system offers users

Interactive Interactive Media has Media nowhas become now become an indispensable an indispensable tool for tool mosta forcompanies mosta companies marketing marketing departments departments and theand Middle the East Middle hasEast turned has into turned a hot into bed a hot for bed a for a plethoraplethora of new exciting of new exciting technologies technologies which can which be can be used to used get ato message get a message across. across.

fingers of multiple users. The system is also modular, allowing an infinite amount of cells to be configured

a number of differenta types numberof ofsystem different presently types ofFirst system off -presently a large amount First off of -information a large amount can beof information can be

Single Touch - one finger Single can Touch be detected - one finger can be detected the ability to be highlythe selective ability of tothe be highly content selective they of the content they


So we could soon be using such tables to buy content

Actionscript, Ideo Labs (www.ideola

an alternative. The Home Brew Mult

consists of tracking software and a mu for receiving touch events in Flash.

available for free from google cod and tutorials for buildin

easy to overpower a user easywith to overpower too much complexity a user with too much complexity

Touch, Multi-User, Object Recognition Interface.

is the Multi-Touch LCD Cell from a Finish company

Touch displays (such as the Surface) is readily

can be found at a

but the folks over at Stereolize but the folks haveover shown at Stereolize that it have shown that it

Thats right! as well as being able to detect multiple

aptly named MultiTouch. Unlike FTIR based systems

available, relatively cheap and there is a large Multi-

other sites.

is possible to strike aissuccessful possible to balance strike between a successful balance between

inputs and different users it can also detect objects

such as the aforementioned Surface, the cell utilizes

Touch open source community that is sharing ideas

complexity and usability. complexity and usability.

such as cameras or mobile phones, which can be used

LCD technology, which offers a higher resolution and

and posting an abundance of information about the topic on the internet .

>> Object Recognition

Masdaar entrusted the Masdaar german entrusted design company the german design company Stereolize

( Stereolize ( to create an




interactive exhibition interactive booth thatexhibition could present booth that could present >> Multi-Touch

>> Multi-Touch

their Masdaar city project their Masdaar from strategy city project throughfrom strategy through

One company, Nortd, sell a multi-touch development

Object recognition is a far more com

kit which comprises of both hardware and software

and at present beyond the reach

and sells for an amazing $1580. The screen is 27”

developers can achieve a similar functi

to implementation. This to project implementation. is a good This example project The is a former good example project made Theuse former of only project one input madeand, use of only one input and,

by 18” in size, but the system is modular, meaning

symbol tracking. Back in 2003 a gro

of how atypical navigation of how systems atypical cannavigation be used to systems can be used to as mentioned previously, as mentioned Multi-Touchpreviously, technologyMulti-Touch is technology is

that any number of screens can be linked together.

from the University of Pompeu Fabr

present information without present sacrifi information cing usability. without sacrifi cingavailable. usability. This is where now now available. things from Thisa isdesigners where things from a designers

A camera behind the screen tracks any fingers that

came up with an ingenious tangible

perspective get very perspective exciting. What get kind very of exciting. user What kind of user

are placed upon the screen and a projector provides

the performance of live music called

The team designed a The system team called designed Ventuz, a system which called Ventuz, which interfaces could be designed interfaces to could take advantage be designed of to take advantage of

visual feedback. In order to avoid errors, the camera

system is identical to the multi-touc

consists of a touchscreen consists terminal of a and touchscreen three large terminal and three large surfaces that can detect surfaces multiple that inputs? can detect multiple inputs?

only views infra red light which is reflected back off

described except that objects can b

the table in order to trigger and chan

plasma screens. The plasma menu screens. on the terminal The menu is on the terminal is

of any finger that touches the screen. This is done

represented by 3d spheres represented which can by be 3d rotated spheres by whichFirst can of beall rotated - whatby does First moreofinputs all - what allow?does It allows more ainputs allow? It allows a

by placing infra red LED strips behind the screen

touch and selecting something touch and causes selecting content something to be causes content to be user to carry out more user complex to carry operations out more in acomplex more operations in a more

and using an RGB filter on the camera to block out

The team designed a set of unique sym

seamlessly displayed upon seamlessly the plasmas. displayed Theupon touch the plasmas. touch intuitive The fashion (thinkintuitive zoomingfashion in on google (think zooming earth in on google earth

any light in the visible spectrum. Full instructions

an application that could identify

Published by: ThinkTank Publishing and Creative House FZ-LLC

Media Production Magazine