Untitled Document

Art

Studiolab Art is a collection of software tools for artists.
Currently, the only available tool is the Drawing Assistant.

The Drawing Assistant

The Drawing Assistant is used for drawing practice and sketching verification.

One purpose of drawing is learning to draw what you see.
The Drawing Assistant can be used to practice to draw what you see on the computer screen.
You can display your own photos or photos from a library maintained by the Studiolab community.
When you have created your own drawing you can take a difgital picture of your drawing and compare it to the original.

Library usage
Before I describe the program in detail (see below), I will describe a usage scenario.

Imagine you want to make a practice drawing.

First, you start the Studiolab program.

Then you want to find an image that you want to draw.
A sculpture seems nice this beautiful day, so you go the Style filter, select 'Sculpture' and press the Collect button.
You could have selected another style, or used the keyword filter, e.g. for finding 'Nude, female art' or 'Child' images, or the Artist filter to find images by 'Michelangelo', or any combination of filters, but you didn't.

All images in the library that fit the 'Sculpture' style selection are now displayed in the list below the filters. You select the 'Brottare' image.

Now the image of the 'Brottare' ('Wrestlers') sculpture is displayed in the big display area.

Some info about the image is displayed above the image.

If the image original is too small, or you are zooming, you can check the Smooth checkbox to make the image less pixelated.

Below the image, the program suggests how the image can be drawn.
In this case you should draw some detail (as the eye icon), not just the contour (different icon) or basic geometric forms (also different icon).
The point of view (red sphere) is the same as the image, i.e. not from somewhere else. Sometimes the program suggests that you should draw the scene from another angle. Imagine drawing the scene with the wrestlers from slightly above and from the left. It's very demanding, and you cannot compare your drawing to the original afterwards.
The direct light (white sphere) should come from above to the left.

Now you draw your first try. The result of my first try is displayed below to the right.
Take a digital picture of your drawing and transfer it to your computer.
Use as much zoom as possible when you take the picture of your drawing to avoid angle-errors. The drawing should be as flat as possible in relation to the camera, and the camera should be above the middle of the drawing.

Select the secondary image tab (point 2 on the application description below) and use the File selector (point 3) to find the photograph of your drawing on your computer. This will display the drawing on top of the sculpture image. You can press the Toggle button (71) to switch between the original and your drawing. Use it to display your drawing.
Now find two points on your drawing, in this case the left hand and the right foot of the left wrestler. You can select the Orientation tool (74) and drag the mouse from one point to the other to display an orientation line. Doubleclick to hide the orientation line.
Now press the Normalize button (72) to display both images.
Use the alignment tools (75 -77 to move, rotate and scale your images. The tools will alter the selected image (use (2) to select image).

You can make the sculpture image a bit darker by adjusting its brightness on the primary tab (2).
You can select the Edge detection of the secondary tab (2) to display your drawing in red on top of the sculpture image.

Now you can compare your drawing to the original image.

Left wrestler: head too high, the right leg has wrong shape, right arm should be lower, left shoulder should be lower and the left foot is too high.
Right wrestler: head too high, neck too high, left hand too small, line of right leg a bit off and feet too high.

Now you can either make corrections on the drawing, make a new drawing of the same image to see if you can do it better, or just move on to the next image.

You can also use the Play button to display a random image from the image list, and set the time you want to spend, e.g. 5 minutes.

From time to time, the image will be replaced by an ad. Just press the key 'X' to get back to you image, unless it has been removed due to time out.

You can display a grid on top of the images to make drawing easier.
You can also save the displayed image, or any part of it, to a jpeg image file, using any amount of zoom and rotation.

Note that the comparison is used to trim your sense of proportions. It does not in any way evaluate the quality of your drawing.
If you have no interest in comparing proportions, or you draw the image as if you view it from another place, or you have no access to a digital camera, you can just make a drawing based on the image and move on to the next when you're done.

You can display your own images instead of the library images if you want, using the File tab.
This method of comparing images can be used if you want to transfer an image or a drawing to e.g. a canvas. First, take or use a photo of the original image. Then make a simple sketch on the canvas, take a digital picture and compare it to the image. Then improve the sketch a bit and continuously check against the image.

There are currently a couple of hundred images in the library at the site, but any current member can invite any number of friends, who in turn can add their personal favourite internet photos to the library. You can email me at wiz(at)wiz.se if you want to become a member yourself, but you do not have to be a member to use the program.

You can look at my personal page for an example what you can contribute with as a member.
The keyword 'Nude, female photo' is naturally used for photos of nude females. If you dislike the usage of such photographs, please avoid using this keyword, but they are good figure drawing practice.

The program

Each main tab is a Studiolab tool. The Drawing Assistant is one of these. The other tools are not documented yet.
The image screen (44) can display one or two images. Use this tab selector to define the bottom (primary) or top (secondary) image. The shortcut keyboard keys are 'P' and 'S'. See the Secondary Image paragraph for an example how to use the second image.
You can display an image from the Studiolab image library using Library controls (4)-(18), on your own computer using File controls (F1)-(F2), or image history using the Log controls (L1).
This is the path to the web library cache if (5) is selected, or the address of the web library if (6) is selected. You can go to this address to find information about the contributors and the image library.
When this radiobutton is selected, the library is constructed from your local library cache and your log. It does not use the web connection. The location of the local cache is displayed at (4).
When this radiobutton is selected, the library is collected from the web site displayed at (4).
You collect images from the library using any of filters (7)-(10).
Every image is tagged with one or more keywords. Use the Keyword filter to find a certain kind of images.
Note that the Nude, female photo keyword contains nude photos.
The Artist filter is used to find art by a certain artist.
The Style filter is used to find art of a certain style, like oil or chalk.
The User filter is used to find images submitted by a certain studiolab community member.
These are the filter choices. If you select several values, all images that correspond to at least one value is selected.
The four filter types can be used together. For instance, if you want children and head images created with chalk, you select the Head and Child values of the Keyword (7) tab, and the Chalk value of the Style (9) tab.
Use this button to clear the currently selected filter (in this case the Keyword filter).
This button is used to refresh the filter values.
When you have selected a set of filters, you press the Collect button to find the images, which are display at (17).
This is the last filter choice you have made. In this example, you have selected two keywords and one style.
You can ignore the last images you have viewed using the Ignore log checkbox to avoid viewing the same images again.
The log is displayed at (L1).
This is the list of images that correspond to you filter choice.
If you want to copy all images of (17) to your local cache, so you can use them offline, you can use this button.
This slider is used to alter the control color of the image. It is used for orientation color (66) and edge color (23).
If this radiobutton is checked, the image is not shown. Normally used for toggling (37).
Use this button to clear the image selection. It is almost the same as using the suspend button.
If this radiobutton is checked, the image is displayed normally, without effects.
When the edge detection is turned on, distinct features of the image, like pencil lines, are accentuated.
This number indicates how soft edges can be to be regarded distinct. Higher number means softer edges.
If this box is checked, only the accentuated edges (not the image itself) are shown.
This is used to alter the limit used for detecting lines. Lower limit means more lines.
This is used to alter the intensity of the displayed lines.
Use this slider to adjust the contrast of the image.
Use this slider to adjust the brightness of the image.
If this box is checked, a histogram of the red, green and blue channels are displayed on top of the image.
This is the size of the histogram.
If this box is checked, the image will be black and white.
When this box is checked, controls (16)-(23) are displayed.
When this box is checked, controls (24)-(28) are displayed.
This button is used for interpolating image pixels for a smoother (and slower) display. It can be used if you try to display an image that has limited resolution, or if your zoom (36 or 78) has a high value.
This is the zoom of the image. If you want to zoom both images, use (78).
This is the rotation of the image, 0-360 degrees. If you want to rotate both images, use (79).
If the Keyboard box is checked, some functions can be accessed using the keyboard.
Press this button for a list of keyboard shortcuts, activated by the Keyboard box.
The Password button will open a Password dialog (P1-P6). Every member in the library has one password, with which he or she can lock images. It is used for restricting library entries, e.g. personal images, to friends. All passwords are submitted with all library requests, and locked library entries that do not match the passwords are simply not displayed.
P1 is a list of all passwords you have entered. It is stored in the file Studiolab/drawing/passwords.xml.
P2 is used to remove the selected entry from the list.
P3 is used for adding or updating a password entry, using the data from P5 and P6.
P4 is used for closing the dialog.
P5 is the member name of a new entry or update.
P6 is the password for the member.
The Grid checkbox is used for turing on or off the grid (65).
This number (0.0-1.0) is used for changing the grid color.
This value is used for altering the grid density (number of lines).
This value is used for adjusting the grid transparency.
This is a progress indicator for displaying images.
Use this value to set the jpeg image quality. Higher number means higher quality and larger file.
Use this button to save a jpeg image.
Note that everything displayed, including histogram and grid will be saved in the image.
When you display images from the web library, they are cached locally in the .../Studiolab/drawing/cache directory.
This button is used for manually emptying the cache.
This is how old logs and cached images must be to be cleared by (48). Set to 0 to clear all logs and caches.
This is the size of all cached images.
When this box is checked, controls (1)-(37) are displayed.
This box is used to minimize the display. It is useful if you have limited screen space.
When this box is selected, the library information (62)-(63) are displayed.
The Random rotation box is used for displaying next image with a random orientation;
50% correct, 10% rotated left, right and upside down and 20% fully random.
This button is used for selecting a random image from (17), if none is selected, and starting the timer (58).
This button is used for stopping the timer.
This button is used for moving to next log or image. The current image will be added to the log (3).
This is the timer duration. It can be changed while the timer is running.
This is the timer progress and estimated remaining time.
This is a field for system messages, like if an image cannot be found.
Use the Log button to find past system messages (60).
This is the image selected in (17), (F2) or (L1).
This is the artist and the title, if the image library contains this information.
This is the style, e.g. Oil or Chalk, and additional information about the image.
If the grid checkbox (41) is selected, a grid is displayed, as defined by (42)-(44). The grid will follow the display orientation (78-80).
You can set orientation lines with the orientation tool (74).The color is set using the Color slider (19).
This is where the histogram is displayed if (30) is selected. It displays a black line for the intensity function, as defined by controls (28) and (29), and a blue line for actual intensity value distribution. The histogram of the primary image is displayed to the left, and the histogram of the secondary image is displayed to the right.

This is the suggested style of drawing. It is an innocent, optional suggestion.

40%

Draw all details.

20%

Draw contour or gesture with very sketchy, with little detail. See below for an explanation.

20%

Paint with color, e.g. watercolor or pastel.

10%

Draw geometric, shaded figures. Use blocks, spheres, cylinders, eggs and cones.

10%

Draw a modern version.

As suggested in the Evansville Figure Drawing tutorial, the contour and gesture exercises can be performed like this:
Contour: Place a finger on the paper, and the pencil by the finger. Then select one spot on the contour of the image and follow the contour slowly with your eye. Follow the trace with the pencil on the paper (without looking at the paper) until you have followed the contour a full circle. This will train your eye-hand coordination, and will improve with practice. Start with using simple forms, like those found with the Simple form keyword.
Gesture: Find the places of interest on the image, and draw these isolated areas at the approximately correct distances. Examples are center of weight, weight distribution centers, like the feet, and areas with most complexity. Constantly move between areas, never focusing on any area for more than ten seconds at a time. This will create isolated areas of interest, which can be increasingly connected. With practice, the precision of the sizes and distances will increase.

This is the suggested perspective. Use the scene of the picture, but draw it from another angle. This is very difficult. In this example, you should draw the nude from left above.
This is the suggested direct lighting direction. Use the picture and possible perspective changes, but change the direction from which the direct lighting is coming. In this example, the lighting comes from left above, after the perspective change.
Use this button to toggle between the primary and secondary image. It is an excellent way to compare them. The first and second toggle will take a couple of seconds, since the images are built up, but subsequent toggles used the cached images, and are instantaneous.
Use this button to display both images by setting the primary image to no effect (22) and the secondary to transparency (S1).
Use this button to reset zoom, rotation and scroll of the selected image (2).
Orientation tool. Use this tool for adding a line that is aligned with the selected image. Doubleclick on the image to clear.
Move tool. Use this tool to move the selected image (2) by dragging the mouse on the display area (62).
Rotation tool. Use this tool to rotate the selected image (2) by dragging the mouse on the display area (62). The down-point will remain stationary.
Zoom tool. Use this tool to zoom the selected image (2) by dragging the mouse on the display area (62). The down-point will remain stationary.
Use this field or slider to zoom the display area.
Use this field or slider to rotate the display area.
Use this tool to move the display area.
This button is used to set display area zoom to fit the primary image in the display area.

F1.	This is the directory on your own computer where you find you local image when the File tab is selected. Use this button to find a directory with images. Note that you select a directory, not a file, using the Browse button. This produces the dialog to the right. B1 is used for selecting drive. B2 contains shortcuts to previously selected directories. Note that if you select a directory here, the directory itself will be the selected path (B7) until you select a file or folder in the list (B6). B3 is the current directory. B4 is used to go to the parent directory. B5 accepts the selection (B7), exacly as (B9). B6 is the list of files and folders of the current directory (B3). B7 is the selected path. Note that if no file or folder is selected in (B6), the directory (B3) itself is the current path. B8 is used to cancel the request. B9 is used to accept the selection.
F2.	These are the files of the selected directory (F1).

L1.	This is the log window with your past image selections. You can display any log item by selecting it in the list. You can clear the log using the Clear cache button (46)

S1.	The Secondary image tab (2) has only the File source tab (3), but it has more image effects. When the transparency button is checked, the secondary image is blended with the primary image, if there is one. This slider also determines the transparency of the secondary image if edge detection is selected, but 'Edges only' is not.
S2.	This effect is used for comparing values (brightness) of the primary and secondary images.
S3.	If this button is checked, lighter parts of the primary image will be yellow and darker blue. Otherwise it's the opposite.
S4.	This level is used to adjust the normal (black) value difference.
S5.	If this box is checked, only the intensity of the selected color (16) is used.

Secondary image
You can use the secondary image to check the proportions of a sketch to an image.
In this example, I will be transfering a photograph to a canvas.

This is the photograph I will try to paint. I select the File source tab (3) of the Primary Image tab (2). Then I select the directory where I keep the photograph (F1), and select the photograph (F2).
This is the initial sketch on the canvas. I have taken a digital photograph of it, and moved it to my computer. I use the File source tab (3) of the Secondary Image tab (2). Then I select the directory where I keep the photograph (F1), and select the photograph (F2). It may be helpful to add a vertical and/or a horizontal line on the sketch to establish absolute directions of the canvas. My sketch does not have any such lines.
On the Secondary Image tab (2), I select Edge detection (23). You see that the images are not aligned. The red color of the edge detection can be changed using the color selection (19) on the Secondary Image tab (2). Now I find two reference points that the images share to use for aligning the images. I use one eye and the corner of the palette. I select the orientation tool (74) and the primary image (2) and click on the eye of the primary photograph and drag the mouse to the corner of the palette of the same image. This will produce a blue line, as you can see to the right. The blue color is the selected color (19) of the primary image. Then I select the secondary image (2) and click on the eye of the secondary sketch and drag the mouse to the corner of the palette of the same image. This will produce a red line, as you can see to the right. The red color is the selected color (19) of the secondary image.
Now I use tools (75)-(77) to align the images. You can see that the sketch is ok, but slightly rotated. The outline of the right arm is slightly off, and the brush is at a wrong angle. Either I change the sketch, take another photo and compare again, or I go ahead with the painting.

You can use the same procedure to compare your drawings to the originals of the Studiolab image library.
You just display a few library images (5)-(17), (55) and draw them.
Then you photograph your own drawings, transfer the photographs to your computer and compare the images.
The images from the library can easily be found in the Log (L1).

Installation and starting
See the download page.

Advertising
Studiolab Art is a freeware (free of charge to use), but it will display advertisements when inactive.
If no image has been selected, or the user has been inactive for twenty minutes, Studiolab will begin displaying the advertisements. You can display the selected image again by clicking on the screen or changing some setting, like scroll, zoom or rotation.
The advertisments are updated regularly from the Studiolab website. Contact studiolab(at)demagic.com for advertising.
The cost is currently (august 2005) SEK 3000 for the first image (max total of 20 images at any given time) per month, with decreasing cost for subsequent images. I sincerely doubt I will ever sell even one ad, but there is no harm in trying...

The website
The website is used for downloads, tutorials and managing the online image library.
The online library is maintained by invited members. This means you have to be invited by an existing members (or me) to add images to the library. The reason for this is fairly obvious; free registering would result in undesired images in the library. If you want a member identity, you can also request one by emailing studiolab(at)demagic.com. Misuse, like adding "immoral" images, will simply result in a deactivated identity.

The library does not contain the images, just the addresses (urls) of the content. This means that the images must already be publicly available on the net before you add it to the library. Note that only invited members can add images to the online library. Any member can get images on their own computer, collected from their own digital camera, a digital album or from the web, and display those images, using controls (F1)-(F2).

One way to find images is through the Google image search. The language used depends on from where you search. This example is in swedish.
First select the Image search (1, Bilder in swedish). Then type what you are looking for in the text field (2, "cat" in the example).

The result may look like the one to the right. When you find an image you like, you can click on it (3) to display the page.

The result will show the image (4) again, as well as the page it was found on (5). Click on the image (4) to find the true location of the full-sized image.

The url shown in the address field (6) is the one that is added to the library (22 below), and which is accessed using controls (7)-(12).

In the library (22 below), you should also register the source of the image. Click on (5) to open the source page, and copy the url (6) to the library data.

The homepage
Every invited member has a personal homepage with personal information as well as a display of contributions to the online library.
The homepage can be reached from the left navigation part of the Studiolab site.

All the information on the homepage can be edited online.
(8) is the full name of the member.
(9) is the email of the member. The member can select whether the email is displayed or not on the personal profile page.
(10) is the personal, external homepage of the member, if there is one.
(11) is a short description of the member.
(12) is a picture of the member. This is the only picture a member can save on the Studiolab site.
(13) is a space reserved for advertising.
(14) is the personal library. The images are organized in folders. When you click on an image on the homepage, you will get additional information about where it is located and when it was added.
These images are supposed to be used for drawing practice, so they should contain some object(s), not just pretty pictures of clouds or abstract graphical images.

(15) is used by the owner to login to the member pages. It will lead to a page that look like the image to the right. You username (16) is already filled in, so enter your password (17) and press the Login button (18).

This will lead you to the member page. It consists of a navigation part, like the image to the right, and an editing part below.
(19) will display your homepage.
(20) is used for editing your email list. It is not used yet.

(21) is used for editing the image library.

Add a new image is used for adding a new image.
The Remove link will remove the image from the public image library. The image is then displayed in this image list with a Restore link and an Erase link. Restore will restore the image to the public library, while Erase will remove it from you list completely. If you want to add it to your list again later, you must use the Add a new image link.

You can edit an image by clicking on it. In this example, I have clicked on the Arnold image.

You add a new image by clicking on the Add a new image link, filling in the form and pressing the Save image button.

Each image belongs to one folder. You can use an existing folder from the drop-down menu, or you can name a new folder.

You can write a description of the image if you want to. It is displayed when someone clicks on the image on your own homepage.

The most important field is the URL. This is the address of the image (6). Please also enter the source of the image (7) in the Source URL field, out of courtesy.
If no source description is entered, the web-site of the Source URL is used.

Note that you cannot really edit the url of the image; if you change the URL and save, a new entry is added to the library. You must then use the image list (21) and first Remove and then Erase the old image.
The reason for this is that if you find several images on the same page, you can enter Folder, URL and Source URL for one image. You then click on this image in the image list and edit the URL only to add all the other images.

(22) is used for editing your personal information.

The username is determined when you are invited.

The description is written using the html format. See the html tutorial for a very short introduction to html.

You can use this page to upload a picture of yourself if you want to.

(23) is used for inviting a friend. The username must be unique for the site, and cannot be changed later.
The password can be changed at any time later.

(24) is used for formatting the website, and is not used yet.