Новости бизнесаСтатьиАналитические колонкиДеньгиКурс валютБизнес технологии
Главная > Новости бизнеса > Hi-Tech > Как упорство позволило совместить увлечение всей жизни с программированием — Разработчик Игорь Гриценко о создании просмотрщика файлов в формате Sketch

Как упорство позволило совместить увлечение всей жизни с программированием — Разработчик Игорь Гриценко о создании просмотрщика файлов в формате Sketch

Пятница, 17 марта 2017 г.

Следите за нами в ВКонтакте, Facebook'e и Twitter'e

Разработчик standalone-просмотрщика файлов в формате Sketch для Windows Icons8 Lunacy Игорь Гриценко написал для vc.ru колонку о том, как хобби и основная специализация помогают создавать успешные продукты.



В избранное Начало пути

С самого детства мне нравились две вещи: программирование и графика. Когда мне было 7 лет, я сделал короткий мультик в текстовом редакторе Lexicon. Немногим позже я нашел то, что позволило мне соединить мои увлечения еще более органично, — игры.

Я люблю игры. Но не играть в них, а создавать. То, как они сочетают в себе программирование и изобразительное искусство, всегда очаровывало меня. В итоге появилась моя первая игра — «гонки», которую я сделал с помощью QBasic. Хотя выглядит она почти как тетрис.



В школе мое увлечение играми только росло. В 10 классе сделал на Basic «танчики» для КПК Palm — помню, играл весь класс.

Здесь же я успел поработать учителем программирования. Наша школа была самой обычной, за одним исключением — в ней был кадетский класс. Ребят, которые в нем учились, готовили к поступлению в военное училище.

Однажды классный руководитель этого класса пришел ко мне с просьбой. У кадетов был запланирован открытый урок по командно-штабным учениям, на который приглашались офицеры из местной воинской части и учителя из других кадетских школ. Нужно было сделать игру-симулятор, в котором указывались маршруты для хождения строем по территории школы.

Я смоделировал школу и добавил пару кадетских моделей, которые нашел в интернете. Вдохновленный задачей, я зашел немного дальше: создал несколько бронемашин и разработал случайный сценарий (вероятность которого была низка, я бы даже сказал ничтожна) нападения на нашу школу врага. Фактически я сделал 3D-стратегию в реальном времени.

Когда пришло время представить свою работу комиссии, запустился почти несбыточный сценарий с нападением. Школьный двор быстро превратился в зону боевых действий.



Я не могу точно вспомнить реакцию учителя информатики, но судя по лицам членов комиссии, они были под впечатлением.

К окончанию университета я сделал много игр, но никогда не планировал вливаться в индустрию их разработки. Мне всегда нравилось делать свои инди-игры, а не участвовать в чужих проектах. И все же, я многому научился благодаря играм. Например, программированию.

Когда я закончил университет, у меня был выбор: найти рутинную стабильную работу программистом в офисе и писать скучные программы за хорошие деньги, или постоянно искать пути для совмещения моего увлечения компьютерной графикой и программирования.

Я не хотел далеко отходить от графики и выбрал второе. Устроился на телевидение. Там разрабатывал софт, который снимал видео с 20+ камер в кластере и монтировал его там же в единое целое, а потом это все отправлялось производственной команде. Потом был Music Box, РБК-ТВ, RT, «Доверие», «Россия-2». Меня без проблем брали на работу, потому что был опыт на ТВ и навыки программирования.

Формально я работал видеоинженером или администратором, что несколько отдаляло меня от программирования. Поэтому все свободное время я программировал и на всех каналах оставил после себя какую-нибудь полезную утилиту для сдачи смен, подписи дисков, замены бегущей строки и прочего.

Поначалу работа на телевидении была идеальной для меня, но видеоинженеры получают не так уж и много, а утилитами я ничего не зарабатывал. Затем родилась дочка, расходы сильно выросли, и чаша весов склонялась к первому варианту — скучной работе за более высокую зарплату. Поэтому, когда знакомый предложил разрабатывать сайты на PHP, я легко согласился.

Так запустилась цепочка проектов: делал интернет-магазины, разрабатывал бизнес-сервисы, была даже парочка госзаказов. Но приходилось постоянно сталкивался с бюрократией, и кучей менеджеров, половина рабочего времени уходила на совещания. Все это продолжалось несколько лет.

Тогда я и решился написать Ивану, основателю Icons8 (каталога бесплатных иконок — прим. ред.) Мы познакомились задолго до того, как я начал работать над своим текущим проектом — просмотрщиком .sketch-файлов Lunacy.

Несколько лет назад отправил ему сообщение в Facebook о том, что хотел бы работать в Icons8. Тогда я не знал, что Иван заблокировал себе доступ в социальную сеть, и поэтому ответ пришел почти через месяц.

К тому времени я уже получил должность мобильного разработчика для Windows в «Рокетбанке», но все-таки понемногу консультировал Ивана по поводу Icons8 Windows App —приложения Icons8 для работы с иконками, и даже сделал рабочий прототип за пару дней.

Позже стало понятно, что полный рабочий день в банке и частичная занятость в Icons8 — это слишком, поэтому наше сотрудничество постепенно свелось на нет.

Однажды директор по маркетингу увидел, как я показываю одну из своих простых игр коллегам. Она ему так понравилась, что он привлек меня к созданию небольших игр для отдела маркетинга. Я полировал банковское мобильное приложение, и при этом примерно 200 людей играли в мои игры каждый месяц. Жизнь была прекрасна. История могла бы легко закончится на этом моменте, но этого не случилось.

Пока я работал в «Рокетбанке», коллега предложил мне сделать клон Sketch, но для Windows. Идея мне показалась перспективной, но все были загружены, и дальше дело не пошло. Тогда же в банке решили, что мобильное приложение для Windows им больше не нужно, а мне предложили переключиться на iOS или заниматься Ruby on Rails в бэкенде.

Мне не понравился ни один из вариантов, и тогда я снова связался с Иваном. Ему понравилась идея создания Sketch для Windows. Более того, оказалось, что он сам думал об этом уже какое-то время.

Мы долго обсуждали идею проекта и в итоге решили начать с чего-то простого, как нам тогда казалось, и полезного. Так началась формироваться идея Lunacy, standalone-программы для просмотра .sketch-файлов на Windows. Разработка Lunacy

Разработка MVP Lunacy заняла три месяца. Первая версия программы могла только открывать .sketch-файлы. Задача звучала тривиальной, но по факту была далекой от этого, ведь нужно было открыть эти файлы на Windows, а не на macOS, где они были созданы в Sketch.

Весь процесс состоял из двух этапов: понимания структуры .sketch-файла и последовательной ее визуализации на Windows. Чтобы понять структуру, нужны были навыки программирования, а мой опыт работы с графикой помог разобраться, как эту структуру визуализировать. Структура .sketch-файла

Если коротко, то структура любого .sketch-файла — набор данных обо всем, что внутри него: об объектах и их иерархии, стилях, размерах и прочем. Вот так выглядит файл, если его просто открыть в Sketch:

Каждое слово, иконка или фон — это отдельный объект, поэтому сам .sketch-файл представляет собой иерархию графических объектов.

Что произойдет, если попытаться открыть этот этот файл через обычный консольный файл-менеджер?

Всего лишь одна строчка, но она дает очень важное понимание: .sketch-файл — это база данных SQLite. Поэтому я скачал первый попавшийся просмотрщик SQLite-баз и, открыв файл в нем, выяснил, что почти все место занимает только одна ячейка таблицы:

Выгрузив содержимое этой ячейки, можно столкнуться с кучей символов:

Но все начинается со строки bplist. Заглянув в поисковики, я понял, что это — стандартный формат macOS для хранения структурированных данных, который называется PList. Недолго думая, конвертировал все это в XML с помощью встроенной утилиты для Mac:

Стало похоже на подобие структуры. Пару дней разбирался что и как хранится, что можно вытащить, и понял, что можно вытащить все. Дело осталось за малым — повторить все это на Windows.

В Windows я нашел только одну библиотеку, которая хоть как-то могла прочитать этот формат. Правда, впоследствии пришлось ее серьезно дорабатывать. В итоге я получил такую структуру:

Выглядело уже лучше, но надо было написать мой собственный обработчик, так как вместо самих объектов в этой древовидной структуре хранятся их адреса внутри файла. Обработчик находил по адресам сами объекты, а специальный метод приводил все это к читабельному виду:

Тут уже легко понять, что у объекта с именем Sketch viewer for Wi в структуре Frame указано положение и размер объекта. Теперь я мог визуально сравнивать сам файл, открытый на macOS, и его структуру, открытую на Windows. Визуализация

Получив структуру файла, можно было последовательно отрисовывать каждый объект, который был в этой структуре.

Для отрисовки на экране используется кроссплатформенная библиотека Google Skia, а точнее, оболочка Xamarin SkiaSharp. С помощью OpenGl она может рисовать графические примитивы, текст или растровые изображения. Кроме того, она обеспечивает все необходимые возможности для визуализации объектов файла максимально близко к оригиналу, так как поддерживает большинство возможностей, которые используются в скетче: градиентные и тайловые заливки, режимы наложения цвета, эффекты тени, размытия и прочее.

[embedded content]

На видео видно, как один за другим последовательно отрисовываются все части файла. В итоге получается то, что мы и называем макетом или .sketch-файлом. Вывод

Много лет назад я заработал первые деньги, делая обычную программу для одного студента, как будто жизнь мне говорила: «Эй, не рискуй, просто программируй и все будет в порядке. Не ищи проекты с какими-то визуальными составляющими, не комбинируй вещи, которые делают разные группы людей. Просто программируй, и все будет хорошо».

Я не последовал этому совету: понял, что можно одновременно заниматься тем, что увлекает, и при этом продолжать делать вещи, в которых ты хорош. Так я получил возможность поработать над проектами, к которым не смог бы приложить руку в другой ситуации, чему очень рад.

В избранное

Следите за нами в ВКонтакте, Facebook'e и Twitter'e


Просмотров: 412
Рубрика: Hi-Tech
(CY)

Архив новостей / Экспорт новостей

Ещё новости по теме:

17: 00
Bozena Riot: мощная система для подавления уличных беспорядков |
17: 00
Почему взлетные полосы должны быть круглыми? |
17: 00
Microsoft опубликовала финальную версию глобального обновления Windows 10 до официальной презентации |
17: 00
Redaktr — онлайн-сервис для создания сайтов |
16: 20
Facebook запускает самоуничтожающиеся Истории и личные сообщения |
16: 20
Создатель Android Энди Рубин опубликовал первое фото своего безрамочного смартфона |
16: 20
Владимир Путин поручил создать свою «Силиконовую долину». И это не Сколково |
16: 20
Финансовое управление в кризис |
16: 00
«Дочка» «ВКонтакте» заключила мировое соглашение с застройщиком дата-центра соцсети по спору на 60 млн рублей |
15: 40
Профессиональная помощь в создании порталов на различных движках |
15: 20
Смартфонов Lenovo больше не будет. Motorola снова в деле |
15: 20
Крупнейшая в мире серия хакатонов AngelHack стартует в Новосибирске 15-16 апреля. |
15: 00
Игровой клуб для любителей азарта: безопасный риск и экстрим |
15: 00
Что мы ждем от камеры Samsung Galaxy S8? |
15: 00
Как проводили зиму с Toyota Land Cruiser Prado |
15: 00
7 фишек новой версии iOS 10.3 |
15: 00
Игровой ПК Asus Strix GD30 позволит разнообразить свой внешний вид |
15: 00
Названы цены 3D-карт серии Gigabyte GeForce GTX 1080 Ti Aorus |
15: 00
Россия вышла на первое место на рынке смартфонов в регионе EMEA |
15: 00
Российский госсектор в 2016 году потерял 100 млрд рублей из-за банкротства банков |
14: 40
Флэш-накопители Adata i-Memory AI920 Jet Black оснащены интерфейсами Lightning и USB 3.1 Gen 1 |
14: 40
Воу. У нас обалденный красный iPhone 7, и он может стать твоим |
14: 40
Девочка перепутала бак от водонагревателя с роботом. И призналась ему в любви |
14: 20
Мини-компьютер KS-PRO предлагает Windows 10 и Snapdragon 835 |
14: 20
Moto X (2017) с двойной камерой показался на живых фото |
14: 20
Gangstar New Orleans — аналог GTA от Gameloft в Google Play уже 30 марта! |
14: 00
Приглашаем на Hardware Hackathon! |
14: 00
Вышел релиз DragonFly BSD 4.8 |
14: 00
Представитель Lenovo объявил о возвращении бренда Motorola на рынок через месяц после отказа от него |
13: 20
Хакер Тодеско: «iOS 10.3 — адское обновление безопасности. Я ухожу из джейлбрейка» |
13: 00
Talelight: электронный стикер на багажник |
Новости бизнесаСтатьиАналитические колонкиДеньгиКурс валютБизнес технологии
Rating@Mail.ru
Условия размещения рекламы

Наша редакция

Обратная связь

RosInvest.Com не несет ответственности за опубликованные материалы и комментарии пользователей. Возрастной цензор 16+.

Ответственность за высказанные, размещённую информацию и оценки, в рамках проекта RosInvest.Com, лежит полностью на лицах опубликовавших эти материалы. Использование материалов, допускается со ссылкой на сайт RosInvest.Com.

Skype: rosinvest.com (Русский, English, Zhōng wén).

Архивы новостей за: 2016, 2015, 2014, 2013, 2012, 2011, 2010, 2009, 2008, 2007, 2006, 2005, 2004, 2003