Visual Checksum

The visual checksum is a technique to prevent the wrong code being read due to reflections or dirt.

It was introduced in the paper “Enabling Hand-Crafted Visual Markers at Scale” to be presented at the ACM conference Designing Interactive Systems 2017.

Using the visual checksum is simple:

  1. We include a new region with a specific number of hollow blobs in our design, and
  2. Tell the software we’re using the visual checksum.

What are checksums?

Checksums are traditionally additional numbers at the end of a list of numbers (like a credit card number) used to make sure the list of numbers has been entered, recognised or sent correctly. You use checksums everyday as the last digit of a barcode or your credit card number, it’s even used on everything you view on the internet! Checksums work by applying some mathematical formula to the list of numbers to decide what the checksum should be and the reversing the process later when we need to check everything’s correct.

The visual checksum is a visual version of this.

If the thought of math is making you reach for the back button don’t worry! The computer does all the math for you.

How do I add it to my design?

Use the box below to enter your code and it will workout the visual checksum value for you. Now just add an extra region with that many hollow blobs.

Enter your code:


  1. You can only have ‘hollow blobs’ in the visual checksum region, mixing in ‘solid blobs’ will prevent it from reading.
  2. Make sure your ‘hollow blobs’ only have one hollow bit and don’t touch, e.g. they should look like ‘D’ rather than ‘B’.
  3. Like the ‘solid blobs’, the ‘hollow blobs’ can be any shape not just circles.

How do I use this in the app?

Just testing things?

If your design uses 5 regions plus the visual checksum region you can test if your new design works by opening the app and searching for “vc555” and select “Visual Checksum 5 Region Test”.

New experience

To create a new experience using the visual checksum open the Artcodes app and search for “vc123” and you will see an experience called “Visual Checksum Base”. Open this then tap “Copy” (you may be asked to sign in with your Google account if you have not already). Now tap “Edit” and edit the name, availability and codes of your experience. You’re done! Your new experience with visual checksum enabled is ready to use!

Existing experience

We are working on adding the ability to add this to existing experiences.

More Details

Show more details…

Add Artcodes to your app!

The Artcodes app on the AppStore and Google Play allows you to scan Artcodes and create end-to-end augmented reality experiences. If you need more features or customisation you can add Artcodes to your app by using a library/dependancy or by downloading the code.


The Horizon Artcodes applications and libraries are publicly distributed under version 3 of the Affero General Public License. If you obtained this code under that license, then all its terms are applicable. The same applications and libraries are also available under alternative license terms negotiated with the Horizon Digital Economy Research Institute at the University of Nottingham. Contact for more details.



Cordova is a cross platform development tool that allows you to create mobile apps using HTML, CSS and JavaScript. The Artcodes Cordova plugin only supports iOS and Android. To install the plugin:
$ cordova plugin add --variable IOS_CAMERA_DESC_STRING="We use the camera to scan Artcodes." --save
To use:
function yourFunction() {
			name: "Scan screen title", 
			actions: [
				{ codes: ["1:1:3:3:4"] }, 
				{ codes: ["1:1:2:4:4"] }
		function (code) { alert(code); }

// like most plugins, Artcodes.scan(...) can only be called sometime after the deviceready event e.g.
document.addEventListener('deviceready', function () {
}, false);


Follow these steps to add Artcodes to your Android app. You can also see an example app on GitHub: Step 1: Add Artcodes to your build.gradle dependencies.
compile ''
Step 2: Create an Artcode experience object to pass to the Artcodes scanner.


Experience experience = new Experience();
String[] codes = {"1:1:1:1:2", "1:1:2:4:4"};
for (String code : codes)
  Action action = new Action();
Step 3: Start the Artcodes scanner activity.
import android.content.Intent;


private final int ARTCODE_REQUEST = 12345; // Range: 0-65535


Intent intent = new Intent(getApplicationContext(), ScannerActivity.class);

// Put experience in intent
Gson gson = new GsonBuilder().create();
intent.putExtra("experience", gson.toJson(experience));

startActivityForResult(intent, ARTCODE_REQUEST);
Step 4: Handle the response, implement onActivityResult:
protected void onActivityResult(int requestCode, int resultCode, Intent data)
  if (requestCode == ARTCODE_REQUEST)
    if (resultCode == RESULT_OK)
      // This is where you will receive a response from the
      // Artcode scanner if an Artcode was found
      // Do any logic based on the result here

      // This is the code of the Artcode that was found (e.g. "1:1:1:1:2")
      String code = data.getStringExtra("marker");
Note: To access the camera this library will add the “Hardware controls: take pictures and video” permission to your app.

Code on GitHub

The Artcodes app is open source and available on GitHub (version 3 of the Affero General Public License applies):

How to use Artcodes (including experiences)

This guide show you how to use the Artcodes with the iPhone and Android apps.

Getting Started

  1. If you haven’t already download and open the Artcodes app.
    The first time you open the Artcodes app you will see a brief tutorial screen (not shown) after you’ll see the “Recommended” screen. This lists recently used, nearby and popular experiences.
  2. Select the “Artcodes” experience from the list. ▶︎
    This will show you the experience’s details.
  3. Tap the camera button to go to the scanning screen. ▶︎
  4. Centre the penguins (below) in the camera image. ▶︎
    You can also use the butterfly you drew in the how to draw an Artcode tutorial.
  5. When the link at the bottom appears tap on it. ▶︎
  6. Congratulations you scanned your first Artcode!


The Artcodes app uses “experiences”. These are mappings from codes to content. You can think of them as lenses, looking through one lens you might see one thing and looking through a second lens another thing. For example on the right the blue lens/experience links to the Artcodes website but the red lens/experience links the same Artcodes to Wikipedia. In the Artcodes app you can use public experiences & those shared with you as well as create & share your own.

Creating an Experience

  1. From the start screen tap the menu button. ▶︎
  2. Tap “Login” and login with your Google account. ▶︎
    If you have already done this your username will appear, tap on that instead.
  3. This screen lists all the experiences you have created. Tap the add new (+) button in the bottom right corner to create a new experience. ▶︎
  4. Give your experience a name, you can also add a description and image. Tap the next button in the bottom right or swipe right to left. ▶︎
  5. On this screen (with a big padlock) you would set availability but we’ll leave it private for now. Tap the next button in the bottom right or swipe right to left. ▶︎
  6. On this screen (with a big warning triangle) we enter the details of the markers we want to create, tap the add new (+) button to add one. ▶︎
  7. Enter a name, website address and code (say 1:1:1:1:2) then tap the checkmark icon. ▶︎
    The name appears as a link to the website you enter when the Artcode is scanned. You could enter the penguins above, they have have code 1:1:2:3:5.
  8. You can repeat the last 2 steps to add more codes, then tap “SAVE”.
  9. That’s it! Now let’s use our experience, tap the camera button and centre the Artcode(s) you setup in the camera image. ▶︎

Sharing an Experience

The app allows you to share experience you have created with specific people or with everyone using the app. To share your experience with specific people:
  1. Go to your experience.
  2. Tap “Share”.
  3. You can share experiences by Facebook, e-mail, text message, etc.
To share your experience with everyone:
  1. Go to your experience.
  2. Tap “Edit”.
  3. Tap “Availability” at the top.
  4. Tap the add new (+) button in the bottom right corner.
  5. You can limit availability by date and suggest a location. If you don’t enter a date it will always be available. Tap the checkmark icon when you’re done or the bin icon to delete this date and/or location.
    Repeat the last 2 steps to add multiple locations or time ranges.
  6. Tap “Save” when you’re done.
By adding a date or location your experience may be found by anyone using the Artcodes app:
  • When users are around the location you set your experience will be suggested to them under “Nearby”.
  • Your experience will also appear in search results.
  • If you leave location set to “Anywhere” your experience will only appear in search results and not under “Nearby”.
  • If your experience is used a lot it may appear under “Popular”.


Q: The experience I create just disappeared? A: It’s still there! Sometimes the list of experiences doesn’t update try closing and reopening the app. (iOS: double press the home button and swipe the Artcodes app off the screen then reopen the app, Android: go to the app switcher and swipe the Artcodes app off the screen then reopen the app) Q: My experience didn’t update when I edited it? A: Sometimes the update doesn’t appear but has been saved, try closing and reopening the app. (iOS: double press the home button and swipe the Artcodes app off the screen then reopen the app, Android: go to the app switcher and swipe the Artcodes app off the screen then reopen the app)