Optimizely Classic iOS SDK Tutorial

The following steps will allow you to try out Optimizely's SDK in our Tutorial App. This guide is a walkthrough of all the key code that you can include in your app prior to releasing your app live to the App Store.

Download the tutorial app

The tutorial app is included as a sub directory in the SDK directory. It can be found in the TutorialApp folder in the SDK.

SDK Version

ZIP | TAR | GitHub

1. Create an iOS Project

To create an iOS project, select "Create New Project" in the Optimizely Dashboard:

Drawing

Drawing

Once you've created a project, please take a look at the Settings tab to find your project ID and API key which you will use during installation:

Project Code Dialog

2. Add Your API token

  1. Now, you're ready to add your API token to the tutorial app! Open the AppDelegate.m file in the Project Navigator. Replace the dummy API token @"AAMseu0A6cJKXYL7RiH_TgxkvTRMOCvS~123456" at the beginning of application:didFinishLaunchingWithOptions: in your app delegate. The code can be copied from your Project Code, which you can find by selecting the appropriate iOS Project in your Optimizely Dashboard. For more details, you can refer back to Step 1: Create an iOS project.

Project Code Dialog

Note: We recommend putting this code at the beginning of your application:didFinishLaunchingWithOptions: function.

  1. In order to enter Edit Mode (which will allow your app to be detected by Optimizely's Editor), you'll have to define a URL scheme for Optimizely.

    1. In the project editor, click on "Targets" -> Your app name -> "Info" tab.
    2. Add optly{PROJECT_ID} to "URL Schemes." Your Project ID is available at the bottom of the Project Code dialog box. For instance, if your Project ID is 123456, your URL Scheme would be optly123456. Once completed, your URL Scheme should look like this: Drawing

    3. Once you run your app in DEBUG mode with the SDK installed, you should see the image below in your Optimizely Dashboard. Once the SDK is detected, the Create Experiment button will appear, and you can continue to Step 3 to create your experiment.

      Drawing

3. Create An Experiment

Once you have a project created and the SDK installed, you should be ready to start running experiments to generate more value from your mobile apps.

  1. In the Optimizely Application, select the project that you use for your iOS experiments and click Create Experiment.

Drawing

  1. Put the app into Edit Mode by drawing the Optimizely 'O'.

4. Modify Live Variables

Live variables have already been added to the sample app. You can refer to the LiveVariablesViewController.m file. There are 3 examples of live variables used in that file, which are shown below. Save your experiment after you have made the change.

Drawing

For more details about live variables, you can refer here.

5. Modify Code Blocks

Code Blocks have already been added to the sample app. You can refer to the CodeBlocksViewController.m file. There is 1 example of a code block used in that file, which are shown below. Save your experiment after you have made the change.

  1. If you tap on "Code Blocks" > "Sign in" without modifying the code block, the View Controller that will appear is shown below:

    Drawing

  2. Return to the "Sign in" View Controller:

    Drawing

  3. Now, select "One Stage", and if you navigate through the app, you will see a new screen appear, which is shown below:

    Drawing

For more details about code blocks, you can refer here.

6. Add Custom Tags

Custom tags sample code can be found in the AppDelegate.m and CodeBlocksViewController.m files. In order to create a test that only runs for returning users as defined in the app, in your Optimizely experiment you can go to Audiences to set up the custom tag condition.

Drawing

For more details about custom tags, you can refer here

7. Track Event

trackEvent sample code can be found in the CodeBlocksViewController.m file. In order to track the custom event for a specific experiment, you can click on the flag image on the top right of the screen next to the "Start Experiment" button.

Drawing

From there, you can add a new goal of goal type custom event as shown below:

Drawing

For more details, you can refer here.

8. Revenue Tracking

Code for tracking revenue can be found in the CodeBlocksViewController.m file. In order to track revenue for a specific experiment, you can click on the flag image on the top right of the screen next to the "Start Experiment" button.

Drawing

From there, you can click on Add a Saved Goal > Select Revenue:

Drawing

For more details, you can refer here.

9. Analytics Integration

For guidance on how to implement Google Analytics and Mixpanel integrations, you can refer to the AppDelegate.m file in the comments.

For more details, you can refer here

10. QA

Preview Mode

Preview mode allows you to view your app in a different variations for a given experiment in order to check that your app and the experiment are both running smoothly. To enter preview mode, connect your device to the editor, open the Preview menu, and click Launch Preview

Enter Preview Mode

Your app will restart and you will see the Optimizely preview menu icon displayed over your app content. The icon may be repositioned by dragging it. Tapping the icon will reveal the Preview Menu which allows you to switch variations, view the goals that have been triggered so far, and see the code blocks and live variables that are included in the experiment.

Preview Mode Demo