Unit 5.pptx

UNIT 5
INVESTIGATE THE CREATIVE USE OF MOVING
IMAGES THROUGH INTERACTIVE MEDIA
ELLIE SMITH

INTRODUCTION
Interactive media normally refers to products and services on digital
computer-based systems which respond to the user’s actions by
presenting content such as text, moving image, animation, video, audio
and video games.
A Moving Image is a series of still images that when shown on
a screen create an illusion of movement.

INTERACTIVE MEDIA PLATFORMS
Apps ,animations
Broadband
Android Phones
Set up boxes for TV’s
Mobile Phones
Interactive
media platforms
animations
Player
• MP4 Player
• DVD Player
2D/3D images
Windows Phone
Apple IPhone(IOS software)
PC/Internet
MPeg
DVD
Website
CD ROM’s
Games Consoles
Kiosk
Interactive PDF
CD’s
PS4
Xbox One
Nintendo 3DS
VR

Interactive Media
Product (Name and
description)
Moving Image
product used
Image Positives Negatives
Website
Youvisit.com
Viewers can take virtual
tours of various places.
360 degree views of
galleries and places
of interest.
Provides information and
clarifies the text on the
website
Slow to download
Interactive Kiosk
Images that move
when they are
touched.
• They reduce costs
because the company
doesn’t have to employ
as many people
• More interesting so they
attract more customers
and they give better
customer service
• The are easy to operate
and it is easier for the
customer to buy
something e.g.
McDonald's interactive
menu
• They improve efficiency
because customers can
be served quicker
• Regular
maintenance to
make sure it keeps
working, this can
cost .
• Reliability is not
sufficient because it
can crash or break.
• Makes people lose
their jobs ,the kiosk is
a replacement.
• Customers details
might become at risk
if stored on the kiosk.
• Could be vandalised
easily.
Games Consoles: Nintendo
3DS
2D or 3D moving
interactive game
images
Interest the user and is
more exciting and fun to
interact with. Clear image
of whole game is given.
Could be more
damaging to the eyes
or take longer to load
the game.

Interactive Media
Product (Name and
description)
Moving Image
product used
Image Positives Negatives
Games Console:
Xbox One
180 degree view
interactive images,
move when player
moves the controller
device to show a
different view.
• Clear, visually
appealing images that
are interactive to
engage the user.
• User can control a
character
• Can take up a lot of
storage space
• Console is expensive
• Games is expensive
• Can lag
Mobile Phone:
Snapchat App
Animated
Augmented reality
–bitmoji 3D moving
image
• Engaging for
user-interesting and
interactive
• The user can edit the
size.
• Drains phone battery
• May be slow loading,
can crash other
applications open.
• app requires lots of
storage space
PC/Internet
GIF (Stands for
Graphics
Interchange Format)
A lossless format for
image files that
supports both
animated and static
images.
Domino's pizza advertisement • A Gif file can hold
multiple images which
lets users create simple
animations.
• The format supports up
to 8 bits per pixel
• GIFs are also really
good at delivering
simple animation
sequences.
• It also can be used for
storing and transmitting
photographic images
on the World Wide
Web.
• Only have a palette of
256 different colours
therefore can
sometimes look of a
poorer quality than
other types of file or
image.
• once the animation has
been coded into the
actual GIF file there is no
way to go back and
edit the image.
• Dependent on internet
connection

Interactive Media
Product (Name and
description)
Moving Image
product used
Image Positives Negatives
Mobile Phones: Apple
IPhone X
User Animated emoji
• Makes it interactive
and more interesting
for the user
• IPhone X is very
expensive
• Software can lag
Interactive Billboard
Moving repeated gif
that can react to
the user e.g.
Reacts to people
coughing
Coughing billboard • Warns people about
effects of smoking
• Makes it more
interesting and
engaging for
someone-advertises
products well
• Might be scary for
some people
DVD Player
Moving images as
movies or TV
shows, video
footage
• you don’t have to
go to the cinema to
watch a movie
• It can play high
quality movies and
tv shows
• Uses up electricity
• Dvd players can
be expensive

MAKING A GIF- COLLECTING IMAGES
I first searched for basket ball on the internet and saved the image above into my N-Drive folder, then I
searched basketball net and chose the image ,right clicked and saved it into the same place as the
basketball image.

CREATING NEW FRAMES AND TIME INTERVALS-
MAKING A GIF
1. I opened Photoshop and selected a new white canvas. I placed the
images using file then place(retrieving them from my folder).I used the
move image tool to move them into place for the first frame.
2. I selected timeline at the bottom and duplicated frames to make several
frames.
3. Then I selected each slide separately(each time moving the ball further
towards the hoop)
4. When I finished all the frames I clicked in the arrow on each frame and
changed the time delay to 0.06 seconds for each frame.

FINAL FRAMES- MAKING A GIF
Finished frames in Photoshop

SAVING AS A VIDEO FILE- MAKING A GIF
To save it I clicked file selected export and
clicked render video to save it as a mP4 video
file in my drive.

CONVERTING THE VIDEO TO AN ANIMATED GIF-
MAKING A GIF
In order to save my image as a working gif
animation I used a video converter to
convert my saved mp4 file in to a gif file.

FINISHED WORKING GIF- MAKING A GIF

MAKING A FLASH ANIMATION
First I opened adobe flash professional and selected an adobe
script 3.0 (making sure I checked the dimensions and animation
speed.

CREATING A SHAPE-MAKING A FLASH ANIMATION
In flash I selected the shape too and changed it to an oval and drew a
small oval on the corner of the canvas.

PREPARING THE SYMBOL-MAKING A FLASH ANIMATION
I clicked the fill tool to change the colour of the circle so it is clearer on the canvas.
Then I used the selection tool to highlight the oval. I selected convert then symbol
and named the symbol circle.

CREATING AN ANIMATION-MAKING A FLASH ANIMATION
I right clicked on the new symbol and created a motion tween which opens an
animation frame at the bottom of the page.

ANIMATED FRAMES-MAKING A FLASH IMAGE
I clicked points on the animation frame and
At each point I moved the position of the
circle so overall it will look like it moves
across the page.

SAVING THE FLASH ANIMATION AS A GIF
To save the flash animation I clicked file export then export movie so I could then
save it as a gif file in my folder. The message comes up about the dimensions and I
clicked ok after checking the dimensions.

FINISHED FLASH ANIMATION

IMPORTING IMAGES-MAKING A FLASH ANIMATION
To use an image for a
background I selected
import image then choose
an image from my file.

Time Lapse videos I
created

OVERALL HOW DO MOVING IMAGES ENHANCE AN
INTERACTIVE PRODUCT
By giving it a sense of dimension and realism, helping to grab the viewer’s
attention and engage them. It can make the overall appearance of the product a
lot more interesting to view and read. It can be informative, imparting
information in a way that is likely to resonate with the viewer.

ANIMATION ADVANTAGES
Definition: The technique of photographing successive drawings or positions of
puppets or models to create an illusion of movement when the film is shown as a
sequence.
How is it effective:
1. Animate things that change: the medium is dynamic, and best suited for
showing dynamic processes.
2. Visualizing the unseen: chemical reactions, body systems, celestial motion –
interacting with the things humans cannot typically interact with.
3. The production cost of animation videos if compared to the cost of shooting
for the real videos are quite lower.
4. Animation is quite effective in packaging and branding of any product. It can
even helps to repackage and rebrand a product which is quite an old and
currently going low in the market.

ANIMATION DISADVANTAGES
1. It takes a lot of time and effort to create even a simple animation.
2. Requires skills in software such as flash.
3. Too much animation on a page can be distracting and annoying.e.g. Ads
4. Too much animation on one game or page can cause lagging or crashing.
5. Can take up alot of bandwidth so it can take a long time to work if the
internet connection is slow.
6. Needs a correct add in to view the file format.

MOTION GRAPHICS ADVANTAGES
Motion graphics are pieces of digital footage or animation which create the
illusion of motion or rotation, and are usually combined with audio for use in
multimedia projects.
How is it effective:
1. Motion graphics works way far better in attracting the attention of the
viewers than static pictures or graphics.
2. Motion graphics which are used in animations with the help of a number of
sketches and latest and updated software are capable of catching every
minute details of each character and the surroundings which a real video or
cameras cannot always able to catch.
3. Motion graphics can create different characters which can be incorporated
into animation videos or movies depending on the type and the age group of
the audience they are catering to.

MOTION GRAPHICS DISADVANTAGES
1. Software such as renderman is expensive
2. The software takes up alot of space for storage on your computer.
3. It is very time consuming to make a motion graphic and it requires skills and
knowledge of using software such as after effects.
4. Detailed and intricate objects are very hard to make it is best for simple
shapes,patterns and silhouettes.

2D ANIMATION ADVANTAGES
Low production cost — It is cheaper when compared to 3D animation.
Quick and saves time — The production lead time for 2D animation is low and it is
quicker to produce.
Simple and less complex– 2D involves less technology and software and hence it is
easier to produce when compared to 3D.
Basic controls — It is easy to handle without any tutorials.
More focus on gameplay- It gives less importance to design and focuses more on
the game play.

2D ANIMATION DISADVANTAGES
It can be boring — Traditional animation can sometimes seem to be boring.
Less demand — with the introduction of 3D animation most people prefer to watch
3D animation movies as compared 2D.
Economic reasons — In certain cases 3D animation can be created with less money
and time due to advanced technology.
Time is money — It is time consuming to create cell-based animation templates
which can never be reused and hence many studios are giving up 2D.

3D ANIMATION ADVANTAGES
Motion communicates — 3D animation has a superior ability to portray movement.
Visual appeal — 3D animation is much more realistic.
Time is money — 3D models made for a particular project can be reused for future
projects which help to lower the cost of production.
Good quality — 3D gives high quality and more gameplay compared to 2D.
In demand — Most of the people now prefer 3D rather than 2D.

3D ANIMATION DISADVANTAGES
Limited imagination- 3D is limited to what the machine can do unlike 2D.
Lack of simplicity — Most of the animated movies have been made in 2D animation
due to its simplicity.
Profit & loss — In few cases the whole lot of effort, time & resources spent on a 3D
project may not be as expected.

EFFECT OF MOVING IMAGES USED ON WEBSITES
•Animation helps in attracting and delighting the visitor to your website. This good
first impression lasts for years.
•Search engines like Google and Bing have started giving preferences to flash based
websites as a result of which such websites have a constant presence on search
results of most search engines.
•Animation in any website sets it apart from the crowd.
•Flash based web design can also help you to implement 3D animation on your web
page.

How do moving images enhance
an interactive product?

What is Web interactivity?
For example a website which allows the user to experience moving images and
animations on the website,usually moving images are in a GIF file format.
What is an interactive product?
Products on digital computer-based systems which respond to the user's
actions by presenting content such as text, moving image, animation,
video, audio, and video games.

Examples of moving images

Websites which use moving images:
BBC Future: Journey to the Centre of the
Earth
Uses dynamic backgrounds and a moving
interactive panel so the user feels
like they are in space and this
attracts their attention if the whole
screen is moving.
Time: A Year In Space
Scenery changes as you scroll lower and
moving machines and vehicles.This makes it
seem like reality and the user can el in
control of the website.This is very
entertaining for the target audience.

More websites which use moving images.
Blue acorn uses simplicity and
motion,the animation takes place in the
centre of the page. With a few clicks
you can see your own city come to life
and be built right before your eyes.
Quechua uses moving textures and drawings that
appear to be drawn by hand when you click on
it.This is effective in the background of
photography and text.

Why do moving images make interactive products
better?
1. They are appealing to the users eye and are more exciting to look
at so it makes them want to use the product or website more than
others with no moving images.
2. They have small file sizes so you can use more of them without
affecting your website or product.
3. They can have transparent backgrounds which make them look
professional and uniform.
4. They can show emotions which a user/consumer will relate to so the
help promote your product/website.
5. Also videos will advertise a product better because the consumer
can see how it works and what it does.

Effect of moving images on an interactive kiosk
Moving images on an interactive kiosk can be used to advertise
products using a rolling gif or to order them. This enhances the
product as it creates an immersive,digital way to interact with their
surroundings and perform a task such as ordering food or buying
clothes without human interaction being necessary.

Effect of moving images in DVD’s
Moving images in a DVD can enhance the product by making the
DVD more user-friendly through a comprehensible, attractive
DVD menu or a title sequence.
It can also act as a movie trailer and display some clips from the
film which could excite the audience or as this will reflect the
atmosphere/environment of the movie and prepare the viewer for
this specific atmosphere.
However,DVD’s are not as popular as they are now considered
outdated as the internet is much more popular and very few
people still use DVDs,blu-rays are also more popular.

The use of animation in
interactive media products.

What is interactive media?
It is a method of communication in which the program’s outputs depend on the
user’s inputs in turn affect the program’s outputs.Interactive media engage
the user and interact with him/her in a way non-interactive media do
not.e.g.Websites and Video games are common types of interactive media.
Movies and TV shows are usually not considered as interactive media but that
do require an audience/participation so they could be considered as
interactive media.

What is animation?
Animation is the technique of photographing successive
drawings or positions of puppets or models to create an
illusion of movement when the film is shown as a sequence.

Advantages of using animation in
interactive media
1. Animation catches your eye and it is effective in selling a product of
interactive media such as a video game.
2. It is effective in education because some learners learn visually and
animated images will help them understand better.
3. In games it makes the game more like real life especially if it is a
simulation game where you become a character.
4. Helps with navigation in websites because sliding toolbars are easy to
navigate between pages.

Disadvantages of using Animation in
interactive media.
1. Can be very expensive to produce good quality animation.(Software to build
animations are available to download but are still expensive).
2. Good quality animation takes lots of time,effort and expertise,especially
when making a detailed video game.It often requires certain software and
equipment also.
3. If an animated object moves too fast it can cause nausea and headaches or
motion sickness(especially in virtual reality games).

Animation in video games.
In video games frames are used to simulate the effect of character moving in a certain
direction,all simulation and action games need this for movement of characters and
scenery in the background.The animation makes the game seem like reality to the user and
animation can also be used in virtual reality games ,for example if you have another
background character leading you(e.g.Halo).Many games like Call of Duty place movement
tracking equipment on real people to use their movements to animate over the people to
make characters move exactly like a real person.Also they can animate over real life
landscapes by using scanning technology to sculpt a realistic terrain.
-Assassins creed
Call of Duty Ghosts ^

Using Video clips in interactive
media.

ADVANTAGES OF USING VIDEO CLIPS IN INTERACTIVE
MEDIA.
1. You can use videos for many purposes in promoting your website because
they are easier to understand.For game,for example
● A promotional video that explains who you are and what you do
● A website tour that tells visitors what they can find on the website, and
where it is
● A virtual tour that lets web visitors see what your physical location is
like.
2. You can use it to demonstrate how a product works by showing videos of what
customers thought and tutorials on how to use your product.
3. Videos are eye catching and they make a website stand out from
competitors,making your website the better product.Overall videos make the
customer engage and interact with the product or website more effectively.

DISADVANTAGES OF USING VIDEO CLIPS IN INTERACTIVE
MEDIA.
1. Can be long and a waste of time ,for example long video tutorials every
time you want to start the same video game.
2. Unnecessary or poor quality video clips can distract or give the wrong
message about the product.
3. Using an already made video in your website can be the easy option and if
the video says/knows more than you do,it can make your company seem
unprofessional.

WEBSITES THAT USE VIDEO CLIPS.
Google Presents;The Hidden World Of National Parks.
This website uses extremely effective use of an intro
video and virtual video tours of different national
parks where you can navigate between different areas
and a video recorded voice tells you all the
information about the certain location.This is a great
way to involve the target audience in their website.
GeoOrbital.
This website uses video blogs to show the
user’s experience with their product and to
show tutorials of how it works so the
customer will understand how to use it
easily.

MORE WEBSITES THAT USE VIDEO CLIPS.
U.S Air Force: hia website engages the user in the
thrill of being in the air force by including video
backgrounds to make the user interact more with the
site and therefore they will be attracted to the
screen so they will want to join.
Plant Your Flag:
This website uses not only video backgrounds
but also inspiring videos about how people can
journey to amazing places and plant their flag
to raise awareness about global issues.

EXAMPLES OF VIDEO CLIPS
https://www.youtube.com/watch?v=5fpggknHC2c
https://www.youtube.com/watch?v=AFnfxzrqqXA
https://www.youtube.com/watch?v=OVoXDk8ps10
https://www.youtube.com/watch?v=5_2UhXJHz7Q

My features on my website