diff --git a/assets/images/Tracker.svg b/assets/images/Tracker.svg new file mode 100644 index 0000000..b27dc61 --- /dev/null +++ b/assets/images/Tracker.svg @@ -0,0 +1,54 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/images/contact-us.svg b/assets/images/contact-us.svg new file mode 100644 index 0000000..8793eeb --- /dev/null +++ b/assets/images/contact-us.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/demo-placeholder.svg b/assets/images/demo-placeholder.svg new file mode 100644 index 0000000..d71e05a --- /dev/null +++ b/assets/images/demo-placeholder.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/design.svg b/assets/images/design.svg index 684ce81..0f85d48 100644 --- a/assets/images/design.svg +++ b/assets/images/design.svg @@ -1,16 +1,16 @@ - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + diff --git a/assets/images/development.svg b/assets/images/development.svg index 184d9ef..3f8eb0e 100644 --- a/assets/images/development.svg +++ b/assets/images/development.svg @@ -1,16 +1,16 @@ - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + diff --git a/assets/images/process.svg b/assets/images/process.svg index 3f2d694..06238b4 100644 --- a/assets/images/process.svg +++ b/assets/images/process.svg @@ -1,14 +1,14 @@ - - - - - - - - - - - - - + + + + + + + + + + + + + diff --git a/assets/images/tracker.svg b/assets/images/tracker.svg index 6e546ba..b27dc61 100644 --- a/assets/images/tracker.svg +++ b/assets/images/tracker.svg @@ -1,16 +1,54 @@ - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - + + diff --git a/markdown/360-components.md b/markdown/360-components.md index fa4b2d5..81a60e5 100644 --- a/markdown/360-components.md +++ b/markdown/360-components.md @@ -27,4 +27,4 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. -Back: [Isomorphic Layouts](isomorphic-layouts.md) | Next: [Tracker](traker.md) +Back: [Isomorphic Layouts](360-components.md) | Next: [Tracker](process.md) diff --git a/markdown/contact-us.md b/markdown/contact-us.md new file mode 100644 index 0000000..4f4bec4 --- /dev/null +++ b/markdown/contact-us.md @@ -0,0 +1,7 @@ +![Alternative Text](../assets/images/contact-us.svg) + +# Contact Us + +**At Rangle we believe doing in the right thing the right way. Talk to us about getting your product or platform to market faster.** + +Back: [Design](design.md) | Next: [Home](radius-home.md) \ No newline at end of file diff --git a/markdown/design.md b/markdown/design.md new file mode 100644 index 0000000..c56e551 --- /dev/null +++ b/markdown/design.md @@ -0,0 +1,32 @@ +![Alternative Text](../assets/images/design.svg) + +# Design + +**We'll provide you with a comprehensive step-by-step guidance on the entire process of creating a component. This includes performing an initial assessment and prioritizing the starting point, followed by the actual component creation process, which encompasses aspects such as naming, accessibility, file organization, and much more! You’ll gain confidence as you experience a seamless and efficient workflow.** + + +## Watch the demo + +![Alternative Text](../assets/images/demo-placeholder.svg) + +## Resources + +Take a peek under the hood and see some of the resources Radius has to offer. + +**Foundations** + +Explore how we implement tokens in Radius. + +**Storybook** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +**Product Files** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +**UI Kit** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +Back: [Development](development.md) | Next: [Contact Us](contact-us.md) \ No newline at end of file diff --git a/markdown/development.md b/markdown/development.md new file mode 100644 index 0000000..5746a01 --- /dev/null +++ b/markdown/development.md @@ -0,0 +1,33 @@ +![Alternative Text](../assets/images/development.svg) + +# Development + +**The key to successful collaboration between developers and designers is continuous communication, mutual respect, and a shared understanding of the project objectives.** + +Our collaborative approach ensures that the Design System you’re building is both visually appealing and technically sound. We outline things like: token naming conventions, handoff specifications, collaboration and creation checklists, to name a few – to allow for the smoothest way of working. + +## Watch the demo + +![Alternative Text](../assets/images/demo-placeholder.svg) + +## Resources + +Take a peek under the hood and see some of the resources Radius has to offer. + +**Foundations** + +Explore how we implement tokens in Radius. + +**Storybook** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +**Product Files** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +**UI Kit** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +Back: [Process](process.md) | Next: [Design](design.md) \ No newline at end of file diff --git a/markdown/process.md b/markdown/process.md new file mode 100644 index 0000000..57c5ddc --- /dev/null +++ b/markdown/process.md @@ -0,0 +1,33 @@ +![Alternative Text](../assets/images/process.svg) + +# Process + +**Our process enhances alignment between your Design System team and Product teams. We'll guide you on collaborating effectively with the Design System team, involving the right roles at the right time, managing unique components, gathering feedback, and more!** + +Our collaborative approach ensures that the Design System you’re building is both visually appealing and technically sound. We outline things like: token naming conventions, handoff specifications, collaboration and creation checklists, to name a few – to allow for the smoothest way of working. + +## Watch the demo + +![Alternative Text](../assets/images/demo-placeholder.svg) + +## Resources + +Take a peek under the hood and see some of the resources Radius has to offer. + +**Foundations** + +Explore how we implement tokens in Radius. + +**Storybook** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +**Product Files** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +**UI Kit** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +Back: [360˚ components](360-components.md) | Next: [Development](development.md) \ No newline at end of file diff --git a/markdown/tracker.md b/markdown/tracker.md new file mode 100644 index 0000000..add3e40 --- /dev/null +++ b/markdown/tracker.md @@ -0,0 +1,33 @@ +![Alternative Text](../assets/images/Tracker.svg) + +# Tracker + +**Track every use of every component in every code base in your company** + +Radius Tracker generates reports measuring design system adoption, calculated bottom-up from individual component usage stats automatically collected from your organization repositories. + +## Watch the demo + +![Alternative Text](../assets/images/demo-placeholder.svg) + +## Resources + +Take a peek under the hood and see some of the resources Radius has to offer. + +**Foundations** + +Explore how we implement tokens in Radius. + +**Storybook** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +**Product Files** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +**UI Kit** + +Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. + +Back: [360˚ components](360-components.md) | Next: [Process](process.md) \ No newline at end of file