AngularJS transition to abstract state

I'm working on an application built with AngularJS that has two different states:

1. App intro wizard
2. App pages (with a Navigation template and nested views)

I want to default to State 1 the first time someone access the app, once done the wizard, continue on to the App pages, State 2.

My "app" state (State 2) is an abstract state because it has nested views. So I cannot transition to this state.

.config(function($stateProvider, $urlRouterProvider) {
$stateProvider

  .state('intro', {
    url: '/',
    templateUrl: 'templates/intro.html',
    controller: 'IntroCtrl'
  })

  .state('app', {
    url: '/app',
    abstract: true,
    templateUrl: 'templates/menu.html',
    controller: 'AppCtrl'
  })

  .state('app.playlists', {
    url: "/playlists",
    views: {
      'menuContent' :{
        templateUrl: "templates/playlists.html",
        controller: 'PlaylistsCtrl'
      }
    }
  });

  $urlRouterProvider.otherwise("/");

})