Sketch JSON Parser

Плагин Sketch JSON Parser заменяет значения слоев в группах данными JSON. Этот плагин позволяет вставлять в дизайн реальные данные с любого сайта. Можно использовать данные в формате JSON. Чтобы плагин заработал, вам необходимо в названиях слоев прописать переменные из масива  JSON, потом вставить сам массив и плагин автоматически подтянет данные с сайта.

 

Установка

  1. Скачайте / клонируйте из репозитория
  2. Запустите json-parser.sketchplugin

 

Пример

1. Скажем, у вас есть группа:

 

Sketch JSON Parser пример

 

2. И массив JSON:

[{

“img”: “http://i.imgur.com/IBZMRic.png”,
“title”: “Holabila”,
“date”: {

“formatted”: “25 Jan 2015”,
“time_ago”: “5 min ago”

},
“name”: “Koen Vendrik”

},
{

“img”: “/Users/joeytribbiani/Desktop/350.png”,
“title”: “Bilahola”,
“date”: {

“formatted”: “28 Feb 2015”,
“time_ago”: “2 days ago”

},
“name”: “Jaer Pollux”

}]

 

3. Теперь включите переменные пути JSON в названия слоев, как тут:

 

Sketch JSON Parser - название слоев

 

4. Продублируйте группу столько рз, сколько нужно, и выделите группы

(в данном случае, возможно, дважды, так как у вас два элемента в массиве)

 

5. Запустите плагин и вставьте JSON, когда появится запрос

 

Sketch JSON Parser - JSON запрос

 

6. Вуаля! Плагин заменил все значения слоев данными из JSON

 

JSON - вуаля все работает

 

[dt_button size=”big” style=”default” animation=”none” color_mode=”default” icon=”” icon_align=”left” color=”” link=”https://github.com/kvendrik/sketch-json-parser/archive/master.zip” target_blank=”true”]Скачать Sketch JSON Parser[/dt_button]

Похожие записи

Полное руководство по дизайну iOS 9 в Sketch

iOS сильно выросла в течение последних лет. С ее iOS 9 апгрейдом, Apple представил новый системный шрифт под названием San Francisco, 3D Touch и многозадачность на iPad. В Xcode вы найдете Stack Views, фантастический инструмент для более адаптивных макетов, гораздо проще Auto Layout.

Самое подробное руководство по дизайну в Sketch

Работая со Sketch последние три года, я освоил ряд ключевых техник, которые значительно улучшили мой рабочий процесс. Так как я, помимо рисования, также обожаю прототипировать и кодить, мне нужен инструмент для быстрого выполнения дизайн-проектов и легкой генерации исходников. Sketch вместе с его плагинами и другие инструменты для прототипирования полностью справляются с этой задачей. Часть 1 Часть 3 Часть 4

Серия уроков Sketch (часть1 из 5): Настройка Sketch

Первое что нам следует изучить, это настройка Sketch. Если вы только начали создавать дизайны для веб и являетесь новичком в Sketch или Photoshop, или вы просто разработчик, желающий включить UI-дизайн в свой репертуар, эти простые уроки по настройке идеально подойдут для быстрого ознакомления с работой Sketch. Часть 2 Часть 3 Часть 4 Часть 5