Designer
Plaything

The Standalone Web Typography and Colour Testing Tool

CURRENT VERSION: 1.1

LAST UPDATED: 26 OCT 2007

Version History

Release Notes: Designer Plaything 1.1 (26 October 2007)

  1. You can now add your own headline text and body copy to the page. To do so click on the "add your own text" button in the article settings section and type or past in your headline and copy text.
  2. New fonts have been added to the headline and body sections. These are:
    • Arial Black
    • Avant Garde
    • Bookman
    • Garamond
    • Helvetica
    • Impact
    • Palatino
    Please note that these fonts will only display if they are installed on your system.
  3. Font drop downs are now styled with the fonts that are listed if available on your system.
  4. Headlines and body text can now be aligned or "justified" to the left, center or right
  5. Forms now fully reset on page refresh
  6. Initial page settings adjusted to be more inline with main website
  7. Spelling correction in colour menu drop down

Designer Plaything 1.0 and before

The idea behind Designer Plaything was born out of complete laziness. I was asked by a designer to mock up a few simple article pages for a site with different font and size variations to help a client finally make their mind up about the site typography.

Adhearing to the adage that a good coder is a lazy coder; I balked at the idea of copying and pasting out a dozen or so pages with slightly different font styling, as well as the task of ensuring that my designer and client were both referring to the same page. Instead I set about building bit of JavaScript that would let them switch between all the required combinations in one place.

I quickly patched it together and emailed it to the client for him to play to his hearts content. We had sign off on typography the next day.

Well when you start on something like that all sorts of other questions start springing to mind... wouldn't it be nice if they could change the background colours, the line height, the column width, the headline length and so on. So bit by bit when I could grab a bit of spare time I cobbled together each of those ideas as they came to me.

Because of this "without plan" method of development I'm pretty sure that some of the code can be tightened up. As the project evolved so did some of the methods used, perhaps some of the earlier parts are now unecessarily independent but they work.

One or two versions of Designer Plaything did make a very small and closed beta getting a few recomendations and suggestions back that have been largely incorporated. For now though, the documentation starts here.