firefrost-operations-manual/docs/design-bible.md

❄️🔥 FIREFROST GAMING: THE DESIGN BIBLE (v1.1)

Last Updated: February 8, 2026
Maintained By: Frostystyle (Michael) & Gingerfury (Meg)
Status: Living Document

---

1. The Core Philosophy: "Choose Your Destiny"

Firefrost Gaming is built on the equilibrium of two opposing forces. We do not compromise on security, and we do not compromise on passion. Every asset we create must reflect this balance.

• The Frost (The Wizard): Represents Logic, Stability, Security, and Technical Precision.
• The Fire (The Emissary): Represents Passion, Community, Warmth, and Authentic Connection.

Tagline: "Fire melts barriers. Frost builds foundations."

---

2. Visual Identity & Color Palette

We use high-contrast color theory to signal to the user exactly where they are in the network.

A. The Frost Palette (Technical/All-Ages)

Used for: Main Website, Tutorials, Gitea, Project Logs, and General Community.

Element	Hex Code	Usage
Primary	#00E5FF	Electric Cyan - Headings, Active Links
Secondary	#01579B	Deep Navy - Buttons, Nav Backgrounds
Background	#0A0A0A	Obsidian Black - Main Page Background
Text	#FFFFFF	Pure White - High Readability Body Text

B. The Fire Palette (Ignis/18+)

Used for: /ignis route, Mature Community Space, and Veteran Socials.

Element	Hex Code	Usage
Primary	#FF3D00	Deep Orange/Red - Alerts, Fire Path Links
Secondary	#BF360C	Burnt Umber - Borders, Secondary Accents
Background	#120000	Blood Black - Gated Section Background
Accent	#FFD600	Amber Gold - Important Calls to Action

---

3. Typography

To ensure accessibility and professional aesthetics, we use a two-font system.

• Headings: Orbitron or Rajdhani. Geometric sans-serif to evoke high-tech "Wizardry."
• Body Text: Inter or Roboto. Clean, high-legibility sans-serif for long-form reading and documentation.
• Code: Fira Code or JetBrains Mono. Used for all technical blocks in the Master Archive.

Font Sizing:

• Base: 16px (never smaller)
• Headings: 1.5x, 2x, 2.5x base
• Line height: 1.6 for body text

---

4. UI/UX Language

The interface should behave differently depending on the chosen path.

The Frost Interface (Precision)

• Shape: Sharp 90-degree corners (border-radius: 0)
• Style: "Glassmorphism" (semi-transparent backgrounds with backdrop blur)
• Border: Thin 1px cyan borders (#00E5FF)
• Shadows: None (flat design)

The Fire Interface (Passion)

• Shape: Slightly rounded corners (4px - 8px border-radius)
• Style: Subtle outer glows and drop shadows that simulate heat radiation
• Border: Gradient borders transitioning from Red (#FF3D00) to Gold (#FFD600)
• Shadows: 0 4px 12px rgba(255, 61, 0, 0.3)

---

5. Tone of Voice

We are "The Helpful Peer." We speak with authority but without ego.

• The Wizard Voice: Calm, technical, and precise. Focuses on the "How-To" and "Source of Truth."

  • Example: "To configure your server, navigate to /etc/nginx/sites-available/"
  • NOT: "Hey friend! Let's dive into some super cool server stuff!"

• The Emissary Voice: Warm, energetic, and protective. Focuses on the "Who" and the community "Vibe."

  • Example: "Welcome back, veteran! Ready to tackle that boss?"
  • NOT: "Execute the following command to initiate the protocol:"

• The Combined Voice: "Stability provided by the Frost; Community fueled by the Fire."

  • Example: "Firefrost Gaming combines technical excellence with authentic community."

---

6. The Frostwall Protocol (The Gate)

The transition between paths must be intentional.

1. Visual Warning: Before entering the Fire Path, the UI color scheme must shift noticeably (Frost → Fire palette).
2. The Handshake: An explicit age-verification check or "Ignis Protocol" login must be presented.
3. The Exit: A prominent "Return to Frost Path" button must always be available to reset the environment to all-ages safety.

Technical Implementation:

• Color shift animation: 800ms transition
• Background: #0A0A0A → #120000
• Border glow intensifies
• Warning overlay fades in

---

7. Imagery & Symbols

Visual Vocabulary

Frost Symbols:

• Staves, Snowflakes, Blue Circuitry, Geometric Shields
• Ice crystals, Angular patterns
• Books, Tomes, Knowledge artifacts

Fire Symbols:

• Flames, Embers, Red Capes, Glowing Hearts
• Hammers (Banhammer metaphor)
• Warm light, Organic flow

The Firefrost Sigil

Construction:

• Outer circle: Frost border (2px, #00E5FF)
• Inner circle: Fire glow (#FF3D00, 60% opacity)
• Center: 6-pointed snowflake (geometric, cyan)
• Background: Flame silhouette (organic, red/gold gradient)

Symbolism:

• The snowflake represents The Wizard (order, structure, knowledge)
• The flame represents The Emissary (passion, community, warmth)
• The circle contains both (unity, balance, completeness)

Usage:

• Favicon (16x16, 32x32, 64x64)
• Loading spinner animation
• Section dividers
• Watermark for official content
• Social media profile images

---

8. Logo Usage & Variations

Primary Logo

• Full color Firefrost Sigil (Fire + Frost combined)
• Minimum size: 120px width
• Clear space: 20px on all sides
• Never distort aspect ratio

Secondary Variations

• Frost-only logo: Cyan/white on dark backgrounds (technical content)
• Fire-only logo: Red/gold on dark backgrounds (community content)
• Monochrome version: White on dark, black on light

Logo Don'ts

• ❌ Don't rotate the logo
• ❌ Don't change the color balance
• ❌ Don't add effects (drop shadows, gradients not in spec)
• ❌ Don't place on busy backgrounds
• ❌ Don't use low-resolution versions

---

9. Motion & Animation Language

Frost Animations (Technical)

• Style: Linear, precise, mechanical
• Timing: Sharp easing (ease-in-out)
• Example: Menu slides, page transitions, data loading
• Duration: 200-300ms (quick, efficient)

Fire Animations (Community)

• Style: Organic, flowing, alive
• Timing: Smooth easing (ease-out)
• Example: Hover effects, button pulses, celebration effects
• Duration: 300-500ms (warmer, more presence)

The Transition (Frost → Fire)

• Gradual color shift over 800ms
• Background darkens (#0A0A0A → #120000)
• Border glow intensifies
• Warning overlay fades in with Age Gate

---

10. UI Components

Buttons

Frost Path:

background: #01579B;
border: 1px solid #00E5FF;
color: #FFFFFF;
border-radius: 0;

/* Hover */
background: #00E5FF;
color: #0A0A0A;

Fire Path:

background: #FF3D00;
border: 2px solid #FFD600;
color: #FFFFFF;
border-radius: 6px;

/* Hover */
box-shadow: 0 0 8px #FFD600;

Cards

Frost Cards:

background: rgba(1, 87, 155, 0.1);
backdrop-filter: blur(10px);
border: 1px solid #00E5FF;
box-shadow: none;

Fire Cards:

background: rgba(191, 54, 12, 0.2);
border: 1px solid #FF3D00;
box-shadow: 0 4px 12px rgba(255, 61, 0, 0.3);

---

11. Accessibility Commitments

Color Contrast

• All text meets WCAG AA standards (4.5:1 minimum)
• Critical CTAs meet AAA standards (7:1)
• Test with WebAIM Contrast Checker before deployment

Keyboard Navigation

• All interactive elements keyboard-accessible
• Focus states clearly visible (2px outline, primary color)
• Skip-to-content links for screen readers

Screen Reader Support

• Semantic HTML (proper heading hierarchy)
• Alt text for all images
• ARIA labels for complex interactions

---

12. Social Media Platform Strategy

Platform Directory

Platform	Handle	Purpose	Frequency	Priority
Discord	discord.gg/firefrost	Command Center	Daily	🔴 Critical
TikTok	@FirefrostGaming	Discovery Hook	3-5x/week	🔴 Critical
Twitter/X	@FirefrostGaming	Real-time Pulse	1-3x/day	🔴 Critical
Instagram	@FirefrostGaming	Visual Gallery	3-4x/week	🔴 Critical
YouTube	@FirefrostOfficial	Long-form Archive	2-3x/month	🔴 Critical
Facebook	Firefrost Gaming	Local Outreach	2-3x/week	🟡 High
Twitch	@FirefrostGaming	Live Streams	1-2x/week	🟡 High
Reddit	r/FirefrostGaming	Community Discussion	2-3x/week	🟡 High
GitHub	@FirefrostGaming	Open Source Hub	As needed	🟢 Medium
LinkedIn	Firefrost Gaming	Professional Network	1-2x/month	🟢 Medium
BlueSky	@firefrostgaming.bsky.social	Twitter Alternative	Mirror	🔵 Low

Profile Images (Standardized)

• All platforms: Firefrost Sigil (snowflake in flame)
• Banners/Headers: Frostystyle & Gingerfury founder art

Bio Template (Adapt by platform length)

Short (Twitter/Instagram):

Fire 🔥 + Frost ❄️ | Minnesota Minecraft Community | Security-First Gaming | 18+ Ignis: [link]

Long (YouTube/Facebook):

Firefrost Gaming is a Minnesota-based Minecraft community built on the balance of Fire and Frost. The Wizard (Frostystyle) ensures technical excellence, while The Emissary (Gingerfury) nurtures our community. 13+ servers, all-ages Frost Path + adult Ignis space (18+). Join: [Discord link]

Content Voice by Platform

Frost Path Content (All-Ages):

• Professional, helpful, educational
• Family-friendly language always
• Technical accuracy prioritized
• The Wizard's voice (precise, informative)

Fire Path Content (Age-Gated):

• Casual, authentic, unfiltered
• Mature humor acceptable
• Community-driven tone
• The Emissary's voice (warm, energetic)

---

13. Code Repository Strategy

Internal vs Public

Gitea (git.firefrostgaming.com) - Private:

• Infrastructure configurations
• Sensitive documentation
• Internal procedures and session logs
• Team collaboration only
• Master Archive for Phase 0.5+

GitHub (@FirefrostGaming) - Public:

• Open source tools and themes
• Custom Pterodactyl themes (Frost & Ignis)
• Wings configuration templates
• Community contributions welcome
• Technical portfolio and credibility

---

Revision History

Version	Date	Author	Changes
1.0	2026-02-08	Frostystyle	Initial Design Bible creation
1.1	2026-02-08	Frostystyle	Added social media platforms, code repository strategy, accessibility standards, UI components, and motion language

---

END OF DESIGN BIBLE

The Wizard (Frostystyle) & The Emissary (Gingerfury)
Building Firefrost Gaming: Fire + Frost in Perfect Balance 🔥❄️