Forums/Layar-Creator/Getting Started

Layar Creator: Getting Started Guide

xuan
posted this on April 04, 2012 10:59

In this guide, we explain what each element of the Creator means and walk you through the steps of creating a campaign. Please read it carefully before starting with your own campaign. You can also refer to it if you have any questions while using the Creator.

Campaign Meta Data

Campaign ID:

The Campaign ID is a unique identifier you create to organize your campaigns and statistics in the downloadable .CSV files. We suggest using the same naming convention which you use in your own internal work, but be sure that it is unique. For example, a magazine may want to include volume and issue date.

Title:

The Title of your campaign will be displayed to users. It should convey the name of your brand or publication to end users. For example, a magazine would use its Cover Name, but without unique information like volume or edition.

Campaign Type:
Select the closest match to your content based on the size of the actual print. If the choices don’t fit, let us know

Display Icon:
The Display Icon will be shown in the Layar app in conjunction with the title of your campaign. We suggest using a logo or other visual mark that is unique to your brand. For the Beta Program, we suggest a square image of 128x128 pixels.

Countries:
This option allows you to target your campaign at specific countries. For example, if you select the Netherlands, only users in the Netherlands will be able to view your campaign. If your content is available globally or if you are not sure, leave it as “Global” to be sure that your users can find your content.

Finish up by clicking Create Campaign. You can edit this meta data at any time.

 

Uploading Pages

Once you create a campaign, you are immediately brought to the Layar Creator. On the first screen, select “Upload the First Page” or “Manage Pages.”

Title:
The Title of your page is for your use only. We will associate all statistics for this page to the title that you give it. Make it one that correctly identifies what the page is, such as the page number of the publication. If you leave this blank, we will randomly generate a name which you can change later.

Type:
If the Type of publication is specific to the page, you can change this here. Choose one that most closely matches the physical objects in your campaign.

Image:
Now you are able to upload your first page! Click “Browse” and find your page on your hard drive. We support JPG and PNG files at this time. For tips on what makes a great page, click here.

Need to upload a PDF or ZIP?
Click the link in the right hand corner “Upload PDFs and Zip Files.” Click “Browse” and select the file on your hard drive. Click “Submit.” This may take a while. Be sure not to navigate away from this page until the system confirms that the upload has completed. You will then see a preview of your pages appear.

Next, select the pages that you wish to upload to your campaign. It’s likely that you will not want to use each page of your publication, so this is a good moment to remove extraneous pages. You can also delete them later under “Manage Pages.”

What is that red box around one of my pages?
Depending on their visual features, some pages are better than others for use with Layar Creator. Pages with a red box can not be accepted into our system. See our Tips on what makes a good page.

Once you have selected your pages, click “Add Selected Pages.” You cannot return to this page later, so be sure that you have selected all of the pages that you want to include. If you need to include other pages later, you will need to upload the file again to select them. Be sure not to navigate away from this page until adding has completed. Your images will appear in the left side of the Layar Creator edit screen when they have finished being added.

 

Buttons

Now that you have a page, it’s time to place some buttons on it. There are two ways to do this: with our standard buttons, or by uploading your own images and attaching an action to them.

NOTE: We urge you to not place more than 200 buttons in a single campaign at this time. The Layar app has a limit of 200 augments to optimize performance. If you have more than 200 buttons, we suggest that you create more campaigns.

Standard Buttons

To place a Standard Button, simply select the one that matches your need from the right hand pane. Drag-and-drop it into position on your image, set the properties in the form and click “Apply Changes.” You can drag the button into its final position and can re-size it using the boxes in the four corners surrounding it.

 

You can customize the color and label of the standard buttons. We support up to 30 characters as the Button Label. You can change the color of the buttons with the RGB colorwheel or one of our presets.

Basic:

1. Website:

  • Button Label: Choose a custom label that clearly explains what the button does (e.g., change the language or use an abbreviation). For the Beta Program, we enforce strict character limits on these buttons.
  • URL: Add the URL of the mobile-friendly landing page that you want users to see, including http:// or https://.

2. Call Now:

  • Button Label: Choose a custom label that clearly explains what the button does.
  • Phone Number: Insert the phone number that you want the user to call, making sure it is properly formatted with country codes and other requirements. When pressed, the number will appear on the user’s phone dialer, but they must then elect to place the call.

3. Buy:

  • Button Label: Choose a custom label that clearly explains what the button does.
  • URL: Add URL of the mobile-friendly shopping landing page that you want users to see, including http:// or https://.

4. Email Us

  • Button Label: Pick something that indicates whom the recipient of the email will be and what you expect. “Send us your feedback”.
  • Recipient: Enter in the address the recipient’s email address. This should be someone or department within your organization.
  • Subject: Enter in a predetermined email subject so that the Recipient can easily identify the email. 

    NOTE: a user could change this before sending the mail, but that is atypical.

5. Download App

  • Button Label: Choose a custom label that clearly explains what the button does.
  • Link: You can use either an “Intent to Market” (ITMS) or an HTTP link, but we suggest using ITMS for best results. Here’s how to find your app’s ITMS link:

        -  iPhone

          1) Search for your app at http://itunes.apple.com
          2) Copy & paste the “View in iTunes” link into iPhone link section.
          3) Replace the “http://” with “itms://”.

        - Android

          1) Search for your app at https://play.google.com/store
          2) Go to the App Detail page (example: https://play.google.com/store/apps/details?id=com.layar&feature...). 
          3) Within that URL, copy the “id=com.layar” (where “layar” is your app’s name).   
          4) Add “market://details?” before it (example: market://details?id=com.layar).

Media:


1. Video:

  •  Video: Enter the URL of your video (H.264 MP4 encoded with Baseline profile level 3.1 for video and AAC codec for audio) or youtube video

NOTE: Check out our How to create and add AR video tutorial.

2. Image Carousel:

Upload up to 10 images to create a slideshow on your page. As an example, you could create a carousel of photos from a photoshoot that didn't make the final cut, or utilize a transparent background to showcase different colors of an item for sale on the page! We support image format in JPG and PNG.

3. Clickable Carousel:

Upload up to 10 images to create a slideshow on your page and link each page to various web page. As an example, you could create a carousel of photos from a photoshoot that didn't make the final cut, or utilize a transparent background to showcase different colors of an item for sale on the page! We support image format in JPG and PNG.

4. Audio:

  • Button Label: Choose a custom label that clearly explains what the button does.
  • Link to MP3: Enter the URL of your hosted MP3 file. The audio will play in the Layar app when the user taps the button.

 Social:

1. Twitter Feed:

  • Feed type: Select the relevant radio button for your Twitter Feed.
  • Account: Enter your username or relevant hashtag to allow users to see tweets in real time. Please note that Twitter only allows for 3rd parties, like Layar, to retrieve tweets from up to eight days from the date of request (i.e. when the end user looks at the feed). Please be sure that you link to a time relevant username or hashtag for your publication.

2. Facebook Like

  • Button Label: Pick something that communicates what your users are about to “Like”. 

    Tip: leave the words Like and Facebook. “Like this on Facebook” or “Like us on Facebook”.

  • URL of your Facebook page: In order to use this feature, you need to supply a link to your company or product’s Facebook page.

3.Facebook Share:

  • Button Label: Choose a custom label that clearly explains what the button does.
  • URL to Share: Enter a mobile-friendly landing page URL that you want your users to share with their friends on Facebook.
  • Title: Title of the page that you are sharing.
  • Description: This is the description that will be shared on Facebook. We suggest using the same description as the meta-description of the page that you are sharing. As required by Facebook, the user will be able to enter their own status message to be published with your link.

NOTE: In older Layar versions, users will be taken to our “Generic Share” page. The output will appear the same regardless of the version.

 

4. Follow us on Twitter

  • Button Label: Pick something that indicates whom the user is about to follow on Twitter.
  • Twitter username: Enter in your twitter username with the @ symbol. Example: @layar.

5. Tweet:

  • Button Label: Choose a custom label that clearly explains what the button does.
  • Default Tweet: Enter a message about your page that you would like your users to share, including a mobile friendly landing page URL. Also include a hashtag or your Twitter account if applicable. Users can change this message before they send it, but it is unlikely that they will remove the link.

6. Share by Email:

  • Button Label: Choose a custom label that clearly explains what the button does.
  • Default Subject: Pre-populate the subject of the email with an engaging statement related to the page being shared.
  • Body: We suggest including a mobile-friendly link in the body of the the email as well as the name of your company, and what you want your users to share with their friends.

NOTE: Users can edit both the subject and body of the email, but they are not likely to. Take care with what you write. If in doubt, follow the guidelines that you use for Share links on your website.

7. Pin it: 


Advanced

1. HTML widget:

  • URL: Enter a valid URL pointing to a mobile-optimized page.
  • View port(w x h): The viewport dimensions define the virtual browser window size. They affect which part of your website is visible to the end user. The dimensions should match your web page dimensions if you want to display without the need for the user to zoom or scroll.

HTML Limitations:

Flash content and HTML5 features are not supported. 

Some websites may not correctly render your HTML in the preview of the widget in the Creator. This does not impact how content is displayed in the app; be sure to test your page with the Layar app.

2. Launch Geo-Layer

  • Target layer name: The name of the geo layer that you have created using Layar Developer API.

Tips for your content:

  • Link to pages optimized for mobile devices.
  • Link to trusted content. No spam, please.
  • Link to content that is relevant to your page. For example, if you are augmenting your car ad, link to a promotional video or a “Find a Dealer” mobile webpage.
  • Incentivise users to take their phones out and scan by promoting your augmented content in other places (e.g., on your website).


Tips for placing buttons:
Every page is different. Where you choose to place your buttons is less of a technical decision and much more an aesthetic one. Place your buttons where it makes the most sense to you and the user. It should look natural in context with the physical object, but should not blend in so much that the user can’t immediately find it. However, we do have one technical suggestion: buttons function better when placed on more visually busy images and not on blank spaces that lack features. Be sure to test the stability of your buttons yourself before publishing your campaign. 

How do I test it ?
Create a campaign, add buttons and save your pages. On your Android or iPhone, open Layar and log in (Layers > Settings > Account) with the account with which you use Creator. Focus on your page and tap “Scan”. When your campaign loads, focus on the page again and your buttons should appear. If your buttons are not holding in place well, try moving them to a different part of the image in the Layar Creator.

NOTE: If there is more than one match on a page, a list of results is shown. Select yours by the Title.

Custom Buttons
If our buttons don't agree with your branding (e.g., actions, style, etc.), you can upload your own. You can select any of the Standard Button action types, but if you have suggestions for other actions, please let us know. Here's how to get started:

  1. Click “Custom” in Layar Creator.
  2. Click “Create Button.”
  3. Enter a title (used for your organizational purposes and statistics).
  4. Select your button image.
  5. Finally, select an action that you want the user to take (e.g., opening a mobile webpage or dialing a phone number).
  6. Save the button, and it’s ready to be placed on a page.
  7. Select a page.
  8. Drag your button onto the page.
  9. Fill out the form information.
  10. Click “Apply Changes” and you’re done. Then just be sure to test it!


Tips:

  • Once uploaded, a button is available for use in any of your campaigns. Don’t worry about uploading the same button multiple times for different campaigns.
  • If you delete a button, it will subsequently be deleted from any pages on which it appears.

Manage Pages
You can upload new pages at any time in the “Manage Pages” section. Here you can also reorder your pages, delete pages, and import pages from another campaign.

Reorder Pages

  1. Go to “Manage Pages,” and click “Pages.”
  2. Select a page and drag it to the desired order.

NOTE: This has no bearing on ordering in the app or how results are delivered to the user. This is for your personal organizational purposes only.

Delete a Page

  1. Go to “Manage Pages,” and select “Pages in your campaign.”
  2. Hover your mouse over the desired page and click the trash can icon.
  3. Click “OK" to delete the page.

NOTE: Deletions are final. This cannot be undone!

Rename or Change Type of Page

  1. Go to “Manage Pages,” and select “Pages in your campaign.”
  2. Hover your mouse over the desired page and click the pencil icon.
  3. Make the desired changes to the page and click “Save.”


Import Pages from Another Campaign

  1. Go to “Manage Pages,” and select “Pick from other campaign.”
  2. Select the desired campaign from the drop down menu in the upper-right.
  3. Click the desired page(s) to add and click “Add selected pages.”

NOTE: Be sure not to navigate away from this page until adding has completed.

 

Campaign Maintenance: Publish, Edit, Archive, Delete

Draft:
Upon initial creation, each campaign is designated as a “Draft.” This means that only you (and Layar Support Staff) can view the content when logged into the Layar app or Creator website. You are strongly recommended to test your campaign on a device before you publish it. 

Publish:
To allow all users to see your content in the app, first go to “Campaign Overview.
Click “Publish” next to the campaign.

NOTE: Before you publish, be sure that you tested each of your pages.

Archive:
If your campaign is complete and you want to hide it from public view, you can choose to Archive your content. You can always republish this content at any time. To get started, first go to “Campaign Overview.”
Click “Archive” button next to the campaign. 

Delete
You may need to clean up your workspace from time to time. You can delete Archived campaigns by clicking on the red “X” in “Campaign Overview”. 

NOTE: All deletions are final. Layar staff cannot recover this content once it is deleted.

 
Topic is closed for comments