Boystown Design System
Last updated Mar 11 2024.
The boystown design system is the one source of truth for all visual and communication patterns online. Like any tool or methodology, it will only work right when used right. And "right" can only be determined through a process of constant polishing and practice.
What are we trying to achieve?
Unify the way we work
Through documenting pre-tested, proven processes. Documenting gives us the ability to see the full process picture and improve specific parts through constant re-usage.
Save time
Split our online experiences into components for better consistency, less technical debt, and faster updates.
Build consistency
Document and spread our values and principles to unify our vision.
Usage
→
Marketeers
→
Designers
→
Developers
→
Contribution
→
Pipelne
→
Foundations
→
Color
→
Typography
→
Actions
→
Structured Text
→
Images
→
Content
→
Voice and Tone
→
Mechanics, Grammar and Inclusivity
→
Patterns
→
Containers / Sections
→
Typographic patterns
→
Cards and Content Cards
→
Separators
→
Taxonomies
→
Images with Overlaid Text
→
Pagination
→
Social Share Buttons
→
Spinner
→
Agility Page Components
→
Styling Definitions
→
Text
→
Text and Media
→
Carousels
→
Accordion
→
Grid Content
→
Examples In Action
→
Templates
→
Blog post
→
Error Page
→
Event Page
→
Landing Page
→
Location Page
→
News Article Page
→
News Release Page
→
Search Page
→