GIMP for digitalization of sketches

GIMP is a very powerful graphics software. I use it for 95% of my graphics work. In this article i will show how to digitalize a sketch. I discovered this method when i wanted a digital pen to work. So decided to use raw sketches since they are natural and powerful way of sketching what we have in our mind. Also i always prefer doing natural way to work, being away from screen whenever possible. I am also in favor of saving power so try to utilize methods which are not dependent on electricity.

Things and skills needed:

• My setup is: ArtistX Linux (modified Ubuntu). Acer e-cmachin EMD-644 AMD APU
  powered laptop. It has less than 25 watts of power consumption.
• GIMP 2.8 or above if available. 2.6 will also work.
• Basics of GIMP.

Below are the methods in steps.

• Take a picture of your sketch using good camera as clean as possible with big contrast ratio (means dark and bright should have higher difference).
• To get good contrast use plain white paper and black ink.
• To get regular, uniform surface try putting a glass panel over the paper. Make sure that reflection does not disturb the shot Or simply use a scanner if you have one.

Now the digitization process. To let this process success even in worse cases i am using low quality sketch in resource constraint state of work. This image is bit blurred and has thick pen. Still we will achieve our goal.

Start GIMP and load your sketch. Make a copy of original layer, set original invisible and locked. Work on copy.

Method #1:

1. Click: Colors => Threshold => Move the slider to choose the best output you need.
2. Try to remove noise/unwanted colors by using other options like Brightness-Contrast, Levels, Curves, Desaturate. Then try step 1 again.

Method #2:

• Click Filters => Artistic => Photocopy.
• Play with mask radius to get how much sketch ink you want in output.
• Keep sharpness higher but its not a rule in every case.
• Keep % black and % white higher to almost 100%. i.e. 1.0

Extra Methods for enhancement of output. Apply before using Methods 1 & 2:

• Color => Auto => White balance, normalize, Stretch contrast, HSV.
• Color => Color to Alpha => Select the color of paper. Find color of paper using color picker.
• Filters => Enhancement => Unsharp Mask. Play with radius and little bit of other options.
• For some cases: Filters => Blur => Pixelize and unsharp mask (above) can be used in respective order to get nice results.

We should only rely on Extra methods to enhance the sketch to get best results from Methods 1 & 2. Below is the output of using above techniques.

I hope this helps in your sketch work. If it helped please say thanks to GIMP first :), its opensource and needs lots of support and funds. Least we can do is to make it grow!.

Download this tutorial in PDF format for offline use and printing:GIMP_for_digitalization_of_sketches.pdf.7z

Search TAGS:
How to convert sketch into digital image, convert paper into digital black and white format, sketch digitization, digitalization.

Making vector like smooth gradients in GIMP

I always wanted to know how graphics like angry birds, CutTheRope etc are made then i came to know about Inkscape, vector arts. But i want to master few software instead of learning 100s. So i wanted to achieve the same in GIMP.

Except shape editing i find GIMP robust for most of my needs, so i surrendered using Inkscape. I use Inkscape for making shapes mostly. Now GIMP does all my job :).

I have written a simple short tutorial to do smooth gradients often found in vector graphics. This tutorial will give you some simple but powerful tips how to choose colors and opacity to play with smooth color gradients.


Below is the download link of the tutorial in PDF format for offline use:
GIMP_smooth_vector_like_gradients.pdf.7z

Or online version below:

Requirements:

1. GIMP 2.8 is recommended, otherwise 2.6 if 2.8 is not available.
2. Some basic knowledge of PC and graphics terms like alpha, hue, saturation etc
3. Basic usage of GIMP or other app with layers.

The only tools and settings we will use most:

1. Airbrush tool, opacity & size of brush.
2. HSV instead of RGB colors,

Steps:

1. Create new project 640x480 or above resolution with transparent background.
2. Fill background with dark green color. [ HSV = 124, 99, 63 ]
3. Select Airbrush tool with size = 20, opacity = 100, same above green foreground color.
4. Select brush blurred circle, size = 51x51, Hardness 075.
5. Create new layer and click it to make active work layer.

Things to note:

We have the same green color which will not produce any effect on the background color then why we picked it?

Because we want to use HSV which allows us great color match & closer difference in surrounding colors using Saturation & Value (lightness).

Notations:

H = Hue, S = Saturation, V = Value (lightness), O= Opacity, Sz = Size,

Back to steps:

6. Now click the FG color box to change the color of our brush.
   
   
7. Look at the color formats available: H, S, V, R, G, B. We will always use HSV not RGB because altering RGB values changes colors undesired way.
8. Now we can move V slider to change darkness/lightness of a color and S slider to change the color strength. H values for choosing different colors.
9. We will select V = 40.
10. Now draw an irregular line (L1) in the blank layer. Now set V = 30.
11. Use “Fuzzy select tool” and select that irregular line. Click “Menu -> Select -> To Path”.
12. Go to path tab near layers tab (dockable layers dialog), enable it with eye button at left. Switch to Layers tab and select path tool.
13. Select the path and move it to above-right of the last selected irregular line. Use Move(alt) option in path tool to move path. Click selection from path. Hide path again.
14. Now fill this selection with the airbrush. V = 40, O = 50, Sz = 30. The Mouse pointer should be over the top-right border of the selection so that middle of the selection fills lighter green color. Unselect all to remove selection. Now the lines should look like a walking path (L2).

15. Now change Brush, V = 75, Sz = 50, O = 100. Draw below L1. Will give output like this -

 

16. Using this method we can make a smooth color gradient just like we get in vector art apps like inkscape. But GIMP gives us much more powerful control.
17. Below is final output of what i made while writing this tutorial using some objects i made separately. Viz -

 

The water like thing at bottom of image was just made using MODE of layer color combination not any pen or brush.

You can try it: Make new layer above your green layer, make figures or anything, from mode select saturation, value, dodge etc whichever looks cool to you.

All these gfx were made using the method i described above. You have to play with V, S, O, Sz and brushes, Use Opacity to get lighter color instead of changing V every time.

There are lots of techniques to play with but one good trick of making quick graphics is to make bigger gfx using airbrush tool and downscale it then use pixel editing if desired.

Lets make a simple grass:

1. Create a new project 640x480 with transparent background.
2. Now create a grass like shape with closed boundaries so that we can fill it with green color.
3. Now select the grass shape with Fuzzy select tool and click Menu => Select => Save to channel (keep important selections saved into channels). Get back to the layers tab and create a new layer. Keep selection active!

NOTE:

Always try to keep outlines in separate layer to keep it unaltered and pick selections from them and work on new layers. It means select something in a layer using selection tools and create new layers and do editing on them. This is important so that any editing we do shouldn't spread outside of the boundaries ( the outline ) of our target object and our outlines remain available as it is.

4. Now fill this new layer with green color with your choice of SV values .
5. Now select Airbrush tool, choose a darker value and apply shade on left of the grass.
6. It is important that you shade color in gradient way, means left to right => dark to light. To achieve this try not to change V, just reduce opacity to draw less darker towards right.
7. The above shade means grass has some light source at right side. Without shading grass will be plain single color filled paint. Can you image what shade objects have at night/dark? Of course nothing but black, That is why keep smarter shading assuming all light sources including the color mixing due to nearby objects. Suppose a blue orb a left, then apply little blue reflective shading at left to produce more realistic output.

NOTE:

Lots of paintings fail due to bad shading, we should never apply anything without planning. While working always think this in such cases, why i am doing this? Even a single pixel can produce bad shade if added randomly.

8. Now select higher V, means lighter green and apply to right side of grass. Just as done above. Below are the snap of all steps done yet -

9. Now select white, but!, in HSV white means V=100, S=0. Apply some white shade randomly where we assume direct light reflection. Adjust opacity to keep white level as per requirements.
10. Remove the black outline and your grass is ready.

This result may or may not be up to your expectations. But the shading methods mentioned above will result in your desired one depending upon efforts made.

Impact of nearby objects:

Colors mix together, here Blue + Green = Cyan, therefore to let shading take practical color create new layer and apply shading with the object (blue here). The layout is blue shade layer above and the target object is below (grass here). Click blue shade layer and select MODE to “Addition”. This will add blue with the bottom layer i.e. green to automaticaly produce cyan.

TIP:Always reuse your work if possible. Using color, size variations of images.

- GIMP rocks :) -

GIMP TIP:
To master GIMP one has to become a player in Selection, selection modifications, path, and color selection. Above tutorial has a little demo of this all. Lots of things are there depending upon your needs. But instead of depending too much on filters try to make things yourself otherwise you probably will loose mastering art!

Using GIMP for learning and working with Pixel-Art

I have been using gimp for pixel-art and it works great with almost everything i needed for pixel-art. Even more than that!

I have written a tutorial how gimp can be used for pixel-art with some techniques to enhance pixel-art work.

Please download the tutorial in PDF format for offline use:

GIMP_for_pixel_art.pdf.7z


Or online version below:

Setup GIMP for pixelart work

1. Start GIMP ( v2.8 recommended )
2. Create new project 32x32 with background transparent.
3. Zoom-in till the working canvas gets screen-fit size.
4. Select pencil tool with black foreground color (default).
5. Choose any brush which doesn't has blur. Simply select the black circle without blur.
6. Now set brush size to 1 pixel in GIMP 2.8 OR minimum scale in GIMP 2.6.

Now the above steps have made a pixel art environment in GIMP.

Setup color palettes

1. Go to any of your favorite TAB ( layers tab at right is recommended ) and click [<| ] button which shows tooltip “configure this tab”. See following image:

2. Click -> Add Tab -> Palettes. Same way add FG/BG color

TIPS:

1. Always work in Greyscale using Greys (32) palette. Click this palette then switch to FG/BG Tab pane. You will get black to white color in order.
2. Why greyscale only? Its because realism doesn't reside in colors but number of colors. Doesn't a black & White image look real? It does. Therefore work in greyscale without caring colors just focus on shading and dithering then after completion give colors using fills or “select by color tool”.
3. Instead of selecting darker OR lighter color from color chooser just change the Opacity of the selected color. E.g. Use black color over lighter backgrounds with varying opacity to get desired black/grey color.
4. Another fast way of getting similar colors to image is to pick colors from the image itself using “color picker tool”.
5. To get dispersed pixel like spray set “Apply Jitter” checked with desired value.

How to get pixelart samples?

This can be done easily using GIMP. Following steps will let you get loads of pixelarts from images/wallpapers we have.

1. Import/Open any camera picture in GIMP.
2. Resize to acceptable size so that image becomes pixelated but clearly recognisable.
3. Now click in menu Image => Mode => Indexed => Generate Optimum palette with maximum 256 colors.
4. This will reduce total colors used by the image. This can make image low-colored but this is exactly what we wanted. Because most of pixelart is done with 256 colors only.
5. Now look at the parts of image how the pixels are organised :)

NOTE:

Indexed image will not offer flexible alpha values, only visible OR invisible pixel are there. To edit indexed image convert it back into RGB format.

Few pixarts i made in GIMP :

pstops tutorial (psutils)

I have recently started to port my game engine GGE to HTML5. So i downloaded javascript & HTML5 tutorials (PDFs) from http://www.tutorialspoint.com/.


But now a days i only keep pocket references for technologies i use instead of heavy books. So i wanted to make a pocket version of those PDFs. I found "pstops" after google'ing, in just an hour i was irritated by the mangled parameters it needed and badly documented manpages & stuffs on internet.


But these two pages made my concept clear and i achieved my task in few minutes.


[REF1] Read this first:
http://wiki.scribus.net/canvas/How_to_make_impositions_with_pstops

[REF2] Then ( this will make you clear about what exactly pstops does):
http://code.google.com/p/uwisdom/wiki/Pstops

My own description ( i assume you have read REF1):
pstops => postscript to postscript converter with desired arrangements, page layouts and sizes.

I will describe this powerful utility by small implementation because that in run accomplishes many people's job.

For experiments please get a ps file of atleast 16 pages. You can convert a PDF into ps by using pdftops utility (its a part of psutils). I am using 23 page file. Lets do some ps conversions.


1. Flip all the pages vertically Or horizontally
vertically:
pstops '1:0V' in.ps out.ps 



Horizontally:
pstops '1:0H' in.ps out.ps 



Description:
As you can see the parameters of pstops are:

pstops  [ -q ] [ -b ] [ -wwidth ] [ -hheight ] [ -ppaper ] [ -dlwidth ] pagespecs [ infile [ outfile ] ]


Most of us have difficulty in pagespecs parameter only. Which is described below:

pagespecs   = [modulo:]specs
specs          = spec[+specs][,specs]
spec            = [-]pageno[L][R][U][H][V][@scale][(xoff,yoff)]

In our flip example, we used '1:0H', What are these hex like codes? lets dissect -

1 => it tells that we want  to print 1 page of "in.ps" in 1 page of out.ps (A4 by default).

If we want to print 4 pages in 1 A4 page we have to use '4:0', for 8 we use '8:0'

:0  

: sign is followed by SPECS. But we have nothing after 0. It simply means that we want to use original unchanged source pages in output file. With -0 end becomes start and start becomes end page. i.e. page numbers get inverted.

2. Lets print two pages in one side, i.e. total 4 in 1 output page. Portrait mode 

pstops '4:0' in.ps out.ps

output => [1] [2] [3] [4] [5] [6] Wrote 6 pages, 1250990 bytes

We get 6 pages in output. But, upon seeing out.ps why we get only 6 pages printed from source instead of all pages? The answer is simple: Did we specified how and where the pages had to be printed? we told to print 0 only i.e. 1st page ( 0 index => 0+1 page number ) of every block.

You don't know what block is? Please refer to REF1 above. In brief i also write here:

Blocks = total pages in input file / total pages we want in our 1 page of output file

1 block simply means number of input pages we want to be printed in 1 output page, above we told to print only 0th index Or 1st page of every block. That is why only 1st pages were printed.

Below is the proper command to print all pages.

pstops '4:0@0.5(0.0w,0.5h)+2@0.5(0.0w,0.0h),1@0.5(0.0w,0.5h)+3@0.5(0.0w,0.0h)' in.ps out.ps

It will output 2 portrait pages per side. Lets understand all the parameters:

4: => 4 input pages / 1 output page

0@0.5(0.0w,0.5h) 

0 => 0th index of block i.e. 1st page

(0.0w,0.5h) => move right by 0% of page width. 50% of height. AFAIK the w,h are of source page.

@0.5 => scale to become 50% of original size.

+2@0.5(0.0w,0.0h)

+ => continuing page on 1st side.

2 => 2nd index of block i.e. 3rd page

(0.0w,0.0h) => no movement, just remain at output's Origin i.e. left-bottom. Just like Cartesian coordinates.

@0.5 => scale to become 50% of original size.

NOTE:

1. x,y are offsets, this is what i have understood, they are not exact render start points. Therefore you should have noticed to draw from top we just have to go 0.5h ( half of output page height instead of full height). 

2. I have not used rotations. You should keep in mind that after rotation the origin of that rotated page still remains at its own left-bottom. So the whole output will change after using rotations. Try it:

pstops '4:0L@0.5(0.0w,0.5h)+2L@0.5(0.0w,0.0h),1L@0.5(0.0w,0.5h)+3L@0.5(0.0w,0.0h)' in.ps out.ps

It outputs blank pages! You know why?

Because when we rotated left (imagine you are holding the paper at left-bottom and rotated it left. Then it goes outside of the output page boundaries. For that you have to translate all pages by full width.

so try this now:

pstops '4:0L@0.5(0.75w,0.5h)+2L@0.5(0.75w,0.0h),1L@0.5(0.75w,0.5h)+3L@0.5(0.75w,0.0h)' in.ps out.ps

in parameters we have described that 1st side of output page will follow this specification:

pages: 1, 3

0L@0.5(0.75w,0.5h)+2L@0.5(0.75w,0.0h)

and the second back side will follow this: ( separated by comma )

pages: 2, 4

1L@0.5(0.75w,0.5h)+3L@0.5(0.75w,0.0h)

Then all the coming blocks will follow these specifications.

For more details below is a simple illustration: please neglect the quality, i made it quickly to illustrate rather than writing 100 lines. :-)

I hope this tutorial will help you to understand how to utilize the power of pstops without Hit n Trials method :-p. Please let me know if you find some bugs or wrong info (if really it is).


Search TAGs:
linux 4-up, make 8 page booklet, linux pstops tutorial, pstops concept, how pstops works, make mini booklets, 8 page booklets 

How to get rid of slow android emulator during app development?

We know that Android emulator starts even slower than the PC itself. But a simple solution to get rid of slower booting of droid emulator is -

Solution when emulator is running -

Do not close the emulator until you are done with all build testings :-)

Simply run your android project and never close the emulator window until you are done with your work for the time, i am working with Eclipse and retest app builds as fast as we do with J2ME. All work the IDE has to do is upload/update the apk instead of relaunching of the emulator window again and again.


Solution #2 - Use Android-x86 in VirtualBox (or VMWare etc).

I don't want to write same thing which someone has already done. Please read the process in this page how to setup android in VirtualBox and use it for development.

http://www.andreybutov.com/2011/10/14/how-to-set-up-a-faster-android-emulator/


Now, most probably you will encounter "where is Host-Only adapter" option?
For that, Go to
File -> Preferences -> Network -> Add new Host-Only Network -> vboxnet0

Now upon selecting host-only network will show vboxnet0 instead of "no item selected".


Happy Droidevelopment :-)

Convert your text files into images

Open your text files with IrfanView and save as image.

I always use IrfanView and GIMP for all my photo works. If you haven't tried them then please give one. ;-)

Output audio through serial port. Serial Port Player v0.1

Serial port player – serialplayer

This software lets us play audio through serial port.

Hardware requirement: (below values are for USB-to-serial chip)

• 
  
  female com port connector
• 
  
  resistors - 1k
• 
  
  capacitors 4.4 uF

For laptop, i used this hardware:-

• 
  
  USB serial converter. I am using Nokia 6600 pc data cable. Which is nothing but a prolific PL2303 usb-to-serial chip with cable utilizing only its TX, RX and GND pins.

Software requirement:

• 
  
  A Linux distro with gcc (GNU's compiler collection) for source compilation.
• 
  
  serialportplayer – binary OR source code.

[Illustration of project]

Raw audio data => serialportplayer => serial port => low pass filter => speaker(s).

Processing:

The software collects raw audio data and processes it according to serial port data transfer speed. The processed data is then output through serial port's TX pin. The processing includes oversampling and modulation (sigma-delta is recommended but current version of program doesn't uses it purely).

Raw data:

The data is raw audio. This raw audio data is extracted from audio files using audacity software as -

• 
  
  Run audacity
• 
  
  Open any audio file
• 
  
  Export that file into raw format.
• 
  
  the raw format must be :- unsigned 8 bit / sample, mono(1channel).

Please note down the samplerate of the original audio file and use it during serial play.

Using serialportplayer:

• 
  
  start your shell – e.g. Konsole, xterm
• 
  
  execute su command and give root's password.
• 
  
  Run serial port player as:- ./tplay OR ./serialportplayer
• 
  
  e.g. ./tplay humdum.raw 16000

if your system can't run the binary you can compile it from source:

cc –o serialplayer serialplayer.c

The following where the sources using which i accomplished the project:

• 
  
  Linux serial port how to (tldp.org) the Linux documentation project.
• 
  
  ttyplay: Project made before mine. It helped me a lot.
  http://vivara.net/software/ttyplay/
  http://hackaday.com/2005/10/25/audio-output-from-a-serial-port/

Any interested person must read about 1 bit audio and sigma-delta modulation.

Please connect 1k resistor to TX pin and capacitor in parallel to TX and GND pins. These values are for USB-to-Serial adapter. Use appropriate values for normal serial port at back of desktop pcs.

Download link: This link has tplay source and binary of ttyUSB, it uses USB-to-Serial device as serial port.

Download :serialportplayer.rar
Password: serialportplayer_homelabs

I recovered my quickly erased CDRW.

Happened in 2006 August.
I had a CDRW which was the only source for my all projects as my hdd was crashed. I tried to find many software on net, found forensic sites but they were charging much money. Being a student, i wasn't able to produce that amount then i decided to search for software based recovery.

I found Isobuster, that wasn't capable of quick erased CDRW's data recovery. But i found a good software - Back2Life. I tried to recover the cd, using "force RW mode".
Hah! it recovered the table but wasn't recovering data as it was a demo version and limited to 64KB file recovery. It must have burned some part on the CDRW. I was disappointed b/c i had very less time, only few days to go. Then my mind lightened an idea and i again used Isobuster, hey! it recovered my data and i successfully saved my all projects. I know it could also help many of you.

That's why we say: Problem occurred for one person but gave solution to many.
Tip: Use back2life version > 2.3 and then use Isobuster.
Now TestDisk is my favorite data recovery program, it now offers optical media recovery.

Rescue tip - copy locked files.

How to copy locked files in windows?
Disclaimer: This information is for rescue / educational purpose only! I can't be held responsible for any damage occurred due to it's use. BTW it has rescued many systems!
Recovery tools can be used to copy the locked files as they don't deal with the file handles, they have full access to the disk. I have successfully copied SAM from Windows which said to be an impossible task!

Articles, Documents

1. What are dll files? download
2. C questions - download
3. Everything about main() - download
4. What is static?