MyKnowledgeMap Ltd Badge Maker: Badge Making 101


Published on

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

Published in: Education, Technology, Business
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

MyKnowledgeMap Ltd Badge Maker: Badge Making 101

  1. 1. ©2013 MyKnowledgeMap LtdInspired assessment learning
  2. 2. ©2013 MyKnowledgeMap LtdInspired assessment learning technology2What is an Open Badge?A digital badge is an online representation ofa skill you’ve earned.Open Badges takes that concept one stepfurther, and allows you to verify yourskills, interests and achievements through acredible organisation. And because thesystem is based on an open standard, youcan combine multiple badges from differentissuers to tell the complete story of yourachievements — both online and off. Displayyour badges wherever you want them on theweb, and share them foremployment, education or lifelong learning.
  3. 3. ©2013 MyKnowledgeMap LtdInspired assessment learning technology3So, how do I make my own badge?The Open Badge Builder allows you to combine different visualelements, colours and text to create an Open Badge graphic. You can thenuse this graphic in your Open Badge issuing systems when creating yourrewards. Here, you see the Shape Categories, Colour Picker, Opacity andposition sliders and File Uploader to help you along the way.
  4. 4. ©2013 MyKnowledgeMap LtdInspired assessment learning technology4Step 1: Pick a ShapeShapes are the base of your badge and are usually the first thing youllwant to add. Theres tons of shapes to choose from spread across sevendifferent categories so look around and give some a try. If you decideagainst a shape (or any other layer) you can use the remove button toreset that layer.Tip: If youre creating a family of badges why not choose a consistent shape for all ofthem - this is a great way of making each badge feel like part of a set while eachcontaining something unique.
  5. 5. ©2013 MyKnowledgeMap LtdInspired assessment learning technology5Step 2: Pick an Inner ShapeSometimes you might want to add some extra texture or colour to yourbase shape - thats where the inner shapes come into their own.Try layering an inner shape on top of a base shape and then use thecolour picker and opacity picker to create some crazy effects. Or, take asimpler approach and use an inner shape to help define a coloured borderaround your badge - its up to you!
  6. 6. ©2013 MyKnowledgeMap LtdInspired assessment learning technology6Step 3: Pick an IconEach image is provided in four different styles - a black and white versionaligned at the top of the badge, and a blank and white version aligned in themiddle of the badge. Each one will work differently with each base shape somake sure you experiment to get the layout youre after. White icons will neverbe affected by the colour picker and will always show up white whereas blackversions will take on whichever colour you have selected.
  7. 7. ©2013 MyKnowledgeMap LtdInspired assessment learning technology7Step 3: Continued…Using your own imagesIf you have your own shapes, icons, logos or images that youd liketo use in your badge then you can use the simple file uploadmechanism inside the badge designer. You can upload images touse as either shapes or icons by clicking the "select file" or"browse" button and finding an image file on your computer.Once loaded youll be able to position your image, change itscolour and even its opacity, if youre uploading an icon. Rememberthat your badge is sized 200x200 pixels so make sure your imagefits inside that space!
  8. 8. ©2013 MyKnowledgeMap LtdInspired assessment learning technology8Step 4: Pick a Banner and Banner TextUsing a combination of the bannerspanel and the text panel you can addeven more detail to your badge. Thebanners panel provides ribbons, boxesand backgrounds for your text and worksin exactly the same way as the shapespanels. Just browse for a banner andclick to see it displayed in your preview.The text panel gives you two lines ofbanner text as well as a colour picker, agreat range of fonts and a verticalpositioning slider so you can get yourtext just where you need it. As with allof the panels, give things a try, have anexperiment and see what works for you!
  9. 9. ©2013 MyKnowledgeMap LtdInspired assessment learning technology9Text Icons and Picture FontsTo give you even more options weve built in a number of picture fontsthat you can use when adding text to your badges. These fonts simplyturn normal letters and numbers into graphical images and icons thatcan be dropped into your design.Use the badge text panel add a letter or a number into the badgetext field, make sure youre using one of the picture fonts and watch asa graphic gets added to your badge! You can even use the positionslider bars to move your icon around for pixel-perfect positioning.
  10. 10. ©2013 MyKnowledgeMap LtdInspired assessment learning technology10Step 3: Publishing and SavingDepending on how youre using the badge designer you might geta publish button, a download button or maybe even both.Publishing a badge sends the badge graphic back into your mainsoftware application while download lets you save a copy of the fileto your computer in PNG format. Whichever option youget, publishing or downloading is the final step in creating yourawesome badge!