Advertisement
Guest User

Untitled

a guest
Feb 6th, 2016
71
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 22.92 KB | None | 0 0
  1. Моя учительница по истории Беларуси очень хотела привить мне интерес к предмету, и из-за этого каждый параграф учебника превращался в пытку. Наверное, кое-что получилось у Елены Викторовны, потому что через 10 лет я сам захотел занырнуть в историю своей страны.
  2.  
  3. Мне попала в руки прекрасная книга Владимира Орлова «Ілюстарваная гісторыя Беларусі», которая зашла просто как вода в сухую землю. По ходу чтения я не переставал удивляться невероятным фактам. Бьюсь об заклад, про них забыли и уже не подозревают большинство моих друзей. Мне показалось, что дизайн и веб-технологии — это некий рупор, который позволит донести это сообщение до них. Короче, сработал триггер профессиональной деформации: видишь массив интересных данных — визуализируй, найди неочевидные моменты.
  4.  
  5. Я умышленно нарвался на две огромные задачи: перелопатить историю Беларуси и придумать, как это все визуализировать. Главное — не пытаться залезть глубоко в дебри. Я не историк, и стоит это сразу обозначить: будущий результат — это любительский подбор фактов, на который не стоит ссылаться студентам и школьникам. Скорее, это шпаргалка, для спорящих в баре поддатых интеллектуалов. У меня была возможность пригласить на проект профессиональных историков, но это бы поменяло первоначальную идею.
  6.  
  7. Отбор фактов
  8.  
  9. Возьмите Крым. Случился 2 года назад, а до сих пор никто не знает, чей он. А Мапа — это попытка разобраться в фактах, которые были 800 лет назад. Ну, вы поняли. Все ангажировано, субъективно и не может быть иначе. Это только кажется, что история — это уже сформированный ряд фактов. Но когда ты вещаешь сам, за тобой встает выбор: какие факты упомянуть, какие замолчать. Из набора фактов и будет состоять твоя позиция. Моя попытка остаться максимально нейтральным — это подбор фактов, которые уже устаканились среди историков.
  10.  
  11. Дизайн
  12.  
  13. При первом подходе к снаряду я попытался уместить все на один экран. И это был провал. Даже, если бы мне удалось на один экран уместить все, это не дало никакого профита. Одновременно следует показывать лишь только то, между чем может быть хоть какая-то корреляция. А какая может быть корреляция, например, между границами Великого княжества Литовского в XIII веке и советской республикой в XX. Короче, фейл. И я отложил это дело до лучших времен.
  14.  
  15. Но не забил. Рано или поздно придется отрисовать все состояния границ, собрать пул фактов, разобраться, кто за кем правил. Почти год у меня ушел на изучение фактов и отрисовку границ.
  16.  
  17. Чем старше карты, тем сложнее понять, как их положить на современные границы. Кстати, именно поэтому я решил искусственно ограничиться 1240 годом и не лезть в более ранний период. (И по этому поводу получил больше всего писем.) Надеюсь, когда-нибудь у меня наберется на то терпение, или найдется человек, который придет и поможет, и на Мапе появится Полоцкое, Туровское и Смоленское княжества.
  18.  
  19. Через год я понял, что нужно использовать самый простой и естественный способ перемещения в компьютерном пространстве — скроллинг. Мотаешь мышку, а у тебя перед глазами 8 веков пролетают.
  20.  
  21. *А теперь лирическое отступление про скроллинг, очевидно и невероятное для самонадеянных дизайнеров типа меня. Судя по тепловой карте кликов и фидбеку, не все пользователи догадались о том, что нужно просто скроллить и предпочли специально кликать по следующей дате, чтобы продвигаться вперед*.
  22.  
  23. Сделал эскиз. Вроде как на новый дизайн ложатся все кейсы, можно уместить любое количество данных и даже есть место для дополнительных информационных слоев.
  24.  
  25. Источники
  26.  
  27. Основным источником стала Википедия: в ней все есть, а больше мне не нужно было по определению проекта. Ну и еще много карт было взято с hist-geo.net
  28.  
  29. Структура данных
  30.  
  31. Не задумываясь о стеке, начинаю собирать в JSON-файлах данные.
  32.  
  33. Правители
  34. Портрет, имя на трех языках, годы жизни. Выписал 66 правителей.
  35.  
  36. Государства
  37. Годы и названия
  38.  
  39. Границы
  40. Описание границ напрямую связаны с целой папкой отрисованных карт. Помимо самих границ в картах еще показаны красной или синей штриховкой изменения границ. Немного жалею, что не сделали по ховеру на такие штриховки какой-нибудь хинт с причиной этого изменения.
  41.  
  42. Всего вышло 63 состояния границ. Конечно же, их было больше. Но эти — основные, как мне показалось.
  43.  
  44. События
  45. Собрали 170 ключевых событий. Я попробовал брать только те факты, которые широко известны в Беларуси, упомянуты в учебниках или еще не успели зарасти мхом истории. Проблематику отбора я описал выше.
  46.  
  47. Города
  48. Решил брать для Беларуси все города, для соседних стран — крупные города и столицы, для остальных стран только столицы.
  49.  
  50. Для объемности картинки города дифференцируются не только размером, но и прозрачностью.
  51.  
  52. А еще для крупных городов описал смену их названий. Например, Берестье → Брест-Литовский → Брест-над-Бугом → Брест.
  53.  
  54. Магдебургское право
  55. Собрал 40 пар «город — год наделения Магдебургским правом». И не пригодилось. Решил опустить, чтобы удешевить разработку. Тут очень много работы могло быть на самом деле: смена гербов, подобрать все, собрать спрайты. Решил сделать тупо по одному гербу на город. Потом будет видно. Ну, и кроме гербов менялись еще и статусы городов.
  56.  
  57. Оставил только смены столиц.
  58.  
  59.  
  60. Короче, вот оно — волшебное чувство: когда модель данных готова, и, кажется, сейчас просто отрендерить надо, и всё.
  61.  
  62. Фронт
  63.  
  64. Лайфхак. Если ваш пет-проект вам надоел и вы опустили руки, найдите чувака, который тебе под подъездом твоего дома объяснит тебе, что ты не прав, возьмёт на себе менеджерские обязательства, привлечет нужных людей и реанимирует проект. Так Виктор Якунин однажды вернул Мапу к жизни и привлек к проекту Женю Шпилевского и Анну Ширяеву.
  65.  
  66. Так вот. Сначала я, наивный албанский парень, сверстал таймлайн, подумал, что дело за малым — отрендерить карту, 63 состояния которой уже были отрисованы. И тут начались сюрпризы, которые я бы один не поборол. Пришёл Женя Шпилевский, посмотрел на мою связку JSON + PHP, поржал и все переписал на Handlebars так, чтобы все генерилось в статику. Теперь с высоты пережитого пика посещений, я понимаю, насколько дальновидный был Женя и как он спас мой дроплет на Digital Ocean.
  67.  
  68. [Скриншот папки проекта в Саблайме например]
  69.  
  70. Для рендеринга самой карты Женя предпочел canvas. Не могу сказать, что с canvas получилось все гладко, но с SVG было бы все сильно хуже с точки зрения отрисовки.
  71.  
  72. Короче, пришел Женя и порешал на canvas всю мою боль.
  73.  
  74. [Скрин из Фотошопа с тайлами]
  75.  
  76. Тачи
  77.  
  78. К черту. Дорого и никакого профита. Проще будет захардкодить вьюпорт, чтобы открывалась десктопная версия.
  79.  
  80. UPD. 10% заходов — айфоны.
  81.  
  82. Что можно было улучшить, и я об этом знаю
  83.  
  84. Хотелось переделать подсветку диффов
  85. Клик по персоне или событию
  86. Связывать геолокацию события с точкой на карте
  87. Белорусскость
  88.  
  89. Буквально за неделю до планируемого запуска я показал Мапу Денису Серебрякову и получил от него совет, который принес все волшебство. Денис посоветовал использовать ленточную антикву. В узких местных кругах она считается прототипом для национального шрифта. А Оптима самый красивый представитель класса ленточных.
  90.  
  91. Мапа заиграла. Интонация совпала с сообщением!
  92.  
  93. Партнерка
  94.  
  95. Летом пришла в голову идея заработать на Мапе. В конце концов, раз в нее вложено столько сил, можно попробовать окупить затраты. Мы решили найти компанию, которая купит партнерский пакет.
  96.  
  97. Например, это могло стать хорошей рекламой для алкоголя. Алкоголю в Беларуси очень сложно рекламироваться: многие рекламные носители закрыты для такой продукции. А тут Мапа, которой мы сулим много тысяч контактов. И вроде как в процессе переговоров было несколько диалогов, которые могли венчаться успехом. Но нет. Одна из причин фейла — конец финансового года, весь рекламный бюджет исчерпан.
  98.  
  99. Короче, нифига не вышло и мы забили. Я даже не расстроился. Наоборот, эта неудача меня немного успокоила. Ведь мог прийти какой-нибудь дядя с деньгами и исказить весь посыл, попросив убрать, например, восстание 1794 года, потому что ему Тадеуш Костюшко не нравится.
  100.  
  101. Нет времени объяснять. Запускаем после новогодних каникул.
  102.  
  103. Запуск
  104.  
  105. Важный момент — вовремя прекратить заниматься минорными багами. В какой-то вечер мы решили, что через неделю запуск, и все. Чтобы там ни случилось.
  106.  
  107. В день запуска, 25 января, было смешно вспомнить, что мы надеялись запустить проект аж 27 июля 2015 — на 25-летие независимости. До сих пор жалею.
  108.  
  109. Пет-проекты нельзя запускать дома, сидя на условной кухне в условных трениках. Нужно обязательно устроить маленькую церемонию. Даже если это будет чашка кофе с запеканкой в кафе по соседству.
  110.  
  111. Так и сделали.
  112.  
  113. [Скрин Мапы]
  114.  
  115. Спустя 10 минут после публикации на фейсбуке первый звонок — Радио «Свобода».
  116.  
  117. Белорусские СМИ
  118.  
  119. Социальные сети творят невозможное. За день пост про Мапу распространился на весь Байнет. Уже через три часа после запуска про карту написали все белорусские СМИ. Почти все. Не написала, как ни странно, «Хартия—97» — главный оппозиционный сайт Беларуси.
  120.  
  121. С citydog.by — городским журналом Минска — получилось странная ситуация. Они позвонили в числе первых и сами пригласили на интервью в оффлайне в конкретное место в конкретное время. Но по итоге девочка, которая мне звонила, сначала сообщила об опоздании, а потом вообще не пришла и перестала отвечать на звонки. Ситидог, ты серьезно так дела ведешь?
  122.  
  123. Тут.бай и Онлайнер — 1000 комментариев диванных историков, прочитав которые можно защитить докторскую по истории.
  124.  
  125. Кстати, на заметку белорусским маркетологам: Онлайнер обеспечивал половину трафика на сайт. Тут.бай — еще четверть.
  126.  
  127. Фидбек
  128.  
  129. По ощущениям:
  130.  
  131. 90 % — позитивные отзывы,
  132. 9 % — колкие отзывы, но с конструктивом,
  133. 1 % — негатив и претензии.
  134. В специально отведенную почту для ошибок пришло 150 писем. Среди них 40 «лонгридов», в которых серьезные ребята писали о тонкости изложения исторических фактов и наших ошибках. Очень радует, что люди не занимают позицию «рукі-ў-бокі», а прилагают усилия, чтобы улучшить проект. Я проникся невероятным уважением ко всем, кто написал и честно без копи-пейста отвечал всем и каждому. Честное спасибо всем, кто написал!
  135.  
  136. Типичные вопросы (и мои ответы)
  137.  
  138. Почему не осветили период до ВКЛ?
  139. Сложно. Чем старше карты — тем сложнее в них разбираться и связывать их с современными границами. Когда-нибудь мы наберемся терпения и исправим это.
  140.  
  141. Некорректный перевод имен собственных на английский язык.
  142. Наш косяк в том, что мы использовали польские и литовские переводы топонимов и имен вместо того, чтобы пользоваться своей родной «латинкой». Каемся. Исправили.
  143.  
  144. Shame!!!
  145. Получили пару дерзких писем от ребят из Литвы, которых что-то не устроило в Мапе. На самом деле я должен отметить, что большая часть писем из Литвы и Польши наделена деликатностью и конструктивом. За что им большое спасибо.
  146.  
  147. Хочется кликнуть на персону и событие.
  148. Мы поленились и не сделали этого. А ведь Денис Серебряков нас предупреждал, что это нужно исправить обязательно.
  149.  
  150. А где Беларусь на современной карте?
  151. Иностранцы пишут, что не понимают, где Беларусь сейчас. Поэтому скроллить Мапу интересно, но непонятно.
  152.  
  153. Метрики и цифры
  154.  
  155. 42 000 визитов в первый день
  156. Это больше чем город Рогачев, в котором я вырос и чью сгущенку вы едите.
  157.  
  158. 118 000 визитов
  159. За первые две недели.
  160.  
  161. 86 000 уников
  162. За первые две недели.
  163.  
  164. 7:36 (!)
  165. Среднее время, проведенное на сайте. С ума сойти: люди не просто смотрят на меняющиеся картинки, а действительно читают это. У нас получилось то, ради чего все затевалось!
  166.  
  167. 75 000 белорусов
  168. Увидело Мапу. Считай, каждый 150-ый белорус и каждый 200-ый минчанин.
  169.  
  170. ~5000 шейров
  171. На фейсбуке.
  172.  
  173. ~10 000 лайков
  174. Там же.
  175.  
  176. ~17 000
  177. Суммарное количество активностей на фейсбуке для трех языковых версий.
  178.  
  179. И пусть сейчас модный маркетолог сидит и с этих цифр порывисто смеется в стиле Шелдона Купера. А у меня такое в первый раз. Было интересно это все переживать.
  180.  
  181. Эти цифры в десять раз больше того, на что мы рассчитывали и того, что предлагали партнерам. Возможно, если бы мы были смелее тогда в прогнозах, то сейчас бы распиливали внешний долг Либерии.
  182.  
  183. Выводы
  184.  
  185. Важно иметь свой маленький проект.
  186. Свои проекты — источник профессионального развития.
  187. Сайт — это рупор. Если СМИ — это четвертая власть, то навык сделать сайт — это может стать пятой.
  188. Мне писали на белорусском в том числе и те, кого мы зовем хипстерами и фирмачами, мне писали девушки модельной внешности, успешные предприниматели и простые ребята. Такой вот приятный инсайт.
  189. Благодаря Мапе я действительно начал лучше разбираться в истории Беларуси. Особенно за счет писем, которые стали просто кладезем знаний.
  190. Современные границы — не абы что. Они действительно развивались столетиями. Некоторые современные границы были такими много веков назад.
  191. Когда читаешь книгу, то массивы фактов побиты по темам: войны, культура, политика, религия. А когда смотришь Мапу, видишь: Острожский и Скорина могли ходить друг к другу в гости в Вильне.
  192. Благодарности
  193.  
  194. Евгений Шпилевский
  195. Фронт-энд
  196.  
  197. Анна Ширяева
  198. Тексты и переводы
  199.  
  200. Виктор Якунин
  201. Менеджмент
  202.  
  203. Павел Кедич
  204. Важные советы
  205.  
  206. А теперь коуб
  207.  
  208. Не сделать грустный коуб под полонез Огинского? Я вас умоляю!
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement