import { Canvas, Meta, Story } from '@storybook/addon-docs';

<Meta title="owncast/Documentation/Design" parameters={{previewTabs: { canvas: { hidden: true } }, chromatic: { disableSnapshot: true }}}/>

# Owncast Design Guidelines & Resources

A collection of design contribution guidelines and resources for the Owncast interface.

> **All participating designers are highly encouraged to shape and evolve these guidelines!**
> It is a work in progress and as we have design contributors we can work to solidify the process, tools and resources.

## 👋 Welcome

Owncast is a live streaming and chat server targeted to anybody who has live streaming needs. This means anybody from corporate events, government meetings, game streamers, musicians, churches, TV stations, and more.

Read the detailed [product definition](https://github.com/owncast/owncast/blob/develop/docs/product-definition.md) to learn more.

## 🚢 How to contribute to product design

1. Check out open [issues](https://github.com/owncast/owncast/issues) here on GitHub (we label them with `needs design`)
2. Feel free to open an issue on your own if you find something you would like to contribute to the project.
3. Add your contributions to an issue and we promise we will review your contribution carefully and foster discussions

**We encourage you to:**

- Get in touch with the team by joining our [Community Chat](https://owncast.rocket.chat).
- Check out our [Contributor Guide](https://owncast.online/help) and
  [Code of Conduct](https://github.com/owncast/owncast/blob/develop/CODE_OF_CONDUCT.md)

## 🎭 Target audience

Owncast is a live streaming and chat server targeted to anybody who has live streaming needs. This means anything from corporate events, government meetings, game streams, concerts, TV stations, and more.

## 🧑‍🎨 Product design opportunities

Owncast is a constantly moving project with features both old and new. This allows for design contributions to be both big or small.
You may not know how much time you can dedicate to the project, or if you'll be able to see something through to the end, so be honest about that. Take on projects that you'll be able to see completed.

- So maybe start small by finding rough edges and improvements to existing features without requiring complete rewrites. As a small project the bandwidth for rebuilding existing designs is limited, but tweaks are appreciated. This is especially great if you don't know how much time or energy you'll be able to provide the project. If you think you have a week to help, but might not be around in a month small projects are better.
- If you think you'll be around longer term, learn about future new features and start thinking about the design challenges of those so we can build them your feedback and design contributions in mind. See your designs put in the world through brand new functionality!
- Not everything has to be a a feature. Think big picture. What can we start doing now to put the project in a better place six months from now, or a year?

## 💅 Design relevant materials

A collection of design relevant information and materials can be found under the "style" section of "Storybook" here:

http://owncast.online/components

### Fonts

https://owncast.online/components/?path=%2Fdocs%2Fowncast-styles-typography--page

Body text: Inter

Display/Header text: Poppins

### Colors

https://owncast.online/components/?path=%2Fdocs%2Fowncast-styles-colors-components--page

### Design Files, Screenshots, etc

We do not currently have any design files that fully represent the state of
the Owncast interface. However, going forward it would be nice to resolve this
and collaborate on designs.

We do have a [PenPot organization](https://design.penpot.app/#/dashboard/team/8373f780-f255-11ec-b774-f940e3befd53/projects). Please ask for access.

## 🎓 License

All design work is licensed under the
[MIT](https://mit-license.org/)

[(Back to top)](#-table-of-contents)

