Giter Club home page Giter Club logo

roarytubbs / predix-design-stencil Goto Github PK

View Code? Open in Web Editor NEW

This project forked from predixdesignsystem/predix-design-stencil

0.0 2.0 0.0 57.07 MB

This repository contains files with the most current symbols library, stencils, color swatches, and fonts for your Predix UI design project. Stencils are provided in Sketch formats. The Predix Components Master is a Sketch document that contains Predix component symbols which you can use in any of your Sketch documents. If there are updates to the master file, documents containing instances of the master file will receive a notification to update to the lastest version. This will guarantee you will have the lastest version and any additions to the Sketch documents. The Predix Design System starter kit is composed of symbols from the Predix Components Master file and layout examples. Please use the starter kit as a way to build stencils for your product and applications.

Home Page: https://www.predix-ui.com/#/about/start-designing

predix-design-stencil's Introduction

Predix Design Stencil

This repository contains files with the most current symbols library, stencils, color swatches, and fonts for your Predix UI design project. Stencils are provided in Sketch formats.

The Predix Components Master is a Sketch document that contains Predix component symbols which you can use in any of your Sketch documents. If there are updates to the master file, documents containing instances of the master file will receive a notification to update to the lastest version. This will guarantee you will have the lastest version and any additions to the Sketch documents. The Predix Design System starter kit is composed of symbols from the Predix Components Master file and layout examples. Please use the starter kit as a way to build stencils for your product and applications.

For a technical overview of Predix UI, and live demos of all of the components included, visit https://predix-ui.com.

PLEASE NOTE: The repo for the Starter Kit has moved. All updates and files will be located in this repo moving forward.

Adding Libraries

Sketch Libraries is only available with Sketch 47 and above.

To start using the Predix Components Master Library, you will need to clone this repository to your local environment and link the library to your file. You can follow these instructions to clone this repository in your local environment.

WARNING: Do not edit the local copy of the Predix Components Master file. If you are creating symbols, be sure to create symbols from a separate file that links to the library. Any changes to the local copy of the Predix Components Master will need to be discarded when fetching any updates.

To add Predix Components Master as a Library, first open your preference window and go to the Libraries tab. Click on the “Add Library…” button that appears on the bottom right of the preference window, and choose the document from the cloned repository. Once you've added Predix Components Master as a Library, you will now be able to insert its Symbols into any of your documents.

Selecting a library

Once you've added Predix Components Master to your Libraries, you can use the symbols to build symbols for your own Libraries or for your local documents. The Predix Components will appear in its own menu item within the symbols option.

Selecting a Libraries Symbol

If you are looking for more information about how Libraries work, you can find documentation here

Updating and Syncing Libraries

We will announce any updates to the Predix Components Master. In order for you to gain access to the updates, you will need to fetch the lastest file via Github. Open the Github desktop client and fetch the latest version by clicking on "Fetch origin" in the upper right. Fetching the origin will update your local copy to the latest version.

PLEASE NOTE: In order to fetch the latest updates, you must be on the Internet Network and not BLUESSO.

Fetch Latest

Using the Starter Kit

The Starter Kit will have the components from the Predix Components Master, components that have not been converted to symbols, and sample layouts. Use the Starter Kit to create symbols or pages for your product and applications. Create or save a copy of the Starter Kit. Be sure to create or save a copy outside of the local Github repo.

Integrating the Predix Components Master Library to your Current File

If you've used previous versions of the Starter Kit to build your screens, you will need to replace your symbols with those that are in the Libraries file. Symbol Swapper is a plug-in that will help to streamline this process. Symbol Swapper provides you with a way to select a symbol and replace it with a symbol with the same name. Symbol Swapper

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.