Skip to main content
Logo

Discover the Future of Drupal with the Drupal Starshot Design System

Drupal Starshot Design System

Wishdesk is always on the lookout for the latest developments and innovations in the Drupal world. We are excited to share the news about the upcoming launch of the new Drupal Starshot design system, which will be presented at DrupalCon Barcelona. This project was developed in collaboration with the Civic Theme initiative and supported by Salsa Digital.

A New Approach to Drupal Website Creation

The new Starshot Experience Builder will allow you to create and launch Drupal-based sites without in-depth technical knowledge. During the meeting, a prototype landing page for the Drupal Starshot product was also presented, showcasing the anticipated capabilities and advantages of the new design system.

What is the Drupal Starshot Design System?

The Drupal Starshot Design System is a comprehensive collection of reusable components and tools designed to simplify and enhance the creation of Drupal websites. The system is being built using the CivicTheme, which serves as the foundation for developing the Drupal Starshot Design System.

Project Goal for the Drupal Starshot Design System

The goal of the project is to demo the power of the Starshot Experience Builder at DrupalCon Barcelona by building a Drupal-branded landing page using an SDC-compatible design system.

How is the Drupal Starshot Design System Built?

The design system includes Single Directory Components (SDC), which bundle everything a component needs into a single directory. Each SDC contains:

  • YAML File: Metadata about the component.
  • Twig File: HTML markup.
  • CSS: Styles for the component.
  • JavaScript (optional): For interactive functionality.

This structure simplifies the integration and use of components, making it easier to maintain consistency across different projects. The system is built with a strong emphasis on accessibility, user-friendliness, and modern design principles.

Key Components and Tools in the Drupal Starshot Design System

  • Experience Builder: This powerful tool allows you to create themes and full websites directly in your browser. Marketers and content managers can quickly edit pages without needing technical specialists.
  • SDC (Single Directory Components): These components include all the necessary files for operation in one directory, simplifying their use and integration.
  • New Drupal Branding: Modern design and branding will make your site even more attractive to users.

Advantages of the Drupal Starshot Design System

Ease of Use for Drupal Users

With Experience Builder, you can independently create and edit sites using an intuitive interface. This reduces dependence on technical specialists and saves your time and resources.

Fast Implementation for Drupal Projects

Thanks to compatibility with SDC, implementing new components is much faster. This allows you to quickly add new features and elements to your site, keeping it relevant and competitive.

High Accessibility Standards for Drupal Sites

The new components meet high accessibility standards, making your site more convenient for all users, including people with disabilities.

Support for Open Standards in Drupal

Support for open standards ensures compatibility with various systems and platforms, expanding the possibilities for integrating and using modern technologies.

Additional Features of the Drupal Starshot Design System

  • Automatic Updates and Project Browser: Reduces the time for system updates and enhances the security of your site.
  • Recipes: Ready-made sets of settings and configurations for quick application to the site, significantly simplifying the setup process.
  • Integration with Web Analytics Tools: Easy integration with popular web analytics tools such as Google Analytics to better understand user behavior.
  • Improved Security for Drupal Sites: New tools for ensuring data security, including support for the latest encryption and authentication standards.

Planned Components for the Drupal Starshot Design System

  • Hero Block: Large headers and images on main pages.
  • Icon Texts: Quickly create informational blocks with icons and descriptions.
  • Buttons with Various Styles: Button options for different purposes and design styles.
  • Interactive Forms: Advanced forms for collecting information from users.

Prototype Landing Page for the Drupal Starshot Design System

At the meeting on July 30, a prototype landing page was presented and created to showcase and promote the Drupal Starshot product. The landing page contains information about the advantages and capabilities of the new design system. Note that this is not the final design, but it demonstrates how Drupal Starshot can improve the creation and management of web pages.

Drupal Starshot Landing Page Prototype

Wishdesk monitors the latest news and developments in the Drupal world and is happy to share them with our audience. The new Drupal Starshot design system is an ambitious project aimed at simplifying the process of creating Drupal-based sites. Thanks to these innovations, your company will have the opportunity to create high-quality, accessible, and easily managed websites.

If you are interested in the capabilities of the new design system or want to order the development or support of a Drupal site, contact Wishdesk for consultation and support.