Answer
dynamic buttons
It is possible to create dynamically sized buttons using Scene7 Image Serving. Below are some templates that provide a basis for developing self-sizing UI buttons using IS. The examples use the default font distributed with IS. The derived art must be wide enough to accommodate the longest text label expected. An actual implementation likely would use higher-resolution art, a different font, and various RTF and IS commands to fine-tune the appearance and position of the text label.
The example below has a solid color background.The text must be in layer 0 so that the button size is driven by the text string. The button art must be transparent in the center to make the label and fill visible:
Link:http://sample.scene7.com/is/image?fmt=gif&layer=0&text=$text$&extend=10,1,10,1&bgColor=$color$&layer=1&src=TechSupport/b-frame&originN=-.5,0&posN=-.5,0&layer=2&src=TechSupport/b-frame&originN=0.5,0&posN=.5,0&extendN=-.9,0,0,0&$text=button%20with%20solid%20color%20fill&$color=aaffaa
http://sample.scene7.com/is/image?fmt=gif&layer=0&text=$text$&extend=10,1,10,1&bgColor=$color$&layer=1&src=TechSupport/b-frame&originN=-.5,0&posN=-.5,0&layer=2&src=TechSupport/b-frame&originN=0.5,0&posN=.5,0&extendN=-.9,0,0,0&$text=button%20with%20solid%20color%20fill&$color=aaffaa
This example has the button art providing the fill. You need to render the text twice; once in layer 0 to provide the overall size, and then again on top of the art. In this case the art would be opaque:
Link:http://sample.scene7.com/is/image?fmt=gif&text=$text$&extend=10,1,10,1&layer=1&src=TechSupport/b-comp&originN=-.5,0&posN=-.5,0&layer=2&src=TechSupport/b-comp&originN=0.5,0&posN=.5,0&extendN=-.9,0,0,0&layer=3&text=$text$&$text=button%20with%20image%20fill
http://sample.scene7.com/is/image?fmt=gif&text=$text$&extend=10,1,10,1&layer=1&src=TechSupport/b-fill&op_colorize=$color$,off&layer=2&src=TechSupport/b-frame&originN=-.5,0&posN=-.5,0&layer=3&src=TechSupport/b-frame&originN=0.5,0&posN=.5,0&extendN=-.9,0,0,0&layer=4&text=$text$&$text=colorized%20gradient&$color=6666ff
Here is an example used by one of our customers. The primary difference and increased complexity is due to the fact that this call generates transparent PNG buttons. This requires nested calls on layer 1 and layer 2. The developer mode in SPS is needed to create the template.
http://sample.scene7.com/is/image/TechSupport/button_small_default?$txt=Put+your+text+here
Template button_small_default
&$txt=Details%20here&layer=0&textPs={{\fonttbl{\f0\fcharset0%20Arial;}}{\colortbl;\red0\green38\blue117;}\f0\cf1\fs12\b%20%C2%BB%20$txt$}&textAttr=150,norm&extend=25,3,25,1&originN=0,0&hide=1&layer=1&src=is{TechSupport?layer=0&textPs={{\fonttbl{\f0\fcharset0%20Arial;}}{\colortbl;\red0\green38\blue117;}\f0\cf1\fs12\b%20%C2%BB%20$txt$}&textAttr=150,norm&extend=25,3,25,1&originN=0,0&hide=1&layer=1&src=TechSupport/background_button&originN=-0.5,0&posN=-0.5,0}&clipPath=M0,0L20,0L20,20L0,20Z&layer=2&src=is{TechSupport?layer=0&textPs={{\fonttbl{\f0\fcharset0%20Arial;}}{\colortbl;\red0\green38\blue117;}\f0\cf1\fs12\b%20%C2%BB%20$txt$}&textAttr=150,norm&extend=25,3,25,1&originN=0,0&hide=1&layer=1&src=TechSupport/background_button&originN=0.5,0&posN=0.5,0}&clipPath=M20,0L800,0L800,20L20,20Z&layer=4&textPs={{\fonttbl{\f0\fcharset0%20Arial;}}{\colortbl;\red0\green38\blue117;}\f0\cf1\fs12\b%20%C2%BB%20$txt$}&textAttr=150,crisp&extend=25,3,25,1&originN=0,0&effect=-1&pos=1,1&color=0xEDD2A8&op_blur=1&op_grow=1&fmt=png-alpha
Answer
Unfortunately, at this time we do not support importing layer transforms from PSD files into the generated basic template.
Answer
A clipping path is a closed vector path, or shape, used to cut out a 2D image in image editing software. Anything inside the path will be included after the clipping path is applied; anything outside the path will be omitted from the output.
You can use image clipping paths to define transparent areas in images you place in page-layout applications. In addition, OS X users can embed Photoshop images in many word-processor files.
You may want to use only part of a Photoshop image when printing it or placing it in another application. For example, you may want to use a foreground object and exclude the background. An image clipping path lets you isolate the foreground object and make everything else transparent when the image is printed or placed in another application.
Note: Paths are vector-based; therefore, they have hard edges. You cannot preserve the softness of a feathered edge, such as in a shadow, when creating an image clipping path.
See http://help.adobe.com/en_US/photoshop/cs/using/WSfd1234e1c4b69f30ea53e41001031ab64-7715a.html#WSfd1234e1c4b69f30ea53e41001031ab64-7711a for more information.
Answer
If an image contains a clipping path, the clipping path is displayed in the Photoshop “Paths” panel with its name displayed in bold font.
Answer
The Scene7 file formats that support clipping paths include:
PSD
EPS (raster)
TIFF
JPG
Answer
One of the image editing options in SPS under the upload job options is to create a mask from a clipping path. This help page has a brief description of this option:
http://help.adobe.com/en_US/scene7/using/WS1C6180F2-3FB5-4222-BB0F-08C53AB21188.html
When this option is selected and the uploaded image contains a path that is denoted as the clipping path (files can have only one clipping path), the mask is associated with the Asset ID for the uploaded file. Specifically a MaskPath which references an 8-bit greyscale mask image is tied to the asset. The alpha channel for the area outside of the clipping path on the mask image will be completely transparent, and the alpha channel will be completely opaque for the area inside the clipping path. More information about MaskPath can be found in the Image Serving documentation:
http://microsite.omniture.com/t2/help/en_US/s7/is_ir_api/index.html#is_api-image_catalog-MaskPath
The catalog::MaskPath overrides the alpha channel in the main image (catalog::Path), if present, and if the alpha channel is unassociated (i.e. not pre-multiplied). If the image alpha is pre-multiplied, catalog::MaskPath is ignored and the alpha channel of the main image is always used.
The result is that the region outside of the clipping path will be transparent when referred to by the Asset ID from the Image Server. It is possible to ignore the mask by using maskuse=off in the Image Serving URL, which effectively removes the transparency created by the clipping path. See the Image Serving documentation for more information on maskUse.
http://microsite.omniture.com/t2/help/en_US/s7/is_ir_api/index.html#is_api-http_ref-maskUse
Here is an example showing the transparency which is created from the mask:
http://testvipd9.scene7.com/is/image/TechSupport/grill1?wid=400&bgcolor=200,100,100
And how you can ignore the mask and therefore lose the transparency:
http://testvipd9.scene7.com/is/image/TechSupport/grill1?wid=400&bgcolor=200,100,100&maskUse=off
Glossary of terms
unassociated alpha channel
RGB images with alpha transparency can be stored in two different ways. One way is to store raw RGB values and alpha values as separate and independent channels; this is called "unassociated alpha". PNG standardized on "unassociated" ("non-premultiplied") alpha so that images with separate transparency masks can be stored losslessly. Most image processing programs stores images with unassociated alpha, to be able to manipulate RGB and alpha independently of one another, and not lose RGB data when zeroing out alpha.
pre-multiplied alpha channel
Another way is to store RGB values not raw, but premultiplied by corresponding alpha value, which is then called "associated alpha".
If an alpha channel is used in an image, it is common to also multiply the color by the alpha value. This is usually referred to as premultiplied alpha. "Premultiplied alpha", stores pixel values premultiplied by the alpha fraction. The alpha information of a pixel is not only stored in the alpha channel itself, but it is already "multiplied" into the red, green and blue channel. Rendering software prefers associated alpha, because with RGB values already multiplied by alpha, less work remains to be done in real time when doing alpha blending. TIFF support both types of alpha, but are frequently mis-labelled.
Answer
Paths are vector-based drawings that can stretch and re-shape and will not lose detail. In Photoshop, you can use a path as a vector mask for a layer. Vector masks, like paths, can be resized without loss of detail. You can denote one path to be a clipping path, and use it to define transparent areas in images. This allows you to isolate the foreground area and make everything else transparent.
With Scene7, you have the option to create a vector mask upon upload into SPS based on the clipping path. In addition, all path information, including clipping paths, can optionally be returned as part of any dynamically generated image response. It is also possible to use path information to dynamically define transparent areas of a layer or image.
In a future version of Scene7, it may also be possible to dynamically crop a layer or image based on a path.
Answer
Upon upload into Scene7, only the clipping path can be used to automatically create a mask. However, we do have support for referencing a named path included in the requested image which will mask out all of the image area that falls outside the path definition. This does not require extracting the path to a mask within SPS, since the path can be used through standard Scene7 Image Serving requests.
Answer
Scene7 does support referencing a named path included in the requested image which will mask out all of the image area that falls outside the path definition. This does not require extracting the path to a mask within SPS, since the path can be used with standard Scene7 Image Serving requests.
The image serving command is called clipPathE, and you can find documentation on this command here:
http://microsite.omniture.com/t2/help/en_US/s7/is_ir_api/index.html#is_api-http_ref-clipPath
Here are a couple of examples showing the use of clipPathE:
No path called, no transparency:
http://s7d4.scene7.com/is/image/ajhco/kidchair_clippingpath?wid=400&bgcolor=200,100,100
Path called, shows transparency:
Another image with different paths defined:
Answer
This functionality as added in our Spring 2014 release.
There are alternate approaches: The IPS API offers getPhotoshopPath and getPhotoshopPathNames. The image server can crop and mask based on path name.
Answer
Developer mode is used when you would like to create template without using the User Interface (UI) design tools. A template will go into developer mode if devmode=true is in the template, or if the parser is not able to parse the template.
Answer
The image serving documentation provides some information on the template request command:
http://microsite.omniture.com/t2/help/en_US/s7/is_ir_api/index.html#is_api-http_ref-template
From the documentation:
When template= is present, the object specified in the request path will not be applied as the source for layer 0, but can be referenced as a src= or mask= anywhere in the template by using the predefined path variable $object$ as a src= value. catalog::Modifier of the object specified in the request path is only applied in connection with the substitution of $object$ within the template, while catalog::PostModifier is always applied.
Here is an example:
http://testvipd4.scene7.com/is/image/ajhco/redjacket?$jbpreset$
http://testvipd4.scene7.com/is/image/ajhco/depot?$jbpreset$
Original URL:
http://testvipd4.scene7.com/is/image/ajhco?layer=0&size=360,270&src=ajhco/redjacket&layer=1&src=ajhco/ni_360_270_redborder&wid=360
add a new layer 0, to fix issue of hairline not appearing correctly. Layer 0 is downsized to 270x270 because the image is square, and layer 1 therefore is cropped to 270x270:
http://testvipd4.scene7.com/is/image/ajhco?layer=0&size=360,270&layer=1&size=360,270&src=ajhco/redjacket&layer=2&src=ajhco/ni_360_270_redborder&wid=360
Use the template feature to allow the template to be used in a preset:
http://testvipd4.scene7.com/is/image/ajhco/redjacket?template=jbsimpletemplate&wid=360
like so:
http://testvipd4.scene7.com/is/image/ajhco/redjacket?$jbpreset$ http://testvipd4.scene7.com/is/image/ajhco/depot?$jbpreset$
Here is the template (jbsimpletemplate):
devmode=true&layer=0&size=360,270&layer=1&src=$object$&size=360,270&layer=2&src=ajhco/ni_360_270_redborder&size=360,270
And the preset (jbpreset):
wid=360&fmt=jpeg&qlt=85,1&op_sharpen=0&resMode=sharp2&op_usm=1,1,6,0&iccEmbed=0&template=jbsimpletemplate
Answer
By design, only multiple layer PSDs can be converted to a template. A single later template has no advantage as a template and does nothing more that duplicating the number of assets for the company for the image and template.
