Sticker Book

By Paul Kienzle and Tanya Riseman (stickers@seul.org).

Sticker Book is a program which lets you place images on a background scene. Every parent surely knows how much fun kids have with these. Indeed, they are a must for any long plane or car ride. Our program is even better than the paper version (assuming you have a laptop) since you can resize, recolour and reorient the stickers that you use, and since you never need run out of stickers. You can even paint with them!

The program is intended for the 3-7 year old crowd, but it got a little out of hand, and now its even fun for adults (well, for us anyway). It is flexible enough to make sophisticated pictures without being as complex as drawing/painting program. The features which make it great for the three year old are:

1. we confine the mouse pointer to the window so your toddler can't damage the system
2. we use large buttons so coordination is less critical
3. we use a big, ugly mouse pointer so that it is easy to find
4. we don't use any words so reading is not required
5. we provide keyboard controls so less coordination is required
6. we give lots of visual feedback
7. we allow lots of time for press/release so key repeat isn't a burden

Status

Bug fixes. New scenes.

See the ChangeLog for details.

Requirements

We compiled with the following:

• gtk 1.2.8
• imlib 1.9.8
• libc6 2.1.3
• gcc 2.95.2

That's not to say you need these particular versions of the library, but they work fine for me.

Download

Extra scenes may be available.

This HTML file is included in the distribution, so don't bother to download it separately.

See the INSTALL file for installation instructions.

Disclaimer

Report bugs, suggestions, or comments to stickers@seul.org. We would really like to know that someone else in the world is using it! Be sure to put STICKERS in the subject line so we know its not a spam.

Usage

The initial display shows you all the sticker scenes available. Click on the scene you want to edit. If there is a pair of scenes together, the first button shows an example of what can be created with the scene and the second button loads your latest copy of the scene with all the stickers in place and available for editting. Click the stop button or press to exit. Press the exclamation mark ! to load the configuration window. This allows you to change various settings for the program.

If your initial scene list shows the message

No scenes available. Please restart stickers using
$ cd stickers; ./stickers scenes
or type make install and run stickers directly.

After selecting a scene, you will see a canvas, some sticker controls down the left, some scene controls down the right and some stickers across the bottom. Pick a sticker, modify it with the sticker controls, move it onto the canvas and stick it there. Use the scene controls to unstick the most recent ("oops"), clear the scene ("sponge") or save and exit the scene ("stop"). After exiting the scene you will be back to the initial display with your newly editted scene displayed in the bottom half of the box.

The stickers across the bottom come in related sets. If you click on an unselected sticker, it will become the selected sticker and you can then paste it into your scene. If you then click on the selected sticker, it will change to the next sticker in the set. On the sticker controls (grow, shrink, rotate, mirror, hue, saturation, and colour), click and hold the mouse button for continuous change, or click and release quickly for a single step. The spin onset delay and rate are controlled from the config window. Hold down the shift key to reverse the direction of change, the control key for finer changes or the alt key to restore the original value.

These controls are available directly from the keyboard as well. This allows you to for example change the colour of a line on the keyboard as you are drawing with the mouse. Our son's favourite is to press the rotate and hue keys while we are driving car stickers around the screen with the arrow keys (and suitable sound effects of course!) Again, the Shift, Control and Alt modifiers work with the keyboard commands. Someday we will paste the the controlling letter on the top left surface of the control so that you don't have to memorize them, but for now see the table below. Click the boomerang or press the Home key to restore the original sticker.

The colour controls require some explanation. The brightness controls the degree of shading, from completely black to completely coloured. The saturation controls the amount of colour, from grayscale, through earth tones and into primary colours. The hue rotates the colours around the rainbow. Since many of our stickers are drawn in a single colour plus grayscale outline and shading, rotating the hue works beautifully. For the rainbow, it is just weird. For example, starting with the red car on the street scene, you can make a blue car by rotating the hue to blue, a white car by removing all the saturation, a gray car by removing all saturation and lowering the brightness or a brown car by rotating the hue to orange, reducing the saturation and reducing the brightness. We haven't figured out how to make a black car though.

Sticker control icons (on left hand side)

Icon	Key	function
	PgUp	increase size of sticker by 10%
	PgDn	decrease size of sticker by 10%
	r	rotate the current sticker
	m	make a mirror image
	h	change the "hue" (color)
	b	change the "brightness" (make it black/nonblack)
	s	change the "saturation" (make it white/nonwhite)
	Home	Go back to the current sticker's original size, color, etc.

Scene control icons (on right hand side)

Icon	Key	function
	Delete	remove last sticker
	End	remove all stickers
		toggle between paint and stamp mode
	esc	exit scene
	#	print scene (requires configuration)
	!	go to configure window

Mousey controls

Control modifiers

Saving and Printing

You can control the format of the saved image by setting saved image file name in the config window %s.xxx. The scene name will be substituted for %s. The extension determines the format of the image. If your imlib library is properly set up, it should handle the most common image formats. You can save a bit of hard disk space by eliminating the %s from the saved image file name (e.g., lastscene.png). This will force all scenes to save to the same file. Note that only the most recently editted image will be saved (even if it isn't actually modified!)

After you have a scene saved, you can use The Gimp or some such to print the scene. Hopefully it will do the appropriate anti-aliasing to make your image come out okay on paper. Using apsfilter, I can print images directly with the lp command. E.g., lp -Pcolor last_scene.jpeg Once you know how to print from the shell, you can set up stickers with a print button. The configure window has a print command box in which you can enter the same command you would type to the shell, but replacing the filename with %s. E.g., the previous example would be: lp -Pcolor %s Finally, you need to enable the print control on the scene window by toggling the print control button in the configuration window. The print control will not show up on the current scene, but you will be able to print by typing #. The next time you edit a scene, the print button should be available.

Each image has a signature stamp in the bottom right hand corner. You can set the content of the stamp using the signature field in the configure dialog. This will be formatted with the function strftime, so you can use the appropriate magic codes to plug in the date as well. E.g., "Jay %d-%m-%Y" says the artist is Jay and pastes the day-month-year beside his name. See the strftime man page for a complete description. If you don't want the signature, leave the box empty. You can set the font to use for the signature in the configure dialog.

There is only one editted scene allowed for each original (so you don't suddenly find that your toddler has used all your disk space). You can keep particularly good ones by renaming them, though the next time they are editted they will be destroyed. You could also rename them and copy them back to /usr/local/share/stickers so they will act like new base scene icons. Alternatively, you could create a separate "good scenes" directory, copy all the .scene and .scene.png files from /usr/local/share/stickers, and move all the good scenes into this directory. Use the configure window to point to the this scene directory instead of the default one.

You can control the size of the saved scene file by adjusting the max stickers saved value in the config window. Some explanation: displaying the initial scene involves displaying the background, then pasting some initial stickers. Sticker placement time is strictly a function of sticker size --- the bigger the sticker, the longer it will take. Since the stickers are not all the same size, simply saving a fixed number of stickers would result in vastly different initial scene rendering times. Instead we use the measure of megabytes which you get by multiplying the sticker dimensions by three for the size of the rendered rgb images, and include as the initial scene all those most recently added stickers whose sum of sizes is less than the value you specify. Note that this does not literally save megabytes of stickers in your file, but only pointers to stickers which add up to megabytes when stuck together. This parameter is largely dependent on the speed of your machine and your patience at startup. Though if you are using a lot of very small stickers, the file can get very large. Note that if you have too many stickers, the oldest ones will be dropped first. Either way your scene won't look right when you reedit it.

Bugs

Note: if your keyboard autorepeat is off when this program exits (it shouldn't be), you can turn it back on again with the command xset r.

Configure Window

Adding New Scenes

You can create new scenes by painting a background in The Gimp or some some such, moving it to the scene directory (/usr/local/share/stickers) and write the file Myscene.scene containing the following:

	@background myscene.png
	@stickers A1.xpm A2.png A3.png
	@stickers B1.xpm B2.png
	...
	@stickers X.jpeg

Once you've created the scene file, start stickers and click on the word Myscene (it won't have a thumbnail), create a sample scene and exit. Copy Myscene.scene.png from your working directory to the scene directory. The next time the scene list is reloaded, the new scene will display as a thumbnail rather than a name.

Note that for really small stickers, it is better to draw them large and then specify a scaling factor in the scene file. That way, the stickers are the `right size' for the scene, by if you decide that you want a larger one, it will still look good when scaled up. E.g.,

	@background Farm.png
	@stickers cow.png
	@stickers chicken.png : 0.35
	...

Please send us links to scenes and sticker sets which are GPL'd so we can link them to this page (you will retain copyright). Make a tarball containing the scene file, the thumbnail, the background and all stickers that you use. The tarball should unpack to the current directory (so it can be easily installed into /usr/local/share/stickers or even into stickers-0.1.5/scenes if they are really cool). Try to pick a unique name (e.g. stickers.seul.org-myscene.tar.gz) so someone can grab a whole bunch at once without them overwriting each other. If you use layers in The Gimp, include the src/*.xcf files for your image so that others can more easily edit them. We have a bit of space available on our site if you have none left.

You can test a newly downloaded scene by untarring into test/ and starting stickers with stickers test/ Some possible scenes are kitchen, store, beach, bedroom, zoo, farm, boating, construction site. It would be nice to have some component-based scenes as well, such as various car parts with which you can design your own car or various animal parts with which you can design your own animal. A "dress-up" scene with figures and clothing would also be nice.

See Also