Squiggles Manual

Now that you know the basics of paint we’ll step into more detail and show the other tools available.



Basic controls 
 
BlankSquiggles
The upper left button as shown brings in a new image to work with. The upper right button is for changing the settings. Tapping this will bring up all the settings. The lower left button is for saving the image to the photo album. Undo is used to undo and redo the last paint or filter process. (Note that it doesn’t undo changes to overlays or text layers) (The images on this page show a Trash Can but in version 1.5 this button reads Undo and functions as an Undo) The center button is the current tool that is being used.
 
currenttool
Tapping this will bring up the tools to choose from along with filters and other options. The color square button brings up the color choices for the standard paintbrush. The circle in the lower right is the tool options button. It will bring up the selection or options for the current tool. If the paintbrush is selected it will bring up brush shapes to choice from.

Erasing Image
Shaking the device will bring up the Erase Image alert. (If the Ask on Shake setting is on)
This will erase all of the paint and overlays on the image and restore it back to the original loaded image.
EraseImage?


Full screen 
If you wish to view your image full frame or would like to continue to work without having the toolbars appear and disappear each time, just tap the word Squiggles in the middle of the top toolbar.
squigglesbutton

DogToolsDogSquigglesPressedDogNoTools
Normal Pressed Squiggles No Tools
 This will cause the toolbars to disappear. You can continue to paint or work. Each corner is now a hot spot. If you tap in the upper left (where the new image button was) the toolbars will reappear. If you tap in the upper right then the Tools screen will appear. This is the same as if you hit the current tool button. The lower left corner will bring up the paintbrush colors. The lower right will bring up the current tool options.
If you shake the phone when the tools are hidden they will re-appear.

hotspots

Colors 
When you click the colored square in the bottom tool bar it will bring up the color selection.
 
ColorsColorsRGBColorsHSL
The 12 colored squares can be used as quick picks for color. When clicked the color is set and the color options immediately disappear. If you click in the rainbow square you can move your finger and choose any color. Up makes the color more pale and down makes the color darker. The current color is shown on the rectangle right above the rainbow square. Once you have the color selected hit the Done button and the color options view will disappear. If you wish to keep a selected color longer you can touch the color display above the rainbow square and drag your finger to one of the 12 squares. When you let go the square will now be the new color. Any colors set will be remembered even after a quit and restart. When finished hit the Done button. Note that these are only for the standard paintbrush tool and text layers.

Tapping RGB button on the lower control will show 3 sliders. One each for Red, Green and Blue. Adjusting the sliders will produce the exact color you wish.

Tapping the HSL button on the lower control will show 3 slider. Hue, Saturation and Lightness. Lightness should be at 50 for the most color.

Tap the Done button when finished. If you wish to keep the color drag your finger from the long color bar to one of the 12 spots and then press Done. This color will be available for quick selection in the future.

Tools 
Tap on the current tool button in the center of the bottom toolbar. This will bring up an assortment of tools and filters.
Tools


Paint
 painticon
This is the standard paintbrush. With this selected you can tap the Tool Options (lower right) and the Paint Brush options will appear. There are a range of hard and soft brushes to choose from. A soft brush is similar to an airbrush.
Brush
In addition at the bottom of the shapes is a slider to control the opacity. By lowering the opacity the paint will show some of the background through it. This is useful for tinting an image.
brushopacity

Below that are different paint modes. These are similar to other desktop paint programs. If you drew a cartoon in black you could choose the Darker mode to add color paint on top. Any paint that goes over the black would not be affected since it’s only using the Darker color between the paint and the background.

The iPhone is much different than a normal computer where you have a mouse and can move it to a position and then apply the paint where you click the mouse. On the iPhone there is no distinction between tapping and positioning. To resolve this Squiggles has the unique option of a finger offset and cursor mode.

By default the paint is applied directly under your finger. In some cases you want to apply the paint more precisely than this allows. By setting the finger offset in the Settings (as described above) you can paint to any side and distance from your finger so you can see the paint actually being applied.

In addition with the finger offset set and the Cursor switch on a cursor will be displayed where the paint will be applied. So to paint click anywhere and you’ll see a cursor image of the brush with the finger offset. You can move your finger around and the cursor will move as well. Once you have the cursor exactly where you want to paint, lift your finger slightly (enough so the cursor disappears but not enough to change positions). Now lower your finger and begin painting. The paint should be in the same spot the cursor was. This works with the Erase, Clone and Stamp tools as well. Takes a moment to get used to it but it should become second nature quickly.

As described in the settings information you can have paint strokes smoothed or paint specific shapes such as lines and circles.

Erase eraseicon
This is an eraser that will restore the painted areas to the same as the original loaded image. Once selected, click the tool options button (lower right) to select a brush to use as the eraser. By default it uses the last brush shape selected. Note this doesn’t affect any text layer or overlay. If you wish to erase all paint and any overlays and text layers, shake the iPhone.

Clone cloneicon
This is an advanced tool to copy from one area of the image to another. Once selected you’ll notice the tool shown in the bottom toolbar has a notch in it.
CloneToolStarting
In order to clone you need to set 2 points before you can paint. Touch the area you want to copy from. Where you lift your finger is the area that will be copied from. Next touch the area you want to copy to. Where you lift your finger will the offset to paint with. The tool will display no notch once the two points have been selected. You can change your brush by selecting the tool options (lower right) and selecting a brush shape. Now when you paint it will copy the image from using the same offset.
CloneInUse
Note cursor where it’s copying from.
If you paint where you touched the second time it will copy where you had clicked the first time. If cursor is turned on in the settings you’ll see cursor where the paint is being copied from. If the finger offset is set you will see the paint cursor as well and be able to move it before painting, just like normal paint.

Stamps stampsicon
These are small color images that you can paint with. Select this tool and then select the specific stamp to work with. Tap on the tool options (lower right) and a scrolling view of preloaded brush images will be available.

Stamps

Scroll up and down by moving your finger. Tap on the image you would like to paint with. The tool options will disappear and you’ll be able to paint directly with the stamp brush. If you have finger offset set and cursor on you will see a cursor that is an image of the brush which applies just like the paint brush tool. Note all colors are determined by the images so the paint color doesn’t affect stamping. Stamping also doesn’t use the smoothing or smart shapes settings.

Overlays overlaysicon
These are large images that can be placed on top of an image. These are treated as layers that can be moved, rotated and scaled. These can be repositioned at anytime until the image is saved (and reloaded) or the image is flattened. Once the overlay tool is select tap on the tool options (lower right). This will display a scrolling view of the preloaded overlays.
Overlays

Move your finger up and down to scroll through the images. Tap on the image you would like to work wit and the tool options will disappear. You can use your finger to move the image to anywhere on the screen. If you use two fingers, one on each side of the center of the image, you can resize by moving your fingers together (pinch) or apart (zoom out). If you rotate your two fingers the image will rotate. It is sometimes easier to rotate before scaling it smaller. The image is actually in a larger invisible rectangle that extends beyond the sides of the image. This should allow you to make the image smaller than normal. If the image is tall you can also place your fingers on the top and bottom. Sometimes your thumbs are easier to work with.

You can add more overlays by tapping the tool options and selecting other images. Since these are done as layers when you have a few overlays in the same place the front one will always be moved or selected (even if you can see another image through the front layer). In these cases move the front layer away to allow access to an image below.

If you need a different image to be in the front then double tap the image. It should now be in front of all other overlays.

If the overlay is already in the front and you double click it will be reset to full size in the center of the screen. This is useful if it becomes too small and you’re unable to rotate or scale the overlay.

If you tap it 3 times then it will be deleted.

If you want the overlay to face the other direction, select it by touching it. Then hit the Overlay tool button in the bottom toolbar and tap the Flip button under layers heading.

If you want to delete a layer select it by touching it. Then hit the Overlay tool button in the bottom toolbar and tap the Delete button under layers heading. If you shake to erase the image all paint and layers will be removed.

If you quit and restart Squiggles the overlays will still be adjustable.

In order to move or work with overlays the Overlay Tool has to be the current tool. When Overlay tool is not selected then the overlays can’t be moved. This is to prevent accidentally moving them while painting. Painting goes on the background image behind the overlays.

Note that Undo does not work on overlays, only on the background image.
Reposition or re-add the overlay as needed.

When you save out to the Photo Album the image is flattened since the iPhone doesn’t use layered images. However the current image is still editable until you select another image, erase the image or flatten it.

Painting and other processing only happens on the background image.

If you’re done placing overlays you can flatten the image. Tap the Overlay tool button in the bottom toolbar and tap the Flatten button under the Layers heading. You won’t be able to move the overlay since it’s now part of the background image and no longer a layer. You may paint or erase since its part of the image now.

Text - texticon
To add a short sentence of text tap the current tool to bring up the Tools screen. Select the Text tool. Tap on the tool options (lower right) to bring up a screen with text options.
TestInputText

If this is the first text layer then the keyboard will appear. Type in the text you wish. Dismiss the keyboard by tapping the return button. You can select any font from the selection. Tap the Done button when you are finished. You may now move, scale and rotate the text the same was as overlays. Layering is done the same as overlays so you can double tap to bring the text to the front if it’s below another layer. All the same overlay options can be done, including flattening, with the exception of Flipping.

The Text tool needs to be selected to move or change text.

The initial color for the text is set by the selected color at the time the text was created. To change the color select the text layer by touching it and tap the color button. Select as you would for the paintbrush. The text should now be the new selected color.

Tapping the tool options button with a selected text layer will display the current text layer font and text. You may change the font by selecting a different font or you can change the text itself by clicking in the text and editing it. Tap Done when finished and the text layer will now be centered with the new font and text.

If you want to add another text layer tap the tool options. Tap the New Text button will create a new blank text. Type the desired text and select the font. Tap Done when finished.

Multiple text layers work just like overlay layers so you can move and resize as well as change the order.

Select a text layer by touching it and change the color or use the tool options to change the font or text.

Settings 
Tap on the upper right button to change the settings.            
 
settingsbutton
 
Settings

Ask on Shake – When turned on, this will bring up a confirmation when the phone shaken. This will prevent unwanted erasing when moving the phone

Smart Shapes  – When turned on, hand drawn lines are straightened, squares are straightened and circles are smoothed into perfect shapes. Any closed shape will be turned into a circle with this on. Only turn on when you’re planning to do geometric style drawing since it may accidentally turn a shape into something else. If it makes a mistake, just hit the Undo button and try again. Note that if you have Paint Smoothing turned on then smart shapes will be ignored. Also note this only works with the standard paintbrush tool.

SmartShapesExample
Load Cropped – When turned on, any images imported from the Photo Album will be cropped to 320 by 320. The move and zoom controls are used. When this control is off the full image is loaded into the iPhone size paint area and the crop/zoom settings are ignored.

Cursor – When you have a finger offset set then a cursor will appear to allow you to accurately place your paint. If this switch is off then no cursor will appear and the paint will be applied immediately just like it does without the offset.

Smoothing  – Sometimes it’s difficult to move your finger smoothly across the glass or a protective cover of the iPhone. To smooth out the bumps and sharp edges of a paint stroke turn on the smoothing switch. The slider below it controls the amount of smoothing. Left is the least amount of smoothing and right is the maximum amount of smoothing. If it’s too high you may lose and sharp turns of your stroke. Now when you paint you’ll see your normal paint stroke and when you lift your finger it will be replaced immediately with a smooth version. If you’re doing precise, detailed work, you’ll likely want to keep this off. Note that smoothing only works on the standard paintbrush tool.

smoothed

Set Finger Offset  – When pressed this brings up a view that allows you to set an offset for the paint relative to your finger. By default paint is applied where your finger touches the screen. It’s difficult to be precise when your finger covers up the exact area you’re painting. The center Plus mark indicates where the paint will be placed. By touching directly below this point (so you can still see the plus mark) the paint will now be applied above your finger. If you’re right handed you might want to place you finger slightly down and to the right so you can see the paint clearly. This also comes in handy if you want to paint right up to the edge of the screen. The small plus mark shows where your finger will be. Hit the Done button if you want to keep this offset. Hit the Cancel to cancel and backup. Double click will reset the offset to be where to where your finger is.

FingerOffset

White BG - When turned on any image loaded that doesn’t match the iPhone format will use white to fill in. If this switch is off black will be used.


Copy and Paste 
To copy a section of an image tap on the tools and select the Select tool.

SelectTool

Now tap your finger and drag it on the image. This area will be selected and show a brighter, slightly blue rectangle.

SelectAreaCopySelect
The Copy/Paste menu should appear. If not double tap or hold down the select tool on the image.
Select copy from the menu. You can now paste the image within Squiggles or you can quit Squiggles and paste it into an app that will take images.

To paste in Squiggles hold down the Select Tool or double tap the Select Tool on the image.


PasteSelectPasteCopyCopyMoved

Select Paste from the menu.
The area copied will now fill the screen and the tool will be set for Overlay. Select the pasted Overlay with two fingers and move, scale and rotate it to where desired.


SelectAllCopyPasteAllFullPasteMoved
To copy the whole image select the Select Tool and double tap the Select Tool or hold the select tool down on the image.
Select the Select All menu and the entire image will be highlighted. Next select the Copy menu. Bring up the Copy/Paste menu and select Paste. The tool will change to the Overlay tool. The image will look exactly the same as before but you can now move, scale and rotate as with any overlay.

PasteSized
You can juxtapose copied areas for some interesting images.


Copy multiple images from the Photos App 

DemoImagesSelectedPhotos

Start up the Photos App. Tap the Export button in the lower left.
Next tap the images you would like to copy. These will be highlighted and marked with a check.
(Don’t click too many since memory is tight on the iPhone)
Tap the Copy button on the lower right. Copy button lists the number of images.

Now start up Squiggles and load the background image you wish.
Select the Select Tool and double tap or hold the Select Tool on the image.

PasteSelectedPastedPhotosPastedPhotosMoved


Select Paste from the menu and all the images should be centered full frame.
The tool will automatically be set to overlay.
Move the images with 2 fingers like any other overlay.


Mailing Images 

ExportButton
To mail an image select the Export button at the lower left.

MailSelected
Select the Send as Email button.

Mail

After a moment the Email view will appear. Select a person to email or enter in an email address.
Add whatever text you woudl liek to include and hit the Send button


Filters 
Note that these don’t affect any layers (Overlays or Text)

Bright - This shows a slider that can adjust the brightness in real time. Hit the Cancel or Ok button as appropriate.

Contrast - This shows a slider that can adjust the contrast in real time. Hit the Cancel or Ok button as appropriate.

Gray- Changes the image to black and white.

Sepia – Changes the image to sepia for an old fashion look.

Distortions
These are similar to PhotoBooth on the Mac.

Twirl - This shows a slider that can adjust the twirl in real time. Hit the Cancel or Ok button as appropriate.

Mirror – Makes a mirror image by flipping one side of the image.

Bulge – Bulges the image outward.

Fisheye – Produces an image that looks like a fisheye lens (big in center, small on sides)

Tunnel – Streaks the area around the center outward.

Squeeze – Pinches the image at the very center.

Dent – Reduces the size of the image at the center.


Layers

Flatten – This takes any layers (Overlays and Text layers) and makes them part of the image. Once this is done they can’t be moved or changed but they can be painted over and erased.

Flip – This takes the currently selected overlay layer and flips it left to right. This only works when the Overlay Tool is selected.

Delete – This takes the currently selected Overlay or Text layer and deletes it. The overlay or Text Tool need to be active and an overlay or text layer needs to be selected.

Advanced
Take advantage of the finger offset and cursor to paint on the far edges of the screen (where your finger might not be able to get to, especially with a hard case).

Take advantage of the finger offset and cursor as well to place paint exactly where you want it.

Smoothing can help with free hand painting.

You can rotate the phone if that makes more sense for painting.  You may need to adjust the finger offset as appropriate.

Because the erase restores to the originally loaded image it's possible to do more advanced work. One example is to use the Gray filter to change the image to black and white.  Now select the erase tool and 'erase' one object in the image.  Since this is being restored to the original image you will have a colored object in a black and white image.

If you flatten an image with overlays and text layers you can paint on top of them to change them.  In addition you can use the erase tool to restore part of the original image.  This allows you to erase part of an overlay that covers an area you don't want covered.