Name and promise
Oukonjou is French for “where do we play?”, spelled the way it sounds. The question teenagers, parents and weekend players ask every day, turned into a name. It is pronounced “oo-kon-zhoo” and always written with a single capital: Oukonjou.
Promise: find a free, no-booking sports spot nearby in seconds, with the rules to enjoy it properly.
Où qu'on joue ? Juste là.
Where to play? Right here.
Baseline : « Le sport en accès libre, autour de vous. » / “Free-access sports spots near you.”
Logo
The symbol is a court's centre circle: the halfway line, the circle and, in the middle, a yellow dot that is both the ball and a map's “you are here”. In the wordmark, the yellow dot sits inside the first O. The wordmark is set in Big Shoulders Display Black, a condensed sans inspired by stadium signage.
logo-lockup.svg
logo-lockup-white.svglogo-lockup-white.svg
logo.svg
logo-mono.svg
logo-mark.svg- Clear space: keep free space around the logo at least twice the height of the yellow dot.
- Minimum size: wordmark 80 px (20 mm) wide; symbol 24 px (8 mm).
- Files (assets/img folder) :
logo-lockup.svg,logo-lockup-white.svg,logo.svg,logo-white.svg,logo-mono.svg,logo-mark.svg,logo-mark-dark.svg,favicon.svg,og-fr.png,og-en.png.
Colours
A palette taken from the neighbourhood court: the green resin of multisport courts, asphalt, yellow line paint, skatepark concrete. Rough proportions: 60% concrete and chalk, 25% asphalt, 10% court green, 5% yellow.
Facility type colours
Each type has its own colour on the map and in listings. A colour never carries meaning on its own: it always comes with the icon and the name. On these colours, only icons and large headings are set in white (contrast of at least 3:1); body text stays in Asphalt, next to them.
Typefaces
Three free families under the SIL Open Font License, hosted with the site (assets/fonts folder, Latin subset): no call to any third-party service.
Skatepark à Lyon
Headings and big figures, always uppercase, tight leading (1.0 to 1.1).
Designed by the Braille Institute for low-vision readers: every letter is clearly distinct from the others. 17 px minimum, 1.6 line height.
1,2 km · 45.76402, 4.83570 · EN 15312:2026
Distances, coordinates, dates, standard references, spaced uppercase labels.
| Level | Family | Size |
|---|---|---|
| H1 | Big Shoulders Display 800 | 34–74 px |
| H2 | Big Shoulders Display 800 | 30–43 px |
| H3 | Big Shoulders Display 700 | 23 px |
| Body | Atkinson Hyperlegible 400 | 17 px |
| Label | IBM Plex Mono 600 | 12,5 px · +9 % |
Icons
24 px grid, 1.8 px stroke, rounded ends and joins, no fill. On a type colour, the icon is white inside a rounded square (radius 27% of the side).
i-skateparki-pumptracki-citystadei-workouti-basketi-traili-petanquei-footi-beachi-climbi-tennisi-pingpongi-swimi-cragi-compassi-hikei-searchi-locatei-mapi-listi-routei-stari-belli-flagi-lighti-accessi-infoi-mailComponents
Shapes: pill-shaped buttons and filters; cards 12 px radius; a single yellow button per screen. 44 px minimum touch target. Keyboard focus: 3 px blue outline.
Tone of voice
- Plain, direct English, short sentences, action verbs: “Search”, “Go”, “Report an error”.
- Concrete: distances, rules, dimensions. No superlatives, no administrative jargon.
- Honest: “check on site” when we don't know. Oukonjou never presents itself as an official service.
- Playfulness is kept for headings and error pages (“Out of bounds”), never for safety rules.
Do and don't
- Use the supplied files without redrawing them.
- Place the logo on Concrete, Chalk, Court green or Asphalt.
- Keep the yellow dot in the first O.
- Stretch, tilt, shadow or outline the logo.
- Change the dot's colour or move it.
- Use yellow for text on light backgrounds (insufficient contrast).
- Pair the logo with an official logo (ministry, Marianne, federation).