text: (window.webpackJsonp=window.webpackJsonp||[]).push([[2090],{"013z":function(e,t,n){"use strict";var a=n("q1tI"),o=n.n(a),r=n("NmYn"),s=n.n(r),i=n("Wbzz"),l=n("Xrax"),b=n("a7k6"),c=n("TSYQ"),u=n.n(c),d=n("QH2O"),p=n("qKvR");var h=({title:e,tabs:t=[]})=>Object(p.b)("div",{className:u()(d.pageHeader,{[d.withTabs]:t.length})},Object(p.b)("div",{className:"bx--grid"},Object(p.b)("div",{className:"bx--row"},Object(p.b)("div",{className:"bx--col-lg-12"},Object(p.b)("h1",{id:"page-title",className:d.text},e))))),m=n("BAC9");var g=({relativePagePath:e,repository:t})=>{const{site:{siteMetadata:{repository:n}}}=Object(i.useStaticQuery)("1364590287"),{baseUrl:a,subDirectory:o,branch:r}=t||n,s=`${a}/edit/${r}${o}/src/pages${e}`;return a?Object(p.b)("div",{className:"bx--row "+m.row},Object(p.b)("div",{className:"bx--col"},Object(p.b)("a",{className:m.link,href:s},"Edit this page on GitHub"))):null},O=n("FCXl"),j=n("I8xM");class f extends o.a.Component{render(){const{tabs:e,slug:t}=this.props,n=t.split("/").filter(Boolean).slice(-1)[0],a=e.map(e=>{const a=s()(e,{lower:!0,strict:!0}),o=a===n,r=new RegExp(n+"/?(#.*)?$"),l=t.replace(r,a);return Object(p.b)("li",{key:e,className:u()({[j.selectedItem]:o},j.listItem)},Object(p.b)(i.Link,{className:j.link,to:""+l},e))});return Object(p.b)("div",{className:j.tabsContainer},Object(p.b)("div",{className:"bx--grid"},Object(p.b)("div",{className:"bx--row"},Object(p.b)("div",{className:"bx--col-lg-12 bx--col-no-gutter"},Object(p.b)("nav",null,Object(p.b)("ul",{className:j.list},a))))))}}var y=f,v=n("MjG9");t.a=({pageContext:e,children:t,location:n,Title:a})=>{const{frontmatter:o={},relativePagePath:r,titleType:c}=e,{tabs:u,title:d,theme:m,description:j,keywords:f}=o,{site:{pathPrefix:w}}=Object(i.useStaticQuery)("2456312558"),x=w?n.pathname.replace(w,""):n.pathname,k=u?x.split("/").filter(Boolean).slice(-1)[0]||s()(u[0],{lower:!0}):"";return Object(p.b)(b.a,{tabs:u,homepage:!1,theme:m,pageTitle:d,pageDescription:j,pageKeywords:f,titleType:c},Object(p.b)(h,{title:a?Object(p.b)(a,null):d,label:"label",tabs:u}),u&&Object(p.b)(y,{slug:x,tabs:u,currentTab:k}),Object(p.b)(v.a,{padded:!0},t,Object(p.b)(g,{relativePagePath:r})),Object(p.b)(O.a,{pageContext:e,location:n,slug:x,tabs:u,currentTab:k}),Object(p.b)(l.a,null))}},BAC9:function(e,t,n){e.exports={bxTextTruncateEnd:"EditLink-module--bx--text-truncate--end--2pqje",bxTextTruncateFront:"EditLink-module--bx--text-truncate--front--3_lIE",link:"EditLink-module--link--1qzW3",row:"EditLink-module--row--1B9Gk"}},I8xM:function(e,t,n){e.exports={bxTextTruncateEnd:"PageTabs-module--bx--text-truncate--end--267NA",bxTextTruncateFront:"PageTabs-module--bx--text-truncate--front--3xEQF",tabsContainer:"PageTabs-module--tabs-container--8N4k0",list:"PageTabs-module--list--3eFQc",listItem:"PageTabs-module--list-item--nUmtD",link:"PageTabs-module--link--1mDJ1",selectedItem:"PageTabs-module--selected-item--YPVr3"}},QH2O:function(e,t,n){e.exports={bxTextTruncateEnd:"PageHeader-module--bx--text-truncate--end--mZWeX",bxTextTruncateFront:"PageHeader-module--bx--text-truncate--front--3zvrI",pageHeader:"PageHeader-module--page-header--3hIan",withTabs:"PageHeader-module--with-tabs--3nKxA",text:"PageHeader-module--text--o9LFq"}},SuLj:function(e,t,n){"use strict";n.r(t),n.d(t,"_frontmatter",(function(){return i})),n.d(t,"default",(function(){return h}));n("3bBZ"),n("q1tI");var a=n("7ljp"),o=n("013z");n("qKvR");function r(){return(r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e}).apply(this,arguments)}function s(e,t){if(null==e)return{};var n,a,o=function(e,t){if(null==e)return{};var n,a,o={},r=Object.keys(e);for(a=0;a<r.length;a++)n=r[a],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(a=0;a<r.length;a++)n=r[a],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}const i={},l=e=>function(t){return console.warn("Component "+e+" was not imported, exported, or provided by MDXProvider as global scope"),Object(a.b)("div",t)},b=l("PageDescription"),c=l("AnchorLinks"),u=l("AnchorLink"),d={_frontmatter:i},p=o.a;function h(e){let{components:t}=e,n=s(e,["components"]);return Object(a.b)(p,r({},d,n,{components:t,mdxType:"MDXLayout"}),Object(a.b)(b,{mdxType:"PageDescription"},Object(a.b)("p",null,"Welcome to Carbon! If you’re just starting out designing with Carbon, you’re in\nthe right place. Here’s a checklist of everything you need to get up and\nrunning.")),Object(a.b)(c,{mdxType:"AnchorLinks"},Object(a.b)(u,{mdxType:"AnchorLink"},"First steps"),Object(a.b)(u,{mdxType:"AnchorLink"},"Additional guidance"),Object(a.b)(u,{mdxType:"AnchorLink"},"Connect with us")),Object(a.b)("h2",null,"First steps"),Object(a.b)("h3",null,"Install your design kit"),Object(a.b)("p",null,"Our primary design kit is ",Object(a.b)("a",r({parentName:"p"},{href:"/designing/kits/sketch"}),"Sketch")," and we also have\n",Object(a.b)("a",r({parentName:"p"},{href:"/designing/kits/adobe-xd"}),"Adobe XD")," and ",Object(a.b)("a",r({parentName:"p"},{href:"/designing/kits/axure"}),"Axure")," kits\navailable. Head on over to the Design kits section and follow the install\ninstructions to get set up."),Object(a.b)("p",null,"These kits come with Carbon components so you don’t have to build them. By using\nthe kits you automatically get any updates made by the Carbon team so you don’t\nneed to go back and change any designs to match the latest release. And when\nhanding off to your developers there won’t be confusion about the component and\nits behaviors."),Object(a.b)("h3",null,"Check out other tools and resources"),Object(a.b)("p",null,"In ",Object(a.b)("a",r({parentName:"p"},{href:"/designing/design-resources"}),"Other resources"),", you’ll find links to the IBM\nDesign Language and icon libraries, color palettes, grid and shell templates,\nthe IBM Plex font, and the Github repos."),Object(a.b)("h2",null,"Additional guidance"),Object(a.b)("h3",null,"Understand the IBM Design Language"),Object(a.b)("p",null,"Carbon expresses the ",Object(a.b)("a",r({parentName:"p"},{href:"https://www.ibm.com/design/language/"}),"IBM Design Language"),"\nin product and delivers it through tools for designers and developers including\nguidance, tooling, components, and support. Take the time to read the design\nlanguage site so that you fully understand what drives IBM’s design philosophy\nand principles, and can make informed decisions in your product work."),Object(a.b)("h3",null,"Review our detailed usage guidance"),Object(a.b)("p",null,"Our usage guidance is detailed and thorough, and you’ll learn a lot about the\nsystem by reading through the components and patterns documentation."),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},Object(a.b)("p",{parentName:"li"},Object(a.b)("a",r({parentName:"p"},{href:"/components/overview"}),"Components"),": Carbon provides in-depth design usage and\nstyle guidance for all components. It’s important to be familiar with this\nadditional UX and visual guidance when you are designing with our components.")),Object(a.b)("li",{parentName:"ul"},Object(a.b)("p",{parentName:"li"},Object(a.b)("a",r({parentName:"p"},{href:"/patterns/overview"}),"Patterns"),": We also offer a range of key patterns—best\npractice solutions for how a user achieves a goal. These design patterns have\nbeen harvested from products built with Carbon, and have been reviewed and\napproved for use by the Carbon governance team."))),Object(a.b)("h2",null,"Connect with us"),Object(a.b)("h3",null,"Join us and the Carbon community"),Object(a.b)("p",null,Object(a.b)("em",{parentName:"p"},"For IBMers only:")," If you have a question about any aspect of the kits or tools,\nyou can reach out to us on Slack and use that as a way to connect with your\nfellow designers. Chances are someone has had a similar problem to you and will\njump in to help you out."),Object(a.b)("ul",null,Object(a.b)("li",{parentName:"ul"},Object(a.b)("a",r({parentName:"li"},{href:"https://ibm-studios.slack.com/messages/C0M053VPT/"}),"#carbon-design-system")),Object(a.b)("li",{parentName:"ul"},Object(a.b)("a",r({parentName:"li"},{href:"https://ibm-studios.slack.com/archives/C046Y0YUD"}),"#carbon-components")),Object(a.b)("li",{parentName:"ul"},Object(a.b)("a",r({parentName:"li"},{href:"https://ibm-studios.slack.com/archives/CDHHNNZQR"}),"#carbon-elements")),Object(a.b)("li",{parentName:"ul"},Object(a.b)("a",r({parentName:"li"},{href:"https://ibm-studios.slack.com/archives/CJUGA7P6H"}),"#carbon-tutorial"))),Object(a.b)("p",null,"And be sure to sign up for the latest Carbon news at\n",Object(a.b)("a",r({parentName:"p"},{href:"https://ibm-studios.slack.com/archives/CJ35H36MP"}),"#carbon-announcements"),"."),Object(a.b)("h3",null,"Learn about what we’re doing"),Object(a.b)("p",null,"You can find out about Carbon’s latest changes and future plans on the\n",Object(a.b)("a",r({parentName:"p"},{href:"/whats-happening/changelog-and-roadmap"}),"Changelog and roadmap")," page."),Object(a.b)("p",null,"If you have questions, here are all the ways to ",Object(a.b)("a",r({parentName:"p"},{href:"/help/contact-us"}),"contact us"),"."),Object(a.b)("h3",null,"Join us at a meetup"),Object(a.b)("p",null,"Attend one of our ",Object(a.b)("a",r({parentName:"p"},{href:"/whats-happening/meetups"}),"meetups")," to connect with us and\nlevel up your skills. The weekly design playback is great for getting feedback\non work in progress from a group of designers and design leaders dedicated to\nyour success."),Object(a.b)("p",null,"If there’s something in particular you’re interested in, we’d love to\n",Object(a.b)("a",r({parentName:"p"},{href:"https://github.com/carbon-design-system/carbon-website/issues/new/choose"}),"hear from you"),"."))}h.isMDXComponent=!0}}]);