Index
A
addAnnotation(), 98
Adobe Flash and iOS devices, 125
Adobe Photoshop’s Color Picker, 54
Aesthete Software, LLC, 187
Twitter account, 194–195
website, 194–195
alert sheets, Internet connectivity checks, 75–76, 99
Allsopp, John, 145
Anderson, Erin, 228
Android OS
jQTouch, jqt style, 175
NimbleKit for Android, 182
PhoneGap support, 173
Sencha Touch, 181
Titanium Mobile support, 178, 180
app binaries
debugging, 41–44
distributing, 44–46
provisioning, 41–44
submitting for review and placement, 213–219
testing
on devices, 41–44
on Simulator, 38–41
app bundles
contents, 31
.js files, adding, 76
submitting apps, 214
app design studio, 16
Apple Developer Agreement, 18–20
Apple Developer ID, 16–18
iOS SDK
Dashcode, 21
downloading/installing, 20–22
Interface Builder, 21
released versus beta versions, 22
Simulator, 21
Xcode, 21
NimbleKit, 22–23
app icons, 32–34
app IDs, 209–210
App Marketing and Identity Guidelines for Developers, 191–192
App Marketing Artwork License Agreement, 190, 191
App Store
app icons, required, 32–33
Apple ID versus Apple Developer ID, 17
Apple’s marketing assets, 189–190
Apple-approved language, 192–193
Apple-approved typography, 193
Available on the App Store badge, 190–191
official iOS device images, 191–192
applications available/downloaded, 4
designer’s identity
in Apple’s Enterprise Program, 188
as individual, 186–187
as your client, 188–189
as your company, 187
distribution method, provisioning profile, 213
product launch, 5
updates for apps, 197–200
URLs to app websites, 191, 194, 198
Appcelerator, 178–180
AppControls styling tool, 166–167
Apple, Inc.
from Apple Computer, Inc., 5
Enterprise Program, 188
marketing assets, 189–190
Apple-approved language, 192–193
Apple-approved typography, 193
Available on the App Store badge, 190–191
official iOS device images, 191–192
strategy changes, 5–6
trademarks and logos, 19
to Apple, Inc., 5
Apple II to Mac computers, 5
GUI (graphic user interface), 5
Apple Developer ID, 16–18
App Marketing and Identity Guidelines for Developers, 191–192
App Marketing Artwork License Agreement, 190, 191
Developer Agreement, 18–20
submitting apps, 213–219
Apple ID versus Apple Developer ID, 17
Apple II to Mac computers, 5
apple style, jQTouch, 175
Apple Worldwide Developer Relations, Certification Authority certificate, 208
Application Loader, 219
<article> element, 145
<aside> element, 145
audio
with HTML5, 116–118
with NKAudioPlayer, 118–123
audiocontrols object, 119
Available on the App Store badge, 190–191
B
badge, Available on the App Store, 190–191
battery charge indicator, 51
BlackBerry OS, PhoneGap support, 173
Blue Crowbar Software, 167
<body> element, 52
border-radius property, 168
Building iPhone Apps with HTML, CSS, and JavaScript, 175
Bundle ID, 214
buttonPressed functions, 120
C
<canvas> element, 146–147
categories for apps, App Store, 217–218
Cederholm, Dan, 151
cellular signal, status bars, 51
Certificate Assistant, 205–206
<class> versus <section> elements, 143
Classes folder, NimbleKit, 29–30
color
status bars, 51–52
Color Picker (Photoshop), 54
color-stop property, 164–165
communications for marketing apps, 193–194
app updates, 197–200
Apple’s marketing assets, 189–190
Apple-approved language, 192–193
Apple-approved typography, 193
Available on the App Store badge, 190–191
official iOS device images, 191–192
social media channels, 195–197
websites, 194–195
Content Strategy for the Web, 225
controls attribute, 126
CSR (Certificate Signing Request), 205–206
CSS3Please! styling tool, 168–169
CSS/CSS3 (Cascading Style Sheets)
@font-face property, Kernest web font services, 155–161
images in content, 83–84
lists, unordered, 80
maps/mapping
HTML button, 104–105
for iPad, 109–110
PhoneGap support, 173
properties
border-radius, 168
color-stop, 164–165
rgb, 54
text-shadow, 168
transform, 168
transition, 168
-webkit-box-shadow, 131
-webkit-gradient, 162–165
Sencha Touch support, 181
styling tools, 165–166
AppControls, 166–167
CSS3Please!, 168–169
D
Dashcode iOS SDK free tool, 21
designers
app development
content strategy, 224–228
planning, 229–233
usability, 234–240
app development, studio, 16
Apple Developer Agreement, 18–20
Apple Developer ID, 16–18
iOS SDK, 20–23
NimbleKit, 22–23
marketing identity
in Apple’s Enterprise Program, 188
as individual, 186–187
as your client, 188–189
as your company, 187
desktop versus mobile apps, 7–8
Detail View pane, Xcode, 28
app icons, 35
Dev Center. See iOS Dev Center
Developer Agreement, Apple Developer ID, 18–20
Developer Guide, iTunes Connect, 32
Developing with Web Standards, 145
development certificates, 205–207
Development Provisioning Assistant, 42, 44, 208–211, 214
Development Provisioning Profiles, 208–211
diagnostic tools, iOS SDK free tool, 21
distribution certificates, 205, 207–208, 212–213
Distribution Provisioning Profiles, 44–45, 212–213
<div> versus <section> elements, 142–143
<dl>, <dt>, and <dd> tags, 70–71
Don’t Make Me Think, 234
Duck, Josh, 147
E – F
Editor View pane, Xcode, 28
Enterprise Program (Apple), 188
EULA (End User License Agreement), 218
Facebook, marketing apps, 194–195
Flash and iOS devices, 125
@font-face property, 154–155, 168
Kernest web font services, 155–161
fonts
installed on iOS devices, 154
Kernest web font services, 155–161
<footer> element, 144
Frameworks folder, NimbleKit, 29–30
G
geographic center, map views, 97
Google Maps
Google Maps API, full version, 94
longitude and latitude, 97
NimbleKit API, 94
opening in Maps app, 108
versus Safari, 99
View in Google Maps button, 95
gradient property, 161–162, 168
color-stop, 164–165
-webkit-gradient, 162–165
grouped table views, 63–65
Groups & Files pane, Xcode, 28
GUI (graphic user interface), 5
H
Halvorson, Kristina, 225
Handcrafted CSS, 151
Hawryluk, Zoltan, 168
<head> element, 52
<header> element, 144
HTML folder, NimbleKit, 29–30
HTML/HTML5
<article>, 145
<aside>, 145
<canvas>, 146–147
<class> versus <section>, 143
<div> versus <section>, 142–143
<dl>, <dt>, and <dd> tags, 70–71
<header> and <footer>, 144
images
inline, 82–83
overlays, 85–86
Internet connectivity checking, 78–80
lists
definition, 70–72
maps/mapping
CSS-styled button, 102–104
NKButton, 96
<nav>, 146
Periodic Table of the (HTML5) Elements, 147
PhoneGap support, 176–178
<section>, 142–143
Sencha Touch support, 181
table views, 73–74
<video, 126–132
hybrid map type, 97
I
IDE (integrated development environment), Xcode, 16, 21, 25
images
assigning CSS class, 82–84
inline, 82–84
in overlays, 84–90
showing/hiding, 87–90
table view navigation, 60–63
insertCategoryNamed, 65
Interface Builder iOS SDK free tool, 21
Internet connectivity checks, 75–76
iOS Dev Center, 21
App Marketing and Identity Guidelines for Developers, 191
Apple Worldwide Developer Relations, Certification Authority certificate, 208
iOS Provisioning Portal, 41–42, 44–45, 204
App ID, 209–210
Apple development device, 210–211
Certificate Assistant, 205–206
CSR (Certificate Signing Request), 205–206
development certificates, 205–207
Development Provisioning Assistant, 208–211, 214
Development Provisioning Profiles, 208–211
distribution certificates, 205, 207–208, 212–213
Distribution Provisioning Profiles, 44–45, 212–213
Keychain Access, CSR (Certificate Signing Request), 205–206
Keychain Access, installing certificates, 207–208
language requirements, 193
official iOS device images, 192
iOS device testing, 41–44
Kernest fonts, 159
maps, 102
warning, 99
iOS Provisioning Portal, 41–42, 44–45, 204
App ID, 209–210
Apple development device, 210–211
Certificate Assistant, 205–206
CSR (Certificate Signing Request), 205–206
development certificates, 205–207
Development Provisioning Assistant, 208–211, 214
Development Provisioning Profiles, 208–211
distribution certificates, 205, 207–208, 212–213
Distribution Provisioning Profiles, 44–45, 212–213
Keychain Access
CSR (Certificate Signing Request), 205–206
installing certificates, 207–208
Internet connectivity checks, 75–76
standard size for iPod touch and iPhone, 50
status bars, 50–53
tab bar navigation, 51
with categories, custom, 56–58
with categories, standard, 55–56
table view navigation, 58
with grouped views, 63–65
with images, 60–63
with plain views, 58–60
title bars, 53–55
versus windows, 50
iOS SDK (Software Development Kit)
Dashcode, 21
Developer versus Applications directories, 22
downloading/installing, 20–22
Interface Builder, 21
released versus beta versions, 22
Simulator, 21
Xcode, 21
iPad
dimensions
status bar, 53
tab bar, 58
title bar, 55
width, table view, 65
fonts installed, 154
jQTouch support, 174
versus laptops, 8
orientation, both portrait and landscape mandatory, 128
projects, new, 27
specifications, size/name
app icons, 32–33
launch graphics, 37
tabs allowed, 57
testing apps on Simulator, 40–41
Titanium Mobile support, 178
video
with HTML5, 126–132
with NKVideoPlayer, 133–138
iPhone
applications available/downloaded, 4
Clock app, launch graphics, 36
dimensions
status bar, 53
tab bar, 58
title bar, 55
width, table view, 65
fonts installed, 154
jQTouch support, 174
Maps app, not available in Simulator, 41
number sold, 4
PhoneGap support, 173
product launch, 6–7
projects, new, 27
specifications, size/name
app icons, 32–33
launch graphics, 37
tabs allowed, 57
testing apps on Simulator, 40–41
Titanium Mobile support, 178
universal apps, 133
video, with NKVideoPlayer, 133–138
iPhone 4
dimensions
status bar, 53
tab bar, 58
title bar, 55
width, table view, 65
fonts installed, 154
jQTouch support, 174
PhoneGap support, 173
specifications, size/name
app icons, 32–33
launch graphics, 37
tabs allowed, 57
testing apps on Simulator, 41
Titanium Mobile support, 178
universal apps, 133
video, with NKVideoPlayer, 133–138
dimensions
status bar, 53
tab bar, 58
title bar, 55
width, table view, 65
fonts installed, 154
jQTouch support, 174
life content from business content, 6–7
product launch, 5
specifications, size/name
app icons, 32–33
launch graphics, 37
strategy change, 6
tabs allowed, 57
Titanium Mobile support, 178
universal apps, 133
video, with NKVideoPlayer, 133–138
Irish, Paul, 168
iTunes App Store
app icons, required, 32–33
Apple ID versus Apple Developer ID, 17
Apple’s marketing assets, 189–190
Apple-approved language, 192–193
Apple-approved typography, 193
Available on the App Store badge, 190–191
official iOS device images, 191–192
applications available/downloaded, 4
designer’s identity
in Apple’s Enterprise Program, 188
as individual, 186–187
as your client, 188–189
as your company, 187
distribution method, provisioning profile, 213
product launch, 5
updates for apps, 197–200
URLs to app websites, 191, 194, 198
iTunes Connect account
app version numbers, 38
Developer Guide, 32
Distribution Provisioning Profiles, 212–213
financial control, 189
submitting apps for approval, 46, 213–219
Application Loader, 219
iTunes Connect Developer Guide, 32
J
JavaScript, 10
audio, 120
Internet connectivity checking, 77–78
landscape orientation, 128
maps/mapping
HTML button, 105–108
for iPad, 110–112
NKButton, with NKMapView, 96–102
onClick event, 106
PhoneGap support, 173
placement at beginning of body, 29
Sencha Touch support, 181
status bars, color change, 52
tab bars, 55–57
grouped tables, 64–65
title bars, 54
video, 133
jqt style, jQTouch, 175–176
jQTouch, 174–175
with PhoneGap, 175–178
jQuery, 10
K
Kaneda, David, 175
Kernest web font services, 155–161
Keychain Access
CSR (Certificate Signing Request), 205–206
installing certificates, 207–208
Krug, Steve, 234–235
L
dimensions
status bar, 53
tab bar, 58
title bar, 55
width, table view, 65
mandatory for iPad, 128
launch graphics, 35–37
EULA (End User License Agreement), 218
NimbleKit, 44
logos (Apple), 19
M
Mac, from Apple II computers, 5
Mac OS desktop computers, Titanium Developer, 179–180
mapsButton, 99
maps/mapping and Google Maps views
pulling in
with CSS-styled HTML button, 102–108
with CSS-styled HTML button, for iPad, 108–112
with NKButton and NKMapView, 94–102
shortcoming for app designers, 94, 99
marketing apps
alternative communications, 193–194
app social media channels, 195–197
app updates, 197–200
app websites, 194–195
to App Store
Apple’s marketing assets, 189–193
designer’s identity, 186–189
Mobile Safari, opening links, 76–77
mobile versus desktop apps, 7–8
MPEG-4 (.m4v) files, 126–127
N
<nav> element, 146
Neal, Jonathan, 168
NimbleKit apps/projects, 26
adding files to, 34–35
building, 44–46
debugging, 41–44
distributing, 44–46
file structure and contents, 29–30
home screen icons, 32–33
HTML folder, 29–30
images and text
overlays, 84–90
top of content, 84–86
Internet connectivity checking, 75–76
iOS interface
status bars, 52
tab bars, 55–57
table views, 59–65
title bars, 54
iTunes App Store icons, 32–33
launch graphics, 35–37
maps/mapping, 94–102
naming
versus final app names, 27
recommended characters, 31–32
renaming, 30–32
screen and iTunes App Store names, 32
new, 26
product selection, 27
provisioning on devices, 41–44
Spotlight search icons, 32–33
submitting, 44–46
testing on devices, 41–44
testing on Simulator, 38–41
text
definition lists, 70–71
ordered lists, 68
table views, 72–74
versions, 38
versus Xcode and Objective-C, 26
NimbleKit for iOS, 11–12
downloading/installing, 22–23
Nitobi, Inc., 172
versus <audio> element, 146
NKButton, 95, 99–102, 103, 106
NKImage, 61
NKImageView, 84–90
NKIsInternetAvailableViaCellularNetwork, 75–76
NKIsInternetAvailableViaWifi, 75–76
NKIsPageSupportsAutoOrientation, 128, 134
NKMapView, 97–102
NKNavigationController, 54–55, 149
NKOpenURLInSafari, 77
NKTabBarController, 56–57
NKTableView, 59
versus <video> element, 146
nondisclosure agreement, Developer Agreement, 19
O
Objective-C, 10–11
NimbleKit, 11–12
downloading/installing, 22–23
versus Xcode and NimbleKit, 26
onClick event, 106
openInMaps(), 98
orientations for screens, 51, 53
dimensions
status bar, 53
tab bar, 58
title bar, 55
width, table view, 65
portrait and landscape mandatory for iPad, 128
Other Sources folder, NimbleKit, 29–30
P – Q
Palm OS, PhoneGap support, 173
Periodic Table of the (HTML5) Elements, 147
PhoneGap, 172–173
with jQTouch, 175–178
versus other mobile frameworks, 182
Photoshop’s Color Picker, 54, 149
dimensions
status bar, 53
tab bar, 58
title bar, 55
width, table view, 65
mandatory for iPad, 128
poster attribute, 126
pricing apps, 214–215
R
Red-Green-Blue-Alpha (RGBA), 149–153
Resources folder, NimbleKit, 29–30, 34–35, 37
restrictions, Developer Agreement, 19
rgb property, 54
RGBA (Red-Green-Blue-Alpha), 149–153, 168
S
satellite map type, 97
screens. See iOS screens
<script> element, 52
<section> element, 142–143
Sencha Touch, 180–182
versus other mobile frameworks, 182
Sender, Boaz, 168
setDisplayRegion(), 97
setMapType(), 97
setStatusBarStyle(), 52
setTimeout(), 98
setTintColor(), 54
setTitle(), 54
setUserLocation(), 98
showUserLocation(), 98
Simulator
iOS SDK free tool, 21
testing apps, 38–41
AppControls buttons, 167
gradients, 163
Kernest fonts, 158–161
maps, unavailable, 102
Titanium Mobile’s Kitchen Sink demo, 180
social media channels, marketing apps, 195–197
Spotlight search icons, 32–33
standard map type, 97
Stark, Jonathan, 175
status bars, 50–53
styling tools, 165–166. See also CSS/CSS3 (Cascading Style Sheets)
AppControls, 166–167
CSS3Please!, 168–169
submitting apps for approval, 44, 46, 213–219
Application Loader, 219
Symbian OS, PhoneGap support, 173
T
tab bar navigation, 51
with categories, custom, 56–58
with categories, standard, 55–56
table view navigation, 58
with grouped views, 63–65
with images, 60–63
with plain views, 58–60
tableView, 60
tax identification numbers and Apple Developer ID, 17
testing apps
on devices, 41–44
Kernest fonts, 159
maps, 102
maps, warning, 99
on Simulator, 38–41
AppControls buttons, 167
gradients, 163
Kernest fonts, 158–159
maps unavailable, 102
text
Apple-approved typography, 193
definition lists, 70–72
ordered lists, 68–70
social content integration, 75–81
table view, 72–74
Twitter as content management system, 75–81
text-shadow property, 168
time, status bars, 51
Titanium Developer, 179–180
Titanium Mobile, 178–180
versus other mobile frameworks, 182
title bars, 53–55
trademarks (Apple), 19
transform property, 168
transition property, 168
as content management system, 75–81
marketing apps, 194–195
feed to website, 195
U – V
UI (user interface), native and custom controls, 9–10
updates, marketing apps, 197–200
Van Buren, Garrick, 155
verification, Apple Developer Agreement, 20
versions of apps/bundles, 38, 216–219
video
with HTML5, 126–132
with NKVideoPlayer, 133–138
Visualizing the World Cup4 and Visualizing the Stanley Cup5 websites, 146
VolnaTech, NimbleKit for Android, 182
W
web app design
Dashcode, 21
jQTouch, 174–175
Web Style Guide, 229
-webkit-box-shadow property, 131
-webkit-gradient, 162–165
websites, marketing apps, 194–195
windows versus iOS screens, 50
Worldwide Developer Conference (WWDC), 18–19
WWDC (Worldwide Developer Conference), 18–19
WWDR intermediate certificate, 208
X – Z
Xcode
app binaries
debugging, 41–44
distributing, 44–46
provisioning on devices, 41–44
testing on devices, 41–44
testing on Simulator, 38–41
app bundles
contents, 31
versions, 38
app icons, 32–34
Detail View pane, 28
app icons, 35
Editor View pane, 28
file structure and contents, 29–30
Groups & Files pane, 28
files, adding, 34–35
files, launch graphics, 37
IDE (integrated development environment), 16, 21, 25
iOS SDK free tool, 21
launch graphics, 35–37
NimbleKit apps
Classes folder, 29–30
file structure and contents, 29–30
Frameworks folder, 29–30
HTML folder, 29–30
licensing, 44
Other Sources folder, 29–30
Resources folder, 29–30, 34–35, 37
status bar color change, 52
versus Objective-C and NimbleKit, 26
projects, 26
adding files to, 34–35
building, 44–46
file structure and contents, 29–30
home screen icons, 32–33
HTML folder, 29–30
iTunes App Store icons, 32–33
naming, renaming, 30–32
naming, versus final app names, 27
new, 26
provisioning on devices, 41–44
Spotlight search icons, 32–33
submitting, 44–46
testing on devices, 41–44
testing on Simulator, 38–41
Yahoo! User Interface. See YUI
Yale Web Style Guide website, 229
YUI (Yahoo! User Interface), 10