App Development

storyboard for app development

iOS User Interfaces: Storyboards vs. NIBs vs. Custom Code  June 8, 2017 – 10:14 am

This iOS development tutorial seeks to explore the difference between 3 approaches to iOS UI design.What’s the best way to develop a UI in iOS: through Storyboards, NIBs, or code?

Answers to this question, explicitly or implicitly, tend to assume that there’s a mutually exclusive choice to be made, one that is often addressed upfront, before development.

I’m of the opinion that the answer instead should take the form of one or more counter questions.

What’s the “best” car?

Let me explain with an off-topic example. Say I want to buy a car and I ask you one simple question: “What’s the best choice?”

  • What’s your budget?
  • How many seats do you need?
  • Do you care about fuel consumption?
  • How do you feel about sports cars?

It’s obvious that there’s no such thing as a good or bad car unless it’s placed in a proper context—there’s just a good or bad car based on specific needs.

Back to iOS UI Design

Just like with our car inquiry, the “What’s the best way to develop an iOS UI” question lacks context. And surprisingly enough, the answer need not be a catch-all case.

Broadly speaking, there are three types of user interface design approaches that you can take, each with its pros and cons, its fans and haters:

  • iOS Storyboards: A visual tool for laying out multiple application views and the transitions between them.
  • NIBs (or XIBs): Each NIB file corresponds to a single view element and can be laid out in the Interface Builder, making it a visual tool as well. Note that the name “NIB” is derived from the file extension (previously .nib and now .xib, although the old pronunciation has persisted).
  • Custom Code: i.e., no GUI tools, but rather, handling all custom positioning, animation, etc. programmatically.

None of these options are universally better than any other (despite what you might hear).

This diagram illustrates one iOS user interface design project that uses Storyboards, NIBs, and custom iOS code.Storyboards, for example, are the latest addition to the iOS UI toolkit. I’ve been told that they’re the future, that they will replace NIBs and custom code UIs. I see Storyboards as a useful tool, but not so much a replacement as a complement for NIBs and custom code. Storyboards are the right choice in some, but not all situations.

Further, why should you statically stick to a single option when you can use them all (in the same project), picking the mechanism that best fits the specific problem at-hand?

This is a question that can be, in my opinion, generalized at a higher level, and whose answer is ranked highly in my list of software development principles: There is no universal language, framework, or technology that is the universal best choice for every software development problem. The same is true for iOS UI design.

In this iOS development tutorial, we’re going to explore each of these methods and introduce use cases in which they should and should not be employed, as well as ways in which they can be blended together.

iOS Storyboards

A classic beginner’s mistake is to create one massive project-wide iOS Storyboard. I too made this mistake when I first started working with Storyboards (probably because it’s a tempting route to take).

A classic beginner’s mistake is to create one massive project-wide Storyboard. A Storyboard is a board with a story to tell. It shouldn't be used to mix unrelated stories into one big volume.

As its name implies, a Storyboard is a board with a story to tell. It shouldn’t be used to mix unrelated stories into one big volume. A storyboard should contain view controllers that are logically related to each other—which doesn’t mean every view controller.

For example, it makes sense to use Storyboards when handling:

  • A set of views for authentication and registration.
  • A multi-step order entry flow.
  • A wizard-like (i.e., tutorial) flow.
  • A master-detail set of views (e.g., profiles lists, profile details).

Meanwhile, large Storyboards should be avoided, including single app-wide Storyboards (unless the app is relatively simple). Before we go any deeper, let’s see why.


Related posts:

  1. Software for mobile app development
  2. How to start iOS app development?
  3. Step by step iOS app development
  4. Best laptop for app development