Are you looking for ways to contribute to Theme Builder?

[aaronreed708]

We have quite a variety of work that we are looking for help with. In our dashboard we are using the good first issue and help wanted labels to group these issues. They range from simple bug fixes to complex design and implementation epics.

I have just completed the exercise of grouping some of the more ambitious projects into a single list with sub items that help gather details on each project into one place. If you are looking to find a juicy, impactful idea to make your own or to tackle with a team, this might be a great place to start.

Ambitious projects in Accessibility Theme Builder

Compliance testing

We encourage you to find a methodology for how we can demonstrate the value that Theme Builder might provide to a project. For example, would it be possible to evaluate a web application using accessibility testing tools in such a way as to come up with a score or grade? And then re-score or re-grade the web application after it applies a design system that was created with Theme Builder?

• [TB] Research Color Contrast detection in currently available tooling
• [TB] Compliance Testing
• [REQUEST] Research and comment on accessibility testing tools for potential integration with Theme Builder
• [REQUEST] Create tests for WCAG compliance

Improve Theme Builder accessibility

Because Theme Builder promotes better accessibility, it would be wonderful if Theme Builder were itself a model web application that not only used a Theme Builder theme, but also contains well-constructed content that is easily digestible by screen readers, responds well to magnification, have easy to understand text and documentation, and many more possible improvements that could have a positive impact on people who require accommodations.

• [REQUEST] Show a pop-up if the user clicks on the "Show Theme" button before adding all the necessary colors
• [TB] Enhance Responsiveness of ThemeBuilder Application on Mobile Devices

Implement new landing page

In an effort to build our community of contributors, we'd like to establish a web page that we can direct people to learn more about the project. This effort is being led by our Community Working Group.

• [REQUEST] Create a new landing page for a Theme Builder microsite, using Theme Builder
• [TB] Do Design Thinking around a new landing page
• [WebSite] Design Thinking / approach for public website

DesignOps Toolchain

We believe that creating a proof of concept for an improved developer+designer workflow would be highly impactful. Imagine a world where a designer could update a design system in Figma and a toolchain could push that change into a place where Theme Builder could pick it up and export some new CSS or a new Theme.jsx that could, in turn, be applied by the toolchain to a Storybook instance and all of the components in the component library would reflect the changes automatically. Similarly a developer using Storybook or Theme Builder could modify a design system and have it pushed by a toolchain in such a way as it gets picked up by Figma and designers then begin to use the updated design system seamlessly.

• [REQUEST] Research improved toolchain workflow
• [TB] Connect Theme Builder to Git Hub
• [DOCS] Review capabilities for integration with Storybook, write a documentation page and blog post outline
• [REQUEST] Create GitHub Actions to help toolchain to transform design tokens

Create a demo, proof of concept using Anima

This is another project with the goal to make the interactions between designers and developers more effective. Can we prove that a designer using Figma, with a design system coming from Theme Builder, could create a wireframe that could be processed by Anima to create React component code (with appropriate design system styling) that could be packaged and handed off to a developer to finish implementing. We believe that this would lead to UI that much more closely matches the original designs.

• [DOCS] Document an example / demo using Anima with Theme Builder for end-to-end design

Figma Plugin

We are envisioning a plugin that could be used by designers in Figma to validate that their designs are compliant to the applicable WCAG AA or AAA standards by leveraging the Theme Builder SDK.

• [REQUEST] Research possible Figma integration
• [REQUEST] Research creating a Figma plugin for Accessbility checking

We hope that by sharing our hopes and dreams that it will inspire you to help make these dreams a reality!

[toni-sharpe]

You can take a look at these documents too, some of the top organisations have put together resources to help guide open source (OS) projects:

Linux Foundation come from a more corporate angle, given this is ultimately FinTech that's probably good. There's plenty in there, so see what Linux Foundation advise the potential contributor. There's bits in the other guides too.

GitHub and by extension also MicroSoft also have an excellent resource. This is more general, better laid out, more thoroughly linkable and a less dry read. Here is the page about good practice for the potential contributor but, I'd advise reading also the guide's entry on how to manage as a maintainer as this view should foster empathy. Finally there's a page about building community which every contributor is part of as soon as starting. The advice here is really for all.

Both these guides are detailed, well sourced and cover the OS topic from both sides, start to finish. This discussion, 909, is targeted at the contributor but the sources will help all involved.