digital imaging tutorial

23
Joe Smith designer, developer Saturday, March 3, 12

Upload: joe-smith

Post on 22-May-2015

733 views

Category:

Self Improvement


0 download

DESCRIPTION

Got an image problem? Start with better digital images. There’s no better—or worse—way to convey your company’s message than with an image. It is your image. It is true that professionals must be involved creating your corporate identity or advertising campaigns, but you can take the task of preparing images to include in your interactive stuff. Joe Smith, art & code guy with Art Dude™ Creative, will guide us through the basics of pixels, resolutions and color. We will crack open some images, learn their structures, manipulate their attributes, observe their aesthetics, determine their thousand words (in every picture), optimize their algorithms (not as geeky as it sounds), and avoid internet image pitfalls. Time and interests allowing, we can delve into more advanced topics like masking, using text in an image, special effects, or color correction.

TRANSCRIPT

Page 1: Digital Imaging Tutorial

Joe Smithdesigner, developer

Saturday, March 3, 12

Page 2: Digital Imaging Tutorial

1px by 1px1 pixel24 bit colorRGB

Saturday, March 3, 12

Page 3: Digital Imaging Tutorial

2px by 2px4 pixels24 bit color

Saturday, March 3, 12

Page 4: Digital Imaging Tutorial

14px by 14px196 pixels24 bit color

Saturday, March 3, 12

Page 5: Digital Imaging Tutorial

40px by 40px1,600 pixels24 bit color

Saturday, March 3, 12

Page 6: Digital Imaging Tutorial

110px by 110px12,100 pixels24 bit color

Saturday, March 3, 12

Page 7: Digital Imaging Tutorial

230px by 230px52,900 pixels24 bit color

Saturday, March 3, 12

Page 8: Digital Imaging Tutorial

630px by 630px396,900 pixels24 bit color

Saturday, March 3, 12

Page 9: Digital Imaging Tutorial

2,636px by 3,923px10,341,028 pixels24 bit color

Saturday, March 3, 12

Page 10: Digital Imaging Tutorial

24 bit color

110px by 110px12,100 pixels

8 bit color1 bit color

Saturday, March 3, 12

Page 11: Digital Imaging Tutorial

1 Bit Colordigital color is binary

one’s and zeros 010101

21 = 2 colors

8 Bit Color28 = 256 colors

24 Bit Color224 = 16,777,216

Saturday, March 3, 12

Page 12: Digital Imaging Tutorial

1 bit color2 colorsblack and white

Saturday, March 3, 12

Page 13: Digital Imaging Tutorial

RGBRed (256 variants)

256x 256x 256

16,777,216

Blue (256 variants)Green (256 variants)

Saturday, March 3, 12

Page 14: Digital Imaging Tutorial

CyanMagentaYellowBlack

Saturday, March 3, 12

Page 15: Digital Imaging Tutorial

Printing on paper with a limited number of colors

Saturday, March 3, 12

Page 16: Digital Imaging Tutorial

Digital Prints are confined to Dots Per InchDPI

Saturday, March 3, 12

Page 17: Digital Imaging Tutorial

DPILPIPPI

Saturday, March 3, 12

Page 18: Digital Imaging Tutorial

630px by 630px396,900 pixels24 bit color

Saturday, March 3, 12

Page 19: Digital Imaging Tutorial

Macbook Pro 15 inch (diagonal) 13 inches wide 1440 pixels wide ~110 ppi

Saturday, March 3, 12

Page 20: Digital Imaging Tutorial

iPad 2 1024 by 768 132 ppi

Saturday, March 3, 12

Page 21: Digital Imaging Tutorial

iPhone 3gs480 by 320163 ppi

Saturday, March 3, 12

Page 22: Digital Imaging Tutorial

iPhone 4gs 960 by 640326 ppi

Saturday, March 3, 12

Page 23: Digital Imaging Tutorial

Adobe Photoshopfor resampling images

Target Size800 by 800 pixels

@72 ppi

Saturday, March 3, 12