Changes

Jump to: navigation, search

BTC640/Images

1,948 bytes added, 13:33, 1 July 2013
Converting Between Types
= Lecture =
Textbook chapterchapters: 3, 13
Images are one of the first multimedia element used on webpages when the web was taking off. But despite the apparent simplicity there is plenty of technical details to learn about them. It's not as simple as "there is an image" vs "there is no image". We will look at various factors that affect the use of images on the web, and various capabilities of image formats.
=== Number of Colours ===
The size of the image can be reduced by reducing the number of bytes required per pixel. A PC can effectively display up to 4 3 bytes per pixel, split as follows:
* 1 byte for red
* 1 byte for green
| PNG || Loss of transparency flag || Lossless || Lossless || Loss of colour and transparency
|-
| JPEG || Lossless || Lossless - GIF stores less colour, may lose some|| Lossless || Lossless
|}
Converting from JPEG to one of the other formats is lossless, but re-encoding it as a JPEG is lossy, so converting it back to JPEG will result in a different image than the original.
 
=== Bitmap to/from Vector ===
 
Converting a bitmap image to a vector is impossible or at least very difficult. You can have a look at this website for some information about [http://www.computerlifesavers.com/netsnippets/Art%20and%20Design/Auto-Tracing%20How%20To%20Convert.htm autotracing and other bitmap/vector facts].
== Scanning and OCR ==
Text in a raster image is not the same as the same text in a text file. To convert rasterised text to computer text OCR is needed. The quality of current systems isn't that great.
 
== Photography ==
 
I will talk in class a little about the basics of photography, including:
 
* http://en.wikipedia.org/wiki/Shutter_%28photography%29
* http://en.wikipedia.org/wiki/Exposure_%28photography%29
* http://en.wikipedia.org/wiki/Shutter_speed
* http://en.wikipedia.org/wiki/Aperture
* http://en.wikipedia.org/wiki/Depth_of_field
== Degree Students ==
The point of using layers is that you can combine them into one image but still make changes to the individual components. This is a very powerful tool mostly used by graphics experts but it's useful even for some simple tasks.
Read the 5 page paper [[Media= Links = * http:lossless_re-enconfig_of_jpeg_images//en.wikipedia.org/wiki/Comparison_of_vector_graphics_editors* http://en.wikipedia.pdf|Lossless Re-encoding of org/wiki/JPEG Images Using Block-adaptive Intra Prediction (Matsuda et al, 2008)]]* http://en.wikipedia.org/wiki/Gif* http://en. It's quite complicated but see how much useful information you can extract from it without spending a month learning the mathwikipedia.org/wiki/Portable_Network_Graphics* http://superuser.com/questions/53600/jpeg-vs-png-vs-bmp-vs-gif
= Lab =
You will need to use Matrix or your own Linux for this This is a marked lab. Please submit it using Moodle (Lab3).
== Gimp ==
* The Gimp on the lab machines isn't fully installed so it may take a very long time to start up the first time. * Find a JPEG photo online, with width:height ration ratio of 4:3. The contents don't matter - mountains, trees, flowers, sky, whatever. For exmaple something from http://amdwallpapers.webspaceforme.net/gallery/ Save the image as step1.jpgDon't use the same image as another student.
* Open the image with Gimp. Notice that most likely you're seeing a scaled down version, the zoom level is displayed at the bottom of the window.
* Resize the image to 900x720960x720, save the result as step2.jpg
* Crop the step2.jpg so that you end up with a square 720x720. Do not scale the image, the proportions of the content should stay the same. Note: gimp has a menu option to do this. Save the result as step3.jpg
* Save step4.jpg as step4.bmp. Note how much bigger the bitmap is.
 
* Save your JPEG in PNG format. Change the number of colours your image has, and save copies of it also in PNG format. For example change it to greyscale and save as another file, change it to indexed colours (palette) with a different number of colours and save as another file. Compare the sizes (in bytes) of the different files. There should be a non-trivial difference. If you have time left - save all these PNG files in JPEG format, and observe whether the numbers of colours make as big an impact on the size of a JPEG as they do on the size of a PNG.
== Dia ==
 
* Download and install [http://projects.gnome.org/dia/downld.html Dia].
* Draw your family tree (it doesn't have to be real, just different from other students) in Dia using shapes (perhaps boxes), arrows from children to parents, and lines without arrows between spouses. Change the colours for males to be blue (boxes and lines) and red for females.
== Convert ==
 
You'll have to use Linux for this part. Unfortunately there's no graphical linux in our lab (mac/windows only machines) so you'll have to either ssh to matrix or use a machine in a different lab.
Convert is a commandline utility that can be used for format conversion as well as some other manipulations.
<pre>for FILE in `ls *jpg`; do convert $FILE `basename $FILE jpg`gif; done</pre>
* Depending on the complexity of your original image the gif versions may look exactly the same or the quality may be degraded, even though the size of the gif versions is probably larger than the size of the original jpg.
* Write a command to separate the colours from the original into different images (man convert should help)
 
== Submission ==
 
After doing all the steps above submit the following files to Moodle (Lab3) in a zip archive: step1.jpg, step2.jpg, step3.jpg, step4.jpg, family.dia, family.png, and one of the grayscale images generated by the last step.

Navigation menu