1 / 58

Graphics and Still Images

Graphics and Still Images. John H. Krantz Hanover College. Outline. Background Images File Types Acquiring Using ImageJ Basics Advanced. The General Beast. Screen Mosaic Triad Arrangement. Interlaced Projection. The Electron Beam. Seeing the Flicker. Graphics vs. Images.

marvel
Download Presentation

Graphics and Still Images

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Graphics and Still Images John H. Krantz Hanover College

  2. Outline • Background • Images • File Types • Acquiring • Using ImageJ • Basics • Advanced

  3. The General Beast

  4. Screen Mosaic Triad Arrangement

  5. Interlaced Projection

  6. The Electron Beam

  7. Seeing the Flicker

  8. Graphics vs. Images • Some definitions: mine for clarity here: • Graphics Def: computer generated or drawn by you. • Image: scanned, captured, take photograph or an graphic file not generated by you. • Difference: • In a graphic, you can directly manipulate the elements because you drew them – Sprites • In an image, you can manipulate pixels but not directly the elements. This has a great impact.

  9. Images or Graphics on the Screen • Pixels: smallest picture element • Pixels are not screen dots!!! • Several dots (at least three, one of each color) make up each pixel) • Bitmat: An array of information that contains the information for the image. • It is a 3 dimensional array • Width x Height x 24 (8 for each color) • So can be huge • (.bmp and .tif or .tiff are most common bitmaps)

  10. Graphic and Image Formats • Bitmap (bmp, PCT, Tiff) – big, not good for web • Graphic Interchange Format (Gif) can animate • 8 bits of color – palette or lookup table or LUT – no loss of spatial information • Can be some legal issues – make sure the generator legally can generate GIF’s • Generally best compression for simple graphics – bad for photos • Can generate transparent regions • Can Animate

  11. Graphics and Image Formats • JPG • Generally better for images and photos • Spatial not color compression, can distort image spatially and more loss with each save • Now can animate as well.

  12. Example JPG

  13. BMP vs JPEG File Sizes Both images are the same relative size. .BMP900kb .JPEG High Quality ~700kb

  14. ImageJ • Free at: http://rsb.info.nih.gov/ij/index.html • Overview • Java program • Interface a bit awkward because it is free • Expandable via plug-ins • Covers all basic editing and many advanced - very advanced • Scientific quality image editor • Used in many technical applications

  15. Basic ImageJ Interface • Menus and Tool bars • FileOpen, Save, Save As, Revert • EditCut, Copy, Paste, Selection, Options • Image Basic Image Editing • Process More Advanced Image Editing Options • Shapes are for selection or drawing. The “A” is for adding text.

  16. File/Open

  17. File/New

  18. Drawing with ImageJ • Very simple but easy • Access to pixels • No anti-aliasing in most drawing modes • Downside: jaggies • Upside: in complete control of graphics • Can store and edit in lots of formats

  19. Aliasing • Technical definition: • When an image contains frequencies beyond the range of the sampling matrix, the wrap-around and occur as lower frequencies, distorting the image

  20. Aliasing • Description of aliasing • Generally try to draw and image that has too fine of detail or sharp edges • Causes “jaggies” • And pixel artifacts • That is you can notice the pixels

  21. Aliasing and Pixel Effects

  22. Try some • When open in ImageJ, all images are bitmaps, but can be edited in different types • Basic Graphics Objects • Adding Text • Saving in Different Format • File/Save As

  23. Putting a Graphic in a Webpage • <p align="center"><img border="0" src=“imagename.gif" width="170" height="238“ alt = “ATI Image”></p>

  24. Acquiring • Scanning • Flatbed gives best quality. • Use 35 MM film for pictures – best resolution • Scan at a high level and sample down later • Any model seems good this day.

  25. Scanned Image

  26. Digital Cameras • No loss in Scanning • CCD • 3.1 Megapixel at least if need photo quality and larger • there are 5 megapixel • Can use lower image if only need web • But do not sacrifice image quality • Easy to download • Can be good in low light

  27. Low Light Digital Image

  28. Taking Photos Digitally • Focusing: Automatic and Manual • Regular focus • Macro – allows focusing up close • Spot Focus: focus is determined by point • Shutter Speed • Zoom: • Do not use digital zoom – if need more zoom, do it on computer later • On my default is off except for movies

  29. Taking Pictures (cont.) • White Balance, controls for our color constancy • Effect of the Illuminant • Flash: • often I keep it off. • Image Size: • I keep at standard (full pixel density, some JPG compression). Balance between image quality and ability to store on disk ~ 1 Meg/picture

  30. Use of Flash Flash No Flash Watch for reflections. Can get inexpensive table camera tripods.

  31. Basic Editing in ImageJ • Edit a bitmap • Most Important Command: Revert • Under the File Menu • Takes back to last save – careful with saves. • Ctrl-z is undo but only one step. • Suggest do “save as” or make copy first so don’t destroy original • Resize for web: under Image: Scale or Image/Adjust: Size

  32. Basic Editing • Often starts with selecting a region • Most editing will then occur defined by the selection • Edit/Clear • Edit/Clear Outside • Image/Crop • Image/Adjust/Brightness and Contrast

  33. Edit/Clear

  34. Edit/Clear Outside

  35. Cropping or my Thumb got in the way – well not really

  36. Select Area Select square on Tool Box

  37. Cropped Image – What thumb?Under Image Menu: Crop

  38. Adjusting Rotating – Image Menu/ Rotate

  39. Brightness and ContrastImage/Adjust/Brightness and Contrast

  40. An Example • How symmetrical am I? • The original image

  41. Select the region • I used the rectangular region – easier • Centered on some feature in middle – find the x value (I used a gap in my teeth) • Then use Copy from the Edit menu or CTRL-c

  42. Flip and Paste Image/RotateFlip Horizontally Edit/Paste or CTRL-V

  43. Final Picture • After adjust location

  44. Paste Control • Copy • Blend

  45. Paste Control • Difference • Transparent

  46. Converting Images • Save as for Image Types – use GIF or JPG • Must add extension, it is not added automatically • Always use save as to save anything other than a TIFF • This is a full color uncompressed image

  47. Converting Images • Converting Color Depth or to Grayscale image • Under Image Menu/Type • 8-bit, 16-bit, 32-bit are grayscale • 8-bit RGB and RGB are color • It is not possible to arbitrarily convert images • but ImageJ gives table of possible conversions • e.g. can only convert JPG to and 8bit grayscale.

  48. Adding to Images • Setting Colors • Edit: Options: Foreground Color • Image: Colors • Adding Text • Set font in • Edit: Options: Font • Draws in selected color

  49. Adding to Images • Drawing a basic graphics object • Draw width: • Edit: Options: Line Width • Select shape • Put shape on image • Edit: Draw or ctrl-D • Filled regions • Same as above, but: • line width not important • Use Edit: Fill or ctrl-F

  50. Filtering Images • Under the Process menu • Sharpen: more edges • Smooth: dull details

More Related