Blippar FAQs

Using a Test Code

To access your Blipps in the Blippar app using a test code.

1) Open the Blippar app and tap 'More'(Bottom right hand corner)

2) Select 'Enter a Code'

3) Enter your chosen test code and tap 'Confirm'

4) Blipp your marker (Marker is only actioned on adding test code)

New to Blippbuilder and looking for a way to learn the craft?

This video will provide an overview of Blippbuilder of the BlippBuilder tool.

The demo will show you around the tool to allow you to get started building your first Blipp. If you have any specific questions please use our knowledge base or reach out to us for a member of the team to get in touch.

If you have further questions following the webinar please contact us here.

Latest: We are currently having an issue and are working on it at the moment.

Product

Status

Date

Notes

Blippar App

nOK

Current

1:58pm GMT

Blippar SDK

OK

Current

BlippBuilder

OK

Current

Blippar Dashboard

OK

Current

Blippar Accounts

OK

Current

Data Dashboard

OK

Current

CV APIs

OK

Current

Other

OK

Current

Blipp won't load?

Blippwon'tload

Blipp won't show in app?

Blipp won't load in app?

Blipp won't load in SDK?

Blipp won't show in SDK?

Blipp can't load?

Blippcan'tload?

If you see the error message 'Blipp Can't Load' please restore to the last working version of the Blipp and check that the assets and marker used are within our guidelines. Asset Guidelines

If your Blipp isn't loading within your own app powered by the Blippar SDK please ensure you are publishing the Blipp to the correct version.

Blipp - SDK Versioning Guide

A marker is a real-world image or object you will use to revealyourblipp. For example, press pages, packaging, T-shirts, posters, business cards and album covers, etc. The opportunities are endless if you follow a few simple guidelines.

Customize Social Sharing Permissions

Think carefully about what to use as your marker, and within which media-types you will promote it. This is critical to the success of your blipp.

One image can be configured to unlock many different experiences and reused within different formats (for example, the same logo or image can be re-used on packaging, a T-shirt, in press pages, or on an outdoor poster); or many different images can be configured to trigger the same content experience (for example, various press ads, or product packaging variants).

Marker Requirements

PNG or JPEG format

Less than 0.5 MB

Accepts RGB, not CMYK

Between 300-800 pixels in width and height.

Not a transparent background.

What makes a good marker?

The busier, more complex and unique a marker is, the better (for example, photos make great markers). Images with lots of contrast, angles and reference points for the app to recognise also work well. Markers should be as unique as possible such as photographs you have taken.

For print markers, we recommend using a full poster, flyer or press page rather than small elements or images within it. Some exceptions include:

Large format/broadsheet publications where a whole page is too large for the user to capture within camera view on their mobile device

Product packaging where there is one consistent image or logo on the label, enabling all variants to be recognized rather than having to configure each option separately.

An example of a good marker:

(PLEASE DO NOT USE THIS IMAGE AS YOUR MARKER)

Whatto avoid in your marker

Lack of contrast within the image, simple shapes, and reflective or curved surfaces do not make the best markers.

Using generic icons or shapes and text will lead to a high chance of your experience not triggering or triggering an alternative experience.

Text is not used as part of the recognition so this should be masked out in the copy of the marker uploaded.

Generic shapes, patterns do not work well as these can lead to conflicts with other content and poor recognition speeds.

Using generic markers such as grids, or purely text are not going to offer a good experience and will likely cause conflict.

A poor marker may still work, but tends not to be as instantaneous or 'sticky,' and can give your blipp a flickery, unstable effect.

For more information and examples of suitable markers view ourmarker guidelines (.pdf available for download at the bottom of the post)

An example of a bad marker:

(PLEASE DO NOT USE THIS IMAGE AS YOUR MARKER)

Testing your markers

Always test your markers thoroughly - in the sort of environment in which it will be blipped - before committing it to print.

Think about:

How the user will be sitting or standing

How the user will be holding the product and their phone

Ambient light levels

Check the efficacy of your marker quickly by uploading it into blippbuilder and adding a few of our pre-populated buttons.

Marker data-tracking

The Blippar data tool tracks the performance of markers, so if you want to evaluate the ROI of each different medium or usage-type, use different markers to track each one's unique response. For example,if you use the same marker image in a press and outdoor campaign you won't be able to identify which medium has converted better for you.

Configuring different images will help with this and could even inform your media buys. For example, use different markers within various publications to test conversion rates.

Related articles

Call-to-Actions

Share your marker questions and ideas in the comments below.

Have you prepared all your assets? Great! You're ready to begin building blipps. Here's a quick overview to getting started:

Creating a new blipp

1. From your account homepage, click on ‘Create Project.’

2.Enter a projectname (e.g. the title and month of your magazine).

3. Select which tool you'd like to use. Note: the most popular is our drag and drop tool Blippbuilder, which is the middle selection.

4. Click 'Create a new blipp.'

5.Name your blipp (e.g. the article or page number within your magazine).

6.Click on the box and upload a marker.

A marker is the image that will trigger your blipp.

Markers must be JPEG or PNG format.

For more information see " Choosing a Marker."

7. Click 'Create blipp.'

Uploading your assets

Once you’ve uploaded your marker you’ll be taken to the main Blippbuilder homepage. You’ll see your marker in the center of the screen. To start building your blipp begin uploading your assets (i.e. the images, videos, audio or 3D files that form the content of your blipp).

1. Click the ‘Uploads’ button.

If needed use our file converter for your .fbx files before uploading.

2. Select the image and video files you want to upload from your computer and click 'Open.'

3. Uploaded graphics will appear in the assets panel (this may take a few minutes if you’re uploading multiple images).

4.Drag and drop uploaded graphics onto the marker, displayed in the center of the screen. We will now refer to this area as ‘the stage.’

Sizing, positioning & ordering of your graphics

Once you’ve put all your assets on the stage you can re-size, move and rotate them using your mouse. Or, for more precise control, use the ‘Transform’ controls in the right-hand panel.

1. Select the object.

2. Open the ‘Layout’ tab.

3. Use the position, scale and rotation controls to adjust.

Scale: Re-size width and height (click on the padlock icon to maintain the aspect ratio).

Position:

o Use the X and Y controls to move the object into the required position on the stage.

o Use the Z control to adjust the depth (i.e. height off the marker).

Rotation: Rotate on its X, Y and Z axes.

Assets flickering/flashing? Ensure Assets are on different Axis. Usually assets overlapping on the same 'Z-Axis' will cause this undesired effect.

Testing your blipp

Once you’ve finished building your blipp you’re ready to test it on your mobile device.

1. Click the ‘preview’ button in the top-right corner of the screen.

2. A pop-up will appear displaying the uploading status of your blipp.

3. Once the upload is complete, follow the on-screen instructions to test your blipp. Make sure you enter the code from the pop-up in the Blippar app on your phone when testing your blipp.

What is the cost for a Blippbuilder license?

We grant free licenses to educators, offering access to Blippar’s powerful creation tool Blippbuilder.

What is the duration of an education license?

The education license does not expire; educators have access to Blippbuilder for an indefinite period.

How many blipps can I create?

Educators can create unlimited blipps, using all of Blippbuilder’s features.

Can I publish my blipps?

Educational blipps cannot be published. You need to issue a ‘code’ to your students, which must be entered into their devices in order for them to view the content.

We recommend that you save all created content in a single ‘campaign’, as this allows you to issue a single, unifying ‘campaign code’ that students can use to unlock all of your blipps. Using this approach, students only have to enter the code on their device once, and it will never have to be changed. Furthermore, the Blippar app saves the code even after the app has been closed, meaning that it only has to be entered once.

Can I make my school’s promotional materials blippable?

The free education license is limited to teaching applications, and precludes any form of institutional marketing or promotion.

Please reach out to Blippar for Education for more information on commercial Blippbuilder licenses ( [email protected] ).

Can my students use Blippbuilder?

Yes, you are free to create Blippbuilder accounts for your students. Students require their own account if they want to create blipps on Blippbuilder.

Students also need to download the Blippar app on their mobile device in order to view the content created on Blippbuilder.

Can my colleagues use Blippbuilder?

When an account has been created for a school or college, the first registered user becomes an administrator for that group. As administrator, you can then freely add additional members to the group, both faculty and students.

How do I access Blippbuilder?

Blippbuilder is a cloud-based tool, so you just need an up-to-date browser. On rare occasions, school firewalls may block Blippbuilder. It’s completely safe for you to use, so speak to your IT administrator to unblock your access.

What are 'assets'? How do I create assets for my blipp?

Assets are the content features of your blipp images, videos, and icons that make your learning materials interactive. Blippbuilder comes with a bank of pre-loaded icons that you can use.

Alternatively, you can create custom icons using third-party platforms such as Adobe

Photoshop or Microsoft PowerPoint, and upload them to your asset library on Blippbuilder to make the blipp uniquely your own. For more information, see our asset guidelines.

Can I upload 3D assets to Blippbuilder?

Currently it is not possible to work with 3D assets in Blippbuilder, but we’re working on it!

What makes a good image marker?

The more complex the image, the easier it is for Blippar to recognise the marker. Images with a lot of contrast tend to work very well, while flat or monochromatic images may not work.

Is there a limit to the size of a blipp?

There isn’t a defined size limit for a blipp. However, blipps that contain many sequences and embedded assets may become slow to load on the Blippar app. One way to reduce the size of a blipp is to resize the individual assets you are using. For example, if you resize an image in Photoshop and upload it again to your asset library on Blippbuilder, it will reduce the size of your blipp.

3D models will notcurrently load within the Blippar app for free users.

Apologies for the inconvenience caused.

This article details how to add or remove markers to your existing Blipp without creating a new version.

This allows you to alter the markers in a Blipp without having to edit the Blipp or uploading another copy of the Blipp zip file.

1. Open the Blippar Dashboard

2. Tap 'More' and select 'Version History'

3.Tap 'More' and select 'Add Markers'

4. Add markers desired to Blipp.

5. Markers added are now visible in current version

6. To remove markers; hover over the marker and tap the 'Trash Can' icon

This article details how to add a video with a transparent background.

Chroma Key:

To use this feature the video used should contain a green/red/blue background prior to uploading into BlippBuilder.

Example Video: Green Screen Video.mp4

1. Add Video to Blipp - MP4 Only

2. Select Video Settings (right-side) and enable following:

Autoplay - Prevents stills showing revealing coloured background

Play in Loop - Prevent frames showing at end of video

Set Chroma Key - Removes coloured background

3. When viewing your Blipp in the app the video will display a transparent background

New to Blippbuilder and looking for a way to learn the craft? Every fortnight we upload a new demo video on our support pages.

These will provide an overview of Blippbuilder to enable you to get started.

This demo is a great way to get started and learn the basics of Blippbuilder. If you have any specific questions please use our knowledge base or reach out to us for a member of the team to get in touch.

If you have further questions following the webinar please contact us here.

Blippar for Android

Download Blippar

Blippar for iOS

In the comments below, share your questions on the blipping experience.

The Blippar dashboard is designed for managing and organising AR experiences created on our platform.

Group Campaigns - Create Projects - Find out How

Asset/Media Management - Find out How

The dashboard is where you manage AR content created with our tools.

Content can be organised as standalone experiences or as part of a group of experiences called 'Projects'.

Projects are useful for grouping experiences together from one campaign (eg. pages inside a magazine or different content created for one event).

Using projects enables you to:

1) View analytics from your campaign together

2) Use assets across all experiences

3) Organise content in an easy to manage way

Sharing Assets:

Assets uploaded within a Blipp are available at project level; this means deleting an asset uploaded will delete this from the entire project and will prevent this asset from loading within another experience it is used in.

How to create a Project:

1) Open blipps.blippar.com and tap 'New Project' in the top right hand corner

Learn: How to Create your First Blipp

2) Choose a name for your project and tap 'Create'

3) Select the project you just selected and tap 'Open'

4) Create your AR Content and this will be created within your new project

DO NOT DELETE THE FIRST SCENE OF YOUR BLIPP AS THIS WILL CORRUPT THE BUILD

After adding scenes you can connect them to create a menu for your blipp. Different scenes can hold different experiences. To direct users to each experience, you will want to connect your scenes.

Adding Scenes to Your Blipp

Key Terms

Scenes: A transition element for your blipp. Giving you the ability to multiple ‘screens,’ allowing you to create a hierarchy or an interactive story. Think of it like a movie. Each scene is an extension of the previous one and contains a different cast of characters.

Blippbuilder Scene Manager: A window that allows you to manage each scene in your blipp including adding, editing and deleting scenes.

DO NOT DELETE THE FIRST SCENE OF YOUR BLIPP AS THIS WILL CORRUPT THE BUILD

To Create a New Scene

In the bottom left corner of the canvas click the scene button it will read “Scene 1.”

In the Blippbuilder Scene Manager window click “Add New Scene,” on the bottom left. It will auto populate “Scene 2.” You can rename your scene if you like. Select enter. Come back to this area to add more scenes to your blipp

Click the X to close the Blippbuilder Scene Manager.

You can edit scenes in the menu on the right hand side. You can change the opacity, scale, position and rotation.

To switch and work on your different scenes, use scene button in the bottom left of the canvas.

Switching Scenes

The button in the bottom left of the canvas displays the current scene name.

2. Click the arrows on either side of the scene name to switch scenes.

3. Click the scene button to launch the Blippbuilder Scene Manager.

4. From here you can switch scenes, delete scenes or rename scenes.

5. Double clicking on the selected scene will switch to the canvas view of that scene.

Related Articles

Edit or Remove Scenes

DO NOT DELETE THE FIRST SCENE OF YOUR BLIPP AS THIS WILL CORRUPT THE BUILD

This video will go through adding Animation to your Blipp. It will go through the Motion Effects and Settings to add animation to assets in your Blipp.

Animation Effects Include:

Fade In/Out

Opacity

Move

Scale

Rotate

Bounce

Useful Info:

Marker - Marker Guidelines

3D Model (Must be in .md2 format) - Convert here FBX to MD2 Converter

Images - Asset Guidelines

Video:

DO NOT DELETE THE FIRST SCENE OF YOUR BLIPP AS THIS WILL CORRUPT THE BUILD

Scenes allow you to create an informational architecture for your blipp. Think of it as the ability to create a menu for your Blipp where users can browse through information by going to different scenes. With scenes you could add a simple mini game or quiz and send users to different scenes based on their actions.

Key Terms

Scenes: A transition element for your blipp. Giving you the ability to multiple ‘screens,’ allowing you to create a hierarchy or an interactive story. Think of it like a movie. Each scene is an extension of the previous one and contains a different cast of characters.

Canvas: A contained space in Blippbuilder that holds drawing and creation elements for your blipp. Located in the center of the screen. You will use this space similar to the way a painter creates their paintings, but instead of drawing you will drag and drop elements to create a picture.

Blippbuilder Scene Manager:A window that allows you to manage each scene in your blipp including adding, editing and deleting scenes.

DO NOT DELETE THE FIRST SCENE OF YOUR BLIPP AS THIS WILL CORRUPT THE BUILD

Add Go to Scene Widget to the Canvas

On the left hand side under widgets select the orange “Go to Scene” icon. This will allow you to link the current scene to a new or existing scene.

Edit or Remove Scenes

2. Drag the “Go to Scene” to the canvas.

3. Click the scene button that will read “Scene 1” it’s located in the bottom left corner of the canvas.

4. In the pop up window click "Add New Scene,” on the bottom left. It will auto populate “Scene 2.” You can rename your scene if you like. Select enter. Come back to this area to add more scenes to your blipp.

5. Click the X to close the menu.

6. To edit your scene use the menu on the right hand side. You can change the opacity, scale, position and rotation.

7. Don’t forget to add your custom assets or our pre-made widgets. To learn more see the article, “Uploading and Adding Assets.”

8. To switch between and work on your different scenes, use scene button in the bottom left of the canvas.

DO NOT DELETE THE FIRST SCENE OF YOUR BLIPP AS THIS WILL CORRUPT THE BUILD

Assign Go to Scene to a Custom Asset

Upload a custom asset to your library. You can learn how to do this here.

From the uploads section, drag and drop a custom asset from your library to the canvas.

On the right hand side under settings click “New Action” to reveal a drop down menu.

Select “Go to Scene” from the drop down menu.

A new field will appear under this section “Select a Scene.” Click to select which scene you’d like it to go to.

If needed, connect your new scene.

Related Articles

Connecting Scenes

DO NOT DELETE THE FIRST SCENE OF YOUR BLIPP AS THIS WILL CORRUPT THE BUILD

This video will go through adjusting the Animation to your Blipp. The principle for changing how the animation added works are adjusted using the position & rotation axis. This video details how this is manipulated.

Useful Info:

Marker - Marker Guidelines

3D Model (Must be in .md2 format) - Convert here FBX to MD2 Converter

Images - Asset Guidelines

Video:

You can upload your own assets/media when creating AR experiences to create consistent material for branded experiences.

Within the Blippar AR creation tool you can upload assets to implement them within your AR experience. The uploads section can be found on the left hand side panel under the tab 'Uploads'.

.

Assets can be dragged into the panel or alternatively you can use the file finder to browser you computer to upload desired assets.

Deleting Assets:

It is important to note this is a working uploads panel and assets seen within this panel must not be deleted if they are to be used in any AR experiences created.

Missing Assets:

If AR experiences state that assets are missing then it is likely assets used within the AR experience (Blipp) have been deleted. Check that assets used anywhere within Blipps across a project are still visible within the uploads panel. If they have been removed you must reupload this assets and replace it within the Blipp.

Sharing Assets:

Assets uploaded within a Blipp are available at project level; this means deleting an asset uploaded will delete this from the entire project and will prevent this asset from loading within another experience it is used in.

Offering end-users something they can get exclusively through blipping is a brilliant way to encourage interaction and engagement. Let users read the first few pages of a new book, flip through recipes or glance at a map. These are just a couple of the many ways you can use the PDF feature.

How to add a PDF to your blipp

Drag and drop the PDF widget onto the stage

Click on the upload button under “Action Settings” to upload a PDF

Give your widget a name

Choose the font and shape of the widget

Finally, select a color based on the preselected color options which are chosen automatically from the main colors of the marker or enter a HEX value to set any color you wish

How do users interact with this widget in a blipp

User taps on the PDF widget in your Blipp and the PDF is opened in the app

3D Models can an enable a more immersive AR experience. We know you want your blipps to be dynamic. 3D assets can help give your blipps more texture and not to mention that “wow” factor.We have updated our converter to enable greater control and usability when working with 3D models in BlippBuilder.

3D Guidelines

All assets should be converted to BB3, Blippar’s proprietary format.

To create an BB3 you can use our FBX to BB3 converter (found here )to convert the FBX file that you created or bought

The converter currently acceptsFBX files with:

However, each geometry can only contain 32,767 Polygons, 32,767 UVs, and 32,767 Vertices.

More than a single geometry.

Node hierarchy with transform information

Embedded textures

Texture maps

Model size under 8mb

We do not support FBX files with:

Lighting

Materials

Bump or specular maps

Other 3D Formats

You can convert the following file formatsto FBX using the Autodesk FBX Converter or Blender.

OBJ

DXF

DAE

3DS

Autodesk FBX Converter:

Using theFBX converter is convenient because it avoids the memory overhead associated withrunning Maya, 3ds Max, or other DCC applications, which would otherwise be necessaryto convert a fileto the FBX file format.

You can download the FBX Converter from the following webpage: https://www.autodesk.com/developer-network/platform-technologies/fbx-converter-archives

Blender 3D Suite:

Using Blender will allow you to import the model and export in FBX to be ready to use in BlippBuilder.

You can download Blender from the following webpage: https://www.blender.org/

This article explains how to convert 3D models for BlippBuilder. Models must be converted from FBX to MD2.

FBX to MD2 Converter

The video details how to convert from an FBX file into the converter tool and then handle uploading the model and texture to the BlippBuilder tool.

In this example, we used TurboSquid to download a free model.

TurboSquid 3D Models

This video will go through adding 3D Models to your Blipp. It will cover converting the assets to the correct format for BlippBuilder and frequently asked questions about how to process the model and textures.

Useful 3D Resources:

Blender 3D Creation Tool - Blender

TurboSquid 3D Model Store - TurboSquid

Useful Info:

Marker - Marker Guidelines

3D Model (Must be in .md2 format) - Convert here FBX to MD2 Converter

Video:

This document gives a brief overview of the Blippar SDK

What is the Blippar SDK?

Basic Requirements to Use the SDK in Your Application

Licence Key

Upgrading the SDK

What's in the SDK?

How Do I Create AR Content?

What is a Marker?

What's the Difference Between a Marker and a Blipp?

What are the Different Ways I can Use Markers?

How Does Blippar SDK Work In My Application?

Which Blipps Can I Run?

Blipp Caching

What About the Camera and the Screen?

How Do the SDK and My ApplicationCommunicate?

Can I Extend the Blippar SDK Functionality?

Can My ApplicationCommunicate With a Running Blipp?

What is the Blippar SDK?The Blippar SDK is a library of classes that provides a range of Augmented Reality and image detection features that can be incorporated into third party applications.The API is available to both Android and iOS and supports applications written in Java, Kotlin, Objective-C and Swift.On iOS the SDK is supplied as a Framework and on Android it is provided as an AAR.Basic Requirements to Use the SDK in Your Application

The minimum supportedAndroid version is Kitkat (4.4.x), API version 19and the minimum iOS version supported is iOS 9.

A rear facing camera. The end-user must grant permission for access to the camera in your application.

A good internet connection. The Blippar SDK uses internet connections extensively to perform detection tasks and download content.

Location Services. This is not compulsory, but you can ask the user for permission for this and potentially provide enhanced AR experiences as a result.

Licence KeyIn order to use this SDK a license key is required. This license key is tied to the App ID and platform (iOS or Android) of your application. If you want to use the Blippar SDK in more than one app, or on iOS and Android) then you will need a separate key for each app and each platform. If you decide to change your App ID then you will need to get a new key from us before you can use the SDK.You will register your App ID with us and we will generate the key that you should use in your application. Please keep your key safe.If you would like to request a license key please reach out to your account manager or email [email protected] the SDKPlease keep up to date with the latest Blippar SDK versions and update the SDK each time you update and release your own application. It is important to keep pace with changes, fixes and other improvements that we will continually make to our system.What's in the SDK?The Blippar SDK is divided into three main components:

Marker and Entity Detector

Augmented Reality Target Tracker

Augmented Reality 3D Engine

The Marker and Entity Detector uses a complex server system to recognise objects and images that your users are pointing their device's camera at. You can run the detector and it will give you results about what the camera is seeing.The AR TargetTracker uses the camera to follow specific target images and provides output that allows 3D animations to be drawn to the device screen as if attached to the target images.The AR Engine can draw and animate sophisticated 3D scenes on top of images within the camera and then track and follow the images so that the scenes seem to be part of the real world - in other words; Augmented Reality. The AR scenes that the Blippar SDK can show are self-contained packages called blipps. Blipps contain 3D models, textures, images, sounds, videos and controlling javascript scripts that allow you to make it all interactive. blipp How Do I Create AR Content?The AR content displayed by the Blippar SDK is packaged in what we callblipps.Each blipp contains all the content required for a single AR experience. A blipp is designed to run on top of a particular image, called marker. The Blippar SDK will automatically project and draw the blipp on the marker as if it was part of it; the essence of AR.The Blippar SDK will use your device camera and draw onto the screen so you can see the camera image and the blipp content. You do not need to do any work with the camera or with 3D rendering yourself; all this will be handled by the Blippar SDK.These blipps can either be entirely build by hand with javascript, using Blippbuilder Script ( https://developer.blippar.com/portal/ar-api/home/ )or can be build using our drag-and-drop blipp design tool; Blippbuilder( https://blippar.com/en/products/blippbuilder/ ).Blipp creation is a large subject all on its own and we don't cover the details in the SDK documentation. You can find more on how to create a blipp with Blippbuilder Script here: https://developer.blippar.com/portal/ar-api/guides/creating-blipp/, or with Blippbuilder here: https://support.blippar.com/hc/en-us/articles/208577557-Your-First-Blipp-Build.In a large organisation it is typical that the blipps are created by a separate design and development team to those building Blippar SDK based applications.When a blipp is created it is packaged up with its marker and stored on our servers where it can later be downloaded by the Blippar SDK and drawn on screen automatically.What is a Marker?A marker is a flat image that our system can detect and track using the camera and then project a 3D AR experience onto.The choice of marker is entirely up to you. Common markers includeadvertising collateral, packaging, manuals, or any other branded imagery.Markers can be good or bad! Good markers contain a lot of detail, with high contrast and bold colour changes. The Blippar tracker looks for detail and if there isn't much, it can't be sure of the exact position and orientation of your marker so the AR experience might not stickonto your marker very well.For more information and examples check out our "Choosing a Marker" article.One important point is that text typically does not make a good marker, because a block of text looks rather similar to other blocks of text and is hard to recognise one from another for our computer vision system. To maximise your success don't use markers that are just text. Full page layouts with text and pictures from a magazine or brochures work great.What's the Difference Between a Marker and a Blipp?A marker is not a blipp. This is an important distinction.

A marker is an image that has been registered with Blippar's Marker Detector. It can be detected and recognised by our detector.

A is an AR experience wrapped up into a package that can be stored on our servers and run by the SDK on your device.

What are the Different Ways I can Use Markers?

You can associate one or many markers with a blipp, so that when those markers are detectedour SDK can download and run the relevantblipp AR experience.You can change the markers that are associated with a blipp, and you can also run a blipp without any markers at all.Running blipps without markers can be useful in several cases:

When you want users that do not have access to the markers to be able to trigger the AR experience. For example, you have designed a blipp that is triggered by a marker attached to a specific location e.g. a plaque next to a monument or landmark.

When you want to use the Blippar SDK as a 3D engine. You may consider this if you are already using our SDK in your applicationand you want to add more 3D contentthat is not related to any marker. This may save you time and resources as you will not need to integrate another SDK, while allowing your final application toconsume less target device memory.

Triggering AR experiences off a location instead of triggering from a marker. While theBlippar SDK does not support geo-triggered AR yet (i.e. it does not allow youto attach AR content to certain coordinates), your custom application could detect user location and launch different blipps based on this information. Please remember that blipps can be restricted to a limited set of countries during the publishing as well, so you can launch country specific blipps even without tracking user location yourself.

Note: If you wish to run a blipp without a marker, it should support the peel-away mode allowing the blipp’s content to stay on the screen when the user moves their device away from the marker.

How Does Blippar SDK Work In My Application?First, design yourmarker(s)and assets. Use them to build your uniqueblipps and upload the blipp packages to our server.Next, you have to make your blipps available to scan with your application.Currently, this is done by assigning a test code to a blipp, this is the first eight symbols of your license key.The typical flow in your application is as follows:

Initialise the SDK (the SDK will take over the camera and the screen).

Start the Marker and Entity Detector and wait for the user to point the camera at one of yourmarkers.

The SDK will call you when your marker has been seen (detected), and it will tell you which blipp the marker is associated with.

You then ask the AR Engine to launch the associated blipp and the SDK will download all the required data and run your blipp.

The SDK will automatically start the AR Target Tracker and draw your AR experience attached to themarker.

You have complete control over which blippsare run in the SDK (you can launch any blipps as long as they are under your Hub account). You do not need to use the Marker and Entity Detector if you just want to run a blipp without waiting for a marker detection.Which Blipps Can I Run?The Blippar SDK will only run blipps that belong to you and are associated with your license, or ones designed by Blippar for testing the SDK. The Marker Detector will not detect anybody else's markers.Blipp CachingWhen blipps are downloaded, they will be cached within your application's disk storage. If the same blipp is run again then the SDK can save a lot of time and internet bandwidth by loading data directly from the cache.What About the Camera and the Screen?The Blippar SDK takes care of all the camera image capturing, camera drawing, and 3D experience drawing. You do not need to do any of this by yourself.

Note: You will not be able to access the device's camera while the Blippar SDK is running in the application.

You can place your own UI controls (buttons, text, pictures and others) on top of the camera feed provided by the SDK if you choose to do so. Remember to be careful not to obstruct the AR area too much since it will make it difficult for your user's to interact with the AR experience. Our advice is to put your UI elements close to the screen edges and keep them small.As a custom application developer, you might be interested to know that the Blippar SDK contains an iOS View Controller/View or Android Fragment(called the Viewin this document for convenience) that you will use to show the camera and 3D content. Once initialised the View will take control of the camera and do all the drawing necessary.The View requires the full screen when it is running.The Blippar View elements draw the camera full screen so naturally it should be the rear-most element in your stack of elements.How Do the SDK and My ApplicationCommunicate?The Blippar SDKuses Delegates or Listeners(i.e.callbacks)to report the status of what is going on. Most of what goes on in the SDK happens in background threads, so should be considered asynchronous.When you call an SDK function to start the Marker Detector or launch a blipp, the function will return immediately (possibly with an instant error), but will then go off and perform all the work in the background and call your callbacks when they have something to report.Both systems use the internet connection to detect and download content.The SDK initialise isan asynchronous operation that uses the internet connection, and may take a short period of time to complete. It must do a variety of things, including checking your application's license key. When it succeeds or fails it will tell you by calling a callback that you must have in your application. You may want to perform some other action or animation of your own while the initialise completes.You don't need to use all the callbacks the SDK provides: use only the ones that are necessary for your particular scenario.A running Blipp is also an asynchronous process. As soon as you launch it, it will load, run and draw itself automatically without the need of any further action.Can I Extend the Blippar SDK Functionality?The Blippar's main View Controller/Fragment is designed with flexibility in mind. Out of the box it tries to do as much as possible for you so that you can get up and running quickly. It will perform the main detect and blipp launch cycle for you automatically. It will:

Initialise and draw the camera.

Automatically perform detection of your markers.

Automatically launch your blipps if detected.

Allow for blipp closure and return to a detecting state.

However, The View Controller/Fragment is designed to be subclassed and you can override various parts of this behaviour and customise it for your own purposes.Can My ApplicationCommunicate With a Running Blipp?This first version of our SDK provides only one communication path. You can call a special SDK function to associate a block of JSON data with a specific blipp ID. This data will be cached and stored, then when the associated blipp is run it will be given this block of JSON as a startup parameter. You can use this to customise the behaviour of a blipp according to previous actions taken in your application. This only happens when the blipp starts up, and calling it again while the blipp is running will not send the data to the blipp.We plan to add several other methods for direct applicationto blipp communication in the near future.

This document will explain how to integrate Blippar SDK into a third-party Android app.

Requirements

License Key

Distribution

Linking

Permissions

Dependencies

Proguard

SDK Registration

Java / Kotlin

Integrating SDK Fragment in an Activity

Adding SDK Fragment Through the Activity XML Layout File

Java

Kotlin

Blipp Lifecycle

Java

Kotlin

Integrating the Debug View

Testing Your App

Sample Apps

Requirements

Blippar Android SDKshould be linked as a part of an Android project in Android Studio or another Android IDE.

The SDK supports Android 4.4 or later, you need to build your app with Android SDK Revision 19.0.0 (API Level 19) or later. The SDK is built with a target SDK version of 27.

The SDK contains four architectures:armeabi-v7a, arm64-v8a, x86_64and x86.

Currently, the BlipparSDK only supports full screen portrait mode. This can be set in theactivity xml or programmatically.

Gradle 3.x.x is not yet supported, please use 2.x.x.

License Key

You must obtain a license key from Blippar to use the SDK in your app. This key must be embedded into your app source code and then given to the SDK during its initialisation (this is shown in the example below.)

If you have more than one app then you will need separate keys for each app.

Distribution

The Android SDK bundle is distributed as an AAR module file.

Linking

Assuming you are using Android Studio 1.3 or later please follow the following steps to import the Android SDK to your project:

Save the provided .AAR file locally.

Open the project you want to use SDK with.

Import a local .AAR file via the following menu:File>New>New Module>Import .JAR/.AAR Package.

This should automatically add the following line to your appbuild.gradlefile underdependenciessection:

dependencies {

...

compile project(':blipparsdk')

...

}

where:blipparsdkis the name you have given to the Blippar SDK module.

If this line has not been added automatically, please add it manually.

You may encounter an error:

Error:Execution failed for task ':app:processDebugManifest'.

> Manifest merger failed : Attribute application@theme value=(@style/AppTheme) from AndroidManifest.xml:11:9-40

is also present at [:blipparsdk] AndroidManifest.xml:11:18-49 value=(@style/SDKTheme).

Suggestion: add 'tools:replace="android:theme"' to <application> element at AndroidManifest.xml:5:5-19:19 to override.

If you add the following line to your AndroidManifest.xml <application> tag:

tools:replace="android:theme"

If tools appear in red in Android Studio then may need to hover over tools and hit alt+enter to automatically import the correct namespace.

Permissions

The SDK requires following basic permissions to function:

the camera,

internet,

network state.

Without these the SDK will not function.

There are a few optional permissions.The SDK will function without them, but if the blipp requires one or several optional permissions to function correctly, it maynot work and even crash at runtimeif permissions are not granted.

It is recommended you only acquire the permissions you know your app needs to run blipps. If you know your blipp while running in your custom app won't be saving or picking photos from the gallery/Photos then you should not acquire the permission.

When targeting Marshmallow or higher the optional permissions are requested from the SDK dynamically at runtime, if not already granted. This only happens at the point at which an operation that requires the permission is performed in the blipp. The one exception to this is the location permission, this must be explicitly acquired by the client app and is never requested by the SDK. You can overload the text used for the various permission prompts if desired.

If targetting earlier versions than Marshmallow then you'll need to request the permissions up front in yourAndroidManifest.xml (see below):

<!-- Mandatory permissions -->

<uses-feature

android:name="android.hardware.camera"

android:required="true"/>

<uses-permission android:name="android.permission.CAMERA"/>

<uses-permission android:name="android.permission.INTERNET"/>

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

<uses-permission android:name="android.permission.VIBRATE"/>

<!-- Optional permissions -->

<!-- Used when writing photos taken within a blipp to the Photos/Gallery app -->

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

<!-- Used to read from Photos/gallery when a blipp wants to choose an existing photo -->

<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

<!-- Used when performing video recording within a blipp -->

<uses-feature

android:name="android.hardware.microphone"

android:required="false" />

<uses-permission android:name="android.permission.RECORD_AUDIO"/>

<!-- Blipps can vibrate the device using a JS API -->

<uses-permission android:name="android.permission.VIBRATE" />

<-- Location permissions -->

<uses-feature

android:name="android.hardware.location"

android:required="false" />

<uses-feature

android:name="android.hardware.location.network"

android:required="false" />

<uses-feature

android:name="android.hardware.location.gps"

android:required="false" />

<!-- Used for determining the user's location. Must still be enabled via the SDK setLocationEnabled API -->

<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

Dependencies

The SDK has a few dependencies.

compile "com.android.support:support-core-utils:${androidSupportLibVersion}"

compile "com.android.support:design:${androidSupportLibVersion}"

compile "com.android.support:preference-v14:${androidSupportLibVersion}"

// For getting saved photo orientation

compile "com.android.support:exifinterface:${androidSupportLibVersion}"

// Face detection/tracking

compile "com.google.android.gms:play-services-vision:${googlePlayServicesLibVersion}"

// Required by Location Services

compile "com.google.android.gms:play-services-location:${googlePlayServicesLibVersion}"

// unit tests

testCompile "junit:junit:${junitLibVersion}"

testCompile "org.mockito:mockito-core:${mockitoLibVersion}"

The SDK allows these libraries to be changed via your app's build.gradle. Below is a table that outlines the various versions:

Gradle Parameter

Default (if missing from root project)

ext.supportLibVersion

27.1.0

ext.googlePlayServicesVersion

12.0.1

ext.junitVersion

4.12

ext.mockitoVersion

2.3.3

ext.buildToolsVersion

27.0.3

ext.minSdkVersion

19

ext.targetSdkVersion

27

ext.compileSdkVersion

27

Proguard

The SDK gradle defines a proguard configuration using the 'consumerProguardFiles 'blipparsdk_proguard-project.pro'.

This means there is nothing special you should need to do.

SDK Registration

Java / Kotlin

Open (or create) yourApplicationclass/Kotlin file.

Add the following line at the top of the file below your own import statements (Android Studio does this automatically for you)

import com.blippar.ar.android.sdk.Blippar;

Search for the callbackonCreate()or override it.

Add the following lines to setup and start the Android Blippar SDK:

super.onCreate();

Blippar.setApplication(this);

Blippar.setKey("enter your license key here");

Note: Please keep your key secure. Do not store it inside any obviously textual files inside your application bundle.

Integrating SDK Fragment in an Activity

As Blippar SDK is using a camera feed to display an AR experience we assume that developer has taken care of getting the camera permission. Launching the SDK without camera permission will crash the app. Location permission is optional and is only needed if the client's custom app is going to display a location-based AR experience. See the "Permissions" chapter in this document for more detail.

The BlipparSDKFragment/BlipparView must be full screen. If using an ActionBar see this document on how to achieve overlaying of content http://www.androiddocs.com/training/basics/actionbar/overlaying.html

See this document on how to hide the status bar https://developer.android.com/training/system-ui/status.html

If using AppCompat you will need to usewindowActionBarOverlayas opposed to the android namespaced one in your activity/app's theme in xml.

If you do not make the view full screen then certain undesirable resizing of blipp content can happen on backgrounding and foregrounding of the app. We will fix this issue in a future release of the SDK.

Adding SDK Fragment Through the Activity XML Layout File

Java

In the activity.xmlfile add a fragment with the class property set to"com.blippar.ar.android.sdk.BlipparSDKFragment". Alternatively, create the fragment programmatically based on theBlipparSDKFragmentclass, there is a convenience static BlipparSDKFragment.create() function.

To control the SDK lifecycle you need to create an SDK observer and override its default callbacks. Use theonInitialiseSuccesscallback to start blipp detection:

private final BlipparSDK.BlipparSDKListener blipparSDKListener = new BlipparSDK.BlipparSDKListener() {

@Override

public void onInitialiseSuccess() {

final BlipparSDK sdk = Blippar.getSDK();

// after the SDK is initialised, start detection and rendering

// You can add other kinds of detectionTypes with the other startDetection variant

sdk.startDetection();

}

@Override

public void onInitialiseError() {

}

@Override

public void onShutdown() {

}

};

In the activity class add an observer for the SDK:

Blippar.getSDK().addSDKListener(blipparSDKListener);

Don't forget to remove the observer after it is not used anymore(overridingonDestroycallback would be a good place for that):

protected void onDestroy() {

super.onDestroy();

// when destroying the activity, remove the lifecycle observer

Blippar.getSDK().removeSDKListener(blipparSDKListener);

}

Kotlin

In the activity.xmlfile add a fragment with the class property set to"com.blippar.ar.android.sdk.BlipparSDKFragment". Alternatively, create the fragment programmatically based on theBlipparSDKFragmentclass, there is a convenience staticBlipparSDKFragment.create()function.

To control the SDK lifecycle you need to create an SDK observer and override its default callbacks. Use theonInitialiseSuccesscallback to start blipp detection:

private var mBlipparSDKListener = object : BlipparSDK.BlipparSDKListener {

override fun onInitialiseSuccess() {

// Start detection with just markers

// You can add other kinds of detectionTypes with the other startDetection variant

Blippar.getSDK().startDetection()

}

override fun onInitialiseError(error: InitialisationError) {

Toast.makeText(this@MainActivity, "Unable to initialise SDK with error: " + error.toString(), Toast.LENGTH_LONG).show()

Log.e(LogTag, "Unable to initialise SDK with error: " + error.toString())

}

override fun onShutdown() {

// Cleanup and remove the listener now

Blippar.getSDK().removeSDKListener(this)

}

}

In the activity class add an observer for the SDK:

Blippar.getSDK().addSDKListener(mBlipparSDKListener)

Don't forget to remove the observer after it is not used anymore(overridingonDestroycallback would be a good place for that):

override fun onDestroy() {

super.onDestroy()

// Remove our listeners

Blippar.getSDK().removeSDKListener(mBlipparSDKListener)

}

Blipp Lifecycle

Java

To respond to the blipp lifecycle you need to implement a blipp state listener.

Create a blipp event listener object based on theBlippStateListenerclass. It has several callbacks that will allow you to follow the blipp lifecycle events:onBlippLoading,onBlippError,onBlippRunning,onBlippWaitingForTrackingLock,onBlippClosingandonBlippClosed.

private final BlippStateListener mBlippStateListener = new BlippStateListener() {

@Override

public void onBlippLoading(BlippContext context) {

// Blipp has started loading

}

@Override

public void onBlippWaitingForTrackingLock(BlippContext context) {

// Blipp is waiting for the tracker to lock onto the target before loading

}

@Override

public void onBlippLoadingProgress(BlippContext context, int progress) {

// Blipp is loading with the visible progress spinner

}

@Override

public void onBlippError(BlippContext context, BlipparSDKBlippErrorType errorType) {

// Blipp has failed to trigger with the given error

}

@Override

public void onBlippRunning(BlippContext context, BlippRunningState runState) {

// Blipp is running in the given state

}

@Override

public void onBlippClosing(BlippContext context) {

// Blipp has begun closing

}

@Override

public void onBlippClosed(BlippContext context) {

// Blipp is closed

}

};

You can cache the blippcontextprovided by theBlippEventListener.onBlippLoadingcallback to control the Blipp lifecycle. However, the BlipparSDKFragment already does this so beware that cache the context may cause reference problems if you don't release it correctly. TheBlipparSDKFragment there is a function to close the currently running Blipp called closeCurrentBlipp.

Kotlin

To respond to the blipp lifecycle you need to implement a blipp state listener.

Create a Blipp event listener object based on theBlippStateListenerclass. It has several callbacks that will allow you to follow the Blipp lifecycle events:onBlippLoading,onBlippError,onBlippRunning,onBlippWaitingForTrackingLock,onBlippClosingandonBlippClosed.

private val mBlippStateListener = object : BlippStateListener {

override fun onBlippLoading(blippEngineContext: BlippContext) {

// Blipp has started loading

}

override fun onBlippWaitingForTrackingLock(context: BlippContext) {

// Blipp is waiting for the tracker to lock onto the target before loading

}

override fun onBlippLoadingProgress(context: BlippContext, i: Int) {

// Blipp is loading with the visible progress spinner

}

override fun onBlippError(context: BlippContext, blipparSDKBlippErrorType: BlipparSDKBlippErrorType) {

// Blipp has failed to trigger with the given error

}

override fun onBlippRunning(context: BlippContext, runningState: BlippRunningState) {

// Blipp is running in the given state

}

override fun onBlippClosing(context: BlippContext) {

// Blipp has begun closing

}

override fun onBlippClosed(context: BlippContext) {

// Blipp is closed

}

}

Register with the SDK

Blippar.getSDK().addBlippStateListener(mBlippStateListener)

Make sure you remove the listener in your onDestroy()

You can cache the blippcontextprovided by theBlippEventListener.onBlippLoadingcallback to control the blipp lifecycle. However, the BlipparSDKFragment already does this so beware that cache the context may cause reference problems if you don't release it correctly. TheBlipparSDKFragmentthere is a function to close the currently running Blipp calledcloseCurrentBlipp.

Integrating the Debug View

Add com.blippar.ar.android.DebugView to your view/activity. Ideally, it would be full screen and on top of everything else.

The DebugView can be toggled (slid in and out) by tapping the bottom of the UI. It will slide down and reveal other options.

The debug view really is only useful when in a blipp but there are some helpful options within the 'More..' overflow

Testing Your App

Once you have a running app you may wish to test against some real markers. See the provided Sample Markers document.

Once the SDK has been initialised call the SDK'ssetDebugTestBlippsEnabledfunction and set this to true in order to see the sample markers.

Make sure you turn off this flag (by default it is off) before releasing your app to the public.

It is also possible to increase the verbosity of the logging system within the SDK.

Sample Apps

There are two sample apps provided, one in Java and one in Kotlin.

They are an example of the most basic integration of the SDK.

The keys have been removed from the project so you need to provide your own key. You can do this in App.java or App.kt.

You will also need to change the package name in the AndroidManifest.xml to your licensed package name to validate the SDK.

You are unable to modify the email associated to your account.

However, you are able to change your password. Simply go to “My Account” on your Blippar Dashboard and select the “profile” section.

- Under Account Settings, click “edit” under the “Password” section

- A form will open up where you can change your current password

File names won't allow any punctuation (e.g.\%/&/+/_/-)

Marker

File Type: PNG or JPEG format

Size: Less than 50 MB

Format: Accepts RGB, not CMYK

Between 500-800 Pixels

A good marker has lots of detail and contrast as opposed to blocks of text or odd shapes. The Blippar app is colour blind, so please keep this in mind when you are about to begin with a project if you have the same image but in two different colours, the app will not be able to differentiate between the two.

More Information on Markers

Graphics

Create your graphics using Adobe Photoshop or similar:

Build up your images and buttons on different layers

Export your assets as separate files ready to upload into Blippbuilder

When creating your graphics please use the following properties:

Maximum: 2000px

File type: jpeg or png (for transparency)

File name won't allow any punctuation or any other character (e.g.\%/&/+/_/-)

Format: Accepts RGB, not CMYK

File Size: Under 300KB.

3D models

All assets should be converted to BB3, Blippar’s proprietary format.

To create an BB3 you can use our FBX to BB3 converter (found here )to convert the FBX file that you created or bought

The converter currently acceptsFBX files with:

However, each geometry can only contain 32,767 Polygons, 32,767 UVs, and 32,767 Vertices.

More than a single geometry.

Node hierarchy with transform information

Embedded textures

Texture maps

Model size under 8mb

We do not support FBX files with:

Lighting

Materials

Bump or specular maps

Animation

Audio

File type: MP3

Size: within 60 seconds (recommended)

Video

File type: MP4

Resolution: 1280 x 720p

Size: max 50mb

Length: under 60 seconds (*Please see below)

Must contain an audio track

Following these guidelines will ensure the optimal loading time of the Blipp.

Video must have an audio file;If the video doesn't have audio you must add a blank audio file to use in your Blipp.

Video title won't allow 'special characters' (e.g.//)

Video title won't allow any spaces in between words

Video title won't allow any numbers

Video title won't allow any punctuation or any other character (e.g.\%/&/+/_/-)

* For longer videos please utilise video streaming in full screen via youtube or another video hosting site.

Choosing the SDK version you use is essential in ensuring that the Blipp created is compatible and work as expected in your own app.

We are currently supporting three versions of our SDK.

1) Latest - SDK 2.3.0 - This is the latest release of our SDK

2) SDK 2.2.0 - This was released in March 2018

3) SDK 2.1.0 - This is the first version of the Blippar SDK released

Some features and improvements to our BlippBuilder AR Creator Tool required an update to the SDK and Blippar App to implement. This means that when using an earlier version of our SDK you must select the version within the BlippBuilder tool prior to publishing.

1) Tap on 'Blipp Name', then tap on 'Settings'

2) Tap 'Select SDK Version' and select the correct version.

FOR THE BLIPPAR APP ALWAYS USE 'LATEST'

If you have any questions please don't hesitate to get in touch.

To add a texture to your 3D model there are two options:

1) Bake the texture to the FBX model prior to converting using our converter

2) Apply texture (JPG.) within the converter tool to the model

Currently you can only add one texture to your model using this method. To use a model with different textures please bake the texture to the model in an external 3D modelling tool prior to converting.

3D Model (Texture Embedded)

1) Upload FBX model to converter tool. Tool will state conversion is finished and offer option to download the BB3 file.

3D Model(Texture Not Embedded)

1) Upload FBX model to converter tool. Tool will flag missing file (texture)

2) Upload texture to converter tool.

Currently you can only add one texture to your model using this method. To use a model with different textures please bake the texture to the model in an external 3D modelling tool prior to converting.

3) Tool will state conversion is finished and offer option to download the BB3 file.

You can upload anything from a 2D asset to a green screen video onto your blippbuilder canvas, and now we’ve added compatibility for animated GIF’s. Whether you want to create your own GIF or download one from a third party provider such as ( Giphy, AwesomeGIFs, or ReactionGIFs ) once you have your asset ready you can follow the steps below to upload and add a GIF to your blipp.

Uploading an Animated GIF

Click on the uploads tab found in the media panel on the left.

Click on “browse” and select your file.

Note: Each file will have a different visual representation, which identifies the media type (image, audio, video and animated GIF) in your library, so you can easily find it again.

Add Animated GIF to Canvas

Drag and drop your animated gif onto the canvas.

On the right, the properties panel will slide in, allowing you to add on-tap actions to your GIF and set other preferences, including scale, position, opacity level and more.

The Animated GIF will appear as a static image in the asset panel and on the canvas, but will be activated once the blipp is triggered on any device

When working with animation, there will come a time when you want to update your timeline. This will allow you to change animation settings such as the start time, elongate to shorten an animation and add two animations to one asset.

Key terms

Animation timeline: Shows the animation for the duration of a blipp in a linear timeline. The animation timelines uses seconds to measure time.

Time scrubber: The cursor on the animation timeline that allows for convenient animation editing. Each dash represents different times during a blipp. You can drag the time scrubber to different spots on the animation timeline and make adjustments that correlate to that moment in the blipp.

Update your animation timeline

If you want to change animation settings, open your animation layers by clicking the arrow in the bottom right. Then click on the animation in the timeline and the corresponding options will reappear in the bottom of the right hand bar.

Adding Scenes to Your Blipp

2. You can change the start time of an animation by dragging it along the timeline. Use the numbers on the timeline (representing seconds) as a time reference.

3. You can elongate or shorten the duration of an animation by clicking the double bars on the end of the animation and stretching or minimizing its width along the timeline. Use the numbers on the timeline (representing seconds) as a time reference.

4. You can also have two animations associated to one asset:

a. Drag and drop multiple animations and set them to overlapping timeframe. They will appear stacked on the timeline.

b. Drag and drop multiple animations and set them to different places on the timeline, to see them occur sequentially. They will appear stacked on the timeline.

c. Use the time scrubber in the timeline to see how combined animations with the asset on the stage.

d. If two animations cannot be combined on the timeline, they will snap before or after the existing objects when dragged onto the timeline.

Related articles

Add Specific Animation Effects: Move, Rotate and Scale

Share with us in the comments what you animation experience has been like and what you have created.

Blippbuilder gives you the ability to control every aspect of your animation. You can move, rotate and scale assets by using animation. With these animation effects you can easily move planets across the sky while spinning or make bird fly through a landscape and get bigger as they appear to come closer.

Key Terms

Animation Timeline: Shows the animation for the duration of a blipp in a linear timeline. The animation timelines uses seconds to measure time.

Time Scrubber: The cursor on the animation timeline that allows for convenient animation editing. Each dash represents different times during a blipp. You can drag the time scrubber to different spots on the animation timeline and make adjustments that correlate to that moment in the blipp.

Canvas: A contained space in Blippbuilder that holds drawing and creation elements for your blipp. Located in the center of the screen. You will use this space similar to the way a painter creates their paintings, but instead of drawing you will drag and drop elements to create a picture.

Controlling the Move Animation

After assigning move to an asset a path will automatically be added. To change this you can move the asset to a new starting point.

To change the direction, click and drag the time scrubber to the end of the move asset in the animation timeline. Then click the asset on the canvas and drag it to your desired end point.

To change the middle of the animation path move the scrubber to the desired point in the timeline. Then click the asset on the canvas and drag it to create your desired path.

To view hit the play button located on top and in the center of the animation timeline.

Adding Animation

Controlling the Rotate Animation

After assigning rotate to an asset you can change the x, y and z axes by using the rotation rotation fields on the left hand side.

To change direction, click and drag the scrubber to the end of the rotate asset in the animation timeline. Then input the desired rotation in the x, y or z fields.

To change the rotation in the middle of the animation drag the scrubber to the time when you’d like to make a change. Then input your changes in the x, y or z fields.

4. To view hit the play button located on top and in the center of the animation timeline.

Controlling the Scale Animation

After assigning scale to an asset you can change the automatically assigned scale by using the scale input field on the right hand side.

To change the scale, click and drag the scrubber to the end of the scale asset in the animation timeline. The input the desired scale in the field on the right hand side.

To edit the scale further you can move the scrubber to any point in the animation and enter the desired scale size for that point in the the timeline.

4. To view hit the play button located on top and in the center of the animation timeline.

Related Articles

Updating the Animation Timeline

Share with us in the comments what you want to create with animation. How will you use move, rotate and scale?

List of features found in Blippbuilder settings that can be edited

Blipp Name - this will appear in the dashboard and search results.

Add background audio - Within the ‘Add audio file’ window users, can upload an mp3 or choose from their library. This sound will play at the blipp’s opening scene.

Add an intro video - Within the ‘Add video file’ window, users can upload a new video file or choose from their library. This will cause for a full-screen video to play upon blipping.

Advanced Settings - Allows you to have more control over your blipp.

Click to enlarge

List of advanced settings features

Share Screenshots - This controls if the user can share a screen shot on social media.

Add blipp to favorites -This controls if the user can view the blipp again without a marker.

Share blipp link- This controls if the user can share a link to a web preview of the blipp in social media.

Peel-away - Allows the Blipp's content to stay on the screen when the user moves the device away from the marker. You can also select portrait or landscape orientation and scale for the peel-away.

Click to enlarge

Where do I find the settings feature?

Click on the arrow in the top left corner next to the blipp name. A pop-up window will appear in the center of the canvas with the setting features listed above.

Click image to enlarge

Related Articles

Add an Intro Video

Add Background Audio

Customize Social Sharing Permissions

If you have any questions on settings, share them in the comments below.

This article details our FAQs and conditions of usage of the Blippar platform.

Testing & Publishing

Inside the BlippBuilder tool we offer the option to preview/test the Blipp you've created.

This is essential to do before sending your Blipp to be published as it allows you to preview in the app how the Blipp will work.

Blipps take up to two working days to be published therefore testing prior to submitting ensures that the Blipp will be made live as soon as possible as it allows you to catch an issues before sending it through.

Publishing

We love our technology and have invested alot of time into producing an exciting platform with ground-breaking technology.

We have clear guidelines about who can and can't publish and the content being sent through.

Personal Users:

Free use of the platform - BlippBuilder & Blipp Script

Ability to experience Blipps in the app for free using a test code Blipp with a Test Code

Personal content and markers only - Marker Guide

The idea behind free publishing is for purely personal reasons eg family photos rather than personal projects or research

Education Users:

Free use of the platform - BlippBuilder & Blipp Script

Ability to experience Blipps in the app for free using a test code Blipp with a Test Code

Option to publish live with a paid upgrade

Access to our full suite of support articles & online training Set-Up Education Access

Education FAQs

Business/Agency:

Various account options depending on use of the platform

Options for internal, external and resale use of the platform

Full training available

Full priority support

Personal Account Manager

Access to statistics on Blipps produced

No watermark on Blipps

If you have any further questions on how you wish to use the Blippar platform please reach out to us here so we can provide more information.

If you are looking to start an account or find out more information please fill out our form so a member of the team can reach out to you.

WINNING SUCCESS FACTORS

Consumer Interest: Essence magazine reaches a large audience and shares an empowering message for women of color.

Touch Point: It’s a section opener, setting the editorial tone for pages that follow.

Blipp Features: A super-simple concept brings the page to life with a series of still images pulled together into one MP4 file and set to jazzy music. The result is pure fun.

Blipp this markersee how they used the instant sound and embedded video features:

Essence, Time Inc.

United States print media

Embed, a short video clip or animation within your blipp, to create initial interest. It gets users excited and makes your blipp look great. You can choose to add video with the video widget or the YouTube widget.

How to add a video widget to your blipp

Drag and drop the video widget onto the stage

Click on the upload video button under “Action Settings.”

Once the video loads on the stage, the right-hand panel will appear and will allow you toadjusthow the video will play.

You can choose to have the video take over the entire screen (Full Screen)or to play within the blipp (AR Video). If you choose AR Video, then you can decide if the video should loop or play upon entry.

Features

Videos must be in MP4

Max file size 50MB

For the best user experience, we recommend videos to be at most 60 seconds. The longer the video, the less likely a user is to stay engaged. Keep it short and sweet.

Users can tap to open a video in full screen in the native video player.

If the video doesn't have audio you must add a blank audio file to use in your Blipp.

How do users interact with this widget in a blipp

User taps the video widget to play the video

Video is opened in full-screen on the device

Adding a YouTube widget

Drag and drop the YouTubewidget onto the stage

Under "Settings” on the right hand side add the YouTube username, channel or URL.

Under style you can change the label, font and colour.

How do users interact with this widget in a blipp

User taps the YouTube widget to play the video from YouTube.

WINNING SUCCESS FACTORS

Consumer Interest: StyleWatch reaches a narrow, highly responsive audience of fashion trendsetters.

Touch Point: There are upwards of 50 Blippar-activated pages inside, but the leading experience launches off of the #1 spotthe cover.

Blipp Features: Two standout features make this blipp a compelling consumer experience. Unlock a digital photobooth to turn yourself into a cover star and listen instantly to the editor-selected music sample.

Blipp this markerto see how they used the following features:

- Instant sound upon blipping

- Photo-booth

- Linking out to a relevant website

PEOPLE StyleWatch, Time Inc.

United States print media

This video will go through adding videos to your Blipp. There are three ways to add video to your Blipp and this video will demonstrate how to set all three ways up.

Adding Video:

AR Mode

Full Screen

Video on Entry

Useful Info:

Videos - Asset Guidelines

Video:

Be proud of your blipp! Tell people your objects are interactive, then teach them how to blipp. We have A/B tested campaigns with CTAs and without.Campaigns with a CTA perform up to 180X better.

Example CTAs

The space and energy given to the CTA within your creative is directly proportional to the conversion rate you can expect.

The example below shows examples from some of our partner's top campaigns.

What makes a good call-to-action

Follow these simple guidelines when creating your CTA:

Make sure your CTA stands out and does not get 'lost' in the creative

Always include the standard Blippar 'b' emblem for consistency of recognition

Include sub-text explaining that the Blippar app is FREE to download

Tell users WHY they should blipp (e.g. to buy now, watch a video, play a game, win a prize)

Tell users WHAT to blipp (e.g. blipp the page, blipp the poster)

For extra clarity on HOW to blipp, include the simple three-step process

Avoid small CTAs that are outside the user's line of sight (e.g. near the ground on a bus-stop poster)

Download our 'Call to ActionGuidelines'

For more information and examples read our CTA Guidelines (.PDF)

CTA Guidelines 2017

Download the Call to Action Artwork

To get started, download the Blippar CTA artwork and adapt to suit your brand.

In the comments below, share your questions on CTAs or tell us how you plan to use CTAs with your blipps.

You can test a blipp right from your Blippar Dashboard!

1) Go to the version history of the Blipp you wish to test and tap 'More' (One code - Multiple Blipps)

2) Select the Blippar app (or select your SDK if applicable) and tap continue

3) Add any additional test codes you wish to you use

4) Confirmation that Blipp is in 'Test'

Using a Test Code

To access your Blipps in the Blippar app using a test code.

1)Open the Blippar app and tap 'More'(Bottom right hand corner)

2) Select'Enter a Code'

3) Enter your chosen test code and tap'Confirm'

4) Blipp your marker(Marker is only actioned on adding test code)

Be proud of your blipp! Use calls-to-action (CTAs) to teach people how to blipp and explain how to interact with your markers and content. Our research has proven that visible and clear CTAs make a marker 5 times more likely to be scanned.

What makes a good call-to-action

Follow these simple guidelines when creating your CTA:

Make sure your CTA stands out and does not get 'lost' in the creative

Always include the standard Blippar 'b' emblem for consistency of recognition

To get started, download the Blippar CTA Artwork and adapt it to suit your brand.

Include text explaining that the Blippar app is FREE to download

Tell users WHY they should blipp (e.g. to buy now, watch a video, play a game, win a prize)

Tell users WHAT to blipp (e.g. blipp the page, blipp the poster)

For extra clarity on HOW to blipp, include the simple three-step process imagery

Avoid small CTAs that are outside the user's line-of-sight (e.g. near the ground on a bus-stop poster)

Example CTAs

The space and energy given to the CTA within your creative is directly proportional to the conversion rate you can expect.

We recommend making the CTAs as visible as possible. Below are a few great examples of CTA use:

Example CTAs

Next steps

Download our Call-to-Action Guidelines

Download our Call-to-Action Artwork

Related Articles

Choosing a Marker

Introduction to Terminology

In the comments below share questions on CTAs or how you plan to leverage CTAs to drive people to your blipps.

CTA, asset, user, photo-share? Scroll through our Blippar dictionary for clarification on words you’re not sure about.

Animation timeline

Shows the animation for the duration of a blipp in a linear timeline. The animation timelines uses seconds to measure time.

Choosing a Marker

For more information about working with the animation timeline, read Updating the Animation Timeline.

Blippar

Blippar is the world-leading augmented reality platform that brings print, products and packaging to life via a free mobile app. Using image-recognition technology, Blippar unlocks the physical world, overlaying it with thrilling digital content on smartphones, tablets and wearables.

For more information about Blippar, visit our website.

Blipp

Blipp (verb & noun blipp-ed, blipp-ing): Blipping is the action of unlocking digital content from the real world using a smartphone or tablet and the open Blippar app. Each individual experience of this kind is termed a ‘blipp’, while images that can be blipped are ‘blippable’.

Blippbuilder

Blippbuilder is Blippar’s DIY blipp-creation tool, enabling content creators (brands, media owners, creative agencies etc.) to build and publish their own interactive experiences for every piece of collateral they create. Its simple drag-and-drop interface makes the tool accessible to everyone within a business, and not solely the tech team.

Blipp assets

Blipp assetsare the individual components that make up your blipp content, for example, the image and video files.

It’s the combination of these assets particularly how you place them and what special effects you add to them - that makes a blipp instantly thrilling and memorable.

Use your favorite tools (Photoshop, Illustrator) to create your blipp content, then prepare each assetin accordance with our asset guidelines before uploading them into Blippbuilder.

Blipp content

Blipp content is whatever the user finds on their screen when they blipp your marker. Content is either ‘on-blipp,’ which appears as soon as the blipp opens, or ‘on-tap,’ which appears only after the user has tapped a button within the blipp.

On-blipp content is made up of:

Images

Buttons

Tracking videos

Sound

Animation

On-tap content includes:

Weblinks

Image galleries

Photo-shares

Fullscreen videos

Sound effects

PDF document

Opinion poll

Dowload an app

Call a number

Send an email

To help understand more about how a blipp fits together, take a look The Anatomy of a Blipp and What Can Blipps Do.

Blipp scene manager

A window that allows you to manage each scene in your blipp including adding, editing and deleting scenes.

For more information on scenes and using the blipp scene manager read, Adding Scenes to Your Blipp.

Call-to-Action (CTA)

A CTA is what tells people there is a blipp hiding beneath an image. Without it, nobody will know to interact with your pages, products, adverts or packaging. And then your poor blipp will remain unblipped, unloved and unhappy.

To guarantee everyone sees your beautiful blipp, shout about it from all your markers with clear, prominent CTAs.A good CTA tells people an image can be blipped and also teaches them how to do it. Educate viewers to download Blippar on their phone, open the app, and then hold it over the entire blippable image.

A visible CTA is crucial if you want your blipp to be well loved and your campaign to succeed. So don’t say we didn’t warn you.

For more information and download the artwork, read our guide to Creating a Call-to-Action (CTA).

Campaign

A campaign is a collection of blipps. You can make campaigns for specific issues of a magazine, for blipps that share similar features, or for blipps you wish to group together. Sets of blipps are easy to keep track of if you use the campaign option.

Canvas

A contained space in Blippbuilder that holds drawing and creation elements for your blipp. Located in the center of the screen. You will use this space similar to the way a painter creates their paintings, but instead of drawing you will drag and drop elements to create a picture.

Image Gallery

A pre-made widget that allows you to add a gallery of up to 15 images to any blipp.

For more information, read our guide to adding an Image Gallery.

Marker

A marker image is the static image or object you want people to 'unlock' for your blipp. It is also known as a trigger image because it triggers the blipp, through which all content is brought to life. Example markers include press pages, product packaging, book covers, T-shirts, posters, bus stands and business cards, but the opportunities are endless if you follow our simple guidelines.

For more information, read our guide to Choosing a Marker.

Peel-away

The ‘peel-away’ function lets blipp content stick to your mobile even when its trigger marker is removed.This function which can be turned on and off - means that you can blipp an image at, say, a bus stop, then get on the bus without losing the blipp from your phone.

For more information, read our guide on how to Add a Peel-away or Turn off Peel-away.

Photo-booth

A photo-booth - one of Blippbuilder’s most popular on-tap functions - is basically a sticker for your camera. It conceals a portion of the screen with an image, allowing users to photograph themselves with, say, a celebrity, a new hairstyle, a set of painted nails or a new dress. They can also put their face (or their car, or their house etc.) on the cover of a magazine. All it requires is a semi-transparent PNG file.

The resulting photo can then be shared to Facebook or Twitter, which gives your blipp the best chance of going viral.

For more information, read our guide to Creating a Photo Booth.

Scenes

A transition element for your blipp. Giving you the ability to multiple ‘screens,’ allowing you to create a hierarchy or an interactive story. Think of it like a movie. Each scene is an extension of the previous one and contains a different cast of characters.

For more information on scenes read, Adding Scenes to Your Blipp.

Time scrubber

The cursor on the animation timeline that allows for convenient animation editing. Each dash represents different times during a blipp. You can drag the time scrubber to different spots on the animation timeline and make adjustments that correlate to that moment in the blipp.

For more information on working with the time scrubber and the animation timeline, read Updating the Animation Timeline and Add SpecificAnimation Effects: Move, Rotate and Scale.

Tracking video

The cursor on the animation timeline that allows for convenient animation editing. Each dash represents different times during a blipp. You can drag the time scrubber to different spots on the animation timeline and make adjustments that correlate to that moment in the blipp. A tracking video is one that plays immediately on-blipp, sparking initial interest and enticing users to play with the rest of the blipp.

Find out more in our guide to Playing a Tracking Video in your blipp.

Trigger Image

A triggerimage is the static image or object you want people to 'unlock' for your blipp. It is also known as a marker.It triggers the blipp, through which all content is brought to life. Example triggersinclude press pages, product packaging, book covers, T-shirts, posters, bus stands and business cards, but the opportunities are endless if you follow our simple guidelines.

For more information, read our guide to.

In the comments below, share any questions or words you'd like to see defined in this article.

To make your blipps truly breathtaking, it’s crucial you understand how the whole process works, from marker to end-use. Here, we peel open a blipp to examine all the layers.

Share your thoughts on the anatomy of a blipp from marker to on-tap actions in the comments below.

Hospital Brochure

Promote health and wellness with a simple blippable brochure; provide the best service possible by including services offered at the institution. Direct your patient towhere the nearest 24 hour pharmacies and ER’s are located. Include a tour of the hospital or patient reviews. Feel inspired? Get designing! We are excited to see what you create!

video widget

Widgets used in this blip:

1) Website, linking to services offered

2) Buy, linking to nearest 24 hour pharmacy

3) Website, linking to nearest ER’s

4) Website, linking patient reviews

5) Website, linking to official website

Other possibilities:

Pamphlets that are specific for an illness, and a that explains the illness

Creative freedom is important, which is why we encourage you to create your own original assets for your blipps. You can use any third-party design tool to create assets and upload them into Blippbuilder, just make sure they are in either JPEG, PNG, MP3, MP4 or 3D formats.

Uploading and Adding Assets to the Stage

Click on the library tab found in the media panel on the left.

Click on the box labeled “+Click to upload files” or “+ Add Media."

Upload the image, audio or video files you wish to use in your blipp.

Drag and drop an asset onto the stage. The properties panel will slide in, allowing you to add actions to our own assets.

Note that you can only set actions for images files. Audio files and video files will become an audio or video action by default.

Click to enlarge

The image gallery allows you to display up to 15 images that viewers can swipe through in your blipp. This is a way to create interactive experiences with photos. For example, you could let users swipe through different colours of a dress, show product shots from different angles.

The image gallery will be displayed in augmented reality and you can add images and transparent PNGs to the gallery.

Key Terms

Image gallery: A pre-made widget that allows you to add a gallery of up to 15 images to any blipp.

Canvas: A contained space in Blippbuilder that holds drawing and creation elements for your blipp. Located in the center of the screen. You will use this space similar to the way a painter creates their paintings, but instead of drawing you will drag and drop elements to create a picture.

Add an Image Gallery

Select widgets on the upper left of the screen.

Select the “Image Gallery” icon and drag it to the canvas.

On the right hand side under “Style” select “Browse to add” this will allow you to upload and select up to 15 photos, transparent PNGs to be included in the gallery.

To change the order of the photos select and drag the icons on the right hand side to the order that you like.

The image gallery on the canvas is a placeholder for the actual content in your blipp. Meaning, you can’t swipe through the images on the canvas.

To test the gallery, select “Preview” in the top right corner. Use the Blippar app to test the image gallery. You can use the arrows to toggle between photos.

Note: To test with the Blippar app you will need to add the preview code provided by Blippbuilder under setting on the app.

Related Articles:

Photobooth

Asset Guidelines

In the comment section below please share your experience with the image gallery. What questions do you have? What are you going to create with image gallery?

BlippBuilder now allows video streaming !

This means that the videos will start playing even if the entire content of the videos are not yet downloaded, also no more waiting for all the videos to load before the Blipp is launched.

You have two video type options when using the video widget: Upload or External:

Upload: the video will be hosted on our servers (the default option)

External: the video can be hosted on any other server by providing the URL

The blipp shows a great use of animations and the content plays on humor, which keeps its target audience (kids) entertained. The reason for its success lies in the simplicity of the design and execution of animations - it gives users a quick and entertaining experience with the brand. Take a look at how they used animations in this blipp.