The document discusses web development topics like coding in the console and using IDEs. It then focuses on using Photoshop for web design, including topics like color profiles, reducing colors for web use, and tools for optimizing PNG files. Scripting in Photoshop is also covered, with an example of duplicating a layer using scripting. Speeding up the iOS graphic design workflow with a tool called DevRocket is also briefly mentioned.

1. a story of a little web developer

2. coding
console
IDE

7. froont.com

8. webflow.com

10. I THINK I AM SICK

12. PHOTOSHOP FOR WEB

13. PHOTOSHOP FOR WEB

14. PHOTOSHOP FOR WEB

15. PHOTOSHOP FOR WEB

16. PHOTOSHOP FOR WEB
IT IS ALL ABOUT SURROUNDING PIXELS

17. PHOTOSHOP FOR WEB
Web standard (W3C) - 16 777 216 colors

18. PHOTOSHOP FOR WEB

19. PHOTOSHOP FOR WEB
color reduction algorithm
dither algorithm
transparency dither algorithm
web snap - reduction of colors

20. PHOTOSHOP FOR WEB

21. PHOTOSHOP FOR WEB
v4 e-sRGB v4 YCC-RGB
v2 GBR v2 Adobe RGB

22. PHOTOSHOP FOR WEB
The system supports these ICC version 4
and version 2 profiles.
The system supports ICC version 2 profiles
only.
The system does not support these ICC
profiles.

23. PHOTOSHOP FOR WEB
Chrome - supports now ICC v2

24. PHOTOSHOP FOR WEB
Firefox - since 3 supports ICC v2

25. PHOTOSHOP FOR WEB
IE9 - supports ICC v2 and ICC v4

26. PHOTOSHOP FOR WEB
supports ICC v2 and ICC v4

27. PHOTOSHOP FOR WEB

28. PHOTOSHOP FOR WEB
Reduce number of colors in the panel
- use a tool:
OptiPNG (40,78 %)
PNGCrush (43,25 %)
PNGOptimizer (54,74 %)
PNGOUT (43,48 %)
PNGWolf (55,56 %)
TruePNG http://css-ig.net/png-tools-overview

29. PHOTOSHOP FOR WEB

30. PHOTOSHOP FOR WEB

35. console
breakpoints
callstack

36. #target photoshop
var activeDocument = app.activeDocument;
var layerToDuplicate = activeDocument.activeLayer;
var duplicatedLayer = layerToDuplicate.duplicate();

38. SCRIPT LISTENING PLUGIN

39. SCRIPT LISTENING PLUGIN

40. SCRIPT LISTENING PLUGIN
// =======================================================
var idMk = charIDToTypeID( "Mk " );
var desc1 = new ActionDescriptor();
var idNw = charIDToTypeID( "Nw " );
var desc2 = new ActionDescriptor();
var idMd = charIDToTypeID( "Md " );
var idRGBM = charIDToTypeID( "RGBM" );
desc2.putClass( idMd, idRGBM );
var idWdth = charIDToTypeID( "Wdth" );
var idRlt = charIDToTypeID( "#Rlt" );
desc2.putUnitDouble( idWdth, idRlt, 500.000000 );
var idHght = charIDToTypeID( "Hght" );
var idRlt = charIDToTypeID( "#Rlt" );
desc2.putUnitDouble( idHght, idRlt, 500.000000 );
var idRslt = charIDToTypeID( "Rslt" );
var idRsl = charIDToTypeID( "#Rsl" );
desc2.putUnitDouble( idRslt, idRsl, 72.000000 );
var idpixelScaleFactor = stringIDToTypeID( "pixelScaleFactor" );
desc2.putDouble( idpixelScaleFactor, 1.000000 );
var idFl = charIDToTypeID( "Fl " );

44. Speed up your entire iOS graphic design workflow with
DevRocket.

53. ADOBE CONFIGURATOR