UXPUB 🇺🇦 Дизайн-спільнота

Cover image for Я создал плагин для Sketch. И у вас получится
Редакція
Редакція

Опубліковано • Оновлено

Я создал плагин для Sketch. И у вас получится

Если вкратце: я создал плагин для Sketch. Это оказалось несложно. Вам тоже стоит попробовать. http://old.ux.pub/rukovodstvo-novichka-po-razrabotke-sketch-plaginov/ Я интересуюсь инструментами для дизайна. Меня очень вдохновили и впечатлили Джош Пикетт и Матей Хрескак, так что и у меня самого зачесались руки сделать нечто подобное. Демо: Вот как все произошло:

  • Все начинается с идеи: Я много вожусь с цифрами в дизайне (например, таблицы данных). В Sketch я создавал такие таблицы, рисуя одну строку или одну ячейку, а затем копировать-вставить N-ное количество раз. Проблема в том, что все числа получаются одинаковыми, в итоге мой дизайн выглядит нереалистично. Но если я начну вручную вбивать каждое число, работа затянется надолго. Мне нужно было как-то автоматизировать этот процесс.
  • Анализ имеющихся решений: У меня уже есть плагин Content Generator, но он не решает мою специфическую задачу. Я искал на Github подходящее расширение, но ничего так и не нашел. Решил, что это хороший знак. Так что пришел к тому, что мне нужно научиться писать плагины под Sketch. Я изучил код Content Generator. Структура файла довольно проста (спасибо команде Sketch). Я просмотрел документацию по плагинам для Sketch. Она написана довольно хорошо, но мне хотелось изучить все до мельчайших деталей.
  • Первая попытка: Я посмотрел на то, как Content Generator генерирует такой контент, как названия городов. Это просто JSON-файл. Так что сначала я сделал первый прототип: вручную создал файл JSON с набором форматированных чисел (по типу $20.50 или 4.50%). Угадайте что? Это и в самом деле сработало, но не так умно, как мне бы хотелось.
  • Доработка: теперь я хотел 1) произвольно генерировать числа в заданном диапазоне и 2) форматировать их. Мои познания в Javascript не так хороши, чтобы взять нужный код прямо из головы, но я хорошо владею искусством гуглить. После открытия 10+ вкладок Stack Overflow, я таки добился своего.
  • Поделитесь с сообществом: Я выслал результат своих трудов своей команде, и людям действительно это понравилось! Я также разместил код на Github, позже обнаружил, что мой плагин появился в директории полуофициальных плагинов для Sketch, а также на сайте Sketch App Sources. И что самое приятное – люди уже начали использовать его для создания собственных расширений! Проверьте эту вилку от RayPS по быстрым наброскам календаря.

Создание плагинов для Sketch Самый важный урок в этом всем – не дайте себя обмануть воображаемым препятствиям в своей голове и просто сделайте это! Я дизайнер. У меня нет компьютерного образования. Я знаю только немного HTML, CSS и Javascript, но и с этим можно уйди довольно далеко. Я создал мобильные приложения, расширения для chrome, скринсейверы и другие продукты (Об этом я, скорее всего, тоже как-нибудь напишу). Начните разрабатывать свои продукты!


Перевод статьи Liu Liu

Найновіші коментарі (0)