Files
mg4/THEMES.md
T
nilsandClaude Opus 5.5 fd38c37ebe App 2.43.4: the Halloween pumpkin's light follows the music
The bass from Android's audio analyser drives the glow and brightens the
carving on the beat, only while the style is on screen. Yellow and green and
the embers keep their meaning; without a signal, as with the radio, the light
stays as it was. Levels only. Tried on the emulator. Not tried on the car.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LhzAVaUyqcw5PkGjz4mWW6
2026-11-01 10:07:01 +01:00

271 lines
15 KiB
Markdown

# Overview styles
The Overview can look twenty ways: pick one under **Settings → Overview style**. Every style shows
the same readings (battery, range, power, speed, gear, usage, trip, climate, odometer, time) and
shows "—" for anything the car did not answer, never a made-up zero.
Each style has two screenshots: with the navigation, and in the Overview's own full screen (the
button beside the MG4 logo; swipe in from the left edge to come back). They come from the test
emulator at the car's resolution with **sample values** (87 km/h in D, 76 %, 18.4 kW), since the
emulator has no car; on the car the values are live.
**Colours.** Most styles are drawn in the accent colour you pick from the MG4 paints (Settings →
Accent colour; shown here in Dynamic Red). Retro, Terminal, Grid (with or without the map) and Visor can also show their original
colours, and Sci-fi, Cartoon, Nixie tubes, Time circuits, Quest, Empire, Día de Muertos and Halloween always do; while one of those is shown, the whole app
(navigation, buttons, switches) takes on its colours too.
| Style | Look | Colours |
|---|---|---|
| [Tiles](#tiles) | the app's own cards | accent |
| [Gauges](#gauges) | analogue needles | accent |
| [Cockpit](#cockpit) | segment rings, power trace | accent |
| [Retro](#retro) | 80s fluorescent display | original or accent |
| [Futuristic](#futuristic) | holographic HUD, energy flow | accent |
| [Sci-fi](#sci-fi) | starship console | own |
| [Cartoon](#cartoon) | comic panels | own |
| [MG](#mg) | octagonal MG dials | accent |
| [Minimal](#minimal) | one big number | accent |
| [Terminal](#terminal) | green-screen shell | original or accent |
| [Nixie tubes](#nixie-tubes) | glowing glass tubes | own |
| [Chronograph](#chronograph) | a watch face | accent |
| [Grid](#grid) | neon lines on a glowing grid floor | original or accent |
| [Grid with map](#grid-with-map) | the Grid, with the real roads round the car on its floor | original or accent |
| [Time circuits](#time-circuits) | a time machine's LED displays | own |
| [Quest](#quest) | a fantasy game's interface | own |
| [Visor](#visor) | a soldier's helmet display | original or accent |
| [Empire](#empire) | a strategy game's interface | own |
| [Día de Muertos](#día-de-muertos) | an ofrenda with papel picado and a calavera | own |
| [Halloween](#halloween) | a jack-o'-lantern on a graveyard hill | own |
## Tiles
The app's original look, from the design it was forked from: glass cards on OLED black, one tile
per value, with the averages over the last five minutes and since the start, vehicle info (with
the lease allowance) and the tyre pressures on a little top view of the car. The most
information on one screen.
![Tiles with the navigation](screenshots/themes/tiles-panel.png)
![Tiles, full screen](screenshots/themes/tiles.png)
## Gauges
Three round instruments with needles, like a classic analogue dashboard: power on the left,
speed in the middle, charge on the right (E to F), and a strip below with gear, climate, time,
usage and a small battery. The needles glide to new values instead of jumping.
![Gauges with the navigation](screenshots/themes/gauges-panel.png)
![Gauges, full screen](screenshots/themes/gauges.png)
## Cockpit
After the digital clusters of modern EVs: rings of lit segments for battery, power and usage.
The power ring in the middle is centred on zero (regeneration lights up anticlockwise in green)
and carries the speed and gear inside it; along the bottom, a strip with the power of the last
two minutes.
![Cockpit with the navigation](screenshots/themes/cockpit-panel.png)
![Cockpit, full screen](screenshots/themes/cockpit.png)
## Retro
An 80s digital dashboard: a vacuum fluorescent display behind smoked glass, as in the
digital-instrument cars of that decade. Slanted seven-segment digits with the unlit segments
faintly visible, bar graphs for charge and power, amber labels and a lit P R N D. In its original
turquoise (shown) or in the accent colour.
![Retro with the navigation](screenshots/themes/retro-panel.png)
![Retro, full screen](screenshots/themes/retro.png)
## Futuristic
A holographic head-up display in hairlines: the battery as a capsule on the left, the speed in a
ring of dashes that turns with it on the right, and between them an energy channel in which
particles flow from the battery to the wheels while driving, and back in green while
regenerating, faster with more power.
![Futuristic with the navigation](screenshots/themes/futuristic-panel.png)
![Futuristic, full screen](screenshots/themes/futuristic.png)
## Sci-fi
A starship console, after the look of the computer screens in 90s science-fiction TV: rounded
"elbow" frames in orange and lilac, pill-shaped labels, condensed capitals and blocky bar graphs
on black. Below 20 % charge the frames turn red: red alert. The app takes on the lilac of the
lower frame.
![Sci-fi with the navigation](screenshots/themes/scifi-panel.png)
![Sci-fi, full screen](screenshots/themes/scifi.png)
## Cartoon
Comic panels in flat colours with thick ink outlines on a night-blue page: a battery with a face
(happy, unsure, then worried and sweating as it empties), a chunky speedometer whose needle
wobbles into place, and the "zap-o-meter" for power with a sound word: PURR, VROOM, ZOOM! or
RECHARGE! while regenerating.
![Cartoon with the navigation](screenshots/themes/cartoon-panel.png)
![Cartoon, full screen](screenshots/themes/cartoon.png)
## MG
After the classic MG dashboards, whose dials sat in octagonal bezels: three octagonal dials with
chrome rims and cream scales (battery, speed, power), needles in the accent colour, and a line of
odometer, trip, usage, climate and time separated by small octagons.
![MG with the navigation](screenshots/themes/mg-panel.png)
![MG, full screen](screenshots/themes/mg.png)
## Minimal
One number and almost nothing else: the speed, very large and thin, the gear above it, power as a
short line growing from the centre, and the battery as a hairline along the bottom edge. For calm
driving.
![Minimal with the navigation](screenshots/themes/minimal-panel.png)
![Minimal, full screen](screenshots/themes/minimal.png)
## Terminal
As if a shell printed the car's state: `watch -n 0.2 vehicle-status` on a green-phosphor screen
with faint scan lines, each value on a row with an ASCII bar, the gear as `[D]`, and a prompt with
a blinking cursor. A low battery turns its row amber. In green (shown) or in the accent colour.
![Terminal with the navigation](screenshots/themes/terminal-panel.png)
![Terminal, full screen](screenshots/themes/terminal.png)
## Nixie tubes
The glow of nixie tubes, the neon number displays of 50s to 70s lab instruments: orange digits in
glass tubes, the unlit numerals faintly behind the lit one, on a dark walnut panel with brass name
plates. Speed, gear and battery on top; power, range, usage and the time below.
![Nixie tubes with the navigation](screenshots/themes/nixie-panel.png)
![Nixie tubes, full screen](screenshots/themes/nixie.png)
## Chronograph
A watch face, after a chronograph wristwatch: a deep-blue dial with a steel bezel carrying the
speed scale, the long main hand for the speed, sub-dials for battery, power and usage, and the
gear in a date window. Engraved columns either side carry range, trip, time, climate and
odometer.
![Chronograph with the navigation](screenshots/themes/chronograph-panel.png)
![Chronograph, full screen](screenshots/themes/chronograph.png)
## Grid
After the neon world of the Tron films: glowing lines on black and a perspective grid floor that
runs towards you as fast as you drive. The speed sits large in the middle; the battery is a
segmented light wall standing on the floor, turning orange when it runs low; power lights up a
disc whose inner ring turns with it, anticlockwise for regeneration; and the last two minutes of
power run across the floor as a light-cycle trail that only turns at right angles. In its
original cyan (shown, and the app turns cyan with it) or in the accent colour — red gives the
films' other side.
![Grid with the navigation](screenshots/themes/grid-panel.png)
![Grid, full screen](screenshots/themes/grid.png)
## Grid with map
The Grid over a map: the roads round the car from OpenStreetMap (through OpenFreeMap) fill the
whole screen as light lanes, straight from above and turned with the direction you drive, about
400 m ahead and 450 m to each side: motorways glow brightest, then main roads, then the smaller
streets, the far ones fainter, over a ground grid every 50 m that turns and slides with them.
The speed, the battery wall, the power disc and the clock stand on dark panels over the map. The car is the chevron on the
floor, and between GPS fixes it runs on with the speed. The roads come through the car's own
server, which fetches only the map tiles you drive through and keeps them (see the README); the car also keeps
the last few hundred tiles itself. Without GPS, the server or the roads, the floor says so and
stays the plain grid. The light-cycle trail makes way for the map here; power stays on the disc.
Shown with sample values over real roads in central Berlin.
![Grid with map, with the navigation](screenshots/themes/grid-map-panel.png)
![Grid with map, full screen](screenshots/themes/grid-map.png)
## Time circuits
After the time machine in Back to the Future: three rows of LED read-outs in a metal panel,
labelled with embossed tape. The red row, "DESTINATION", shows where you can still get to — the
gear as a word (DRV, REV, NTL, PRK), the charge, the range and the usage, with lamps for power and
regeneration; the green row is the present date and time, as in the film; the amber row, "LAST
TIME DEPARTED", is when you last shifted out of P. Beside them the speed in large red digits and
the flux capacitor, whose light runs to its centre with the power and outwards while
regenerating. At 88 km/h the speed burns white and the flux capacitor flashes. The app turns red
with it.
![Time circuits with the navigation](screenshots/themes/time-circuits-panel.png)
![Time circuits, full screen](screenshots/themes/time-circuits.png)
## Quest
After the interface of a fantasy online game like World of Warcraft, with the car as the player
character: a portrait with the gear as its level, the battery as the health bar and power as the
energy bar; a minimap with the clock; the speed in large gold numbers over a cast bar that reads
"Accelerating", "Regenerating", "Coasting" or, in P, "Resting"; a road-trip quest whose objectives
are the trip, the usage and the climate; a chat window with system lines; P R N D as action
buttons, and the odometer as the experience bar, a level per 1000 km. Below 20 % a raid warning
flashes "Low battery!". The app turns gold with it.
![Quest with the navigation](screenshots/themes/quest-panel.png)
![Quest, full screen](screenshots/themes/quest.png)
## Visor
After the helmet display of a science-fiction shooter like Halo: thin light-blue lines and
slanted frames on a dark visor. The shield bar on top is the battery, turning red and blinking
"BATTERY LOW" below 20 %; the ammunition counter is the range, as a number and as rounds, one per
10 km, with P R N D as the grenade slots under it; the reticle in the middle holds the speed and
fills with power round it, green and the other way while regenerating; the motion tracker shows
the last two minutes of power as blips, red while drawing and green while regenerating, and
sweeps while you drive. The objective lists trip, usage, climate and odometer. In its original
blue (shown, and the app turns blue with it) or in the accent colour.
![Visor with the navigation](screenshots/themes/visor-panel.png)
![Visor, full screen](screenshots/themes/visor.png)
## Empire
After the interface of a real-time strategy game like Age of Empires: a wooden resource bar on
top with the battery, range, power and usage, the clock, and the age you have reached by
odometer — Dark Age, then Feudal from 10,000 km, Castle from 30,000 and Imperial from 60,000. In
the isometric world below, the car is the selected unit on a road, its health bar the battery,
while the ground and trees move past as fast as you drive and the speed stands large over the
land. The carved panel at the bottom has P R N D as command buttons, the unit's portrait and
stats, and a diamond minimap with the odometer and the way to the next age. Below 20 % it warns
"Your battery is running low!". The app turns the player's blue with it.
![Empire with the navigation](screenshots/themes/empire-panel.png)
![Empire, full screen](screenshots/themes/empire.png)
## Día de Muertos
After the ofrenda, the altar families in Mexico build to welcome their dead back for a visit: a
celebration, so bright and warm rather than frightening. The papel picado across the top is the
battery, one cut-paper flag per 10 %, those not lit hanging dark, turning red with "BATTERY LOW"
below 20 %. The calavera in the middle, a decorated sugar skull with marigolds (cempasúchil) for
eyes, has the speed on its forehead; the ring of marigolds round it is the power, clockwise while
drawing, turquoise and anticlockwise while regenerating. The altar's candles are the range, one
per 50 km. The path of marigold petals along the bottom, which in the tradition leads the visitors
home, is the last two minutes of power. On the right the clock in a tin frame, P R N D as small
marigolds, and trip, usage, climate and odometer on the altar cloth. While you drive the flags
sway and the flames flicker. The app turns the papel picado's pink with it.
![Día de Muertos with the navigation](screenshots/themes/muertos-panel.png)
![Día de Muertos, full screen](screenshots/themes/muertos.png)
## Halloween
A graveyard hill under a full moon. The jack-o'-lantern has the speed cut into its grin, and its
carving burns candle yellow while drawing and witch-fire green while regenerating; the arch of
embers over it is the power, from the left while drawing and from the right while regenerating.
The potion flask is the battery, red with "BATTERY LOW" blinking below 20 %. The tombstone reads
the range ("here lies … km"), and the bats are the range too, one per 50 km; P R N D are small
gravestones, the one engaged lit. The moon holds the clock, a sign hanging from a cobweb has trip,
usage, climate and odometer, and the hill along the bottom is the last two minutes of power. While
you drive the bats fly, the potion bubbles and the ghost floats (where there is room for it, as on
this screen). With Bluetooth or CarPlay music playing, the pumpkin's glow swells and its carving
brightens on the beat; the radio cannot be heard, so it burns as usual then. The app turns the
pumpkin's orange with it.
![Halloween with the navigation](screenshots/themes/halloween-panel.png)
![Halloween, full screen](screenshots/themes/halloween.png)