---
title: Building watchOS app Interfaces Using the Storyboard
framework: WatchKit
role: collectionGroup
platforms: []
path: watchkit/storyboard_support/building_watchos_app_interfaces_using_the_storyboard
---

# Building watchOS app Interfaces Using the Storyboard

Create the user interface for your watchOS app by nesting stacks.

## Overview

watchOS apps use a simplified, stack-based layout model for their user interfaces. Xcode automatically groups elements into horizontal and vertical stacks, and you can fine-tune the layout by modifying the element’s attributes. Additionally, you can ensure that your interface works as expected on all Apple Watch sizes by using resizable elements and size-specific customizations.

As you add items to the storyboard, Xcode stacks them vertically, with each item on its own line ([Figure 1](building_watchos_app_interfaces_using_the_storyboard.md)).

![]()

Use Groups to create horizontal or vertical stacks ([Figure 2](building_watchos_app_interfaces_using_the_storyboard.md)). Groups don’t have a default visual representation, but you can configure a background color or image as needed. Nest Groups, as necessary, to create more complex layouts.

![]()

### Customize the Layout Using Attributes

You can fine-tune an interface element’s size and layout using the Attributes inspector. All interface elements have the following attributes:

Groups provide additional options to manage their content:

## Topics

### Controls

- [Connecting Your User Interface to Your Code](../connecting-your-user-interface-to-your-code.md)

### Navigation

- [Navigating Between Scenes](../navigating-between-scenes.md)

## See Also

### User interface basics

- [WKInterfaceObject](../wkinterfaceobject.md)
- [WKInterfaceController](../wkinterfacecontroller.md)
- [WKAlertAction](../wkalertaction.md)
- [WKAccessibilityImageRegion](../wkaccessibilityimageregion.md)
- [WKAccessibilityIsVoiceOverRunning()](../wkaccessibilityisvoiceoverrunning().md)
- [WKAccessibilityIsReduceMotionEnabled()](../wkaccessibilityisreducemotionenabled().md)
