AMC Academy Tech Design System
A complete, engineering‑grade brand system for SATCOM & Maritime Education covering colour, typography, spacing, components, motion, media, and layout patterns for all AMC Academy Tech experiences.
1. Brand overview
AMC Academy Tech is a professional SATCOM and Maritime Engineering training institution. Our visual and interaction language reflects technical precision, maritime reliability, and OEM‑grade professionalism.
This brand system defines how we design, structure, and present every digital touchpoint from the public website to training materials and corporate documentation.
This document is the single source of truth for AMC Academy Tech’s digital brand implementation.
2. Colour system
AMC Academy Tech uses a dark, technical palette with high‑contrast signal accents. This palette is optimised for engineering content, maritime environments, and long‑form reading on screens.
Text should primarily use white on dark backgrounds, with muted text for secondary information. Accent colours are reserved for interactive elements, highlights, and key signals.
3. Typography system
AMC Academy Tech uses Inter as its primary typeface, chosen for clarity, legibility, and modern engineering aesthetics.
Heading 1 — 28–32px
Heading 2 — 22–24px
Heading 3 — 18–20px
Body text — 14–16px. Line height between 1.55 and 1.7 for comfortable reading. Use weight 400–500 for body, 600–700 for headings.
Usage
- Headings: Inter 600–700, tight but readable spacing.
- Body: Inter 400–500, 14–16px.
- Links: Inter 600, accent colour.
Do / Don’t
- Do keep hierarchy clear and consistent.
- Don’t mix multiple typefaces.
- Don’t use all caps for long body text.
4. Spacing & layout
Spacing is based on a modular scale to keep layouts consistent and predictable. Common vertical spacing: 24px, 32px, 40px, 64px.
Containers
- Max width: 1100px for main content.
- Horizontal padding: 5% on small screens.
- Sections: 56–72px vertical padding.
Patterns
- Hero → Section → Grid → Footer.
- Use card grids for grouped content.
- Maintain consistent gaps between cards (16–24px).
5. Component library
Components are the reusable building blocks of AMC Academy Tech. They ensure consistency across pages and experiences.
Navigation
- Fixed top bar with blurred background.
- Logo left, navigation right.
- Mobile menu collapses into a toggle button.
Cards
- Dark background, subtle border, rounded corners.
- Hover: slight lift and shadow.
- Used for programmes, corporate training, and brand content.
6. Motion & interaction
Motion is used to communicate state and hierarchy, not decoration. All animations should be subtle and purposeful.
- Preloader: simple rotating loader, fades out after page load.
- Hover states: small elevation and shadow on cards.
- Transitions: 150–220ms ease for most interactions.
7. Media & imagery
Imagery focuses on SATCOM, maritime operations, and engineering environments. Use high‑contrast, technically oriented visuals.
- Hero imagery: maritime vessels, radomes, network infrastructure.
- Videos: used for corporate training and demonstrations.
- Icons/diagrams: clean, minimal, engineering‑style.
8. Layout patterns
Layout patterns define how content is structured across pages. They ensure consistency between the homepage, legal pages, and brand documentation.
- Homepage: hero with image, mission, programmes, corporate training, contact, footer.
- Legal pages: fixed nav, centred content column, simple headings and paragraphs.
- Brand system: long‑form document with clear sections and dividers.
9. Brand principles
AMC Academy Tech must always present as a serious, technically competent, and globally relevant SATCOM and Maritime Engineering academy.
- Clarity over decoration.
- Consistency over novelty.
- Engineering‑grade precision in layout and content.
10. AMC Academy Tech AI System
AMC Academy Tech AI is the dedicated artificial intelligence system supporting SATCOM and maritime engineering education, corporate training, and technical reasoning across AMC Academy Tech experiences.
Role in the brand system
- Provides AI‑driven guidance across training, legal, and brand documentation.
- Supports learners with SATCOM, RF, maritime connectivity, and engineering reasoning.
- Aligns responses with AMC Academy Tech’s professional, OEM‑grade positioning.
Behaviour & tone
- Technical, precise, and engineering‑grade in all explanations.
- Clear, structured, and aligned with AMC layout and typography patterns.
- Consistent with AMC’s brand principles: clarity, consistency, and precision.
AMC Academy Tech AI operates as an integrated part of the brand system, ensuring that all AI‑generated content respects the same visual, structural, and professional standards defined in this document.