From the beginning, we decided to pass on the vintage hacker standard of bright text on a black background: it's definitely a look, but it's hard to do something exceptionally legible with it that has any character at all. Gynophage came up with the idea of something that looked like a Japanese game show. There's tons of reasons to love it: clips from Japanese game shows have been favorites for the distraction screens in previous years, so it's not unfamiliar, there's a wide variety of motifs and colors to be used, and we don't know of other games that used this visual style.
Within hours of this suggestion I'd cooked up a rough draft in HTML: a weird salmon background, Katakana at a weird angle, parchment behind text, and an intent to have both English and Japanese text for most of the body copy.We were also using the "Ubuntu" font family from said Linux distribution: it's a readable but distinctive sans-serif font, is available in a shit-ton of different weights, has condensed and monospaced variants, and is available on Google Web Fonts to make it work on your web browser.

I spent a little time in Photoshop farting around with colors, and came up with this ghastly mix of a strawberry linen texture, yellow, and parchment that stuck with us.
Astute readers will notice the nonsense Japanese text for our logo. We hemmed and hawed about it, and I spent a lot of time punching synonyms of "Legitimate Business Syndicate" into Google Translate, until landing on "true company," which turns into four glyphs. I felt that four glyphs worked the best visually.
The grey login box kinda sucked, as did the copyright bullshit at the bottom.
We went public with an announcement on March 23, and a schedule on April 1, as is tradition. For our schedule, we designed another kind of box, the blue grid, for the schedule and other calendar-y things. Part of the schedule was a list of other CTF events happening in June, because we love you.
During the run-up to quals, I spent a lot of time dithering about challenges (and not much time writing them), and only in the last month or so polished up the scoreboard to be ready to go live.
The first thing I did was get rid of the old terrible colors, and replace them with a flat strawberry color.
I hooked up some data, toned down the pink and green, textured the green with check-marks (solved!), and started work on the challenge window. The "hot" visual showed up here for the first time, being a crimson.
I wanted to bring back some fun to the style without being as retina-burning as the neon green and pink atrocities previously committed. The obvious treatment for "hot" challenges is something hot, like fire.
We added a couple more textures: pink hearts for unlocked problems, dark cherry 'X' marks for locked problems.Quals Statistics
| Lines of Sass | 583 |
|---|---|
| Bytes of minified CSS | 10865 |
| CSS "float" declarations | 11 |
| Inline style attributes | 0 |
| Favorite CSS declaration | tie between "padding" and "width" |






