Part 1: Hello World

Create your first Skylight Application.

Time Required: 5 Minutes

Today we’re going to show you just how fast you can start building Skylight applications. In just 5 minutes you’ll create and deploy a wearable application.

Setup

Before we get started, let’s make sure everything is ready for you to work. Please make sure you have gone through the setup steps in Part 0: Setup.

Hello World!

It wouldn’t be a Getting Started tutorial without a Hello World example, so that’s exactly what we’re going to create. This simple application will form the basis for the rest of the Getting Started series.

Skylight divides user interface elements into groups of “cards” that are organized into “views". Today we’ll create two simple cards in the default root view of a new application and then publish the application.

1. Open Chrome and go to the Skylight web portal.

2. Login with your Skylight credentials.

3. Once logged in, click on the Applications in the Application Dashboard section of the menu on the left-hand side of the screen.

4. This is our first time, so we won’t have any applications by default. Click on the New Application button on the lower right corner of the screen to create a new application.

5. Select Blank app (rather than importing an application).

6. Let’s call our first application Quick Start and click Create App.

7. When you create a new application, a default view called root is automatically created for you. You should see this reflected in the left-hand view explorer. For this tutorial, we’ll simply create a couple of text cards and place them in our default view.

8. Drag a Text card from the Cards section on the lower left hand of your screen into the Workflow panel in the top-middle of your screen (Where it currently says “There are no cards in your workflow…”).

9. On the right side of the screen, you’ll see a number of properties that allow you to configure the look and functionality of your new card. Let’s set the Text property of the card to Hello.

10. Now repeat the process by dragging another Text card to the right of the first one and setting its Text property’s value to World. Note that by dragging cards into place, you can configure how they are ordered within your view.

11. Save your new application by clicking File > Save from the top navigation bar.

As you’ll just be testing your application and you don’t want to release it to others on your team, you don’t have to publish it. As the owner of the application, you will still have access to the latest unpublished version of your application on the client.

Skylight comes with a web client preview tool that allows you to test your applications without having to use a device. To access the web client, hover on the Preview drop down at the upper right corner of the application builder and select Client.

This will open the web client in a new tab on your browser. From the application list in the preview tool, you can click the name of an application to open and preview it. You can keep this client open side-by-side with Application Builder as you build your apps to see changes reflected as you work!