Skip to content

Mchl/medal-bar-generator

Repository files navigation

Medal bar generator

This is a little application which procedurally generates fake medal ribbons

Why?

I was looking for some kind of (digital) badges that I could award to members of my team for their accomplishments. Military style medal ribbons was one idea, but I didn't want to deface any actual award. That's why I decided to make an application that would generate designs similar to actual medal ribbons. I haven't decided yet if I'm going to use it for the initial purpose, but I've learned quite a lot about phaleristics along the way.

What?

  • The application has a couple of general ribbon layouts to choose from (both symmetric and asymmetric).
  • It selects a color palette for a ribbon from an official list used by US Military
  • It applies a horizontal grille pattern to simulate ribbon threads
  • Finally it randomly decides whether to apply some award devices At this point devices available are the gold frame, the arrowhead and the silver and bronze service stars.
    No actual rules regarding how these devices can be applied in real life (e.g. silver and bronze service stars can be mixed on one ribbon to represent number of times medal was awarded to an individual or a unit) are implemented

How?

The application is created using some quite fresh JavaScript/ECMAScript features, including ES Modules. No transpiling, bundling, preprocessing etc. Whatever I typed in my IDE is the code that runs in your browser.

If you're on any fairly recent or 'evergreen' browser, it should work fine. If it doesn't work for your browser... well I don't really plan to work on extending support. It's just not that kind of project, sorry. Give it a go in Chromium, Chrome, Firefox, Safari, even latest Edge should be ok. If it fails in these modern browsers let me know by creating an issue.

Where?

See it in action here!

Assets used and their licenses

  • Arrowhead: Public Domain created by Wikimedia Commons user Ipankonin
  • Bronze Star: Creative Commons Attribution-Share Alike 3.0 Unported, created by Wikimedia Commons user Lestatdelc
  • Silver Star: Creative Commons Attribution-Share Alike 3.0 Unported, created by Wikimedia Commons user Lestatdelc
  • Alea: MIT by Johannes Baagøe