This repository has been archived by the owner on Sep 2, 2020. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 84
BadgeStudio config
Erik Christensen edited this page Feb 10, 2014
·
9 revisions
A description of the JSON file used to configure BadgeStudio's visual badge design options.
An example:
{
"shapes": {
"shape1": {
"image": "shape1.png",
"iconLayout": {
"center": "50,50",
"scale": 0.9
},
"borders": [
"shape1border1.png",
"shape1border2.png"
],
"texts" : [
{
"name": "text1",
"center": "50,50"
},
{
"name": "text2",
"center": "70,50",
"scale": "0.9"
}
],
"backgrounds": [
{
"name": "back1",
"center": "60,50",
"scale": "1.0"
},
{
"name": "back2"
}
]
},
"shape2": {
"image": "shape2.png",
"backgrounds": [
{
"name": "back1"
},
{
"name": "back3"
}
]
}
},
"backgrounds": {
"back1": {
"image": "back1.png"
},
"back2": {
"image": "back2.png"
}
},
"texts": {
"text1": {
"font": "myfont.svg",
"lineWidth": "100",
"align": "center",
"alignPoint": "50,50",
"maxSize": "20",
"minSize": "10",
"background": {
"image": "fontback1.png",
"center": "50,50"
}
},
"text2": {
"font": "myfont.svg",
"lineWidth": "200",
"align": "left",
"alignPoint": "0,25",
"maxSize": "24",
"minSize": "10"
}
},
"colors": [
["#FFFFFF", "#AAAAAA", "#000000"],
["#000000", "#AAAAAA", "#FFFFFF"]
]
}
Required fields below are in bold. All coordinates are in pixels.
Top-level fields:
- **shapes **- An array of objects defining each available badge shape. (see format below)
- **colors **- An array of hex color triplets of the form ["#AAAAAA", "#BBBBBB", "#CCCCCC"] defining the available color options
Shapes object fields:
- **image **- The name of the file containing the shape image data
- iconLayout - An object that defines how icons and images will be placed on the badge (see format below)
- borders - An array of file names that contain the available "border" images for this shape.
- texts - An array of objects defining the available "text" options for this shape. (see format below)
- backgrounds - An array of objects defining the available "background" options for this badge (see format below)
iconLayout fields:
- center - A string of the format "X,Y" that defines the X,Y coordinates of the center of any icons or images that are placed on the badge
- scale - A number that indicates the initial scale value of any icons placed on the badge.
texts fields:
- font - file name that contains the font used by this option
- lineWidth - Maximum width, in pixels, of the line of text displayed. The font size will decrease to keep the text within this maximum width.
- align - One of "center", "left", or "right". Describes the justification of the text.
- alignPoint - A string of the format "X,Y" that defines the point at which text is aligned (the Y coordinates describes the baseline point of the text)
- maxSize - The maximum font size to use (this will be the default provided the text fits within lineWidth
- minSize - The minimum font size to use (the font will gradually reduce in size to stay within lineWidth. Once minSize is reached, no more text can be added)
- background - An object describing the background to use for this text option. If this is defined, user-selected backgrounds will be disabled. (see format below)
- center - a string of the format "X,Y" that defines the X,Y coordinates of the center of the text displayed using this option
- scale - A number that indicates the
backgrounds fields (both "background" within the "texts" object and "backgrounds" within the "shapes" object share this format):
- image - A file name containing the background image..
- center - A string of the form "X,Y" that defines the location on the badge to place the center of the background image
- scale - A number that describes how the background image should be scaled.
For support working with BadgeKit or Open Badges, use any of the following channels:
- Post general questions in our Community Google Group and post technical questions in our Dev Google Group.
- Reach members of the Open Badges team directly on IRC (irc.mozilla.org) on the #badges channel.
- Email questions directly to [email protected] and a member of the team will follow-up.
- Follow or tweet the Open Badges team @OpenBadges.
- Get involved or submit issues via the GitHub repos - feedback is always appreciated!
Introduction
Users
Developers
- Self-Hosting Guide
- Troubleshooting BadgeKit
- API Introduction
- User API
- BadgeKit and Open Badges Resources
Concepts
Design
History