A short on how to create your own Open Badge using MyKnowledgeMap's Badge Builder. You'll find our free Badge Builder here: www.openbadges.me

1. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
1
www.openbadges.me

2. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
2
What is an Open Badge?
A digital badge is an online representation of
a skill you’ve earned.
Open Badges takes that concept one step
further, and allows you to verify your
skills, interests and achievements through a
credible organisation. And because the
system is based on an open standard, you
can combine multiple badges from different
issuers to tell the complete story of your
achievements — both online and off. Display
your badges wherever you want them on the
web, and share them for
employment, education or lifelong learning.

3. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
3
So, how do I make my own badge?
The Open Badge Builder allows you to combine different visual
elements, colours and text to create an Open Badge graphic. You can then
use this graphic in your Open Badge issuing systems when creating your
rewards. Here, you see the Shape Categories, Colour Picker, Opacity and
position sliders and File Uploader to help you along the way.

4. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
4
Step 1: Pick a Shape
Shapes are the base of your badge and are usually the first thing you'll
want to add. There's tons of shapes to choose from spread across seven
different categories so look around and give some a try. If you decide
against a shape (or any other layer) you can use the remove button to
reset that layer.
Tip: If you're creating a family of badges why not choose a consistent shape for all of
them - this is a great way of making each badge feel like part of a set while each
containing something unique.

5. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
5
Step 2: Pick an Inner Shape
Sometimes you might want to add some extra texture or colour to your
base shape - that's where the inner shapes come into their own.
Try layering an inner shape on top of a base shape and then use the
colour picker and opacity picker to create some crazy effects. Or, take a
simpler approach and use an inner shape to help define a coloured border
around your badge - it's up to you!

6. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
6
Step 3: Pick an Icon
Each image is provided in four different styles - a black and white version
aligned at the top of the badge, and a blank and white version aligned in the
middle of the badge. Each one will work differently with each base shape so
make sure you experiment to get the layout you're after. White icons will never
be affected by the colour picker and will always show up white whereas black
versions will take on whichever colour you have selected.

7. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
7
Step 3: Continued…
Using your own images
If you have your own shapes, icons, logos or images that you'd like
to use in your badge then you can use the simple file upload
mechanism inside the badge designer. You can upload images to
use as either shapes or icons by clicking the "select file" or
"browse" button and finding an image file on your computer.
Once loaded you'll be able to position your image, change its
colour and even its opacity, if you're uploading an icon. Remember
that your badge is sized 200x200 pixels so make sure your image
fits inside that space!

8. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
8
Step 4: Pick a Banner and Banner Text
Using a combination of the banners
panel and the text panel you can add
even more detail to your badge. The
banners panel provides ribbons, boxes
and backgrounds for your text and works
in exactly the same way as the shapes
panels. Just browse for a banner and
click to see it displayed in your preview.
The text panel gives you two lines of
banner text as well as a colour picker, a
great range of fonts and a vertical
positioning slider so you can get your
text just where you need it. As with all
of the panels, give things a try, have an
experiment and see what works for you!

9. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
9
Text Icons and Picture Fonts
To give you even more options we've built in a number of picture fonts
that you can use when adding text to your badges. These fonts simply
turn normal letters and numbers into graphical images and icons that
can be dropped into your design.
Use the badge text panel add a letter or a number into the badge
text field, make sure you're using one of the picture fonts and watch as
a graphic gets added to your badge! You can even use the position
slider bars to move your icon around for pixel-perfect positioning.

10. ©2013 MyKnowledgeMap Ltd
Inspired assessment learning technology
10
Step 3: Publishing and Saving
Depending on how you're using the badge designer you might get
a publish button, a download button or maybe even both.
Publishing a badge sends the badge graphic back into your main
software application while download lets you save a copy of the file
to your computer in PNG format. Whichever option you
get, publishing or downloading is the final step in creating your
awesome badge!