Create carbon.html

Signed-off-by: Raydo Matthee <raydo@skunkworks.africa>

IBM/carbon.html

@@ -0,0 +1,125 @@
+# Course Outline Template
+
+#### Course Title:
+*Enter the course title here*
+
+#### Instructor:
+*Enter the instructor's name here*
+
+---
+
+### 1. Course Overview
+- **Introduction**
+  - Brief description of the course
+  - Objectives and goals
+  - Target audience
+
+- **Typography**
+  - Use IBM Plex® typeface
+  - Links to [IBM Plex® on Adobe Fonts](https://fonts.adobe.com/fonts/ibm-plex) and [IBM Plex® on Google Fonts](https://fonts.google.com/specimen/IBM+Plex+Sans)
+  - Alternatives: Noto Sans CJK SC and Noto Sans CJK TC for Chinese scripts
+
+---
+
+### 2. Course Materials
+
+- **Design Tools**
+  - **IBM Design Language Library**
+  - **Sketch Icon**: [Carbon Libraries](https://github.com/carbon-design-system/carbon)
+  - **Carbon Theme Libraries**
+
+- **Color Palette**
+  - IBM color palette in .ase and .clr formats
+  - Implementation guide for [Color in UI](https://www.ibm.com/design/language/elements/color/)
+  - [Color contrast checker](https://webaim.org/resources/contrastchecker/)
+
+- **Grid Systems**
+  - Overview of the [2x Grid in UI](https://www.ibm.com/design/language/elements/grid/)
+  - Template for video and UI elements
+
+---
+
+### 3. IBM Branding
+
+- **Logos**
+  - Request permissions for internal and third-party use via IBM ID
+  - Co-branding guidelines
+  - Eye-Bee-M patterns
+
+- **Iconography**
+  - Libraries for UI icons (16px, 20px, 24px, 32px)
+  - IBM UI icons master in Adobe Illustrator
+  - Repositories for UI and app icons on [GitHub](https://github.com/carbon-design-system/carbon)
+
+---
+
+### 4. Visual and Data Elements
+
+- **Illustration Kits**
+  - Line style, flat style, and isometric style kits in Adobe Illustrator
+
+- **Photography**
+  - Access to photography assets (IBM ID required)
+
+- **Data Visualization**
+  - Carbon data visualization tools and color palettes
+
+- **Animation**
+  - Guidelines for [motion in UI](https://www.ibm.com/design/language/elements/motion/)
+  - IBM motion package on npm
+  - Motion generator on GitHub
+
+---
+
+### 5. Accessibility
+
+- **Web Content Accessibility Guidelines (WCAG) 2.1**
+  - Ensuring accessibility in design and content
+  - Color contrast checks
+
+---
+
+### 6. Additional Resources
+
+- **Getting Started with Carbon**
+  - Comprehensive guide to using Carbon Design System
+
+- **Brand Center Resource Page**
+  - Additional resources for IBM branding (IBM ID required)
+
+- **Carbon Design Kits**
+  - Detailed design kits for various components and themes
+
+---
+
+### 7. Assignments and Activities
+
+- **Practical Assignments**
+  - Projects utilizing IBM design tools
+  - Exercises on creating consistent and accessible designs
+
+- **Quizzes and Tests**
+  - Assessments to gauge understanding of IBM design principles
+
+---
+
+### 8. References and Documentation
+
+- **IBM Documentation**
+  - Link to IBM's official [documentation](https://www.ibm.com/design/language/)
+  - Additional references and guides
+
+---
+
+### 9. Feedback and Support
+
+- **Feedback Mechanism**
+  - How to provide course feedback
+  - Support contacts for course-related queries
+
+- **Community and Collaboration**
+  - Links to forums and collaborative platforms like Teams, Slack, and Discord
+
+---
+
+This template ensures that all elements and components are covered, providing a comprehensive guide for creating educational content while adhering to IBM's design standards. Feel free to customize and expand each section to fit specific course needs.