Drl-admin: Created page with "==Digital Standards== ===Website (droidbuilders.info)=== The primary DroidBuilders website uses a '''dark theme''' as the established visual standard. All page design decisions align with the Dark Theme Palette and Typography system. ====Layout Principles==== * Maximum content width: 1200px (boxed layout) * The Coruscant cityscape side background is an intentional design element -- do not remove or replace * Whitespace is a design feature..."

2026-05-31T21:10:02Z

Created page with "==Digital Standards== ===Website (droidbuilders.info)=== The primary DroidBuilders website uses a '''dark theme''' as the established visual standard. All page design decisions align with the Dark Theme Palette and Typography system. ====Layout Principles==== * Maximum content width: 1200px (boxed layout) * The Coruscant cityscape side background is an intentional design element -- do not remove or replace * Whitespace is a design feature..."

New page

==Digital Standards==

===Website (droidbuilders.info)===

The primary DroidBuilders website uses a '''dark theme''' as the established visual standard. All page design decisions align with the
[[DarkThemePalette|Dark Theme Palette]] and [[Typography]] system.

====Layout Principles====

* Maximum content width: 1200px (boxed layout)
* The Coruscant cityscape side background is an intentional design element -- do not remove or replace
* Whitespace is a design feature -- avoid dense or cluttered layouts
* Each page should follow this visual flow: hero > key message > supporting content > call to action

====Component Standards====

{| class="wikitable" style="width:100%"
! style="background-color:#003468; color:#FFFFFF;" | Component
! style="background-color:#003468; color:#FFFFFF;" | Color
! style="background-color:#003468; color:#FFFFFF;" | Notes
|-
| Page background
| Deep Space <code>#060D1A</code>
| Outermost layer only
|-
| Content background
| Dark Surface <code>#0A1628</code>
| Primary content area
|-
| Cards and panels
| Card Surface <code>#0F2040</code>
| Individual content blocks
|-
| Primary CTA button
| Gold <code>#FFC20E</code> with Deep Navy text
| Main action on any page
|-
| Secondary button
| Transparent with Gold border
| Supporting actions
|-
| Links (inline)
| Sky Blue <code>#3BADFF</code>
| Hover state: Gold
|-
| Dividers
| Border <code>#003468</code>
| Section separators
|-
| Navigation text
| White, uppercase
| Exo 2 SemiBold; active state: Gold underline or text
|}

====Minimum Touch Targets====

All interactive elements must have a minimum touch target of 44x44 pixels
on mobile. See [[AccessibilityStandards]] for full requirements.

===Donation Page===

The donation page is one of the highest-impact pages on the site.

* Lead with mission impact before donation mechanics
* Four-tier payment structure is the approved system:
** Community -- $1/month
** Mission -- $55/year
** Champion -- $75/year
** One-Time -- any amount
* Tier names and amounts may only be changed by board approval
* CTA buttons must use Gold (<code>#FFC20E</code>) with Deep Navy text
* All copy must conform to fundraising language rules in [[VoiceTone]]

===Social Media===

====Platform Image Specifications====

{| class="wikitable" style="width:100%"
! style="background-color:#003468; color:#FFFFFF;" | Platform
! style="background-color:#003468; color:#FFFFFF;" | Profile Image
! style="background-color:#003468; color:#FFFFFF;" | Cover / Banner
! style="background-color:#003468; color:#FFFFFF;" | Post Image Size
|-
| Facebook
| Circular Logo, 400x400px
| 1640x924px
| 1200x630px
|-
| Instagram
| Circular Logo, 400x400px
| N/A
| 1080x1080px square; 1080x1350px portrait
|-
| X (Twitter)
| Circular Logo, 400x400px
| 1500x500px
| 1200x675px
|-
| YouTube
| Circular Logo, 800x800px
| 2560x1440px
| Thumbnail: 1280x720px
|}

====Social Media Voice====

* Use the voice principles from [[VoiceTone]] -- warm, precise, joyful
* Primary hashtag: #DroidBuilders -- add event-specific or sector tags as secondary
* Only post on behalf of the organization with board or designated social media lead authorization
* Refer to droids as "droids" -- not "robots" or "costumes"
* Tag partner organizations when sharing event content, with their permission

====Sector Social Media Accounts====

Sector accounts must:

* Use the sector/zone logo (not the primary standalone logo) as the profile image
* Include "DroidBuilders -- [Sector Name]" in the account display name
* Follow all national voice, tone, and content standards
* Not post organizational policy statements or announcements -- those originate from the board only

===Email Communications===

{| class="wikitable" style="width:100%"
! style="background-color:#003468; color:#FFFFFF;" | Element
! style="background-color:#003468; color:#FFFFFF;" | Specification
|-
| Header
| Full-width dark background; Primary Logo (white version), centered
|-
| Body background
| Dark Surface <code>#0A1628</code> preferred; white for light-theme emails
|-
| Typography
| Source Sans 3 for body; Exo 2 for headlines (web-safe fallbacks apply)
|-
| CTA buttons
| Gold <code>#FFC20E</code> with Deep Navy text; minimum 44px tall;
full-width on mobile
|-
| Footer
| Unsubscribe link, mailing address, and 501(c)(3) designation required
|-
| Subject lines
| Lead with action or impact; avoid spam-trigger phrases
|}

[[Category:Branding]]

DigitalStandards - Revision history