{"__v":32,"_id":"55a590d580c8a30d00b32404","category":{"__v":9,"_id":"559a61d3dbcfd20d00710b3d","pages":["559a61d3dbcfd20d00710b3f","55a54655670b152f00075368","55a546722e70c025003805db","55a8d4c8cf45e1390093f1bf","55a8d4fd27a17d2100525155","55a8d51cc8bd450d000dd09e","55a9118c27a17d210052523b","565dbeaa94f30d0d00d1f37c","569e599efbee990d0072d912"],"project":"559a61d2dbcfd20d00710b39","version":"559a61d2dbcfd20d00710b3c","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2015-07-06T11:09:07.118Z","from_sync":false,"order":0,"slug":"documentation","title":"Documentation"},"parentDoc":null,"project":"559a61d2dbcfd20d00710b39","user":"55a575ebaaf9cf1900114d73","version":{"__v":23,"_id":"559a61d2dbcfd20d00710b3c","project":"559a61d2dbcfd20d00710b39","createdAt":"2015-07-06T11:09:06.510Z","releaseDate":"2015-07-06T11:09:06.510Z","categories":["559a61d3dbcfd20d00710b3d","55a589ddaaf9cf1900114dd0","55a589e30f354f0d00fd0312","55a589ea80c8a30d00b323cc","55a589f6aaf9cf1900114dd1","55a58d4e80c8a30d00b323e6","55a8e7a227a17d21005251a2","55a93098cf45e1390093f351","55afb085f202b12100cd9e83","55afb22e902fd51700f5f8bf","55afb260902fd51700f5f8c2","55afb28ec8a85321007a5462","55afb294f202b12100cd9e95","55afb29b902fd51700f5f8c5","55afb2a1c8a85321007a5463","55afb2a7902fd51700f5f8c7","55afb2ad902fd51700f5f8c8","55afb2b5902fd51700f5f8ca","55b74b2131bccb190081bedc","55bb441b54f9640d006e6cf2","565711085cb2420d00d70071","5681681330018c0d006bf7ff","588f38b5923d610f00c72dad"],"is_deprecated":false,"is_hidden":false,"is_beta":true,"is_stable":true,"codename":"Version 1.0","version_clean":"1.0.0","version":"1"},"updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-07-14T22:44:37.013Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":0,"body":"There are a few important steps to get out of the way when integrating MOCA SDK with your iOS or Android app for the first time. Follow these instructions carefully to ensure that you will have a smooth development experience. We will take you through the basic technical steps for configuring Apple and MOCA services, show you how to add the first proximity-triggered experiences to your app and provide detailed examples and instructions for using advanced MOCA features.\n\n[block:embed]\n{\n  \"html\": \"<iframe class=\\\"embedly-embed\\\" src=\\\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2F-PKE0Vrr3bw%3Ffeature%3Doembed&url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3D-PKE0Vrr3bw&image=https%3A%2F%2Fi.ytimg.com%2Fvi%2F-PKE0Vrr3bw%2Fhqdefault.jpg&key=02466f963b9b4bb8845a05b53d3235d7&type=text%2Fhtml&schema=youtube\\\" width=\\\"854\\\" height=\\\"480\\\" scrolling=\\\"no\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\",\n  \"url\": \"https://www.youtube.com/watch?v=-PKE0Vrr3bw\",\n  \"title\": \"Getting Started With MOCA - Proximity Marketing and iBeacon Platform\",\n  \"favicon\": \"https://s.ytimg.com/yts/img/favicon-vflz7uhzw.ico\",\n  \"image\": \"https://i.ytimg.com/vi/-PKE0Vrr3bw/hqdefault.jpg\"\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/yTKMcnVdQPiF2cUtuX7Q_sdks.png\",\n        \"sdks.png\",\n        \"400\",\n        \"160\",\n        \"#e08e49\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Production & Development Apps in MOCA\"\n}\n[/block]\nWhen you create or edit an App in MOCA, you must select whether your app is **In development** or **In production** mode. When developing or testing your app, configure your app to *In development*. When submitting your app to AppStore, configure your app to *In production*. MOCA treats the two modes separately, we suggest making two apps in the MOCA Console. That way you can continue to build and develop your application even after releasing it without interrupting your users.\n[block:callout]\n{\n  \"type\": \"danger\",\n  \"body\": \"Always create a Production Status MOCA app first and make sure your app code is pointing to the production app key. For more tips on what to check before you release your app, see [*Submitting Your App to the Store*](/docs/moca-ios-sdk-submitting-your-app-to-the-store) article.\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Creating your first Campaign and Experiences\"\n}\n[/block]\nAfter adding your first app to your Moca account, you can start creating Campaigns and adding as many Proximity Experiences to them as you need.\n\nStart by selecting your app:\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/IcE6Yc1sRu2gcuL1JQRf_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.38.42.png\",\n        \"Captura de pantalla 2015-09-23 a las 17.38.42.png\",\n        \"1731\",\n        \"727\",\n        \"#df333b\",\n        \"\"\n      ],\n      \"caption\": \"MocaApp for Testing\"\n    }\n  ]\n}\n[/block]\nThen select campaign and click on \"New campaign\":\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/bvHYtw3qSWGqskBoM2nt_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.41.50.png\",\n        \"Captura de pantalla 2015-09-23 a las 17.41.50.png\",\n        \"1731\",\n        \"679\",\n        \"#55718f\",\n        \"\"\n      ],\n      \"caption\": \"Campaign list\"\n    }\n  ]\n}\n[/block]\nChoose a name for your Campaign, add a start date and an end date, and optionally add a description and choose a target (Standard and Pro versions only):\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/cLz21QrdRXiktEpiZl1Y_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.44.43.png\",\n        \"Captura de pantalla 2015-09-23 a las 17.44.43.png\",\n        \"467\",\n        \"550\",\n        \"#436b98\",\n        \"\"\n      ],\n      \"caption\": \"Add Campaign View\"\n    }\n  ]\n}\n[/block]\nNow you'll see your new Campaign listed in your Campaigns' list. When ready remember to click the \"Start\" button to initiate the Campaign, otherwise your users won't receive any Proximity Experiences. \n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/N8EuWC41QoWi5AYLtx9U_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.46.25.png\",\n        \"Captura de pantalla 2015-09-23 a las 17.46.25.png\",\n        \"1497\",\n        \"349\",\n        \"#527da7\",\n        \"\"\n      ],\n      \"caption\": \"Campaign List\"\n    }\n  ]\n}\n[/block]\nNow let's add our first experience. Click on the campaign name and then click on the \"New experience\" button on the upper right corner.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/1MKnruM6ScKPJ1tOKg1w_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.46.25.png\",\n        \"Captura de pantalla 2015-09-23 a las 17.46.25.png\",\n        \"1497\",\n        \"349\",\n        \"#527da7\",\n        \"\"\n      ],\n      \"caption\": \"Campaign List\"\n    }\n  ]\n}\n[/block]\nThis will take you to the Proximity Experience editor.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/sgo9kiCGRGpetCVsT90z_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.51.25.png\",\n        \"Captura de pantalla 2015-09-23 a las 17.51.25.png\",\n        \"1487\",\n        \"1164\",\n        \"#906c64\",\n        \"\"\n      ],\n      \"caption\": \"Moca Proximity Experience Editor\"\n    }\n  ]\n}\n[/block]\nThere are several types of Experiences you can create, each for a different purpose. They can be classified by their in-app action and whether they have a Notification Message in the device's notification center.\n\n[block:parameters]\n{\n  \"data\": {\n    \"h-0\": \"Type\",\n    \"h-1\": \"Notification Message\",\n    \"h-2\": \"InApp Action\",\n    \"h-3\": \"Limits\",\n    \"0-0\": \"Message\",\n    \"0-1\": \"Yes\",\n    \"0-2\": \"None\",\n    \"0-3\": \"OS Notification character limit.\",\n    \"1-0\": \"Image\",\n    \"1-1\": \"Yes\",\n    \"1-2\": \"An Image\",\n    \"1-3\": \"OS Notification character limit.\",\n    \"2-0\": \"URL\",\n    \"2-1\": \"Yes\",\n    \"2-2\": \"A URL to a website\",\n    \"2-3\": \"OS Notification character limit.\",\n    \"3-0\": \"HTML\",\n    \"3-1\": \"Yes\",\n    \"3-2\": \"InApp rendered HTML\",\n    \"3-3\": \"OS Notification character limit.\\n\\nmax. 50KB of HTML code\",\n    \"4-0\": \"Card\",\n    \"4-1\": \"Yes\",\n    \"4-2\": \"Barcode, perfect for event tickets.\",\n    \"4-3\": \"OS Notification character limit.\",\n    \"5-0\": \"Video\",\n    \"5-1\": \"Yes\",\n    \"5-2\": \"InApp video playback.\",\n    \"5-3\": \"OS Notification character limit.\",\n    \"6-0\": \"Sound\",\n    \"6-1\": \"No\",\n    \"6-2\": \"InApp sound playback\",\n    \"6-3\": \"None\",\n    \"7-0\": \"Tag (available only in Standard and Pro)\",\n    \"7-1\": \"No\",\n    \"7-2\": \"It's a virtual counter\",\n    \"7-3\": \"None\",\n    \"8-0\": \"Custom (available only in Standard and Pro)\",\n    \"8-1\": \"No\",\n    \"8-2\": \"Runs a callback function in your App's code\",\n    \"8-3\": \"None\"\n  },\n  \"cols\": 4,\n  \"rows\": 9\n}\n[/block]\nAfter choosing the type of Experience you want to deliver, we need to decide on what triggers the experience.\n\nThere are three different types of triggers:\n[block:parameters]\n{\n  \"data\": {\n    \"h-0\": \"Type\",\n    \"h-1\": \"Definition\",\n    \"0-0\": \"Place\",\n    \"0-1\": \"A place is a Geofence and it can be created in the \\\"Places\\\" option in the Moca console.\",\n    \"1-0\": \"Zone\",\n    \"1-1\": \"A zone is a group of beacons associated to a Place. You can add zones to any of your places.\",\n    \"2-0\": \"Beacon\",\n    \"2-1\": \"A beacon is, as its name implies, an actual beacon. These can be added independently or assigned to a zone.\"\n  },\n  \"cols\": 2,\n  \"rows\": 3\n}\n[/block]\nSince by default, each account comes with a Place pre-installed. Let's select place as the trigger. However, for this to work, remember to specify the location of your Place in the Place option.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/Djo4gLrcTtGaMQTXMhJR_Captura%20de%20pantalla%202015-09-23%20a%20las%2018.11.41.png\",\n        \"Captura de pantalla 2015-09-23 a las 18.11.41.png\",\n        \"1226\",\n        \"1112\",\n        \"#987166\",\n        \"\"\n      ],\n      \"caption\": \"Selecting Place as trigger\"\n    }\n  ]\n}\n[/block]\nAs you can see in the image above, after selecting \"Place\" as a trigger, we select \"On enter\" as the event of the trigger. This means that when a user enters the selected location the Experience should appear on his/her phone.\n\nFinally, after selecting the \"Place\" we want as a trigger, there are a few more settings for activating and setting a frequency for the Experience.\n\nWe'll leave it as it is:\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/7sEBqDlRbmTzmukRXcLm_Captura%20de%20pantalla%202015-09-23%20a%20las%2018.15.12.png\",\n        \"Captura de pantalla 2015-09-23 a las 18.15.12.png\",\n        \"722\",\n        \"219\",\n        \"#9a6c5f\",\n        \"\"\n      ],\n      \"caption\": \"Experience extra settings\"\n    }\n  ]\n}\n[/block]\nThis means that, besides having the experience activated, if the user decides to stay near the trigger's area, the experience won't repeat itself for at least another 5min.\n\nAnd that's all. Once you're happy with the experience's settings, click the \"Save experience\" button and that'll take you back to the Experiences list, where you'll see your new and shiny experience ready for action!\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/Te5pyvUlRK2U5Qaegndh_Captura%20de%20pantalla%202015-09-23%20a%20las%2018.19.02.png\",\n        \"Captura de pantalla 2015-09-23 a las 18.19.02.png\",\n        \"1026\",\n        \"556\",\n        \"#688eb8\",\n        \"\"\n      ],\n      \"caption\": \"Experience List\"\n    }\n  ]\n}\n[/block]","excerpt":"This page will help you get started with MOCA. You'll be up and running in a jiffy!","slug":"moca-sdk-getting-started","type":"basic","title":"Getting Started with MOCA Proximity iBeacon platform"}

Getting Started with MOCA Proximity iBeacon platform

This page will help you get started with MOCA. You'll be up and running in a jiffy!

There are a few important steps to get out of the way when integrating MOCA SDK with your iOS or Android app for the first time. Follow these instructions carefully to ensure that you will have a smooth development experience. We will take you through the basic technical steps for configuring Apple and MOCA services, show you how to add the first proximity-triggered experiences to your app and provide detailed examples and instructions for using advanced MOCA features. [block:embed] { "html": "<iframe class=\"embedly-embed\" src=\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2F-PKE0Vrr3bw%3Ffeature%3Doembed&url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3D-PKE0Vrr3bw&image=https%3A%2F%2Fi.ytimg.com%2Fvi%2F-PKE0Vrr3bw%2Fhqdefault.jpg&key=02466f963b9b4bb8845a05b53d3235d7&type=text%2Fhtml&schema=youtube\" width=\"854\" height=\"480\" scrolling=\"no\" frameborder=\"0\" allowfullscreen></iframe>", "url": "https://www.youtube.com/watch?v=-PKE0Vrr3bw", "title": "Getting Started With MOCA - Proximity Marketing and iBeacon Platform", "favicon": "https://s.ytimg.com/yts/img/favicon-vflz7uhzw.ico", "image": "https://i.ytimg.com/vi/-PKE0Vrr3bw/hqdefault.jpg" } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/yTKMcnVdQPiF2cUtuX7Q_sdks.png", "sdks.png", "400", "160", "#e08e49", "" ] } ] } [/block] [block:api-header] { "type": "basic", "title": "Production & Development Apps in MOCA" } [/block] When you create or edit an App in MOCA, you must select whether your app is **In development** or **In production** mode. When developing or testing your app, configure your app to *In development*. When submitting your app to AppStore, configure your app to *In production*. MOCA treats the two modes separately, we suggest making two apps in the MOCA Console. That way you can continue to build and develop your application even after releasing it without interrupting your users. [block:callout] { "type": "danger", "body": "Always create a Production Status MOCA app first and make sure your app code is pointing to the production app key. For more tips on what to check before you release your app, see [*Submitting Your App to the Store*](/docs/moca-ios-sdk-submitting-your-app-to-the-store) article." } [/block] [block:api-header] { "type": "basic", "title": "Creating your first Campaign and Experiences" } [/block] After adding your first app to your Moca account, you can start creating Campaigns and adding as many Proximity Experiences to them as you need. Start by selecting your app: [block:image] { "images": [ { "image": [ "https://files.readme.io/IcE6Yc1sRu2gcuL1JQRf_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.38.42.png", "Captura de pantalla 2015-09-23 a las 17.38.42.png", "1731", "727", "#df333b", "" ], "caption": "MocaApp for Testing" } ] } [/block] Then select campaign and click on "New campaign": [block:image] { "images": [ { "image": [ "https://files.readme.io/bvHYtw3qSWGqskBoM2nt_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.41.50.png", "Captura de pantalla 2015-09-23 a las 17.41.50.png", "1731", "679", "#55718f", "" ], "caption": "Campaign list" } ] } [/block] Choose a name for your Campaign, add a start date and an end date, and optionally add a description and choose a target (Standard and Pro versions only): [block:image] { "images": [ { "image": [ "https://files.readme.io/cLz21QrdRXiktEpiZl1Y_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.44.43.png", "Captura de pantalla 2015-09-23 a las 17.44.43.png", "467", "550", "#436b98", "" ], "caption": "Add Campaign View" } ] } [/block] Now you'll see your new Campaign listed in your Campaigns' list. When ready remember to click the "Start" button to initiate the Campaign, otherwise your users won't receive any Proximity Experiences. [block:image] { "images": [ { "image": [ "https://files.readme.io/N8EuWC41QoWi5AYLtx9U_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.46.25.png", "Captura de pantalla 2015-09-23 a las 17.46.25.png", "1497", "349", "#527da7", "" ], "caption": "Campaign List" } ] } [/block] Now let's add our first experience. Click on the campaign name and then click on the "New experience" button on the upper right corner. [block:image] { "images": [ { "image": [ "https://files.readme.io/1MKnruM6ScKPJ1tOKg1w_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.46.25.png", "Captura de pantalla 2015-09-23 a las 17.46.25.png", "1497", "349", "#527da7", "" ], "caption": "Campaign List" } ] } [/block] This will take you to the Proximity Experience editor. [block:image] { "images": [ { "image": [ "https://files.readme.io/sgo9kiCGRGpetCVsT90z_Captura%20de%20pantalla%202015-09-23%20a%20las%2017.51.25.png", "Captura de pantalla 2015-09-23 a las 17.51.25.png", "1487", "1164", "#906c64", "" ], "caption": "Moca Proximity Experience Editor" } ] } [/block] There are several types of Experiences you can create, each for a different purpose. They can be classified by their in-app action and whether they have a Notification Message in the device's notification center. [block:parameters] { "data": { "h-0": "Type", "h-1": "Notification Message", "h-2": "InApp Action", "h-3": "Limits", "0-0": "Message", "0-1": "Yes", "0-2": "None", "0-3": "OS Notification character limit.", "1-0": "Image", "1-1": "Yes", "1-2": "An Image", "1-3": "OS Notification character limit.", "2-0": "URL", "2-1": "Yes", "2-2": "A URL to a website", "2-3": "OS Notification character limit.", "3-0": "HTML", "3-1": "Yes", "3-2": "InApp rendered HTML", "3-3": "OS Notification character limit.\n\nmax. 50KB of HTML code", "4-0": "Card", "4-1": "Yes", "4-2": "Barcode, perfect for event tickets.", "4-3": "OS Notification character limit.", "5-0": "Video", "5-1": "Yes", "5-2": "InApp video playback.", "5-3": "OS Notification character limit.", "6-0": "Sound", "6-1": "No", "6-2": "InApp sound playback", "6-3": "None", "7-0": "Tag (available only in Standard and Pro)", "7-1": "No", "7-2": "It's a virtual counter", "7-3": "None", "8-0": "Custom (available only in Standard and Pro)", "8-1": "No", "8-2": "Runs a callback function in your App's code", "8-3": "None" }, "cols": 4, "rows": 9 } [/block] After choosing the type of Experience you want to deliver, we need to decide on what triggers the experience. There are three different types of triggers: [block:parameters] { "data": { "h-0": "Type", "h-1": "Definition", "0-0": "Place", "0-1": "A place is a Geofence and it can be created in the \"Places\" option in the Moca console.", "1-0": "Zone", "1-1": "A zone is a group of beacons associated to a Place. You can add zones to any of your places.", "2-0": "Beacon", "2-1": "A beacon is, as its name implies, an actual beacon. These can be added independently or assigned to a zone." }, "cols": 2, "rows": 3 } [/block] Since by default, each account comes with a Place pre-installed. Let's select place as the trigger. However, for this to work, remember to specify the location of your Place in the Place option. [block:image] { "images": [ { "image": [ "https://files.readme.io/Djo4gLrcTtGaMQTXMhJR_Captura%20de%20pantalla%202015-09-23%20a%20las%2018.11.41.png", "Captura de pantalla 2015-09-23 a las 18.11.41.png", "1226", "1112", "#987166", "" ], "caption": "Selecting Place as trigger" } ] } [/block] As you can see in the image above, after selecting "Place" as a trigger, we select "On enter" as the event of the trigger. This means that when a user enters the selected location the Experience should appear on his/her phone. Finally, after selecting the "Place" we want as a trigger, there are a few more settings for activating and setting a frequency for the Experience. We'll leave it as it is: [block:image] { "images": [ { "image": [ "https://files.readme.io/7sEBqDlRbmTzmukRXcLm_Captura%20de%20pantalla%202015-09-23%20a%20las%2018.15.12.png", "Captura de pantalla 2015-09-23 a las 18.15.12.png", "722", "219", "#9a6c5f", "" ], "caption": "Experience extra settings" } ] } [/block] This means that, besides having the experience activated, if the user decides to stay near the trigger's area, the experience won't repeat itself for at least another 5min. And that's all. Once you're happy with the experience's settings, click the "Save experience" button and that'll take you back to the Experiences list, where you'll see your new and shiny experience ready for action! [block:image] { "images": [ { "image": [ "https://files.readme.io/Te5pyvUlRK2U5Qaegndh_Captura%20de%20pantalla%202015-09-23%20a%20las%2018.19.02.png", "Captura de pantalla 2015-09-23 a las 18.19.02.png", "1026", "556", "#688eb8", "" ], "caption": "Experience List" } ] } [/block]