From 8e815381f357e19ee2360ad3a599d6bd424fd0c2 Mon Sep 17 00:00:00 2001 From: Jan Child Date: Thu, 20 May 2021 17:25:16 -0500 Subject: [PATCH 1/9] comms: all about carbon additions --- src/data/nav-items.yaml | 6 +- .../all-about-carbon/images/ecosystem/bee.svg | 1 + .../images/ecosystem/blog.svg | 1 + .../images/ecosystem/carbon.svg | 1 + .../images/ecosystem/chat-bot.svg | 1 + .../images/ecosystem/data--1.svg | 1 + .../images/ecosystem/ibm-cloud.svg | 1 + .../images/ecosystem/iot--platform.svg | 1 + .../images/ecosystem/watson.svg | 1 + .../all-about-carbon/the-carbon-ecosystem.mdx | 236 ++++++++++++++ src/pages/all-about-carbon/what-is-carbon.mdx | 123 +++++-- .../all-about-carbon/who-uses-carbon.mdx | 308 ++++++++++++++++++ .../all-about-carbon/why-use-carbon copy.mdx | 259 +++++++++++++++ src/pages/designing/get-started.mdx | 6 + src/pages/developing/get-started.mdx | 6 + 15 files changed, 926 insertions(+), 26 deletions(-) create mode 100644 src/pages/all-about-carbon/images/ecosystem/bee.svg create mode 100644 src/pages/all-about-carbon/images/ecosystem/blog.svg create mode 100644 src/pages/all-about-carbon/images/ecosystem/carbon.svg create mode 100644 src/pages/all-about-carbon/images/ecosystem/chat-bot.svg create mode 100644 src/pages/all-about-carbon/images/ecosystem/data--1.svg create mode 100644 src/pages/all-about-carbon/images/ecosystem/ibm-cloud.svg create mode 100644 src/pages/all-about-carbon/images/ecosystem/iot--platform.svg create mode 100644 src/pages/all-about-carbon/images/ecosystem/watson.svg create mode 100755 src/pages/all-about-carbon/the-carbon-ecosystem.mdx create mode 100755 src/pages/all-about-carbon/who-uses-carbon.mdx create mode 100755 src/pages/all-about-carbon/why-use-carbon copy.mdx diff --git a/src/data/nav-items.yaml b/src/data/nav-items.yaml index 552cbe3d7a7..2983bded0c6 100644 --- a/src/data/nav-items.yaml +++ b/src/data/nav-items.yaml @@ -2,8 +2,10 @@ pages: - title: What is Carbon? path: /all-about-carbon/what-is-carbon/ - - title: How Carbon works - path: /all-about-carbon/how-carbon-works/ + - title: Who uses Carbon? + path: /all-about-carbon/who-uses-carbon/ + - title: The Carbon ecosystem + path: /all-about-carbon/the-carbon-ecosystem/ - title: The Carbon team path: /all-about-carbon/the-team/ - title: Partners diff --git a/src/pages/all-about-carbon/images/ecosystem/bee.svg b/src/pages/all-about-carbon/images/ecosystem/bee.svg new file mode 100644 index 00000000000..2d0757621fc --- /dev/null +++ b/src/pages/all-about-carbon/images/ecosystem/bee.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/all-about-carbon/images/ecosystem/blog.svg b/src/pages/all-about-carbon/images/ecosystem/blog.svg new file mode 100644 index 00000000000..8c6770a4eb9 --- /dev/null +++ b/src/pages/all-about-carbon/images/ecosystem/blog.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/all-about-carbon/images/ecosystem/carbon.svg b/src/pages/all-about-carbon/images/ecosystem/carbon.svg new file mode 100644 index 00000000000..cb837d6d494 --- /dev/null +++ b/src/pages/all-about-carbon/images/ecosystem/carbon.svg @@ -0,0 +1 @@ +carbon \ No newline at end of file diff --git a/src/pages/all-about-carbon/images/ecosystem/chat-bot.svg b/src/pages/all-about-carbon/images/ecosystem/chat-bot.svg new file mode 100644 index 00000000000..cdbcbe95a7f --- /dev/null +++ b/src/pages/all-about-carbon/images/ecosystem/chat-bot.svg @@ -0,0 +1 @@ +chat-bot \ No newline at end of file diff --git a/src/pages/all-about-carbon/images/ecosystem/data--1.svg b/src/pages/all-about-carbon/images/ecosystem/data--1.svg new file mode 100644 index 00000000000..c95cf9a3466 --- /dev/null +++ b/src/pages/all-about-carbon/images/ecosystem/data--1.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/all-about-carbon/images/ecosystem/ibm-cloud.svg b/src/pages/all-about-carbon/images/ecosystem/ibm-cloud.svg new file mode 100644 index 00000000000..8e49e26f310 --- /dev/null +++ b/src/pages/all-about-carbon/images/ecosystem/ibm-cloud.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/all-about-carbon/images/ecosystem/iot--platform.svg b/src/pages/all-about-carbon/images/ecosystem/iot--platform.svg new file mode 100644 index 00000000000..86f5098658a --- /dev/null +++ b/src/pages/all-about-carbon/images/ecosystem/iot--platform.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/all-about-carbon/images/ecosystem/watson.svg b/src/pages/all-about-carbon/images/ecosystem/watson.svg new file mode 100644 index 00000000000..f94ecccc849 --- /dev/null +++ b/src/pages/all-about-carbon/images/ecosystem/watson.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/all-about-carbon/the-carbon-ecosystem.mdx b/src/pages/all-about-carbon/the-carbon-ecosystem.mdx new file mode 100755 index 00000000000..3d7a036a087 --- /dev/null +++ b/src/pages/all-about-carbon/the-carbon-ecosystem.mdx @@ -0,0 +1,236 @@ +--- +title: The Carbon ecosystem +description: + Within IBM, every team that is building a digital experience is consuming + Carbon assets and guidance but Carbon is more than one website. +--- + + + +Within IBM, every team that is building a digital experience is consuming Carbon +assets and guidance but Carbon is more than one website. + + + + + +Overview +Community assets +Product +IBM.com +Brand +Conversational UX + + + +## Overview + +At its core, Carbon has universal assets–elements, components, patterns, and +code–and guidance for how to design and build with them. These assets are +considered universal or fundamental in nature, which means they can used as a +base for the widest variety of situations, and extended or adapted for the +specific business use cases. + +Beyond this core is a distributed ecosystem of sites that support and serve the +design and development communities within IBM and, where open source content is +available, the external community as well. + +The following sites within the Carbon community include guidance, assets, and +resources for all of IBM’s digital experiences from product to website. _Note +that some guidance is accessible to IBMers only._ + +## Community assets + +### Component index + +These components are developed and maintained by members of the IBM Carbon +community. They may change over time, and they may be incomplete or +experimental. For support, please contact the maintainers listed on each page. + +_Some of this content is accessible to IBMers only._ + + + + + +![Carbon icon](images/ecosystem/carbon.svg) + + + + + + +### Patterns + +Patterns are best practice solutions for how a user achieves a goal. These +community patterns are developed and maintained by members of the Carbon +community. For support, contact the maintainers listed on each page. + +_Some of this content is accessible to IBMers only._ + + + + + +![Carbon icon](images/ecosystem/carbon.svg) + + + + + + +## Product + +The guidance and resources here are for IBM product teams building software +applications and digital experiences with the Carbon Design System. This work is +built on the foundation of Carbon and provides solutions for specific domains +and use cases. + +_This content is accessible to IBMers only._ + + + + + +![IoT icon](images/ecosystem/watson.svg) + + + + + + + +![Data icon](images/ecosystem/ibm-cloud.svg) + + + + + + +![Cloud icon](images/ecosystem/ibm-cloud.svg) + + + + + + +![Pattern icon](images/ecosystem/watson.svg) + + + + + + +![Pattern icon](images/ecosystem/watson.svg) + + + + + +## IBM.com + +The guidance and resources here have been developed for IBM teams building +digital experiences for the IBM.com site. + + + + + +![Bee icon](images/ecosystem/bee.svg) + + + + + + +## Brand + +The journey to understand IBM brand guidance begins with the foundations in the +Brand Center, then extends to the expression of brand as documented in the IBM +Design Language (IDL) site. From there, go to the IBM Brand Systems for visual +systems and guidance tailored to our hero brands, category brands, and +offerings. + +_This content is accessible to IBMers only._ + + + + + +![Bee icon](images/ecosystem/bee.svg) + + + + + + + +![Bee icon](images/ecosystem/bee.svg) + + + + + + + +![Bee icon](images/ecosystem/bee.svg) + + + + + + +## Conversational UX + +The IBM Natural Conversation Framework is for anyone designing or building +conversational agents. It provides design principles, interaction patterns, and +working code for the basic mechanics of natural conversation. + +_This content is accessible to IBMers only._ + + + + + +![Chatbot icon](images/ecosystem/chat-bot.svg) + + + + + diff --git a/src/pages/all-about-carbon/what-is-carbon.mdx b/src/pages/all-about-carbon/what-is-carbon.mdx index 4965612a602..9246ca4c6ae 100755 --- a/src/pages/all-about-carbon/what-is-carbon.mdx +++ b/src/pages/all-about-carbon/what-is-carbon.mdx @@ -15,31 +15,41 @@ community of contributors. -## Welcome - -As IBM's official design system, Carbon serves a wide range of designers and -developers building digital products and experiences. - -Carbon is funded and built by IBM. Although that means we build for the -company's business needs, it also means we have a brilliant team of engineers -and designers working full time to make Carbon better. It is maintained by a -core team of designers, developers, and writers based in the Austin, Texas IBM -Design Studio. - -The goals of the design system include improving UI consistency and quality, -making the design and development process more efficient and focused, -establishing a shared vocabulary between designer and developer, and providing -clear, discoverable guidance around design and development best practices. - -The design system is built [React](/developing/frameworks/react) first. We also -support core parts of the system in -[vanilla JS](/developing/frameworks/vanilla), -[Angular](/developing/frameworks/angular), [Vue](/developing/frameworks/vue), -and [Svelte](/developing/frameworks/svelte). If you’re using a different -framework, you can still build components by following our guidelines for -[other frameworks](/developing/frameworks/other-frameworks). + + +Overview +How Carbon works +Carbon compliance at IBM +Contact us + + + +## Overview + +A design system is a collection of pre-built, reusable assets—components, +patterns, guidance, and code—that allows its users to build consistent digital +experiences faster. + +By using the pre-built and universal assets of Carbon, the time teams spend +designing and building is minimized. Instead of building and re-building basic +elements, they can spend that time customizing their products to address +specific client use cases. + +### Carbon is open source -## Guiding principles +Carbon is funded and built by IBM, which means we build for the company’s +business needs, but we’ve made it open source for anyone to use and contribute +back to. + +While being primarily open source, Carbon also serves various parts of the IBM +business that follow an inner source model. + +## How Carbon works + +The Carbon team is committed to helping members of the community be successful +in adoption and their use of Carbon assets. + +### Our guiding principles **Carbon is open.** The design system is a distributed effort, guided by the principles of the @@ -59,3 +69,68 @@ desires, Carbon is laser-focused on real people. **Carbon builds consistency.** Based on the IBM Design Language, every element and component of Carbon was designed from the ground up to work elegantly together to ensure consistent, cohesive user experiences. + +### We maintain assets + +**Carbon maintains design kits containing Carbon components.** We offer and +maintain design kits in [Sketch](/designing/kits/sketch) and +[Adobe XD](/designing/kits/adobe-xd). We also have an +[Axure](/designing/kits/axure) kit, maintained by the community. + +**Carbon supports multiple code implementations.** These reflect the +production-level design libraries. The frameworks are listed below with their +primary maintainers: + +- [React](https://github.com/carbon-design-system/carbon): Carbon team +- [CSS/Vanilla](https://github.com/carbon-design-system/carbon): Carbon team +- [Angular](https://angular.carbondesignsystem.com/): Community maintained +- [Vue](https://github.com/carbon-design-system/carbon-components-vue): + Community maintained +- [Svelte](https://github.com/ibm/carbon-components-svelte): Community + maintained + +If you’re using a different framework, you can still build components by +following our guidelines for +[other frameworks](/developing/frameworks/other-frameworks). + +**Design patterns are harvested from products built with Carbon.** These become +part of the design system. Teams can use these well-defined patterns in their +work and contribute patterns back to the system. + +### We support adoption + +**We conduct training classes, run meetups, and offer certifications.** We offer +tutorials in Angular, React, and Vue. We run [meetups](/whats-happening/meetups) +and design reviews on a regular basis. We're also available to teach at +conferences, bootcamp labs, and wherever else we’re needed. + +**We engage the community.** We strive to be one of the world’s best design +systems and we’re +always [open to feedback](https://github.com/carbon-design-system/carbon-website/issues/new?assignees=&labels=feedback&template=feedback.md&title=). +We communicate with you about Carbon’s state and roadmap through GitHub support, +blog posts, and Twitter. + +**Contributed components and patterns include a list of maintainers.** The +Carbon team triages and supports maintenance requests that do not have a +maintainer. + +**We provide support for users of the design system.** The Carbon team engages +with users primarily through GitHub. A member of the Carbon team responds to all +issues and pull requests. + +## Carbon compliance at IBM + +Carbon compliance by the IBM community is critically important to the IBM brand. +Carbon is the digital expression of the IBM brand and the chassis upon which all +products and digital experiences are built. It is the foundation for every +digital experience people have throughout their relationship with IBM. + +Making delightful user experiences rooted in human-centered design, high-quality +design standards, and the IBM brand ensures we deliver consistency and +excellence to our users, and build a brand that people love across the entire +product line. + +## Contact us + +Have questions? Found a bug? Learn where to go and what to do by visiting +the [Contact us page](https://carbondesignsystem.com/help/contact-us). diff --git a/src/pages/all-about-carbon/who-uses-carbon.mdx b/src/pages/all-about-carbon/who-uses-carbon.mdx new file mode 100755 index 00000000000..5907e458a28 --- /dev/null +++ b/src/pages/all-about-carbon/who-uses-carbon.mdx @@ -0,0 +1,308 @@ +--- +title: Who uses Carbon? +description: + Carbon is for all members of a cross-functional product team—designers, + developers, marketers and offering managers. Every point along a user's + journey needs to feel part of a holistic, branded experience—that's where + Carbon comes in. +--- + + + +Carbon is for each and every member of a cross-functional team—designers, +developers, marketers and offering managers. Every point along a user's journey +needs to feel part of a holistic, branded experience and that's where Carbon +comes in. + + + + + +Designers +Developers +Marketers +Product managers +Sales +Support + + + +## Overview + +Carbon provides the building blocks that allow product teams to build +consistent, branded solutions to complex problems. Let's look at how different +team members use Carbon, what the benefits are, and how you can get started. + +## Designers + +Designers are passionate advocates for users, and Carbon helps them provide +value to our users with accessible, fully-tested assets and guidance that +designers can rely on to create cohesive experiences that are in line with other +business units. + +### How Carbon helps designers + +Carbon supports designers with the tools to build excellent experiences for our +users that are consistent, delightful, and thoughtful. Designers can quickly +create tailored solutions for our clients, drawing on Carbon's reusable kit of +parts. This saves valuable time that can be spent on innovating new solutions. + +In addition, Carbon enables product and .com designers across the organization +to explore and deliver the full potential of a design, leveraging the work of +other teams where possible, avoiding redesign and duplication of efforts, +keeping the focus on the distinct client use cases. + +### How designers can engage with Carbon + +Here are some ways designers can begin engaging with Carbon. + +#### Learn the system + +- Familiarize yourself with the Carbon + [foundational elements](/guidelines/2x-grid/overview), their usage + documentation, and the system's + [design principles](https://www.ibm.com/design/language/). + +- Familiarize yourself with usage and style guidance for all of Carbon's + [components](https://www.carbondesignsystem.com/components/overview/) and + [patterns](https://www.carbondesignsystem.com/patterns/overview/). + +- Check out + [design tutorials](https://www.carbondesignsystem.com/designing/tutorials/) to + learn more about some of the foundational pieces of the design system. + +#### Get the tools + +- Visit + [Designing > Getting Started](https://www.carbondesignsystem.com/designing/get-started/) + on the Carbon website and install the design kits. + +- Visit the + [Other Resources](https://www.carbondesignsystem.com/designing/design-resources/) + page on the Carbon website to find other useful tools and kit extensions like + the Mobile Sketch kit and the Master Data Visualization file. + +#### Connect with the team + +- Find [meetups](https://www.carbondesignsystem.com/whats-happening/meetups/) + for leveling up your skills, connecting with your peers, and getting reviews + on work in progress. + +- If you're confused or if you've spotted an inconsistency, reach out on our IBM + Slack channels. At this time, the Slack channels are for IBMers only. + + - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) + - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) + +- Make a + [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) + when you find a bug or want to request a feature. + +#### Keep up with the latest + +- Stay up to date with Carbon's + [roadmap and releases](https://www.carbondesignsystem.com/whats-happening/releases/). + +- Keep your eye on the + [Work in progress](https://www.carbondesignsystem.com/whats-happening/work-in-progress/) + section for new resources that are currently being worked on. + +#### Contribute back to Carbon + +- [Contribute](https://www.carbondesignsystem.com/contributing/overview/) + component and/or pattern enhancements, or create new assets, stewarded by the + Carbon team. + +- Author usage documentation for + [patterns](https://www.carbondesignsystem.com/contributing/pattern/) and + [components](https://www.carbondesignsystem.com/contributing/component/). + +- Create tooling, especially as related to design kits in various frameworks. + +- Explore scalable system logic such as token additions or inline theming. + +- Connect with the Carbon team to share work in progress and assess its + suitability for universal guidance. + +## Developers + +Carbon provides developers with the tools they need to build more product in +less time, while saving them from the mind-numbing work of creating the same +base components over and over again. + +### How Carbon helps developers + +By leveraging Carbon's pre-built assets, developers free themselves (and their +backlogs) up to do the innovative work that inspires them and ultimately +elevates the user experience for our clients. + +Developers can create products that are cohesive with other business +units—high-quality, consistent, and robust front-end experiences that share the +IBM brand. + +### How developers can engage with Carbon + +Here are some ways developers can begin engaging with Carbon. + +#### Learn the system + +- Familiarize yourself with the + [Carbon foundational elements](https://www.carbondesignsystem.com/guidelines/2x-grid/overview/), + their usage documentation and the system's + [design principles](https://www.ibm.com/design/language/). + +- Check out a tutorial in your framework of choice + ([React](https://www.carbondesignsystem.com/developing/react-tutorial/overview/), + [Angular](https://www.carbondesignsystem.com/developing/angular-tutorial/overview/) + or + [Vue](https://www.carbondesignsystem.com/developing/vue-tutorial/overview/)) + and get your Developer Essentials badge. + +#### Get the tools + +- Visit + [Developing > Getting Started](https://www.carbondesignsystem.com/developing/get-started/) + on the Carbon website and install your framework of choice. + +- Visit + [Developer resources](https://www.carbondesignsystem.com/developing/dev-resources/) + to find Carbon tools, as well as our GitHub repos and Storybooks for your + framework of choice. + +#### Connect with the team + +- Find [meetups](https://www.carbondesignsystem.com/whats-happening/meetups/) + for leveling up your skills, connecting with your peers, and getting reviews + on work in progress. + +- If you're confused or if you've spotted an inconsistency, reach out on our IBM + Slack channels. At this time, the Slack channels are for IBMers only. + + - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) + - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) + - [#carbon-react](https://ibm-studios.slack.com/archives/C2K6RFJ1G) + - [#carbon-ng](https://ibm-studios.slack.com/archives/CBZC0LM2N) + - [#carbon-vue](https://ibm-studios.slack.com/archives/CAM5P6NR1) + - [#carbon-web-components](https://ibm-studios.slack.com/archives/CL83LMKSA) + - [#carbon-tutorial](https://ibm-studios.slack.com/archives/CJUGA7P6H) + +- Make a + [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) + when you find a bug or want to request a feature. + +#### Keep up with the latest + +- Stay up-to-date with Carbon's + [roadmap and releases](https://www.carbondesignsystem.com/whats-happening/releases/). + +- Keep your eye on the + [Work in progress](https://www.carbondesignsystem.com/whats-happening/work-in-progress/) + section for new resources that are currently being worked on. + +#### Contribute back to Carbon + +- [Contribute](https://www.carbondesignsystem.com/contributing/overview) + component and pattern enhancements or create new assets, stewarded by the + Carbon team. + +- Author developer documentation for patterns and components. + +- Create any relevant tooling to help developers within your PAL community or + the wider community build more efficiently with Carbon. + +- As you learn and grow give back to the community in the support channels. + +## Marketers + +Carbon allows teams to build excellent experiences that differentiate IBM from +the competition. + +Products and experiences built with Carbon provide an interoperability of +experience and visuals across products. More complex multiproduct stories are +easier to tell when product experiences are in lock step. + +Here are some ways marketers can begin engaging with Carbon: + +- Visit [IBM Brand Center](https://www.ibm.com/brand) to learn more about + foundational brand compliance, as well as for the hero brand systems that + drive IBM's portfolio of products and experiences. + +- The majority of marketing experiences use Carbon web components. Visit + [Carbon for ibm.com](https://www.ibm.com/standards/web/carbon-for-ibm-dotcom/) + to ensure that these experiences are adhering to Carbon guidance. + +- Familiarize yourself with + [ibm.com web standards](https://www.ibm.com/standards/web/) to assess the + legal compliance of your experience. + +- Make sure all digital experiences by third parties meet IBM-A accessibility + requirements: + + - [Marketing materials](https://www.ibm.com/able/toolkit/launch/readiness#marketing-materials) + - [Supplier and Partnership Accessibility Requirements and Process](http://ibm.biz/SupplierAccessibility) + - [Accessibility guidelines for suppliers](http://blob:https//www.ibm.com/c4c955b3-b746-c74c-86de-c852f7f1462a) + + ## Product managers + +Carbon accelerates team productivity and time to market. It improves business +outcomes such as increased lifetime value, revenue, NPS, and decreased churn. +Teams using Carbon have also won awards in both the +[product](https://pages.github.ibm.com/cdai-design/awards) and the +[digital](https://medium.com/design-ibm/ibm-cloud-app-id-and-assist-me-win-indigo-design-awards-47600197f780) +realms. + +Here are some ways product managers can begin engaging with Carbon: + +- Stay current with Carbon's + [releases and roadmap](https://www.carbondesignsystem.com/whats-happening/releases/) + to prioritize upgrading Carbon (new assets, upstream fixes, designer/developer + workflow improvements, tooling enhancements, etc.) vs. allowing time towards + product features and fixes. + +- Provide the Carbon team with adoption and migration feedback, as well as + measured product performance with regard to Carbon, providing a healthy + collaboration loop. You can find + [migration worksheets and other resources here](https://pages.github.ibm.com/cdai-design/dux/). + +## Sales + +Multiproduct stories are easier to tell and sell when product experiences work +together seamlessly. Suites of products built on the same foundation, that have +the same interactions are a dream to demo. + +Carbon also extends +[IBM iX's capabilities,](https://blog.adobe.com/en/publish/2019/11/04/adobe-and-ibm-ix-extend-partnership-to-help-enterprises-design-powerful-and-consistent-customer-experiences.html#gs.101gaxd) +allowing iX customers to implement and customize Carbon, showcasing it's +adaptability as a white-label design system. + +Here are some ways people in sales can begin engaging with Carbon: + +- Consultants who are selling digital solutions to clients should understand the + benefits of Carbon for rapid prototyping, demo'ing and building. + +- Our IBM consultants are the champions of third party Carbon use. Carbon looks + to them for the following: + - Creating case studies that highlight the effective use and benefits of + Carbon. + - Providing information about gaps in third party capabilities, as well as + prioritized client requests. + +## Support + +Product experiences that are built on the same foundation and work together +seamlessly to reduce cognitive load for users, thereby reducing user errors and +questions, and significantly reducing the need for support. + +Consistent experiences also result in less need for extensive training and +onboarding resources; learning can be leveraged across multiple spaces. + +Here are some ways people in support roles can begin engaging with Carbon: + +- Make a + [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) + to report bugs or address gaps. + +- Report issues in these primary support Slack channels: + - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) + - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) + - [#carbon-react](https://ibm-studios.slack.com/archives/C2K6RFJ1G) diff --git a/src/pages/all-about-carbon/why-use-carbon copy.mdx b/src/pages/all-about-carbon/why-use-carbon copy.mdx new file mode 100755 index 00000000000..f3bc4c42a3d --- /dev/null +++ b/src/pages/all-about-carbon/why-use-carbon copy.mdx @@ -0,0 +1,259 @@ +--- +title: Why use Carbon? +description: + Carbon is for every member of a cross-functional product team—designers, + developers, marketers and offering managers. The complexity of what we build + means we work across multiple teams, disciplines, and functions to deliver a + full experience to our users. very point along a user's journey needs to feel + part of a holistic, branded experience—that's where Carbon comes in. +--- + + + +Carbon is for every member of a cross-functional product team—designers, +developers, marketers and offering managers. The complexity of what we build +means we work across multiple teams, disciplines, and functions to deliver a +full experience to our users. + +Every point along a user's journey needs to feel part of a holistic, branded +experience—that's where Carbon comes in. + + + +## Designers + +Designers are passionate advocates for users, and Carbon helps them provide +value to our users with accessible, fully-tested assets and guidance that +designers can rely on to create cohesive experiences that are in line with other +business units. + +- Carbon helps designers build excellent experiences for our users that are + consistent, delightful, and thoughtful. +- Carbon allows designers to quickly create tailored solutions for our clients, + drawing on Carbon's reusable kit of parts. This saves valuable time that can + be spent on innovating new solutions. +- Carbon enables product and .com designers across the organization to explore + and deliver the full potential of a design, leveraging the work of other teams + where possible, avoiding redesign and duplication of efforts, keeping the + focus on the distinct client use cases. + +### Designer checklist for Carbon + +- Familiarize yourself with the Carbon + [foundational elements](/guidelines/2x-grid/overview), their usage + documentation, and the system's + [design principles](https://www.ibm.com/design/language/). + +- Visit + [Designing > Getting Started](https://www.carbondesignsystem.com/designing/get-started/) + on the Carbon website and install the design kits. + +- Visit the + [Other Resources](https://www.carbondesignsystem.com/designing/design-resources/) + page on the Carbon website to find other useful tools and kit extensions like + the Mobile Sketch kit and the Master Data Visualization file. + +- If confused about the system or if you've spotted an inconsistency, bring it + to the Carbon team's attention on our IBM Slack channels. At this time, the + Slack channels are for IBMers only. + + - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) + - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) + +- Make a + [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) + when you find a bug or want to request a feature. + +- Keep your eye on the + [Work in progress](https://www.carbondesignsystem.com/whats-happening/work-in-progress/) + section for new resources that are currently being worked on. + +- Check out + [design tutorials](https://www.carbondesignsystem.com/designing/tutorials/) to + learn more about some of the foundational pieces of the design system. + +- Find [meetups](https://www.carbondesignsystem.com/whats-happening/meetups/) + for leveling up your skills, connecting with your peers, and getting reviews + on work in progress. + +- Familiarize yourself with usage and style guidance for all of Carbon's + [components](https://www.carbondesignsystem.com/components/overview/) and + [patterns](https://www.carbondesignsystem.com/patterns/overview/). + +- [Contribute](https://www.carbondesignsystem.com/contributing/overview/) back + to the system: + + - Design component and/or pattern enhancements, or create new assets stewarded + by the Carbon team. + - Author usage documentation for + [patterns](https://www.carbondesignsystem.com/contributing/pattern/) and + [components](https://www.carbondesignsystem.com/contributing/component/). + - Create tooling especially as related to design kits in various frameworks. + - Explore scalable system logic such as token additions, or inline theming. + - Connect with the Carbon team to share work in progress and assess its + suitability for universal guidance. + +## Developers + +Carbon provides developers with the tools they need to build more product in +less time, while saving them from the mind-numbing work of creating the same +base components over and over again. + +- By leveraging Carbon's pre-built assets, developers free themselves (and their + backlogs) up to do the innovative work that inspires them and ultimately + elevates the user experience for our clients. +- Developers can create products that are cohesive with other business + units—high-quality, consistent, and robust front-end experiences that share + the IBM brand. + +### Developer checklist for Carbon + +- Familiarize yourself with the + [Carbon foundational elements](https://www.carbondesignsystem.com/guidelines/2x-grid/overview/), + their usage documentation and the system's + [design principles](https://www.ibm.com/design/language/). + +- Visit + [Developing > Getting Started](https://www.carbondesignsystem.com/developing/get-started/) + on the Carbon website and install your framework of choice. + +- Visit + [Developer resources](https://www.carbondesignsystem.com/developing/dev-resources/) + to find Carbon tools, as well as our GitHub repos and Storybooks for your + framework of choice. + +- Make a + [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) + when you find a bug or want to request a feature. + +- Check out a tutorial in your framework of choice + ([React](https://www.carbondesignsystem.com/developing/react-tutorial/overview/), + [Angular](https://www.carbondesignsystem.com/developing/angular-tutorial/overview/) + or + [Vue](https://www.carbondesignsystem.com/developing/vue-tutorial/overview/)) + and get your Developer Essentials badge. + +- Find [meetups](https://www.carbondesignsystem.com/whats-happening/meetups/) + for leveling up your skills, connecting with your peers, and getting reviews + on work in progress. + +- If confused about the system or if you've spotted an inconsistency bring it to + the Carbon team's attention on our Slack channels. At this time, these Slack + channels are for IBMers only. + + - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) + - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) + - [#carbon-react](https://ibm-studios.slack.com/archives/C2K6RFJ1G) + - [#carbon-ng](https://ibm-studios.slack.com/archives/CBZC0LM2N) + - [#carbon-vue](https://ibm-studios.slack.com/archives/CAM5P6NR1) + - [#carbon-web-components](https://ibm-studios.slack.com/archives/CL83LMKSA) + - [#carbon-tutorial](https://ibm-studios.slack.com/archives/CJUGA7P6H) + +- [Contribute](https://www.carbondesignsystem.com/contributing/overview) back to + the system: + + - Develop component and pattern enhancements or create new assets, stewarded + by the Carbon team. + - Author developer documentation for patterns and components. + - Create any relevant tooling to help developers within your PAL community or + the wider community build more efficiently with Carbon + - As you learn and grow give back to the community in the support channels. + +- Stay up-to-date with Carbon's + [roadmap and releases](https://www.carbondesignsystem.com/whats-happening/releases/). + +## Marketers + +Carbon allows teams to build excellent experiences that differentiate IBM from +the competition. + +Products and experiences built with Carbon provide an interoperability of +experience and visuals across products. More complex multiproduct stories are +easier to tell when product experiences are in lock step. + +### Marketers checklist for Carbon + +- Visit [IBM Brand Center](https://www.ibm.com/brand) to learn more about + foundational brand compliance, as well as for the hero brand systems that + drive IBM's portfolio of products and experiences. + +- The majority of marketing experiences use Carbon web components. Visit + [Carbon for ibm.com](https://www.ibm.com/standards/web/carbon-for-ibm-dotcom/) + to ensure that these experiences are adhering to Carbon guidance. + +- Familiarize yourself with + [ibm.com web standards](https://www.ibm.com/standards/web/) to assess the + legal compliance of your experience. + +- Make sure all digital experiences by third parties meet IBM-A accessibility + requirements: + + - [Marketing materials](https://www.ibm.com/able/toolkit/launch/readiness#marketing-materials) + - [Supplier and Partnership Accessibility Requirements and Process](http://ibm.biz/SupplierAccessibility) + - [Accessibility guidelines for suppliers](http://blob:https//www.ibm.com/c4c955b3-b746-c74c-86de-c852f7f1462a) + + ## Product managers + +Carbon improves business outcomes (increased lifetime value, revenue, NPS & +decreased churn) and wins awards in both the +[product](https://pages.github.ibm.com/cdai-design/awards) and the +[digital](https://medium.com/design-ibm/ibm-cloud-app-id-and-assist-me-win-indigo-design-awards-47600197f780) +realms. + +Carbon accelerates team productivity and time-to-market. + +### Product manager checklist for Carbon + +- Stay current with Carbon's + [releases and roadmap](https://www.carbondesignsystem.com/whats-happening/releases/) + to prioritize upgrading Carbon (new assets, upstream fixes, designer/developer + workflow improvements, tooling enhancements, etc.) vs. allowing time towards + product features and fixes. + +- Provide the Carbon team with adoption and migration feedback, as well as + measured product performance with regard to Carbon, providing a healthy + collaboration loop. You can find + [migration worksheets and other resources here](https://pages.github.ibm.com/cdai-design/dux/). + +## Sales + +Multiproduct stories are easier to tell and sell when product experiences work +together seamlessly. Suites of products built on the same foundation, that have +the same interactions are a dream to demo. + +Carbon also extends +[IBM iX's capabilities,](https://blog.adobe.com/en/publish/2019/11/04/adobe-and-ibm-ix-extend-partnership-to-help-enterprises-design-powerful-and-consistent-customer-experiences.html#gs.101gaxd) +allowing iX customers to implement and customize Carbon, showcasing it's +adaptability as a white-label design system. + +### Sales checklist for Carbon + +- Consultants who are selling digital solutions to clients should understand the + benefits of Carbon for rapid prototyping, demo'ing and building. + +- Our IBM consultants are the champions of third party Carbon use. Carbon looks + to them for the following: + - Creating case studies that highlight the effective use and benefits of + Carbon. + - Providing information about gaps in third party capabilities, as well as + prioritized client requests. + +## Support + +Product experiences that are built on the same foundation and work together +seamlessly to reduce cognitive load for users, thereby reducing user errors and +questions, and significantly reducing the need for support. + +Consistent experiences also result in less need for extensive training and +onboarding resources; learning can be leveraged across multiple spaces. + +### Support checklist for Carbon + +- Make a + [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) + to report bugs or address gaps. + +- Report issues in these primary support Slack channels: + - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) + - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) + - [#carbon-react](https://ibm-studios.slack.com/archives/C2K6RFJ1G) diff --git a/src/pages/designing/get-started.mdx b/src/pages/designing/get-started.mdx index f8868371516..6e6c7674815 100644 --- a/src/pages/designing/get-started.mdx +++ b/src/pages/designing/get-started.mdx @@ -121,3 +121,9 @@ your success. If there’s something in particular you’re interested in, we’d love to [hear from you](https://github.com/carbon-design-system/carbon-website/issues/new/choose). + +### Learn about the benefits + +Learn more about the +[benefits of using Carbon](/all-about-carbon/who-uses-carbon/) as a designer, +and how Carbon benefits all members of a product team. diff --git a/src/pages/developing/get-started.mdx b/src/pages/developing/get-started.mdx index b650640b324..638a19f3969 100644 --- a/src/pages/developing/get-started.mdx +++ b/src/pages/developing/get-started.mdx @@ -113,3 +113,9 @@ You can find out about Carbon's latest changes and future plans on the [Releases](/whats-happening/releases) page. If you have questions, here are all the ways to [contact us](/help/contact-us). + +### Learn about the benefits + +Learn more about the +[benefits of using Carbon](/all-about-carbon/who-uses-carbon/) as a developer, +and how Carbon benefits all members of a product team. From 08781f96cad0d329125c10ccb326ed2abc0d515f Mon Sep 17 00:00:00 2001 From: Jan Child Date: Thu, 20 May 2021 17:35:28 -0500 Subject: [PATCH 2/9] update to the team page --- src/pages/all-about-carbon/the-team.mdx | 5 ----- 1 file changed, 5 deletions(-) diff --git a/src/pages/all-about-carbon/the-team.mdx b/src/pages/all-about-carbon/the-team.mdx index 542ea9041ae..778008c3419 100644 --- a/src/pages/all-about-carbon/the-team.mdx +++ b/src/pages/all-about-carbon/the-team.mdx @@ -37,11 +37,6 @@ design and build with them. ![Andrea Cardona headshot](/images/team/cardona_andrea.png) - - - -![Jan Child headshot](/images/team/child_jan.png) - From 175b407954ffdab1e3436c9bfa4267f9687029b5 Mon Sep 17 00:00:00 2001 From: Jan Child Date: Thu, 20 May 2021 17:57:08 -0500 Subject: [PATCH 3/9] copyediting pass --- .../all-about-carbon/who-uses-carbon.mdx | 121 ++++++++---------- 1 file changed, 54 insertions(+), 67 deletions(-) diff --git a/src/pages/all-about-carbon/who-uses-carbon.mdx b/src/pages/all-about-carbon/who-uses-carbon.mdx index 5907e458a28..48081fd4c9d 100755 --- a/src/pages/all-about-carbon/who-uses-carbon.mdx +++ b/src/pages/all-about-carbon/who-uses-carbon.mdx @@ -64,29 +64,24 @@ Here are some ways designers can begin engaging with Carbon. [design principles](https://www.ibm.com/design/language/). - Familiarize yourself with usage and style guidance for all of Carbon's - [components](https://www.carbondesignsystem.com/components/overview/) and - [patterns](https://www.carbondesignsystem.com/patterns/overview/). + [components](/components/overview/) and [patterns](/patterns/overview/). -- Check out - [design tutorials](https://www.carbondesignsystem.com/designing/tutorials/) to - learn more about some of the foundational pieces of the design system. +- Check out [design tutorials](/designing/tutorials/) to learn more about some + of the foundational pieces of the design system. #### Get the tools -- Visit - [Designing > Getting Started](https://www.carbondesignsystem.com/designing/get-started/) - on the Carbon website and install the design kits. +- Visit [Designing > Getting Started](/designing/get-started/) on the Carbon + website and install the design kits. -- Visit the - [Other Resources](https://www.carbondesignsystem.com/designing/design-resources/) - page on the Carbon website to find other useful tools and kit extensions like - the Mobile Sketch kit and the Master Data Visualization file. +- Visit the [Other Resources](/designing/design-resources/) page on the Carbon + website to find other useful tools and kit extensions like the Mobile Sketch + kit and the Master Data Visualization file. #### Connect with the team -- Find [meetups](https://www.carbondesignsystem.com/whats-happening/meetups/) - for leveling up your skills, connecting with your peers, and getting reviews - on work in progress. +- Find [meetups](/whats-happening/meetups/) for leveling up your skills, + connecting with your peers, and getting reviews on work in progress. - If you're confused or if you've spotted an inconsistency, reach out on our IBM Slack channels. At this time, the Slack channels are for IBMers only. @@ -94,28 +89,24 @@ Here are some ways designers can begin engaging with Carbon. - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) -- Make a - [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) - when you find a bug or want to request a feature. +- Make a [Github issue](/contributing/bugs-and-requests/) when you find a bug or + want to request a feature. #### Keep up with the latest - Stay up to date with Carbon's - [roadmap and releases](https://www.carbondesignsystem.com/whats-happening/releases/). + [roadmap and releases](/whats-happening/releases/). -- Keep your eye on the - [Work in progress](https://www.carbondesignsystem.com/whats-happening/work-in-progress/) +- Keep your eye on the [Work in progress](/whats-happening/work-in-progress/) section for new resources that are currently being worked on. #### Contribute back to Carbon -- [Contribute](https://www.carbondesignsystem.com/contributing/overview/) - component and/or pattern enhancements, or create new assets, stewarded by the - Carbon team. +- [Contribute](/contributing/overview/) component and/or pattern enhancements, + or create new assets, stewarded by the Carbon team. -- Author usage documentation for - [patterns](https://www.carbondesignsystem.com/contributing/pattern/) and - [components](https://www.carbondesignsystem.com/contributing/component/). +- Author usage documentation for [patterns](/contributing/pattern/) and + [components](/contributing/component/). - Create tooling, especially as related to design kits in various frameworks. @@ -147,33 +138,28 @@ Here are some ways developers can begin engaging with Carbon. #### Learn the system - Familiarize yourself with the - [Carbon foundational elements](https://www.carbondesignsystem.com/guidelines/2x-grid/overview/), - their usage documentation and the system's + [Carbon foundational elements](/guidelines/2x-grid/overview/), the usage + documentation, and the system's [design principles](https://www.ibm.com/design/language/). - Check out a tutorial in your framework of choice - ([React](https://www.carbondesignsystem.com/developing/react-tutorial/overview/), - [Angular](https://www.carbondesignsystem.com/developing/angular-tutorial/overview/) - or - [Vue](https://www.carbondesignsystem.com/developing/vue-tutorial/overview/)) - and get your Developer Essentials badge. + ([React](/developing/react-tutorial/overview/), + [Angular](/developing/angular-tutorial/overview/) or + [Vue](/developing/vue-tutorial/overview/)) and get your Developer Essentials + badge. #### Get the tools -- Visit - [Developing > Getting Started](https://www.carbondesignsystem.com/developing/get-started/) - on the Carbon website and install your framework of choice. +- Visit [Developing > Getting Started](/developing/get-started/) on the Carbon + website and install your framework of choice. -- Visit - [Developer resources](https://www.carbondesignsystem.com/developing/dev-resources/) - to find Carbon tools, as well as our GitHub repos and Storybooks for your - framework of choice. +- Visit [Developer resources](/developing/dev-resources/) to find Carbon tools, + as well as our GitHub repos and Storybooks for your framework of choice. #### Connect with the team -- Find [meetups](https://www.carbondesignsystem.com/whats-happening/meetups/) - for leveling up your skills, connecting with your peers, and getting reviews - on work in progress. +- Find [meetups](/whats-happening/meetups/) for leveling up your skills, + connecting with your peers, and getting reviews on work in progress. - If you're confused or if you've spotted an inconsistency, reach out on our IBM Slack channels. At this time, the Slack channels are for IBMers only. @@ -186,24 +172,21 @@ Here are some ways developers can begin engaging with Carbon. - [#carbon-web-components](https://ibm-studios.slack.com/archives/CL83LMKSA) - [#carbon-tutorial](https://ibm-studios.slack.com/archives/CJUGA7P6H) -- Make a - [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) - when you find a bug or want to request a feature. +- Make a [Github issue](/contributing/bugs-and-requests/) when you find a bug or + want to request a feature. #### Keep up with the latest -- Stay up-to-date with Carbon's - [roadmap and releases](https://www.carbondesignsystem.com/whats-happening/releases/). +- Stay up to date with Carbon's + [roadmap and releases](/whats-happening/releases/). -- Keep your eye on the - [Work in progress](https://www.carbondesignsystem.com/whats-happening/work-in-progress/) +- Keep your eye on the [Work in progress](/whats-happening/work-in-progress/) section for new resources that are currently being worked on. #### Contribute back to Carbon -- [Contribute](https://www.carbondesignsystem.com/contributing/overview) - component and pattern enhancements or create new assets, stewarded by the - Carbon team. +- [Contribute](/contributing/overview) component and pattern enhancements or + create new assets, stewarded by the Carbon team. - Author developer documentation for patterns and components. @@ -242,7 +225,7 @@ Here are some ways marketers can begin engaging with Carbon: - [Supplier and Partnership Accessibility Requirements and Process](http://ibm.biz/SupplierAccessibility) - [Accessibility guidelines for suppliers](http://blob:https//www.ibm.com/c4c955b3-b746-c74c-86de-c852f7f1462a) - ## Product managers +## Product managers Carbon accelerates team productivity and time to market. It improves business outcomes such as increased lifetime value, revenue, NPS, and decreased churn. @@ -253,16 +236,14 @@ realms. Here are some ways product managers can begin engaging with Carbon: -- Stay current with Carbon's - [releases and roadmap](https://www.carbondesignsystem.com/whats-happening/releases/) - to prioritize upgrading Carbon (new assets, upstream fixes, designer/developer - workflow improvements, tooling enhancements, etc.) vs. allowing time towards - product features and fixes. +- Stay current with Carbon's [releases and roadmap](/whats-happening/releases/) + to prioritize upgrading Carbon's new assets, upstream fixes, + designer/developer workflow improvements, and tooling enhancements. - Provide the Carbon team with adoption and migration feedback, as well as measured product performance with regard to Carbon, providing a healthy - collaboration loop. You can find - [migration worksheets and other resources here](https://pages.github.ibm.com/cdai-design/dux/). + collaboration loop. Here are some + [migration worksheets and other resources](https://pages.github.ibm.com/cdai-design/dux/). ## Sales @@ -271,8 +252,8 @@ together seamlessly. Suites of products built on the same foundation, that have the same interactions are a dream to demo. Carbon also extends -[IBM iX's capabilities,](https://blog.adobe.com/en/publish/2019/11/04/adobe-and-ibm-ix-extend-partnership-to-help-enterprises-design-powerful-and-consistent-customer-experiences.html#gs.101gaxd) -allowing iX customers to implement and customize Carbon, showcasing it's +[IBM iX's capabilities](https://blog.adobe.com/en/publish/2019/11/04/adobe-and-ibm-ix-extend-partnership-to-help-enterprises-design-powerful-and-consistent-customer-experiences.html#gs.101gaxd), +allowing iX customers to implement and customize Carbon, showcasing its adaptability as a white-label design system. Here are some ways people in sales can begin engaging with Carbon: @@ -282,11 +263,15 @@ Here are some ways people in sales can begin engaging with Carbon: - Our IBM consultants are the champions of third party Carbon use. Carbon looks to them for the following: + - Creating case studies that highlight the effective use and benefits of Carbon. - Providing information about gaps in third party capabilities, as well as prioritized client requests. +- Stay up to date with Carbon's + [roadmap and releases](/whats-happening/releases/). + ## Support Product experiences that are built on the same foundation and work together @@ -298,9 +283,11 @@ onboarding resources; learning can be leveraged across multiple spaces. Here are some ways people in support roles can begin engaging with Carbon: -- Make a - [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) - to report bugs or address gaps. +- Stay up to date with Carbon's + [roadmap and releases](/whats-happening/releases/). + +- Make a [Github issue](/contributing/bugs-and-requests/) to report bugs or + address gaps. - Report issues in these primary support Slack channels: - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) From ac35e85cdbb6374060ded3074070386bb585c788 Mon Sep 17 00:00:00 2001 From: Jan Child <44503588+janchild@users.noreply.github.com> Date: Fri, 21 May 2021 10:00:06 -0500 Subject: [PATCH 4/9] Update src/pages/all-about-carbon/who-uses-carbon.mdx Co-authored-by: emyarod --- src/pages/all-about-carbon/who-uses-carbon.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/all-about-carbon/who-uses-carbon.mdx b/src/pages/all-about-carbon/who-uses-carbon.mdx index 48081fd4c9d..4a984e3e3ed 100755 --- a/src/pages/all-about-carbon/who-uses-carbon.mdx +++ b/src/pages/all-about-carbon/who-uses-carbon.mdx @@ -89,7 +89,7 @@ Here are some ways designers can begin engaging with Carbon. - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) -- Make a [Github issue](/contributing/bugs-and-requests/) when you find a bug or +- Make a [GitHub issue](/contributing/bugs-and-requests/) when you find a bug or want to request a feature. #### Keep up with the latest From c92c413f35af3a5ef94b9dc52fdfe92668bb42ca Mon Sep 17 00:00:00 2001 From: Jan Child <44503588+janchild@users.noreply.github.com> Date: Fri, 21 May 2021 10:00:20 -0500 Subject: [PATCH 5/9] Update src/pages/all-about-carbon/who-uses-carbon.mdx Co-authored-by: emyarod --- src/pages/all-about-carbon/who-uses-carbon.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/all-about-carbon/who-uses-carbon.mdx b/src/pages/all-about-carbon/who-uses-carbon.mdx index 4a984e3e3ed..d0cd8aceb7c 100755 --- a/src/pages/all-about-carbon/who-uses-carbon.mdx +++ b/src/pages/all-about-carbon/who-uses-carbon.mdx @@ -211,7 +211,7 @@ Here are some ways marketers can begin engaging with Carbon: drive IBM's portfolio of products and experiences. - The majority of marketing experiences use Carbon web components. Visit - [Carbon for ibm.com](https://www.ibm.com/standards/web/carbon-for-ibm-dotcom/) + [Carbon for IBM.com](https://www.ibm.com/standards/web/carbon-for-ibm-dotcom/) to ensure that these experiences are adhering to Carbon guidance. - Familiarize yourself with From 52c68a07faaef6a3be406fc3e5117173b83e6ca8 Mon Sep 17 00:00:00 2001 From: Jan Child <44503588+janchild@users.noreply.github.com> Date: Fri, 21 May 2021 10:00:25 -0500 Subject: [PATCH 6/9] Update src/pages/all-about-carbon/who-uses-carbon.mdx Co-authored-by: emyarod --- src/pages/all-about-carbon/who-uses-carbon.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/all-about-carbon/who-uses-carbon.mdx b/src/pages/all-about-carbon/who-uses-carbon.mdx index d0cd8aceb7c..98da4d8886b 100755 --- a/src/pages/all-about-carbon/who-uses-carbon.mdx +++ b/src/pages/all-about-carbon/who-uses-carbon.mdx @@ -215,7 +215,7 @@ Here are some ways marketers can begin engaging with Carbon: to ensure that these experiences are adhering to Carbon guidance. - Familiarize yourself with - [ibm.com web standards](https://www.ibm.com/standards/web/) to assess the + [IBM.com web standards](https://www.ibm.com/standards/web/) to assess the legal compliance of your experience. - Make sure all digital experiences by third parties meet IBM-A accessibility From dcbe3b27bbe732a9e4be80354804ca1fd44ba361 Mon Sep 17 00:00:00 2001 From: Jan Child <44503588+janchild@users.noreply.github.com> Date: Fri, 21 May 2021 10:00:35 -0500 Subject: [PATCH 7/9] Update src/pages/all-about-carbon/who-uses-carbon.mdx Co-authored-by: emyarod --- src/pages/all-about-carbon/who-uses-carbon.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/all-about-carbon/who-uses-carbon.mdx b/src/pages/all-about-carbon/who-uses-carbon.mdx index 98da4d8886b..efa5f8c52e7 100755 --- a/src/pages/all-about-carbon/who-uses-carbon.mdx +++ b/src/pages/all-about-carbon/who-uses-carbon.mdx @@ -286,7 +286,7 @@ Here are some ways people in support roles can begin engaging with Carbon: - Stay up to date with Carbon's [roadmap and releases](/whats-happening/releases/). -- Make a [Github issue](/contributing/bugs-and-requests/) to report bugs or +- Make a [GitHub issue](/contributing/bugs-and-requests/) to report bugs or address gaps. - Report issues in these primary support Slack channels: From aa02ec8fcd6dba4d54dd93e5c59b2f3b21c5c4bd Mon Sep 17 00:00:00 2001 From: Jan Child <44503588+janchild@users.noreply.github.com> Date: Fri, 21 May 2021 10:02:56 -0500 Subject: [PATCH 8/9] Update src/pages/all-about-carbon/who-uses-carbon.mdx Co-authored-by: emyarod --- src/pages/all-about-carbon/who-uses-carbon.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/all-about-carbon/who-uses-carbon.mdx b/src/pages/all-about-carbon/who-uses-carbon.mdx index efa5f8c52e7..ca06719b6a8 100755 --- a/src/pages/all-about-carbon/who-uses-carbon.mdx +++ b/src/pages/all-about-carbon/who-uses-carbon.mdx @@ -172,7 +172,7 @@ Here are some ways developers can begin engaging with Carbon. - [#carbon-web-components](https://ibm-studios.slack.com/archives/CL83LMKSA) - [#carbon-tutorial](https://ibm-studios.slack.com/archives/CJUGA7P6H) -- Make a [Github issue](/contributing/bugs-and-requests/) when you find a bug or +- Make a [GitHub issue](/contributing/bugs-and-requests/) when you find a bug or want to request a feature. #### Keep up with the latest From 5ccf12e4d7c93150090c918dab091b2f00362149 Mon Sep 17 00:00:00 2001 From: Jan Child <44503588+janchild@users.noreply.github.com> Date: Fri, 21 May 2021 10:03:51 -0500 Subject: [PATCH 9/9] Delete why-use-carbon copy.mdx --- .../all-about-carbon/why-use-carbon copy.mdx | 259 ------------------ 1 file changed, 259 deletions(-) delete mode 100755 src/pages/all-about-carbon/why-use-carbon copy.mdx diff --git a/src/pages/all-about-carbon/why-use-carbon copy.mdx b/src/pages/all-about-carbon/why-use-carbon copy.mdx deleted file mode 100755 index f3bc4c42a3d..00000000000 --- a/src/pages/all-about-carbon/why-use-carbon copy.mdx +++ /dev/null @@ -1,259 +0,0 @@ ---- -title: Why use Carbon? -description: - Carbon is for every member of a cross-functional product team—designers, - developers, marketers and offering managers. The complexity of what we build - means we work across multiple teams, disciplines, and functions to deliver a - full experience to our users. very point along a user's journey needs to feel - part of a holistic, branded experience—that's where Carbon comes in. ---- - - - -Carbon is for every member of a cross-functional product team—designers, -developers, marketers and offering managers. The complexity of what we build -means we work across multiple teams, disciplines, and functions to deliver a -full experience to our users. - -Every point along a user's journey needs to feel part of a holistic, branded -experience—that's where Carbon comes in. - - - -## Designers - -Designers are passionate advocates for users, and Carbon helps them provide -value to our users with accessible, fully-tested assets and guidance that -designers can rely on to create cohesive experiences that are in line with other -business units. - -- Carbon helps designers build excellent experiences for our users that are - consistent, delightful, and thoughtful. -- Carbon allows designers to quickly create tailored solutions for our clients, - drawing on Carbon's reusable kit of parts. This saves valuable time that can - be spent on innovating new solutions. -- Carbon enables product and .com designers across the organization to explore - and deliver the full potential of a design, leveraging the work of other teams - where possible, avoiding redesign and duplication of efforts, keeping the - focus on the distinct client use cases. - -### Designer checklist for Carbon - -- Familiarize yourself with the Carbon - [foundational elements](/guidelines/2x-grid/overview), their usage - documentation, and the system's - [design principles](https://www.ibm.com/design/language/). - -- Visit - [Designing > Getting Started](https://www.carbondesignsystem.com/designing/get-started/) - on the Carbon website and install the design kits. - -- Visit the - [Other Resources](https://www.carbondesignsystem.com/designing/design-resources/) - page on the Carbon website to find other useful tools and kit extensions like - the Mobile Sketch kit and the Master Data Visualization file. - -- If confused about the system or if you've spotted an inconsistency, bring it - to the Carbon team's attention on our IBM Slack channels. At this time, the - Slack channels are for IBMers only. - - - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) - - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) - -- Make a - [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) - when you find a bug or want to request a feature. - -- Keep your eye on the - [Work in progress](https://www.carbondesignsystem.com/whats-happening/work-in-progress/) - section for new resources that are currently being worked on. - -- Check out - [design tutorials](https://www.carbondesignsystem.com/designing/tutorials/) to - learn more about some of the foundational pieces of the design system. - -- Find [meetups](https://www.carbondesignsystem.com/whats-happening/meetups/) - for leveling up your skills, connecting with your peers, and getting reviews - on work in progress. - -- Familiarize yourself with usage and style guidance for all of Carbon's - [components](https://www.carbondesignsystem.com/components/overview/) and - [patterns](https://www.carbondesignsystem.com/patterns/overview/). - -- [Contribute](https://www.carbondesignsystem.com/contributing/overview/) back - to the system: - - - Design component and/or pattern enhancements, or create new assets stewarded - by the Carbon team. - - Author usage documentation for - [patterns](https://www.carbondesignsystem.com/contributing/pattern/) and - [components](https://www.carbondesignsystem.com/contributing/component/). - - Create tooling especially as related to design kits in various frameworks. - - Explore scalable system logic such as token additions, or inline theming. - - Connect with the Carbon team to share work in progress and assess its - suitability for universal guidance. - -## Developers - -Carbon provides developers with the tools they need to build more product in -less time, while saving them from the mind-numbing work of creating the same -base components over and over again. - -- By leveraging Carbon's pre-built assets, developers free themselves (and their - backlogs) up to do the innovative work that inspires them and ultimately - elevates the user experience for our clients. -- Developers can create products that are cohesive with other business - units—high-quality, consistent, and robust front-end experiences that share - the IBM brand. - -### Developer checklist for Carbon - -- Familiarize yourself with the - [Carbon foundational elements](https://www.carbondesignsystem.com/guidelines/2x-grid/overview/), - their usage documentation and the system's - [design principles](https://www.ibm.com/design/language/). - -- Visit - [Developing > Getting Started](https://www.carbondesignsystem.com/developing/get-started/) - on the Carbon website and install your framework of choice. - -- Visit - [Developer resources](https://www.carbondesignsystem.com/developing/dev-resources/) - to find Carbon tools, as well as our GitHub repos and Storybooks for your - framework of choice. - -- Make a - [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) - when you find a bug or want to request a feature. - -- Check out a tutorial in your framework of choice - ([React](https://www.carbondesignsystem.com/developing/react-tutorial/overview/), - [Angular](https://www.carbondesignsystem.com/developing/angular-tutorial/overview/) - or - [Vue](https://www.carbondesignsystem.com/developing/vue-tutorial/overview/)) - and get your Developer Essentials badge. - -- Find [meetups](https://www.carbondesignsystem.com/whats-happening/meetups/) - for leveling up your skills, connecting with your peers, and getting reviews - on work in progress. - -- If confused about the system or if you've spotted an inconsistency bring it to - the Carbon team's attention on our Slack channels. At this time, these Slack - channels are for IBMers only. - - - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) - - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) - - [#carbon-react](https://ibm-studios.slack.com/archives/C2K6RFJ1G) - - [#carbon-ng](https://ibm-studios.slack.com/archives/CBZC0LM2N) - - [#carbon-vue](https://ibm-studios.slack.com/archives/CAM5P6NR1) - - [#carbon-web-components](https://ibm-studios.slack.com/archives/CL83LMKSA) - - [#carbon-tutorial](https://ibm-studios.slack.com/archives/CJUGA7P6H) - -- [Contribute](https://www.carbondesignsystem.com/contributing/overview) back to - the system: - - - Develop component and pattern enhancements or create new assets, stewarded - by the Carbon team. - - Author developer documentation for patterns and components. - - Create any relevant tooling to help developers within your PAL community or - the wider community build more efficiently with Carbon - - As you learn and grow give back to the community in the support channels. - -- Stay up-to-date with Carbon's - [roadmap and releases](https://www.carbondesignsystem.com/whats-happening/releases/). - -## Marketers - -Carbon allows teams to build excellent experiences that differentiate IBM from -the competition. - -Products and experiences built with Carbon provide an interoperability of -experience and visuals across products. More complex multiproduct stories are -easier to tell when product experiences are in lock step. - -### Marketers checklist for Carbon - -- Visit [IBM Brand Center](https://www.ibm.com/brand) to learn more about - foundational brand compliance, as well as for the hero brand systems that - drive IBM's portfolio of products and experiences. - -- The majority of marketing experiences use Carbon web components. Visit - [Carbon for ibm.com](https://www.ibm.com/standards/web/carbon-for-ibm-dotcom/) - to ensure that these experiences are adhering to Carbon guidance. - -- Familiarize yourself with - [ibm.com web standards](https://www.ibm.com/standards/web/) to assess the - legal compliance of your experience. - -- Make sure all digital experiences by third parties meet IBM-A accessibility - requirements: - - - [Marketing materials](https://www.ibm.com/able/toolkit/launch/readiness#marketing-materials) - - [Supplier and Partnership Accessibility Requirements and Process](http://ibm.biz/SupplierAccessibility) - - [Accessibility guidelines for suppliers](http://blob:https//www.ibm.com/c4c955b3-b746-c74c-86de-c852f7f1462a) - - ## Product managers - -Carbon improves business outcomes (increased lifetime value, revenue, NPS & -decreased churn) and wins awards in both the -[product](https://pages.github.ibm.com/cdai-design/awards) and the -[digital](https://medium.com/design-ibm/ibm-cloud-app-id-and-assist-me-win-indigo-design-awards-47600197f780) -realms. - -Carbon accelerates team productivity and time-to-market. - -### Product manager checklist for Carbon - -- Stay current with Carbon's - [releases and roadmap](https://www.carbondesignsystem.com/whats-happening/releases/) - to prioritize upgrading Carbon (new assets, upstream fixes, designer/developer - workflow improvements, tooling enhancements, etc.) vs. allowing time towards - product features and fixes. - -- Provide the Carbon team with adoption and migration feedback, as well as - measured product performance with regard to Carbon, providing a healthy - collaboration loop. You can find - [migration worksheets and other resources here](https://pages.github.ibm.com/cdai-design/dux/). - -## Sales - -Multiproduct stories are easier to tell and sell when product experiences work -together seamlessly. Suites of products built on the same foundation, that have -the same interactions are a dream to demo. - -Carbon also extends -[IBM iX's capabilities,](https://blog.adobe.com/en/publish/2019/11/04/adobe-and-ibm-ix-extend-partnership-to-help-enterprises-design-powerful-and-consistent-customer-experiences.html#gs.101gaxd) -allowing iX customers to implement and customize Carbon, showcasing it's -adaptability as a white-label design system. - -### Sales checklist for Carbon - -- Consultants who are selling digital solutions to clients should understand the - benefits of Carbon for rapid prototyping, demo'ing and building. - -- Our IBM consultants are the champions of third party Carbon use. Carbon looks - to them for the following: - - Creating case studies that highlight the effective use and benefits of - Carbon. - - Providing information about gaps in third party capabilities, as well as - prioritized client requests. - -## Support - -Product experiences that are built on the same foundation and work together -seamlessly to reduce cognitive load for users, thereby reducing user errors and -questions, and significantly reducing the need for support. - -Consistent experiences also result in less need for extensive training and -onboarding resources; learning can be leveraged across multiple spaces. - -### Support checklist for Carbon - -- Make a - [Github issue](https://www.carbondesignsystem.com/contributing/bugs-and-requests/) - to report bugs or address gaps. - -- Report issues in these primary support Slack channels: - - [#carbon-design-system](https://ibm-studios.slack.com/messages/C0M053VPT/) - - [#carbon-components](https://ibm-studios.slack.com/archives/C046Y0YUD) - - [#carbon-react](https://ibm-studios.slack.com/archives/C2K6RFJ1G)