Code Monkey home page Code Monkey logo

rebusurance's Introduction

Rebusurance

Rebusurance is a suite of image assets for displaying highway shields in software user interfaces. Included in this repository is a single PaintCode document that contains various shields for routes in the United States. Each shield is scalable, simultaneously accommodating variations in screen resolution, font size, and route number length. The designs are loosely based on the specifications in the Manual on Uniform Traffic Control Devices (MUTCD) as implemented in Wikimedia Commons template images, including common state and territorial route shields.

This project’s design goals are:

  1. Maximize legibility, with the legend set as large as possible and extraneous details removed.
  2. Stay within a predictable width and height to facilitate text layout.
  3. Resemble the design most commonly seen on signage, preferably guide signs.

The name of this project is a play on the words rebus and reassurance, as in reassurance marker. Just as rebuses are icons displayed inline within a sentence, rebusurance images are best suited for running text, such as within a turn banner or step table in a turn-by-turn navigation application.

Setup

PaintCode is required for opening these image assets. From within PaintCode, choose a target platform and language, then export the assets as a “StyleKit”, which is generated drawing code that you can include in your application. The code that invokes this drawing code can specify the following parameters for any shield:

Name Kind Default value Description
legendText String 25 The alphanumeric legend born by the shield.
legendSize Number 60 The font size of the legend. The shield automatically resizes to fit the legend.

Additionally, each shield accepts two or more color parameters, depending on the colors used by the design. The default colors are based on the MUTCD color specifications.

Name Kind Default value
blue Color #003F87
brown Color #603311
green Color #006B54
orange Color #DD7500
pink Color #EF5B84
purple Color #72166B
red Color #AF1E2D
yellow Color #FCD116
yellowGreen Color #BAD80A
white Color #FFFFFF
black Color #000000

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.