At this point in our book app process, we will begin to look at each individual page and each layer on that page. There are a few points that we need to discuss before we can begin.

Full Sized Graphic Layers

The graphic on the bottom (background) layer of every page of our book app MUST HAVE the same height and width dimensions as the screen for our target device. Because it's one solid layer and doesn't have any transparent areas, we can export this layer as a jpg image.

Mobile devices have limited memory and will crash if an app uses more than it should. We can reduce the size of the background graphic file that will be loaded into memory by exporting the layer as a jpg image, which has a much smaller file size than the png image format. We can do this with any layer that has the same dimensions as the iPad screen.

Graphic Layers with Transparency

The objects on the other layers do not cover the entire layer. Therefore these layers do have transparent areas. For example, the small Enter button is on one layer. The button graphic object is only 165 x 115 pixels and the rest of the layer is empty. Unlike the jpg image, which can only be made up of solid colored pixels, a png image can have transparent pixels. So we will not use the option to export the layer as a jpg image and Kwik will know to export the layer in the default png image format.

Shared Assets

Some layers might contain a shared asset, such as a button. A good example of this are the navigational button layers. Each page of our book will have a Next and Back button, each on its own layer. The only exceptions are the cover and last page of the book, which will only have one navigational button. As you can imagine, if we had a 50 page book app and exported these buttons for every page of the book, we would have about 100 png button images. However, we only really need to export one graphic for each button and the app can reuse that button image on each page. This is done by setting the buttons as Shared Assets.

We will add these navigational buttons to our template and tell Kwik which buttons (Pages, Back and Next) are shared assets. By doing this, Kwik will know to export only one Pages, Next and Back button graphic for the entire project. It will also know to display these buttons on every page and remember what actions should occur when these buttons are clicked. Using only three button images instead of 100 images will reduce the amount of memory our app will need to run on the mobile device.

Of course, not all layers will contain shared assets. Some layers will have one-of-a-kind objects such as a movie clip animation that only appears once in our app. When setting the Layer Properties for this type of layer, we will need to export the layer as a png (Kwik does this by default) and not as a shared asset or jpg image.

Copyright 2018 Adobe Systems Incorporated. All rights reserved. Adobe product screen shot(s) reprinted with permission from Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst and Flash Paper is/are either [a] registered trademark[s] or a trademark[s] of Adobe Systems Incorporated in the United States and/or other countries.
Kwik product, the Kwik logo and Kwiksher are properties of Kwiksher.com - Copyright 2011. Screen shots used by permission.

These tutorials are for the older version of Kwik 2 and may not be much help when using Kwik 3 and above. If you are having trouble, please use the Kwik forum.