Jake recently designed a series of academic textbooks for Westview Press and it got us thinking… what would it take to convert the printed books into an eBook format? This post touches on the basics of creating eBooks, specifically modifying cover designs to the required specifications.

Overview

Electronic books were originally designed to display text with minimal images. For that reason, children’s books, cookbooks, comics, etc. do not translate well and often have trouble displaying correctly across platforms. A good rule of thumb is that eBooks work best for text-heavy novels and long, narrative articles (think best seller lists and The New Yorker). That being said, readers are constantly evolving and expected to soon support graphic-heavy books. In fact, Apple’s iOS devices already support fixed-layouts, so it is safe to assume other readers will soon do the same. Either way, eBooks still require a strong cover design to attract interest in the book.

eBook Formats

Any electronic book is considered an eBook, but over 90% of all eBooks are read on Amazon’s Kindle, Apple’s iOS devices (iPad, iPhone and iPod) and the Barnes & Noble Nook using these formats:

• EPUB: This is an open standard adopted by Apple (iOS), Barnes & Noble (Nook) and many other makers of eBook readers (such as Sony).
• Kindle: This is a proprietary format that Amazon uses for its Kindle, which is a modification of the Mobipocket format.
• PDF: PDF is inherently made for print and doesn’t display well on digital devices. But if you really need to get data out to an iOS or Android device now, then it’s a useful format.

Making Your eBook

There are multiple ways to create your eBook. Some of the most popular methods are:

• Amazon’s Kindle Direct Publishing (kdp.amazon.com): KDP is a fast, easy self-publishing tool that lets you publish your digital text content for the Amazon Kindle.
• Kindle Plugin for Adobe InDesign: Create Kindle books in-house using a free Kindle Plugin that converts your file to a Kindle format. You can download the plug-in at www.amazon.com/kindlepublishing.
• Outsourcing: Services such as Lulu and Smashwords will translate your Word document into an eBook format. In addition to creating your book, they will also submit it to Apple and Amazon bookstores for a small fee.
• Hand Coding: More on this in a future JakeIntel post.

eBook Covers Formats

Since eBooks are used on various platforms and purchased online, they require a few different cover formats:

• Embedded eBook Cover: The cover embedded inside your eBook that displays as the first page. This can and should be separately sized to each store’s specifications.
• Catalog Cover: The cover that shows up in the eBook store on Amazon, B&N, ect. Generally uploaded separately, and also used at a thumbnail size when displaying search results.
• Publicity Cover: This cover is used on your website, ads and other marketing materials. Size vary based on the application.

Cover Specifications

In addition to the various cover formats outlined above, each reader has slightly different size requirements. You can reference the chart below when creating your covers:

If you are unable to produce multiple covers, your best bet is to create a 600×800 JPG. This isn’t the optimal cover size for each reader, but it should cover all your bases. In addition to the sizes noted above, remember to convert all graphics to RGB. Any files submitted as CMYK will be rejected.

Designing Your Cover

In most cases you can simply resize your printed cover to fit the required specs, but occasionally a redesign is needed since not all covers translate well on screen or at smaller sizes. For example, a cover that uses gold leaf or embossing will not display well on screen. When redesigning your cover, it is best to stick with simple, but bold graphics and strong type treatments. Jake’s design for Supreme Decisions: Great Constitutional Cases and Their Impact is a perfect example of strong graphics and type that convert well to the Amazon Kindle and other e-reading devices:

What are Photoshop Scripts?

Scripts serve as a great tool to assist designers in increasing their workflow by automating repetitive tasks, customizing commands and even adding new features. Although they debuted way back with version 7, it is surprising how few people even know they exist. Originally scripts were an optional plug-in available via download, but today they come built into the program with a few useful scripts preloaded.

Scripting allows you to combine the power of Photoshop’s tools with custom programming. The feature allows users to write scripts using JavaScript, VB Script, or AppleScript, to do what you can’t with your mouse and keyboard—or simply don’t feel like spending your time on. The scripts are fairly basic, but for those of us not up to the challenge of learning to write custom scripts—there are plenty of freebies available online.

Why Scripts, Not Actions?

Photoshop Scripts are way more powerful than actions or batching and can be as smart as you make them. Some examples of the powers of scripting include:

• You can add conditional logic, so that the script automatically makes “decisions” based on the current situation. For example, you could write a script that decides which color border to add depending on the size of the selected area in an image: “If the selected area is smaller than 2 x 4 inches, add a green border; otherwise add a red border.”
• A single script can perform actions that involve multiple applications. For example, you could target both Photoshop CS2 and another Adobe Creative Suite 2 Application in the same script.
• You can open, save, and rename files using scripts.

Installing a Photoshop Script

Installing scripts is super simple. First download the script (or create your own), then save it into the specified scripts folder.

• PC: C:\Program Files\Adobe\Photoshop\Presets\Scripts\
• MAC: Applications > Photoshop > Presets > Scripts.

After copying a script to this folder you’ll need to Quit and then Restart Photoshop before the script appears in the File> Scripts menu.

Examples of Pre-loaded Scripts

Photoshop comes with a few useful scripts right out of the box. Once the program is installed, you can find them under File > Scripts. One example includes:

Layer Comps to Files
This one does exactly what it says, outputting your Layer Comps to separate files. Layer comps are an easy way to create “snapshots” of your comps in various states. Using the script, you can output the comps to various files types PSD, JPG, and GIF. If you have clients who like to see everything in PDF format, there’s also “Layer Comps To PDF” which outputs the layer comps into a single PDF document with multiple pages.

Examples of Free Add-On Scripts

As mentioned previously, you can find tons of free scripts online. Some scripter sites will even write custom scripts for you on request. A few timesaving scripts include:

Remove Copy From All Layers
If you create multiple comps and layers sets in your files and are anal like me, having the word “copy” in half your layers is an annoying Photoshop feature. It takes time to go through each layer and manually remove the word “copy”. Luckily, someone else thought the same thing and created a script to remove them all at once. It removes the word copy and also the number next to it, so “mylayername copy 12″ becomes simply “mylayername”.

Download the script here

NOTE: CS5 now has a built in option to turn this off, so you don’t need the script. You can set it in your layer palette options.

Text Export
This script will export all your layers to a text file so you can easily convert to HTML without having to copy and paste. For example, if you have 3 text layers:

(Layer 1) Lorem ipsum
(Layer 2) This is a headline
(Layer 3) Submit

You run the script and you get a text file with these contents:

Lorem ipsum
This is a headline
Submit

Download the script here

Links and References

Here are a few useful links to learn more about Photoshop scripts:

Trevor Morris Photographic

Jeff Tranberry

Adobe, Photoshop Scripts

PS-Scripts

Kirupa Tutorials

Typography is the art or process of printing with type. However, in modern usage typography includes all manner of non-printed letter forms such as websites, eBooks, electronic billboards, and even textiles. Through the use of type, a person can visually tell a story using little to no imagery. This post is intended to teach you about the anatomy of type and to help you better understand what to look for when choosing your next font.

First, the basics …

Typeface vs Font, What’s the difference?
A typeface, also called a font family, is a set of fonts designed with a stylistic unity, each comprising a coordinate set of glyphs. A font is a complete character set of a typeface at a particular size, weight, and style.

Serif vs Sans Serif, Which one to use?
Serif letters are drawn with features at the ends of their strokes. The serifs are the little feet we see in fonts like Times. These are some of the oldest type designs. The feet along the baseline help guide the eye from left to right, making them very ‘readable’ fonts.

Sans Serif (french for “without serifs”) are letters drawn with straighter lines and no feet. Their larger letterforms make them very legible, but can cause greater eye strain when used in long runs of text. Helvetica is considered the quintessential sans serif font.

The Anatomy of a Letter

There is a standard set of terms to describe the parts of a character. These terms, and the parts of the letter they represent, are often referred to as “letter anatomy” or “typeface anatomy.” By breaking down letters into parts, a designer can better understand how type is created and altered and how to use it effectively.

• Baseline – The baseline is the invisible line on which characters sit. While the baseline may differ from typeface to typeface, it is consistent within a typeface. Rounded letters such as “e” may extend slightly below the baseline.
• Meanline – The meanline falls at the top of many lowercase letters such as “e,” “g” and “y.” It is also at the curve of letters like “h.”
• X-Height – The x-height is the distance between the meanline and the baseline. It is referred to as the x-height because it is the height of a lowercase “x.” This height can vary greatly between typefaces.
• Cap Height – The cap height is the distance from the baseline to the top of uppercase letters like “H” and “J.”
• Ascender – The part of a character that extends above the meanline is known as an ascender. Note that this is the same as extending above the x-height.
• Descender – The part of a character that extends below the baseline is known as a descender, such as the bottom stroke of a “y.”
• Serif – Fonts are often divided into serif and sans serif. Serif fonts are distinguishable by the extra stroke at the ends of the character, known as a serif.
• Stem – The vertical line of a “B” and the primary diagonal line of a “V” are known as the stem. The stem is often the main “body” of a letter.
• Bar – The horizontal lines of an “E” are known as bars. Bars are horizontal or diagonal lines of a letter, also known as arms, and are open on at least one side.
• Bowl – An open or closed circular line that creates an interior space, such as in “e” and “b.”
• Counter – The inside of a bowl.
• Leg – The bottom stroke of a letter, such as the base of an “L” or diagonal stroke of a “K.”
• Shoulder – The curve at the beginning of a leg of a character, such as in an “m.”

Great Examples of Type-Only Design