Giter Club home page Giter Club logo

sync.sketchplugin's Introduction

Sync Sketch Plugin

Save your text styles, layer styles, and color palette in a Google Sheet to keep your design team in sync. Every time you run this plugin your styles and colors will be replaced with those you specify in a spreadsheet. This should make it easier to share typography styles across teams!

Installation

Install from Sketch Toolbox (recommended) or download the zip, unzip, and open sync.sketchplugin.

Getting Started

  1. Create a Google Sheet from this template (click the "Use this template" button).

  2. Select File > Publish to web… and then click the Publish button.

  3. Copy the link to your sheet. (See below if you are using Google Apps at work)

  4. Run the Sync command from the plugin menu and paste your URL into the prompt.

Your text styles, layer styles, and color palette should now be synced with your spreadsheet. Run the plugin again any time to update. Share your published sheet URL with your team to stay in sync.

Using Google Apps at work?

Some companies prevent employees from publishing sheets. If the Published content & settings drill-down in the Publish to the web modal says that people at your company must log in to view, then Sync will not be able to access your sheet. Don't worry – you can still use Sync for typography. Just visit Sheetsu to generate an API for your new sheet. Use your new Sheetsu URL and continue to step 4.

Font Weight

Font variants—such as bold, italic, or narrow—are actually separate font files on your computer. You should specify these exactly as named in ~/Library/Fonts/ folder on your Mac, excluding the file extension (e.g. ttf). The Google Sheet template provides an example of this.

Need help?

View the screencast, create an issue or tweet @stan.

Pattern Libraries

Share your pattern library with the Sync community.

Custom API

As an alternative to Google Sheets, you can create a custom JSON api with the following structure. Currently this method only supports typography.

{
  …
  result: [
    {
      Style: "Headline 1",
      Size: "32",
      Color: "DD2E1F",
      Opacity: "85",
      Typeface: "SourceSansPro-Semibold",
      Alignment: "center",
      Line: "40",
      Character: "0"
    },
    …
  ]
}

Run the Sync command from the plugin menu and paste your API endpoint URL into the prompt.

sync.sketchplugin's People

Contributors

nolastan avatar gabrieltomescu avatar

Watchers

Thierry Charbonnel avatar James Cloos avatar

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.