Open for beta testing of your app

As I take a break from actively developing iOS apps I want to focus my attention of something else. One of the thing that I like to do is testing software. Great software. I've done it in the past for App Cooker, Grades 2.0 and a few others. So, if you are looking for serious help to test your iOS apps, I'm open to any request. Please not that I love www.testflightapp.com. (see review here: Building iPhone Apps: TestFlightApp: a complete review).

Poll: Are you attending WWDC 2011?

Poll: Do you use externally developed libraries in your apps?

App Cooker video preview

Want to know more about App Cooker? See this video.

EXCLUSIVE: App Cooker to become the best prototyping tool on iPad

iOS development landscape is doing very well. Developers keep coming to the iOS platform (more than 80 000 regisetred) and new applications keep coming in (last time I checked, there was more than 450 000 apps available for iOS devices). Building those apps requires a lot of time (for well designed apps this is surely the case). Tools to help developers are becoming more and more sophisticated. Once category of application that I follow closely is prototyping tools. Today, after many weeks of extensive testing, I'm pleased to post my complete review of a new prototyping tool called App Cooker.

App Cooker is built to support the developer or the designer in five areas: refining an idea, creating a nice application icon, designing the mockups, meeting the pricing challenge and finally preparing for the App Store. App Cooker uses Widgets for each of these tasks that are laid out on the application's App Board. Users can freely move between them with just two taps.

Creating a new project is simple: you select the device type, the default orientation, the project name then you set a default project icon in a very well design modal dialog box.

Well designed screens in App Cooker put the user in confidence

The application's App Board

Having an idea

App Cooker supports the developer in helping him define and refine his idea in three different ways. First, the definition statement space asks for an idea statement that should touch the differentiation or the solution and the target audience of the application. Next, the Type chart offers the developer to place an icon on a X-Y axis chart in order to provide corresponding advices. X axis correspond to the application usage and Y axis to the seriousness degree.

The third way is the evaluation of the idea. The developer judge his idea against five areas: idea, newness, ergonomy, graphics, interactivity. Depending of the ratings, a judgement is made by App Cooker. While trying this widget, I came across the best one: "You're going to be rich".

I like this widget because it provides the developer the opportunity to think about his idea and refine it before going too far in the design process.

The application's front door: the icon

The application's icon is the front door of your app. This is the first thing the user see in your app. Designing it with the right tools is a must. App cooker comes with a basic icon editor.

Icon widget of App Cooker

App Cooker provides the same graphic tools that you use in order to build visuals of the application UI: circle, square, etc. Also shown is the icon in all required resolutions for the Retina Display, iPad, Settings and Spotlight results. 

Creating mockups
Having an idea is nice but execution is the next step. This is where the mockup part of App Cooker comes into play. Having played with Blueprint for a while (a competitor to App Cooker), I must say App Cooker design in this area really shine. The mockup area contains a tool palette called the transformation bar located at the top where you can group, arrange, mirror, rotate resize or move selected objets. This palette can be hidden to make more room for the design area which is nice.

The transformation bar

At the bottom, the property bar allows you to act upon selected objects.

Property bar while a Navigation bar is selected

Property bar while a text box is selected

Each objects can be placed on the design canvas with great flexibility and precision. Tapping Size or Position on the transformation bar, you'll get a popover to change the attributes in a precise way with the use of the plus or minus. But, even cooler, tapping the number will extend the popover to show a keypad.

Creating mockups is done by selecting basic user interface elements (widgets) from a popover at the top right of the screen. You'll be able to use nearly all of the available native widget that Apple provides on an iOS device but a few are missing in this initial release: UITableView, SplitViewControllers, UIActionSheets, PopOvers and UIAlerts. These will be implemented in the coming releases.

Some of the supported widgets

Also included are many graphical primitives as shown in the the following popover.

App Cooker supports portrait and landscape orientations in design and preview mode which is very useful to build complete prototypes. In edit mode, both orientations are shown one the same canvas so you don't have to go back and forth while editing both orientations. In preview mode, rotating the device will show the respective screen. 

Screens supporting portrait and landscape mode

The prototype flow is created by linking screens together with the use of hotspots . These can be shown or hidden while in preview mode to guide the user where to tap the screen. Once a mockup is done, it can be tested in preview mode where you'll be able to "run" the application. To exit the preview mode, a tap with three fingers is required.

A rather complex prototype navigation overview

Setting the right price
How much should you sell your app? Well, it depends on many factors: how much did you pay for its development? Do you rent offices for your staff? How many copies do you plan to sell in the next couple of months? What if you consider the fact that this is an iPad app which make the potential market smaller? These are all the things that you'll be able to factor in with the Revenues and Expenses widget of App Cooker.

So you basically define the application's potential devices market size, sales period duration and optionally application in-app purchases, which pricing tier the application will be in, expenses of people, renting, equipment or anything else. You can set recurring or one time spending. These will be used to create a scenario with expected net income or net loss.

Scenario summary

Preparing for the App Store submission

App Store submission is a tedious process. You have to enter a lot of information that will serve the best to sell your application. With App Cooker, you use the Store widget to enter application name, description, promotional text, text localization, keywords, application classification just like you would do it on iTunes Connect while submitting your application for approval. This is nice. One thing that would be cool is the ability to export the information so that the developer can then do simple copy and paste into iTunes Connect to facilitate the submission process. As far as this release is concerned, the only export option is PDF file but exporting in text format will be added soon to the available choices. So it is doable but still, plain text file could be easier to copy and paste operations.

The Store widget fully supports localization. Panels for each country are presented as tabs so switching between localized versions is very easy to do. A nice touch is the bytes count shown for each field which are based on Apple's enforced limits. A byte count is more precise as accented characters account for two bytes,

This pop over is simply gorgeous

The information tab with general information about the application

On the right of the application's name, a green checkmark confirms the name will fit on the device home screen

If the application's name is too long, we see a red exclamation mark

Some functionalities and features are missing and it makes me anxious to get my hand on future releases: native prototyping for table views, export of Store widget metadata for use with iTunes connect, all iOS UI elements implementations to name a few. The maker of App Cooker told me they prefer to spend all the time it takes to polish a feature before releasing it. Good move.

Another issue is the use of an overly designed thing like the colour palette. This kind of thing is something pretty standard in design software and there is much more standard and effective way of presenting a colour palette.

Other interesting things
One thing to note is that App Cooker could be used in iOS programming class to teach the many aspects of building iOS apps. App Cooker has a very broad target market. Also very important, one of the gotcha with App Cooker is obvious when you use it to present your prototypes to your client. The reaction will be to make him think the application is almost ready! Imagine one day App Cooker generating all the code! Meanwhile, a project can be exported on a PDF document or sent by email as a whole.

Last words
According to Johann Fradj, the application developer, the next release will bring many new features including:

• more widgets
• augmented icon library
• improved bitmap drawing module
• wire framing (oh this one would be cool!)
• and a few surprises

While on the subject of the next features to be included in future releases of App Cooker, the user will be granted by this notice upon starting the application. It is clear the developer of App Cooker want the users to take into consideration upcoming features before giving a bad review. 

Conclusions

App Cooker offers a lot for a first release and according to the developer the best is yet to come. This application will become a must for a lot of iOS developers and designers. Everything in this application received a lot of design attention and thinking. They have been working on this for more than a year. So, every parts of the application is very polished and well integrated. I'm already anxious to get my hand on the next releases of App Cooker. You'll be able to get App Cooker in the next few days on the App Store.

Previous posts about iOS prototyping tools that were posted on my blog:

1. Prototyping tools for iOS app design: Part 1 - classification
2. Prototyping tools for iOS app design: Part 2 - Pen, Stencils
3. Prototyping tools for iOS app design: Part 3 - Bitmap based kits
4. Prototyping tools for iOS app design: Part 4 - Vector based kits
5. Prototyping tools for iOS app design: Part 5 - Applications

I want these! Really nice job

iOS 5 preview is around the corner. Everybody is waiting. Nobody knows what's in store for us. Everybody has wishes. Some have great and clear ideas of what they want to see in iOS 5. Check this out. Now.

4 things we'd LOVE to see in the next iOS from Color Monkey on Vimeo.

Nice video. Very nice implementation of iOS 5 notifications, widgets, shortcuts to settings and people. I want this now!

Another resource for great UI designs

Today, I stumble upon a new resource for iOS developers and designers called iPhone Screen Dump. The site is full of screen shots of great application designs. They are organized with tags like "User Profiles" or "Splash Screens".

I've spent a few moments their and l recommend this site. But, please change the ugly background! Way too much distractive.

More at http://www.iphonescreendumps.com/

Beyond the UISplitViewController

What is a UISplitViewController?
This view controller is only available on the iPad. In landscape mode, it is the reunion of two views: the left one often called the master view and the right one often called the detail or subordinate view. The relationship between the two is entirely done in code. In portrait mode, the master view becomes a pop over.

This view controller was created to take advantage of the iPad big screen compared to the iPhone. I guess it was created with the navigation interface in mind: the master - detail navigation found on the iPhone. The Split View Controller in landscape mode does not always produce visually great displays: cells on the subordinated view look often over sized horizontally.  This can be looked as "space filling" by a designer.  But did Apple go far enough? Looking at design trends since the iPad came in, I think the answer to this question is no. 

Table cells on the right look a bit over stretched

The Twitter client case

When Twitter released their client for the iPad, we all discovered a very special designed application. As you know, the official Twitter client on the iPad employs a screen that can be split in three different views. On the left, the usual master view is followed be what I would call the mid-view that displays the content of a tweet message and on the right the more detailed view which often is the content of a followed URL. I would call this screen organization the Master/Detail/More model.

Twitter pioneered the use of the Master/Detail/More display model

The case of Reeder for iPad

Reeder is one of my favourite iPad app. In Reeder, the left most view is a toolbar. This is a variation of the Master/Detail/More model. 

Remember The Milk case

Recently the web service Remember The Milk came out with their wonderful iPad client. The first thing I noticed about their application was the use of a similar screen organization like the Twitter client. In some situations, the application presents a forth view which is shown on the following screen shot.

In landscape orientation, Remember The Milk client will present of to four views at the same time

In portrait orientation, Remember The Milk client keeps the four view in place while keeping focus on the forth view

A closer look to the Master/Detail/More model

Here is a more complete and formal description of this new visual model. The master part display the root of the data model. The middle part is related to the selected object in the master view. The third part that I intentionally call "More" is very application and context specific. But in general it contains the content of an object selected in the middle view. By selected I mean an sub-object displayed in a cell-based organization (i.e an URL most of the time). There can be more than one "More" view (like in Remember The Milk). The major characteristics of this new content organization are:

1. The two right views are movable to allow the user to adjust how much information to display in the Mode part. 
2. The middle view can be tossed on the right in order to make the More view less apparent or even disappear. This is how the Twitter client behave.
3. The More part can take up to two third of the screen in landscape mode in order to maximize content display without completely losing track of the relationship to the underlying data model in effect.
4. In portrait mode, the More view can disappear to make more room available to the middle view.
5. There is no title bar because it wouldn't make any sense.
6. The left most view can be a toolbar in some cases (like in Reeder).

Conclusion

Apple came out with the split view on the iPad but they did not go as far as they could in providing ways to display more content on the iPad while keeping is elegant. Developers came out with solutions that are both visually nice while being a very effective model of user interaction. This what I call the Master/Detail/More model. Twitter was the first to innovate, followed by Reeder. Then came Remember The Milk implementation. All of them are example of innovation while staying on the side of simplicity and nice design. Bravo.

Do you have other application examples that uses the Master/Detail/More model? Post them in this post comment section!

Shipping an app with NSLog statements - maybe not

I'm currently working on a new release of one of my application. I'm using a lot of NSLog statements to see how different part of my application code is working. I have so many NSLog statement that I was wondering if I would let them there when submitting my application to Apple for review. So I created a poll "Do you ship applications with NSLog statements?" to see what other developers are doing with this. The survey says:

It is surprising to see that more than half of developers (not a scientific poll though) includes NSLog statements in their shipping applications. Is this a good idea? Well, maybe not. It depends of the output those statements create on the device console. It becomes really tricky considering this iPhone application called AppSwitch from Xcool. 

This application allows you to see the device's console. While it may be great to do debugging on the device with adhoc builds, shipping this to the world has to be seriously reconsidered. In the case of my application, I'm logging various events and variables content with sometimes humorous comments. If can also be a security breach if these statements reveals private information about the user using the application.

Poll: Do you ship applications with NSLog statements?