Brutalist Phylogenetic Map Redesign
A brutalist, scientific interface design inspired by biological archives and museum catalogs. Characterized by high-contrast monospace typography (Courier Prime), a 'paper cream' background (#F7F4ED), and a utilitarian technical grid. This design system is ideal for data-heavy applications, educational platforms, scientific dashboards, and fintech interfaces that require a structured, 'system' feel. It uses a taxonomic color palette for categorical differentiation and employs stark, hard shadows and 2px black borders to define elements. Key features include an interactive SVG phylogenetic tree, scan-line animations, and data-rich tooltips.
Summary
A brutalist scientific interface utilizing technical grids, monospace typography, and a 'system-terminal' aesthetic to organize complex taxonomic data.
Style
The style is 'Scientific Brutalism'. It pairs Courier Prime (monospace) across all hierarchies with a strict color palette: #F7F4ED (Background), #1A1815 (Ink), #C5A059 (Gold), #2D5A27 (Green), #8B7355 (Brown), and #C44536 (Red). Elements use 2px solid black borders and offset hard shadows. Animations are utilitarian: sharp translations (no easing on hover), pulse effects for status indicators, and linear 'scan-line' effects for data visuals.
Layout & Structure
The layout follows a modular block structure with a sticky navigation and defined sections for hero, status alerts, data visualization, and terminal inputs.
Navigation
Hero Section
Phylogenetic Map Section
Teaser/Challenge Section
Terminal Input Section
Components
Taxonomic Specimen Card
A high-density data component mimicking a laboratory log.
SVG Data Tooltip
Rich HTML content rendered inside an SVG interactive map.
Brutalist Action Button
A high-impact button with physical movement feedback.