1. Overview: Project Types

Thumbstudio offers you many ways to present your images in the internet simply and attractively.
The following project types are available ...

• Webalbum
  The thumbnails are displayed in a table.
  Click on an image to open the same image in a larger dimension.
  
  
• Webalbum with Slideshow
  The thumbnails are displayed in a table.
  The user can click on an image to open a slideshow, which can be used to browse through the images. 
  
  
• Slideshow
  Each page contain a single image in the specified dimensions.
  The viewer can use the controls to browse and navigate between the pages. 
  
  
• Java Slideshow
  Each page contain a single image in the specified dimensions.
  The viewer can use the controls to play/pause and navigate between the images.
  
  
• Slideshow with Preview
  The Slideshow with Preview contains a large image and small thumbnails for the next and/or previews images.
  
  
• Batch Processing
  Thumb Studio supports batch processing of a huge number of images without creating web-page.
  You can also use this function to add a watermark to your images.
  
  
• Custom Template
  You can create a slideshow or webalbum using custom templates.
  You can use your own design and don't have to use one of the included drafts.

1.1 Webalbum

The thumbnails are displayed in a table. Click on an image to open the same image in a larger dimension.
A webalbum is ideal to present a large number of pictures openly and organized.

Click on an image to open the same image in a larger dimension.
The image size could be defined in Thumb Studio; select "None" if you don't want to use a larger image.

A webalbum can also contain subalbums. Images can be grouped and sorted through this. 
By a click on the folder name you can jump directly into the respective (sub)album. 
Use „Up“ and „Home“ to jump to the parent album.

1.2 Webalbum with Slideshow

The thumbnails are displayed in a table. Click on an image to open the same image in a larger dimension.
A webalbum is ideal to present a large number of pictures openly and organized.
The user can click on an image to open a slideshow, which can be used to browse through the images. 

The lower area contains contols, which can be used to navigate through the images.
Click on the image number to jump directly to the corresponding image.

1.3 Slideshow

Each page contains a single image in the specified dimensions.
The viewer can use the controls to browse and navigate between the pages.
Click on the image number to jump directly to the corresponding image.
A complete overview isn't available in this project (unlike the webalbum).

1.4 JAVA Slideshow

Each page contains a single image in the specified dimensions.
The viewer can use the controls to play/pause and navigate between the images. 

1.5 Slideshow with Preview

In addition to the current picture, the previous and following pictures are represented in miniature view here.
The viewer can use the controls to browse and navigate between the pages.
Click on the image number to jump directly to the corresponding image or click on one of the preview images.

1.6 Batch Processing

Thumb Studio supports batch processing of a huge number of images without creating a web-page.
You can also use this funtion to add a watermark to your images.


Resize
The image can be resized into 3 different dimensions with a single click.

( Image A - Image B - Image C )

Watermark
You can also use the resize option to add a watermark to your images. 
The Watermark option is avaiable in all project types.

1.7 Custom Template

Create a slideshow or webalbum using custom templates.

Open your html template in your html editor and insert the placeholder ##THUMBSTUDIO## on the desired position.
You can use your own design and don't have to use one of the included drafts.

Please check the correct spelling, otherwise the program will not be able to detect the placeholder in your document.
If you want to arrange the photo album or slideshow in the center, then center the placeholder in your document.

Now use the document in Thumb Studio and the program will automatically add the photo album or slideshow. 

IMPORTANT:
Thumb Studio saves all files (html pages and images) in the specified output folder. 
Copy or upload the contents of the folder into your web.

Some elements will not be shown correctly unless you have copied the pages into your web.

2. Step by Step ... Creating a Project

The following shows how easy it is to create a Webalbum or Slideshow. 

Each point equals a tab in the program interface. Some settings are disabled, depending on the project type. 
These options aren't relevant for the project or can't be changed.

2.1 Project 

The first step is the selection of the project type.
A click on the project type in the left window will expand the included drafts for the project type ... if available (1). 

You can browse through all the included drafts with the cursors or by clicking on the item (2).
The window on the right side shows a small preview image for the selected draft (3).
You can change the font for all drafts, some drafts even allow you to change all the colors, depending on the design.

Select the draft you want to use and click on "Next" (4).

2.2 Image Settings

This dialog can be used to define the exposure of the images.

• Image Size (1)
  You can define up to 3 sizes for the images (A, B and C). You can use one of the pre-selected images sizes, use a custom size or disable the image. Please note, that some sizes cannot be changed, e.g. an image in a designed table cannot be changed, because it would not fit into the table.
  
  The illustration below shows the position of the images (A, B and C) in the project.
  
  Subfolder is the name of the (sub) folder (which contains the images) inside the output folder.
  The .html files are stored in the output folder and the images in a subfolder.
  
  Algorythm specifies the method, which should be used to resize the images.
  Please note, that algorythms differ in speed and quality. 
  
  The File-Prefix will be used as filename for the images together with the filenumber.
  
  

• Watermark (3)
  The program can add a visible watermark to each image, which allows you to protect your images from illegal use.
  
  

• Image Format (2)
  You can select between popular image formats, JPEG is often used for web pages. 
  The PNG format is also interesting, because it uses a lossless compression method.
  
  Use the slider to specify the quality for JPEG images. 
  The quality effects the compression, so a high quality output images is much bigger than an image with low quality. 
  
  Click on „Edit IPTC Tags and JPEG Comment“ to open the following window:
  
  
  
  The image descriptions are saved invisibly in every single image. It can contain copyright information and also title/comments.
  You can also use the comment field from the program to give each image an invidual comment.

2.3 Project Settings

• Project (1) (Website Integration only)
  Columns and Rows specifies the number of images in a table. Use Rows = 0 to display all items on a single page of the webalbum.
  This options is not available if you use of the included drafts or a project type, which does not support multiple images on a page.
  
  Please make sure, that the images will fit into the table (see also 4). The table width must be big enough for the images in a row.
  Now select the template which should be used. The following dialog will open ...
  
  
  
  This dialog also allows you to choose one of the included control-sets.
  
  IMPORTANT:
  Open your web page in your html editor and insert the placeholder ##THUMBSTUDIO##
  on the desired position before selecting the file in Thumb Studio.
  
  

• Import Caption from Image Files (2)
  Each image can have an individual comment, e.g. a description of the image.
  
  * IPTC Image Caption
  * JPEG Image Comment
  * EXIF Image Description
  * Filename (without extension) 
  
  Please select the desired option BEFORE you add your images in Thumb Studio.
  
  Some drafts allow you to show a comment, e.g. below an image.
  Its also possible to add the comment hidden in the image file (see also Image Format).
  
  

• JAVA-Script Options (3) 
  A JAVA slideshow contains a play function.
  The slideshow speed defines how long each image should be displayed before the next image will be shown.
  
  A blend effect can be used to blend each image into the other smoothly.
  Javascript must be enabled on the clients browser to use the java slideshow.
  
  Most project types contain at least a view lines of javascript-code, e.g. to open the images in the same browser window.
  Check the option „Use HTML only – no Javascript“ to remove all Javascript-code.
  This could be required, if you want to create an offline album or CD, where no Javascript should be included.
  
  

• Table (4) (Custom Template only)
  You can define the table width, border size, cell padding and spacing here.
  Use Width=0 to use the max. width available in your draft. 
  
  

• Colors and Fonts (5)
  Some of the included drafts support custom colors and fonts.
  The project type „Website Integration“ allows you to customize all style elements.

2.4 Image and Album Selection

This page can be used to add images, add albums and for image manipulations.

• Album (1)
  This section will show the images and albums in the selected album.
  
  

• Image (2)
  Click on “Add Folder“, to add multiple images inside a folder.
  This also allows you to add a complete structure (recursive) and create subalbum automatically.
  Use “Add Image“ to select one or more images, which should be added.
  Use „Remove Image“ to remove an image from the selection.
  
  

• Comment (3)
  Click on an image and edit the comment for each image.
  See also „Import Caption from Image Files“ in the section „Project Settings“. 
  
  

• Sort (4)
  Click on an image and use the buttons „Move up“ and „Move down“ to change the sort order within the album.
  
  

• Image Manipulations (5)
  Click on an image and use the buttons to rotate or flip an image.
  
  

• Album (6) (Webalbum only)
  Images can be organized and sorted into Albums.
  Albums are virtual Folders, which can contain unlimited Albums and Images.
  This means you don't have to create any „real“ folders on your hard-disk.
  Please note, that not all Project Types will support Albums.
  
  The structure in the output page will be created exactly as defined here.

2.5 Create

The final step is to select where the program should create the output files. 

The program uses a personal folder by default and each project has an unique name.

• Project Name
  Thumb Studio creates a folder with this name in the Project Folder.
  The Project Name is also display in most drafts, so its recommended to choose a custom name, e.g. 30th Birthday.
  
  

• Project Folder
  The program creates a folder with the Project Name here.
  It can host multiple projects or just a single one.
  The program saves the last selection for future use.
  
  

• Output Folder
  The Output Folder is the complete path, where the program saves the html and image files. (Project Name \ Project Folder)

Click on Create to start the processing. It could take some time, depending on the size of the project and images until all images have been resized.

2.6 Output

• FTP Upload Project Files (1)
  Enter the information required to connect to your FTP server here. 
  Upload opens two file explorer: one for your local hard-disk and one for the FTP server.
  You can copy/paste the files, from one to the other, the same way as a local file on your disk.
  
  

• Explore and Copy Project Files (2)
  Opens a single file explorer showing your files. 
  Now you can copy or edit the file for further use.

The lower window (3) contains a small web-browser showing the first page. 
Click on „Open“ to open the first page in your default web-browser.

2.7 How to copy the Output to your Web

The program generates all required files. The output files could be found at the folder specified inside the program as output folder. If you click on „Explore and Copy Project Files“, then the software will locate it on the disk for you and open an explorer at this location.

Please note, that the program only writes files inside this folder. Even if you select a custom template - the template .htm file or the original folder will not be changed by Thumb Studio.

The atsxxxxx.htm file(s) will contain your slideshow or webalbum, the image files will be inside the „images“ folder. You can copy/open/import the .htm files with most html or web-editors. If you already have a website or a web-project then please refer to the manual provided by your webspace provider or html editor on how to open or import .htm files. 

Please note, that you also need to copy or upload the „images“ folder to your web.

In many cases its the best solution to create a new folder on your web and copy/upload the webalbum or slideshow to this location.

Sample:

• Create a new folder in your web, e.g. Holidays

• Now copy/upload the contents (all .htm files and the image folder) from the Output-Folder of the program (click on „Explore and Copy Project Files“) to this location.

• Now set a link from your homepage to the first htm page inside the new folder.
  (ats00000.htm)

• Thats all. If you click on the link then the ats00000.htm will open and show your slideshow or webalbum. 

Please refer to the user manual of your webeditor or other html manual if you are unsure how to create a link. Instructions how to upload files to your webspace should be provided by your webspace-provider.

A. Misc

Sample Images licensed through fotolia.de – www.fotolia.de: