Fanbyte Design System
Context
Fanbyte required a redesign of the site in 2023 to focus on providing guides and tools for live services games such as Final Fantasy XIV and Destiny 2. Along with this, the site needed to migrate CMS platforms.
Minimal Disruption of Brand
Fanbyte has gone through multiple iterations over several years, so maintaining consistency with the brand was key to avoid unnecessary disruptions to existing users and overall user perception of the site.
Insufficient Accessibility Support
Basic elements on the site were inconsistent with color contrast pairs, element hierarchy, and more which impacted fundamental accessibility as well as SEO.
Restrictive Design Patterns
Many of the existing design patterns made it difficult to adjust core page layouts, including challenges with ad placement.
Outcomes
Modular, Extensive Design System
The design system follows an atomic methodology to ensure optimal reuse and consistency throughout the site. Fundamental visual accessibility standards were baked in to atomic elements so that larger components would be as clear and readable as possible.
Extensible
Additional sublibraries were established for primary game titles that the site provided content and tools for so that layouts and modules could utilize stylistic overrides to make the corresponding verticals on the site feel more connected and cohesive to the particular game title.