App Design - Binary Math-Game for Nerds

With our App "BinaryChallenge" you have fun with converting binary, octal and hexadecimal numbers into decimal system, training your skills and shareing your success.

The app targets nerds&geeks with interest in math and/or computer science.

http://www.guessbinary.com/

We have discussed themes like Retro, University etc, but decided to go for a moderate Science Fiction theme. "Moderate": The app should NOT look like a flying soucer but rather the screens colors, fonts, forms & icon styles should remind us slightly of the control panels on a science fiction spaceship. Something that wouldn't suprise you in your favorite science fiction serial. Since this is a modern spaceship, I'd expect a touch panel here, so no need to imitate physical buttons etc. Maybe our panel is located in the machine room or research lab, so don't oversimplify the UI as we might do for a mass end consumer product.

Colors: Definetly not colorfull; rather dark background. I'd imagine one or max two colors on the screens - only black/grey scales would look too boreing. On the result view we need to visualise the correct/wrong segments etc. we may need green/red here as an indictor.

Forms: Simple geometric forms as a basis. No "sharp edges", you should still want to touch it. The math behind the app and the sctructure we use are highly symmetrical; to balance this we could use some kind of assymetrie in the forms, e.g. like cutting the lower right corner of rectangles.

Fonts: We imagine a font like "http://www.dafont.com/de/polentical-neon.font" or "https://typekit.com/fonts/mic-32-new-rounded-web". The digits in the segments might have a different font, e.g. a monospaced computer-display font like https://typekit.com/fonts/larabiefont. Possibly these fonts look too extreme when used for a whole screen in the app, so feel free to suggest a more common looking font. Fonts for texts need to be compatible with common languages (cover. e.g. German Umlauts). It would also be nice for the font for the score numbers to be monospaced for the digits (but only for them) so the layout doesn't flip when we animate the score.

Icons: Since this app is mostly a game, we'd like to see very intuitive icons (especially instead of text-buttons) that are easily interpreted by first time user and don't bore the heavy users. Symbols may be slightly futuristic to honor the science fiction theme.

Background Images: No distracting background image, but something unobtrusive might be ok. Probably it make sense to apply some images for small backgrounds and/or borders for some elemnts in the screens.

Feel free to suggest improvements to us, if you have a good idea!

BinaryChallenge

1. Main Screen / Game Setup:
- allows the user to setup the game & start it
- shows the users current level, score & achievement-advancement

2. Play Game
- a large binary number is shown, divided into segments of 4 binary digits each
- the player enters the decimal value for each segment; in "assisted mode" the app shows nine suggested values for each segment to make it easier

3. Result
- visualises for each segment, wheather the player has entered the correct decimal value or not
- shows the users current level, score & achievement-advancement

4. Explain (not part of this contest)
- Explains how to convert each segment into the decimal value

- No real "physical" looking elements - stay abstract

- No 3D elements - use a flat or allmost flat design

- Avoid Arcade-style (e.g. in logos)

- Don't stick to close to the exact layout in or briefing - you are free improve & change the layout. The light gray backgrounds and the lines around the bits in the segments are mostly shown to understand the logic of the app.