tutorial: pixel art template setup/ exporting as png

1. run photoshop (i'm using adobe ps cc 2014)
2. file > new . . .
3. document type: custom; size: blank; width: 800 pixels; length: 600 pixels; res: 72 px/in(apparently ideal for pixel art/ web use); RGB (also default); background: transparent; > OK
(rule I currently follow for pixelart: use 1/10th of the final file's dimension; if f.eks. the output file will be 100 x 100pixels, create a document of 10 x 10 pixels)  (for this specific file I'm creating 100x100 for my file which will be 1000 x 1000)~ 
4. zoom in ('Ctrl' + '+') .
5. view > show > show pixel grid (this option sometimes doesn't show up for me but ok; also you'll have to zoom in very close to see this grid~ I prefer disabling pixel grid most of the time but its a good option to have!~) 
6. duplicate layer
7. select > pencil tool
8. pencil tool: 1 px; opacity:100; mode: normal.
9. to open a reference image. . .
    file > open . . .
    select tool > style: fixed ratio
    click and drag select your ref image
    edit > copy
    select your pixel art template
    edit > paste
 
10. draw pixel art on fresh layer ( I use the ref art as a guide about 30% of the time, mostly for proportions and finding more realistic characteristics & anatomy of whatever your subject is).

11. my pre-steps to export file . . . (enjoy my very extra steps to export a jpg lol)
       hide reference layer
       select > all ('Ctrl' + 'a')
       edit > copy merged
       file > new > OK   (will have presets tailored to whats on ur clipboard)       file > paste
     
12. file > save for web . . .
      percent: 1000; quality: nearest neighbor; >  Done






adapted from flow graphics' text art tutorial (link) ~


. . . to animate

follow steps 1~ 8

9. draw each frame of animatio, on its dedicated layer   (next time I animate I'm going to draw each frame by hand, scan and use as ref in ps.. note 2 self) ~~ (this step needs more visual explanation, maybe I'll make a video?) ~~

    I like to keep all my elements in seperate layers on my 'master file' then set up my scenes one by one. I then select all > copy merged > new file > paste. I create these frames, then compile a new file where I stack my frames in layers. 


10. 'Create Frame Animation' in timeline
11. creating frames in timeline. . .
     

Kommentarer