Fresh Blocks

iPad Mock-Up Tools

fresh blocks — Fri, 19 Feb 2010 19:42:24 +0000

The iPad Wifi version release is approaching quickly. Even just after the announcement, so people quickly jumped into creating stencils and other designing tools for mocking up iPad apps.

If you’re willing to pay up some money ($17.95), you can go ahead and check out UI Stencils‘ brand new iPad Stencil Kit. We just got ours in a couple days ago and are pretty excited about it.

New Year, New Data – iPhone vs Android

fresh blocks — Fri, 12 Feb 2010 18:11:45 +0000

The folks over at Flurry have released the new data reports for January.

Of interest to us and our clients is the data around the percentage of newly registered iPhone and Android app projects over time.

The Retention rate of apps are also of interest to us.

Check out the Flurry Blog for rest of the details around their data analysis. Do keep in mind that in order for Flurry to collect the data, the developers much add the Flurry Analytics code to their apps otherwise, Flurry cannot include it in their reports.

The Case for the iPad

fresh blocks — Mon, 01 Feb 2010 19:21:16 +0000

The Apple iPad is here. It’s been all over the news and it’s no big surprise now to anyone. We will be doing iPad apps for both our own apps and also for clients. You can choose from 3 different types now: iPhone only, iPad only, or “Universal” as Apple calls it, which works on both iPhone and iPad.

There’s been a lot of criticism about the iPad. Both good and bad. As with all things, nothing is perfect and there will always be that one thing that can tip a consumer either direction. As for Fresh Blocks? We’re actually very excited about it. So much so, that one of the iPhone apps we have been working on, makes much more sense now that we can do an iPad version of it.

Lack of Flash

Yes, the iPhone OS does not support Adobe Flash. No mystery there. It never has, I’m not sure if it ever will. Adobe has publicly made their case for the lack of Flash on the iPad following Apple’s announcement. You can read about it over here.

What the lack of Flash means right now, is that you cannot watch Hulu, some other video sites and also not play Flash-based games on the iPad. That’s pretty much it. It doesn’t mean much more than that. I just don’t see Flash getting into the core iPhone OS. If it does, Apple will also have to try to cater to Microsoft and allow Silverlight to get in as well. You can’t just let one in and not the other right?

Now, there are alternatives, HTML5 video and h264 is already supported on the iPhone and Youtube has recently created a non-Flash version of their site. Adobe may be fighting the wrong fight. They may just be trying to push their install-base further into every device possible, but as Jeffrey Zeldman put’s it:

“Apple’s decision to omit Flash from the iPad isn’t about revenge, it’s about delivering a stable platform. And with HTML5 here, the tea leaves are easy to read. Developers who supplement Flash with HTML5 may soon tire of Flash—but Adobe has a brief but golden opportunity to create the tools with which rich HTML5 content is created. Let’s see if they figure that out.”

Here’s hoping they figure it out sooner rather than later. As for the sites like Hulu? It’s really on them to decide how to proceed. Zeldman and other Web Standards would suggest going the Web Standards route of HTML5 video and it’s definitely a viable solution. It’s a standard and Flash isn’t. Flash is a plug-in. We mustn’t forget that.

The Portrait View

It seems appropriate to note that the resolution of the iPad is 1024×768. A dear old friendly resolution that yield things like the 960 Grid System. However, it seems as if the iPad can be read in Landscape view or Portrait view. As the demo showed and can be seen on the iPad’s website there are some websites that have chose to create portrait versions of their site. For example, the New York Times. A portrait view of your site may very well become important in the near future with a maximum width of 768 instead of 1024.

Excited?

You bet we are. And we’re not the only ones. Former Facebook iPhone app creator Joe Hewitt is as well. Apple seems to think there’s a middle ground between the smart-phone and notebook market. From what we’ve seen, there’s definitely a market for it. It’s not for the power users who want to run multiple applications at the same time and quickly jump around or for those who need power applications like Photoshop. But for those who just need to write a quick email or find map directions, the iPad definitely has a place. All in all, we can’t wait for it and are already cranking away on getting our iPad apps ready for sale when it comes out.

Differences Between Android and iPhone Development

fresh blocks — Wed, 27 Jan 2010 04:07:15 +0000

Google Android and Apple iPhone are currently battling out for market share. Data for December is now out. For developers, there are quite a bit of differences between iPhone and Android development. Deciding whether to choose one or do both?

	iPhone	Android
Fees	$99 Yearly	$25 One-time
Profit Cuts	30%	30%
Development Language and Environment	Objective-C, Cocoa Touch	Java, Java EE
Development Tools	XCode with DashCode, Interface Builder and iPhone Simulator	Eclipse with Android SDK Plug-in
Carrier/Network	AT&T	Verizon and T-Mobile
Current Version	3.1.2	2.1.0
Review Time	Approximately 2 weeks.	Open
Conference	Worldwide Developers Conference (WWDC)	Google I/O
Current Market Share (North America)	54%	27%

Lastly, Analysts at Gartner seem to believe that Android will overtake the iPhone in 2012.

Settings App or In-App Settings?

fresh blocks — Wed, 20 Jan 2010 21:55:50 +0000

Planning on having user specific options or settings for your iPhone app? Where do they go? What’s the easiest way to add it? What’s the Apple recommended way? The choices come down to either an in-app settings view or using Apple Settings app.

Apple’s Guidelines for Preferences

“Adding your application preferences to the Settings application is most appropriate for productivity-style applications and in situations where you have preference values that are typically configured once and then rarely changed. For example, the Mail application uses these preferences to store the user’s account information and message-checking settings. Because the Settings application has support for displaying preferences hierarchically, manipulating your preferences from the Settings application is also more appropriate when you have a large number of preferences. Providing the same set of preferences in your application might require too many screens and might cause confusion for the user.”

In App Settings

Putting your user preferences in your app seems to be the preferred way for users. The majority of users don’t go look at the Settings App to see if there are specific settings for your App. If you previously used Tweetie for the iPhone, you may have noticed that Settings were in the Settings app but have since moved to in app in Tweetie 2.

The obvious downside to this method, is that you must implement everything for the settings. This includes, saving and restoring the data, configuring the views and displaying them accordingly. Alternatively, there’s a new project on GitHub aimed at making all this a bit easier called InAppSettingsKit.

In-app settings does allow users to change their user preferences without leaving your app and coming back to it. This in-itself is a pretty big benefit to the user’s experience. Forcing a user to leave your app to change a setting isn’t something very pleasing. Another smaller benefit of doing in-app settings, is giving the developers the choice of how and where they want to save the information. Be it either in a file on disk, using Core Data or directly into a SQLite database. Not a terribly big benefit though. A final benefit of having in-app settings, is full control of the user interface for the settings. If you want to have multiple views for separate sections such as an Advanced section, Experimental section or even just a full text view for an About section. This can all be done with in-app settings, but not with Apple’s Settings app.

Resources

Settings App

The Apple preferred method for user preferences that are rarely changed. That pretty much encompasses the majority of user preferences that are set once and rarely ever changed again. Adding your app to the Settings app is extremely easy. Apple has basically taken care of everything. You will need to provide a small icon image in your app for the Settings App to display, but outside of that, the Settings Bundle will be able to handle most things, including Groups and Hierarchical preference panes.

The obvious downfall is that users may assume that if there’s no in-app Settings screen, that your app just doesn’t have an user configurable settings. This can be easily remedied by making sure to inform users that the Settings are located in the Settings App on first launch, noting it in your App Store description and any other methods you may have.

Resources

iPhone Application Programming – Application Preferences (iPhone Dev Center Account Required)

As a final note, and also an Apple recommendation:
You should never spread your preferences across the Settings app and in-app settings screens. If you have preferences, pick one solution and use it exclusively. Having both would only serve to further confuse your users.

iPhone Apps Launch Screens Guidelines and Showcase

fresh blocks — Mon, 18 Jan 2010 20:08:51 +0000

First impressions are important. So, it comes with App design that the launch screen the user will see first becomes your first impression (or second if you count the App’s icon) over and over again every time the user launches your app.

Apple’s iPhone Human Interface Guidelines

“To enhance the user’s experience at application launch, you should provide a launch image. A launch image looks very similar to the first screen your application displays. iPhone OS displays this image instantly when the user taps your application icon on the Home screen. As soon as it’s ready for use, your application displays its first screen, replacing the launch placeholder image.
It’s important to emphasize that the reason to supply a launch image is to improve user experience; it is not an opportunity to provide:
An “application entry experience,” such as a splash screen
An About window
Branding elements, unless they are a static part of your application’s first screen
Because users are likely to switch among applications frequently and quickly, you should make every effort to cut launch time to a minimum, and you should design a launch image that downplays the experience rather than drawing attention to it.
If you think that following these guidelines will result in a very plain, boring launch image, you’re right. Remember, the launch image is not meant to provide an opportunity for artistic expression; it is solely intended to enhance the user’s perception of your application as quick to launch and immediately ready for use. The following examples show you how plain a launch image can be.”

Apple also suggests that you“Avoid including elements that might look different when the application finishes launching, so that users don’t experience a flash between the launch image and the first application screen.

Guidelines, not Rules or Requirements

It’s important to remember that these are guidelines and not requirements for your app to get approved for the App Store. Apple isn’t actively policing your launch screens and does leave this area completely up to you.

Showcase of iPhone App Launch Screens

These apps follow Apple’s guidelines very well

Things

Facebook

Tweetie 2

Google

These apps stray from the guidelines

DropBox

Kindle for the iPhone

Bing

Mint

Skype

How to Add TextExpander Touch SDK to iPhone Apps

fresh blocks — Tue, 12 Jan 2010 18:50:07 +0000

TextExpander Touch was released August 25th, 2009. Along with it, came an SDK to allow other iPhone apps to integrate it’s expanding feature. For users of TextExpander Touch, having this feature can be quite handy. There are quite a few apps like Tweetie 2 that feature TextExpander integration.

Adding TextExpander Touch support to your iPhone app is extremely easy. The SDK comes with a both a README file and a sample application to show how it came be done.

If you’re more of a visual person, here’s a step by step tutorial on how to add support.

Requirements

You’ll want to go ahead and head on over here to download the latest version of the SDK. Also, if you currently use TextExpander for the Mac, you’ll want to turn it off while testing in the iPhone Simulator, as things could get confusing.

Adding the SDK

Copy the Device and Simulator Folders from the project into your XCode Project. You’ll want to make sure it creates the associated Groups so the 2 files don’t collide.
Copy over SMTEDelegateController.h to your XCode project.
Pick your XCode project (or Target app) and “Get Info” on it.
Navigate to “Build” and make sure “All Configurations” is selected
Click on “Library Search Paths” and then select “Add Build Setting Condition” from the Configuration at the bottom.
Select “Any iPhone Simulator” and Add the following “$(SRCROOT)/Simulator”
Repeat the same process for the “Any iPhone Device” and Add the following “$(SRCROOT)/Device”
Set “Other Linker Flags” to: “-l teEngine”
Finally, add the AddressBook and AudioToolkit frameworks to your project

Adding the Integration to UITextField and UITextView

In your view’s .h header file add the following:
#import “SMTEDelegateController.h”
In your view’s .m implementation file add the following:
Allocate and Initialize TE Touch Delegate, and assign them to UITextField and UITextView.
And finally, take care of Memory Management by releasing your allocated items.

Notes

You will want to copy the “Defaults.textexpander” file to your XCode project for iPhone Simulator testing, but do make sure to remove it from your app when building for Device and Releasing to the App Store. Alternatively, you can keep it if you allow users to disable TextExpander expansions as a setting in your app.

You’ll get a compiling warning every time with the SDK added due to the Device linking. You can always remove the Device part and add it in later when you’re ready to test on a device or release the app.

Stay updated with the TE Touch SDK by sending them an email on their website and also by joining the Google Group for TE Touch SDK.

And as a final note, please don’t violate their license agreement. The SDK Read Me file contains explicit instructions on what needs to be listed in the Feature List for your app and in your About screen.

Will you be adding TextExpander Touch integration to your next app?

7 Third-Party Frameworks and SDKs for iPhone Apps

fresh blocks — Mon, 11 Jan 2010 17:28:51 +0000

The Apple iTunes App Store is flooded. Back in November, Apple announced that developers have created over 100,000 apps for the App Store. You need to be different to stand out in such a big marketplace. One way to do that, is by adding special integration with Third Party services such as Google, Yahoo, and Facebook. The following frameworks and SDK can help you do just that.

Facebook’s Three20
Three20 is a collection of iPhone UI classes, like a photo viewer, and general utilities, like an HTTP disk cache. Three20 is derived from the Facebook iPhone app.
Facebook Connect
Just like the web version of Facebook Connect, the iPhone version allows you to integrate facebook into your app. Friends List, posting status updates, News Feed updates, and more Facebook features can be added to your app.
Yahoo! Social APIs
The Yahoo Social APIs makes it easy for developers to authenticate with OAuth, fetch user profiles and contacts.
Yahoo! Blueprint
Blueprint is Yahoo!’s platform for developing and distributing rich mobile Internet services. It uses XML to create applications. Yahoo!’s oneConnect iPhone app was built with Blueprint. More information is available at the Blueprint Developers page.
Google GData APIs
The Google Data API gives you access to just about every single Google product. This includes Analytics, Health, Picasa/Photos, Contacts, YouTube, Calendar, Docs, Blogger, Finance, Maps, etc.
TextExpander Touch
TextExpander touch integration offers users their TextExpander snippets that will expand when they enter their abbreviations in the application. For users who do use TextExpander to simplify their typing, it can be a very powerful feature.
PhoneGap
PhoneGap is an open source development tool for building fast, easy mobile apps with JavaScript. Since PhoneGap is device agnostic, it gives you a simple way to build apps that can go to the iPhone App Store, Android Market, and Blackberry Marketplace really quickly.

Bonus

Going the web app route? Make your web app look and function like a native app with PastryKit

PastryKit Resources

Hello TypeKit

fresh blocks — Wed, 06 Jan 2010 18:45:23 +0000

Fonts on the web has always been a bit of a problem child. Quite possibility one of the biggest differences between Print and Web design is the control a designer has over the fonts that can be used. Particularly, there is a small set of fonts that are considered Web Safe. Web Safe means that these fonts are likely to be present on a wide range of computers. Font Tester has a nice list here of these fonts.

Although, you are free to use any fonts you want, the likelihood that they are present in a user’s computer sometimes isn’t very high. And so, Scalable Inman Flash Replacement (sIFR) was created. Unfortunately, sIFR came with it’s own problems. It affects page loading time (from the multiple requests required for the Flash, JavaScript and CSS files used by sIFR). And the growing popularity of browser ad blocker plugins may decorate Flash content with a “block” button which can obscure the text. Another alternative that came out is Cufón. Instead of using Flash, Cufón uses a combination of JavaScript, JSON and either HTML5’s Canvas element or Vector Markup Language (VML).

The Case for TypeKit

The obvious case for these types of systems is the control the designer has on the look and feel of the websites they produce. Instead of giving users different experiences, they can get closer to offering the same experience to a wider audience. Typekit also helps out designers in one highly overlooked area. The legal aspect of fonts on the web. Since Typekit works directly with Font Foundries, it takes away the legal battles a designer could face by using copyrighted fonts in a manner that they were not suited for such as web redistribution.

The Case Against TypeKit

TypeKit has 4 different plans available for signing up. These are very akin to any other web service provided online. A small free trial one and a couple bigger ones. If you do use the Free trial, you will be required to have a small colophon added to your website. It’s very small, but it would be nicer if you were allowed to select where to display it or how to display it. I have no problem with the colophon per say, but a bit of customization would be nice.

The pricing is also very nice right now considering they’re providing an early discount for yearly purchases. However, outside of font fanatics, I just don’t see this catching on with small businesses or maybe even big businesses. Either way you look at it, it’s an added cost for fonts when the majority seem ok with the Web Safe ones. Hopefully I’m wrong on this and small businesses understand the value that Typekit has to offer with the different font foundries out there for a better more customizable web.

Resources

Alternative

Typotheque is an alternative to TypeKit. Here’s Andy Clarke’s take on it:
Testing Typotheque @font-face embedding | For A Beautiful Web

Why Do Photographer Websites Suck?

fresh blocks — Fri, 01 Jan 2010 20:55:56 +0000

Actually, that’s not true. Not all photographer websites are bad. But a very large majority of them are. And I’m not the only one who thinks so. Professional photographer, Scott Borne, recently wrote Five Reasons Why Photographers Should Build A Blog Rather Than A Website.

“I’ve visited 20 Flash-based photographer’s websites this week. I’ve been subjected to long load times, terrible – loud music, poor animation and a serious lack of good imagery.
– Scott Borne”

Scott spent a lot of time looking at photographers websites for a contest called: Emerging Photographer of the Year. I on the other hand, spent a lot of time looking at wedding photographers websites specifically to find a photographer for our wedding. Unsurprisingly, my fiancee and I ran into the same exact problems as Scott did.

It seems common practice for photographers to use Flash and have background music playing on their websites. My only guess, is that it’s for users to sit there and watch a slideshow of their images. Other than that, I don’t know why you need music. You’re a photographer, not a musician, singer, or song writer. You’re trying to sell your photos, not music. Odds are I’m already listening to music on my computer when visiting your site or I’m looking at it somewhere where I don’t need music to attract others, such as a coffee shop, bookstore, etc.

If your using Flash to prevent people from “stealing” your images by doing the whole “right-click” and “save image,” don’t bother. You’d have to somehow prevent the Print Screen button as well. If someone really wants to steal your image, they’ll find a way. Instead use a service like TinEye to find your images online to see if they’re being used without your proper copyrights. TinEye even has a bookmarklet and IE/Firefox plugins, so you don’t have to keep remembering the URL. Also, it’s really annoying if you don’t allow users to right-click. There are users who like to “right-click” and choose “Open in New Tab/Window.” Not everyone is out to get you!

I do disagree with Scott’s opinion that photographers should start blogs instead of a website. Instead, I do think photographers should have a website or at least Flickr or Picasa public account to share their photos for viewing. The photographers primary objective is to have their photos be seen by others and potentially get clients or sells their photos. A blog would be a good addition to a website for a photographer where they can expand on a photograph as to why they took it, techniques used and any other information that they may want to convey to their audience.

Scott’s 5 points are valid. Blogs are easy to start. They can be started for free. And you can style it to whatever you want it look like. There’s nothing wrong with using a CMS, such as WordPress, for your photography portfolio. Actually, I would recommend it, if you’re not already using Flickr or Picasa as well. Or even Posterous.

Free iPhone App Icons and Images Illustrator Template

fresh blocks — Fri, 18 Dec 2009 18:40:38 +0000

When you’re creating an iPhone app, there are a few images that you may need to create.

The main App icon
Dimensions: 57×57 px
Filename: icon.png
The mini App icon for spotlight search and settings screen
Dimensions: 29×29 px
Filename: Icon-Small.png
The splash/loading screen
Dimensions: 320×480 px
Filename: Default.png
The High Resolution Icon for the App Store
Dimensions: 512×512 px 72 DPI
Filename: lcon-Large.jpg

This template utilities Adobe Illustrator CS4’s new feature of Multiple Art-boards to keep everything for each App organized in 1 file.

All the image sizes are in pixels and the color is in RGB format.

Download

Fresh_Blocks_iPhone_App Template.zip
241 KB

License:

iPhone Artwork Illustrator Template by Fresh Blocks is licensed under a Creative Commons Attribution 3.0 United States License.
Based on a work at www.freshblocks.com.

The Project 52 Challenge

fresh blocks — Tue, 15 Dec 2009 02:06:17 +0000

We’re joining in on the fun that is the Project 52 challenge. Over 300 people have joined in already and it’s just about time to get started with 2 weeks left to go.

About Project 52

Project52 is a personal challenge geared toward getting fresh content on your website. The goal is to write at least 1 new article per week for 1 year. Because we all know what it‘s like to procrastinate on our content. A website is not just a fresh design that can be uploaded to the web and forgotten about!

The Project52 challenge will go from January 1st, 2010 to January 1st, 2011. It will be interesting to see how many of us make it that far.

The Fresh Blocks Goal

Our goal for the challenge will be to provide at least 1 quality post per week that can help both our clients and readers in furthering their knowledge of Web and Mobile Design/Development. This includes anything from CSS, HTML, jQuery to Android and iPhone App development.

We’re pretty excited about this challenge and believe we’ll be able to accomplish it. This isn’t a challenge for most professional bloggers, but we’re just not that. So in 2 weeks, the challenge begins!

Can we make it? Can you?

Join the challenge yourself over at the Project 52 website or follow @p52info on Twitter for progress updates.

Getting Set Up for Android Development on a Mac

fresh blocks — Tue, 10 Nov 2009 18:40:27 +0000

Getting set up for developing for Android on a Mac is super easy.

Downloads and Set up

Download and Install the Mac version of the SDK
http://developer.android.com/sdk/index.html
Download Eclipse and Install (if you don’t already have it) version 3.4 or newer is recommended.
http://www.eclipse.org/downloads/
Look in your home directory for .bash_profile file. Look for a line that sets the PATH environment variable and add the full path to the tools/ directory to it. If you don’t see a line setting the path, you can add one:
export PATH=${PATH}:/tools
You can create the .bash_profile if you haven’t already set one up on your machine.

Installing Android Development Tools (ADT)

Start Eclipse, then select Help > Install New Software.
In the Available Software dialog, click Add….
In the Add Site dialog that appears, enter a name for the remote site (for example, “Android Plugin”) in the “Name” field.
In the “Location” field, enter this URL: https://dl-ssl.google.com/android/eclipse/
Note: If you have trouble acquiring the plugin, you can try using “http” in the URL, instead of “https” (https is preferred for security reasons).
Click OK.
Back in the Available Software view, you should now see “Developer Tools” added to the list. Select the checkbox next to Developer Tools, which will automatically select the nested tools Android DDMS and Android Development Tools. Click Next.
In the resulting Install Details dialog, the Android DDMS and Android Development Tools features are listed. Click Next to read and accept the license agreement and install any dependencies, then click Finish.
Restart Eclipse.

Now modify your Eclipse preferences to point to the Android SDK directory:

Go to Eclipse > Preferences… to open the Preferences panel.
Select Android from the left panel.
For the SDK Location in the main panel, click Browse… and locate your downloaded SDK directory.
Click Apply, then OK.

Add the Android Platforms and Other Components

Open Eclipse and select Window >Android SDK and AVD Manager.

Select Available Components in the left panel. This will reveal all components currently available for download.
Select the components you’d like to install and click Install Selected. I suggest just installing everything, but that’s personal preference. You will want to get all of the Platform version for testing your app though.
Verify and accept the components you want and click Install Accepted. The components will now be installed into your existing Android SDK directories.

Tip: Use the “Display updates only” checkbox to show only the components you do not have.

What Versions to Support

Take a look at Google’s Device Dashboard for information on what versions of Android are currently being widely used. The data for the dashboard is regularly updated, but do keep in mind that the data is based on the number of Android devices that have accessed Android Market within a 14-day period ending on the data collection date. What this means, is that there will be devices out there that are not accounted for since the users did not visit the Android Market.

This is the dashboard as of 12/14/2009

That’s It

And we’re done. You’re all set for creating Android Apps. Go ahead and try making your Hello World app. And if that’s not advanced enough for you, Google also has a Notepad app tutorial.

Tracking iPhone/Android App Usage with Google Analytics

fresh blocks — Thu, 05 Nov 2009 00:29:39 +0000

Yesterday, Google announced the Google Analytics for Mobile Apps. What this adds, is the ability for you to track how your users are using your Mobile App.

Current Support

Analytics for Mobile Apps SDK is currently available for Android and iPhone use. The SDK currently tracks Events and Page Views.

Pageviews – The standard unit of measure for a traditional web site. It is used to calculate visits, session length, and bounce rate.
Events – The method used to track user interaction of a web site. It is used to track button clicks and similar user generated interactions. Events are grouped using categories and may also use per-event labels, which provides flexibility in reporting. For example, a multimedia app could could have play/stop/pause actions for its video category and assign a label for each video name.

Important Notes

The major downside to this type of tracking and currently all usage tracking methods, is the requirement of an Internet Connection. The connection is needed to upload the data to the Google Analytics servers for your research. The SDK will continue to track usage, but it will not be able to upload any data without a connection. This means, WIFI on an iPod Touch or either 3G or Edge on an iPhone or Android-based phone.

Also, Google requires that “you must indicate to your users, either in the application itself or in your terms of service, that you reserve the right to anonymously track and report a user’s activity inside of your app.” Something you should be doing without Google asking you somewhere in your Terms of Use agreement.

Current Known Issues

Possibly inaccurate timestamps – Timestamps are recorded at the time the application dispatches to Google Analytics, so if a user experiences long periods of offline use, the timestamps may not be 100% accurate.
Referrals/Traffic Sources – It is currently only possible to trace the campaign/referral source of an app download on Android. iPhone tracing is not currently available.

Instructions on how to add Google Analytics to your iPhone or Android app are available on the Analytics Tracking for Mobile Apps site.

How To Use Google APIs with iPhone SDK

fresh blocks — Mon, 08 Jun 2009 19:00:46 +0000

Adding Google API support to your iPhone App could not be any easier. Google provides Objective-C APIs for:

Google Base
Analytics – (Only available via SVN Trunk or manual download)
Blogger
Book Search
Calendar
Code Search
Contacts
Documents List
Finance
Health
Picasa Web Albums
Spreadsheets
Webmaster Tools
YouTube

Step 1

The first step, is to head on over to the Google Code website for the Objective-C Client, download and extract the zip file source code. Alternatively, you can get the latest and greatest version via Subversion using:

svn checkout http://gdata-objectivec-client.googlecode.com/svn/trunk/ gdata-objectivec-client-read-only

If you downloaded the zip file from the website, you’ll have version 1.7.0, and if you used the svn code you’ll have a -read-only folder.

Step 2

Open up the GData XCode Project from your downloaded folder as well as your iPhone App XCode project.

Step 3

Drag over the GData Sources Folder from the GData project to your iPhone App project and add it as reference [don't check the box for Copy items into destination group's folder (if needed).] You do not need to copy over all the files into your project. You can, but it’s not required.

This will add a ton of files to your project. You may delete the APIs you are not planning on using, but make sure that the files GDataXMLNode.m and GDataXMLNode.h in the Common/Optional/XMLSupport group are not removed from your project as they are required for iPhone builds.

Step 4

Open up the build settings for your iPhone App project. Located and set the following settings.

Header Search Paths: /usr/include/libxml2
Other Linker Flags: -lxml2

For the Debug build configuration only, add the Other C Flags setting so that the library’s debug-only code is included:

Other C Flags: -DDEBUG=1

Step 5 (Optional for iPhone 3.0 Beta SDK)

If you downloaded the zip file version (1.7.0) of the API, you will also run into this error message when you attempt to first build your iPhone App project:

...Source/Networking/GDataHTTPFetcherLogging.m:224: error: 'NSTask' undeclared (first use in
...Source/Networking/GDataHTTPFetcherLogging.m:224: error: 'task' undeclared (first use in this
function)

Apple has removed the NSTask from the Foundations Framework in the iPhone 3.0 SDK. In order to fix this, simply open up the GDataDefines.h file, find the developer section and add:

#define  GDATA_SKIP_LOG_XMLFORMAT 1

Note: This fix is only needed if you downloaded version 1.7.0 of the GData Objective-C API and are using iPhone 3.0 Beta SDK. If you downloaded the latest Subversion read-only trunk of the code or are using iPhone 2.2.1 SDK, you do not need to do this.

Step 6

At this point, your iPhone XCode project should build successfully and you can begin using the Google APIs by simply importing the appropriate header files. ie.

#import "GDataAnalytics.h"

Step 7 (Optional if downloaded GData version 1.7.0 Zip file)

If you downloaded the zip file version (1.7.0) of the API, you will be missing the Analytics API. That has not yet been zipped up for the download. You may want to download those separately.

Additional Resources:

How to change com.yourcompany in Xcode for iPhone Applications

fresh blocks — Wed, 11 Mar 2009 04:13:40 +0000

Having been doing some iPhone App development lately, I’ve run into one of the little issues abound. In order to test your application on an iPhone and also deploy it to the Apple iTunes App Store, you need to properly configure your application’s Bundle Identifier in your Info.plist file. All the books tell you this. And Apple makes it a point to tell you how to do this before you try to deploy on the App Store.

After creating App after App though, it becomes a very tedious task. I’ve searched far and wide online and couldn’t find anything that pointed me to how to change it. I did manage to find information on how to change it for developing Mac Desktop Applications. Didn’t really help my case too much.

In any case, what you’re looking for is in the directory path:
/Developer/Platforms/iPhoneOS.platform/Developer/Library/Xcode/Project Templates/Application

In there, you’ll find directories for each type of iPhone Application template that you can create from Xcode.

Navigation-Based Application
OpenGL ES Application
Tab Bar Application
Utility Application
View-Based Application
Window-Based Application

In each directory, there is a file called: Info.plist Here you can change your default Bundle Identifier by finding the Key String pair.

CFBundleIdentifier
	com.yourcompany.${PRODUCT_NAME:identifier}

Simply change yourcompany to your new default and save. Once you’ve done that. Any new iPhone App you create from Xcode’s iPhone Application templates will be pre-filled with your new identifier.

Much easier than fixing it for each new iPhone App you make. Hope this helps!

Creating the Fresh Blocks Site

fresh blocks — Fri, 30 Jan 2009 00:40:13 +0000

The Objective

A simple, clean, and fast website for potential clients to view our previous work, and for others to learn from us. It must be easy to add, remove and update content while at the same time allowing us the freedom to be creative. Here’s how we did it.

The Core

We carefully evaluated a couple of alternatives when going about choosing a publishing platform based on the requirements we had for our content.

WordPress

We ended up choosing WordPress for our publishing platform. We also tried out ExpressionEngine’s Core 1.6 and a pure HTML5 single page site. In the end, we chose WordPress for the extendability we get at the low cost of free.

jQuery

This was an easy choice. Since WordPress uses jQuery and includes it in tag already, we had no interest in potentially running into javascript conflicts by using Prototype or MooTools. Purely a decision made from personal preference. We’re also using the Google hosted version of jQuery.

Additional Functionality

Aside from creating an action WordPress theme for our website’s appearance, we had the need to add some functionality currently not in WordPress as the system is primarily a blogging platform.

Custom Project Write Panel

The major part of our website, is by far our Portfolio page that is used to showcase our work. As such, we needed to make adding future work simple, easy and fast. That required a custom panel for adding each individual project’s details. We created one similar to Function’s Revisited: Creating Custom Write Panels in WordPress article. Below a screenshot of our custom Project Details panel.

Thumbnails

We are currently using the built-in Media Library of WordPress and have set it up to automatically re-size the images for us for our specified sizes of Thumbnail (55×55 px), Medium (215×215 px) and Large (530×530 px). We use each individual size type in Project’s view to show the work. In addition to that, we’re also using a jQuery version of Lightbox to allow users to view a larger version of the images.

Different View Options – List vs Grid and Filtering

The last small bit of advanced functionality we wanted to add is a filtering option for the users to filter the list of projects to only the Service type they’re looking for. For us, that meant Android Apps, iPhone Apps, Web Apps or Website Design. While we were at it, we also went ahead and added the functionality to allow the users to see our projects as a thumbnail grid view or as a detailed list view. All this was done with some jQuery magic. NetTuts+ and DesignMag have some great tutorials on how to do it yourself.

The Need for Speed

Speed is important. One of the main objectives of the site is to minimize the load time. User experience is so important to us, especially since we want our potential clients to be able to jump around our site without having to wait for something to load. We made sure our website passed both CSS and HTML validation. And then ran them through both Google’s PageSpeed and Yahoo’s YSlow tools to measure our website’s performance. We then made sure to enable GZip Compression. We ended up having to do this through our Web Host’s CPanel system under Optimize Website. It was as simple as adding in all the Mime Types to the list.

We are not currently using a Content Delivery Network (CDN) such as Amazon S3 to offload our static content, but we are keeping that in mind for the future. We are using the W3 Total Cache plugin for WordPress to assist in minifying CSS, JS and caching.

Future Consideration

Aside from the possibility of going with a CDN for static content, we are looking forward to using TypeKit and better incorporating CampaignMonitor’s newsletters archive into our site.

Fresh Blocks

iPad Mock-Up Tools

New Year, New Data – iPhone vs Android

The Case for the iPad

Lack of Flash

The Portrait View

Excited?

Further Reading

Differences Between Android and iPhone Development

Settings App or In-App Settings?

Apple’s Guidelines for Preferences

In App Settings

Resources

Settings App

Resources

iPhone Apps Launch Screens Guidelines and Showcase

Apple’s iPhone Human Interface Guidelines

Guidelines, not Rules or Requirements

Showcase of iPhone App Launch Screens

How to Add TextExpander Touch SDK to iPhone Apps

Requirements

Adding the SDK

Adding the Integration to UITextField and UITextView

Notes

Will you be adding TextExpander Touch integration to your next app?

7 Third-Party Frameworks and SDKs for iPhone Apps

Bonus

PastryKit Resources

Hello TypeKit

The Case for TypeKit

The Case Against TypeKit

Resources

Alternative

Why Do Photographer Websites Suck?

Free iPhone App Icons and Images Illustrator Template

Download

License:

The Project 52 Challenge

About Project 52

The Fresh Blocks Goal

Can we make it? Can you?

Getting Set Up for Android Development on a Mac

Downloads and Set up

Installing Android Development Tools (ADT)

Add the Android Platforms and Other Components

What Versions to Support

That’s It

Tracking iPhone/Android App Usage with Google Analytics

Current Support

Important Notes

Current Known Issues

How To Use Google APIs with iPhone SDK

Step 1

Step 2

Step 3

Step 4

Step 5 (Optional for iPhone 3.0 Beta SDK)

Step 6

Step 7 (Optional if downloaded GData version 1.7.0 Zip file)

Additional Resources:

How to change com.yourcompany in Xcode for iPhone Applications

Creating the Fresh Blocks Site

The Objective

The Core

WordPress

jQuery

Additional Functionality

Custom Project Write Panel

Thumbnails

Different View Options – List vs Grid and Filtering

The Need for Speed

Future Consideration

Resources