1

Этап 1

Виджет "кнопка с иконкой" для вставки в статьи сайта на базе WordPress

2

Этап 2

Вставка иконок в меню сайта на базе WordPress

3

Этап 3

Иконки для заголовков статей сайта на базе WordPress

4

Этап 4

Изучение библиотеки Vue

5

Этап 5

Анимация иконок

6

Этап 6

Интеграция наборов иконок Icons8 в плагин

7

Этап 7

Интеграция OpenSource наборов иконок в плагин

8

Этап 8

Иконки для категорий сайта на базе WordPress

9

Этап 9

Виджет "ссылки с иконками" для сайдбара на сайте на базе WordPress

10

Этап 10

Дополнительные визуальные параметры

1

Этап 1

Виджет "кнопка с иконкой" для вставки в статьи сайта на базе WordPress

2

Этап 2

Вставка иконок в меню сайта на базе WordPress

3

Этап 3

Иконки для заголовков статей сайта на базе WordPress

4

Этап 4

Изучение библиотеки Vue

5

Этап 5

Анимация иконок

6

Этап 6

Интеграция наборов иконок Icons8 в плагин

7

Этап 7

Интеграция OpenSource наборов иконок в плагин

8

Этап 8

Иконки для категорий сайта на базе WordPress

9

Этап 9

Виджет "ссылки с иконками" для сайдбара на сайте на базе WordPress

10

Этап 10

Дополнительные визуальные параметры

20 апреля 2017 31 августа 2017
Цель завершена 24 августа 2017

Автор цели

Общая

6000 установок иконок Icons8 для WordPress

Кто мы

Мы работаем в команде Icons8 — бесплатно рисуем иконки в стиле Flat по заявкам обычных пользователей и уже нарисовали 43 000 иконок. Также мы делаем много полезных бесплатных утилит для работы с иконками. Наш новый проект — плагин Icons Enricher для WordPress, который позволяет иллюстрировать сайты на базе WordPress аккуратными иконками.

Их можно использовать для меню навигации, для оформления блоков информации, для заголовков, кнопок и использовать в качестве иллюстраций прямо в текстах блога.

Цель

Сделать удобный инструмент для вставки иконок, который позволит использовать в сайтах на базе WordPress более 40000 иконок в векторном формате от команды Icons8 и более 10000 иконок из 30 популярных коллекций иконок и иконочных шрифтов, таких как FontAwesome, IonIcons, Linecons, Google Material Icons, LineAwesome.

--------------------------------------------------------

Что дают иконки обычному сайту?

Одна иконка заменяет несколько слов. В некоторых случая иконка вообще может заменить надпись. Она узнаваема независимо от того, каким языком владеет посетитель сайта. Она однозначно даёт понять, что эта кнопка - для скачивания ZIP, если подставить там иконку "download" или "ZIP".

В зависимости от стиля иконки, сайт может приобрести строгий стиль или, наоборот, стать более игрушечным.

--------------------------------------------------------

При разработке концепции плагина были учены шесть важных факторов:

1. Плагин Icons Enricher очень компактный

Более 50 000 иконок в форматах PNG и SVG - это 300 мегабайт данных даже в ZIP. Но плагин должен оставаться компактным, чтобы работать на бесплатных хостингах. В Icons Enricher включен только минимум файлов, остальное запрашивается с специального сервиса и сохраняется в блоге только при необходимости.
Он также компактен по программному коду - нет развесистой структуры классов PHP, нет громоздких скриптов JS. Все написано очень сжато. Скрипты и стили минифицированы.

2. Плагин Icons Enricher использует ассоциативный поиск

В других плагинах иконки традиционно неудобно искать. При использовании других плагинов пользователю приходится просматривать глазами огромные списки иконок, либо выбирать их из выпадающих списков, либо вводить имя иконки по памяти. В IonIcons около 900 иконок и я не помню как точно называется иконка "палец вверх". В Icons Enricher эту иконку можно найти по ассоциациям: «like», «good», «perfect», «like», «thumb», «approve», «hand» и много других. Ищи иконки по тому слову, которое тебе пришло в голову

3. Плагин Icons Enricher имеет много настроек для иконки и не теряет изящества интерфейса

Да, я опять про списки иконок. Их можно посмотреть глазами, конечно. А ещё можно сравнить иконки разных наборов. А ещё настроить отображение иконки: размер, цвет, отступы, анимацию, подложку...

4. Плагин Icons Enricher - мультифункциональный

WordPress устроен так, что записи блога, меню навигации, виджеты - это всё разные части, у каждого своя логика. Обычно для виджетов устанавливают плагин от одного автора, для меню навигации - плагин другого автора. Но как во всех этих плагинах выбрать одну из 50 000 иконок для меню навигации?

Плагин Icons Enricher позволяет использовать иконки в разных местах страницы сайта WordPress с одинаковым интерфейсом для поиска и настройки иконок. Он включает в себя надстройки для меню навигации, для заголовков, для категорий, виджеты и мини-коды для вставки аккуратных кнопок-ссылок, с приятной ненавязчивой анимацией.

5. Плагин Icons Enricher экономит трафик

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

  • использовать встроенные в плагин файлы, чтобы они загружались с самого сайта автора блога
  • или загружать файлы со сторонних серверов

Это экономит трафик и ускоряет работу блога.

6. Плагин Icons Enricher следит за целостностью стиля

Бывает возникает необходимость вставить на одну страницу две иконки, но какая-то из них найдена в коллекции LineAwesome, а какая-то в Stroke7. Эти коллекции нарисованы в разном стиле: отличается толщина линий, отступы, способ заливки.

Некоторые иконки имеют базовый тон (как коллекция иконок Ultraviolet) или набор цветов как коллекция иконок в стиле Microsoft Office.

Плагин следит за тем, какие иконки используются на странице. Если он обнаружит, что иконки разного стиля - предупредит об этом и предложит иконки на замену.

--------------------------------------------------------

Скачать плагин Icons Enricher можно уже сейчас, бесплатно, без SMS, без рекламы

Попробовать в действии на специальной demo-странице

Ознакомиться с планами и добавить свои идеи

Посмотреть статистику по количеству установок и количеству иконок

--------------------------------------------------------

Это был питч про плагин, небольшой устный доклад про несуществующий пока проект. Если тебе интересно всё, что здесь написано, то значит было правильным решением создать его.

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

Итак, его ещё предстоит сделать настолько хорошим, насколько мы сами себе это представляем.

 Критерий завершения

1. Плагин для WordPress имеет 6000 инсталяций

2. С помощью плагина можно работать с 50 000+ иконок в векторном и растровом формате

 Личные ресурсы

Умею программировать, есть команда из дизайнеров, знаю CMS WordPress, есть достаточное количество свободного времени

 Экологичность цели

Хочу помогать людям

  1. Виджет "кнопка с иконкой" для вставки в статьи сайта на базе WordPress

  2. Вставка иконок в меню сайта на базе WordPress

  3. Иконки для заголовков статей сайта на базе WordPress

  4. Изучение библиотеки Vue

    Для создания удобного интерфейса требуется реализовать его на базе фреймворка для Single Page Application
    Фреймворк должен быть маленьким (требование компактности) и с удобной внутренней архитектурой, чтобы не запутаться когда плагин станет сложнее

  5. Анимация иконок

  6. Интеграция наборов иконок Icons8 в плагин

    Вся коллекция Icons8 = более 40 000 иконок в 10 стилях

    1. Иконки в формате PNG с размером до 100px

    2. Иконки в формате PNG с размером до 1024px

    3. Иконки в векторном формате SVG

  7. Интеграция OpenSource наборов иконок в плагин

    1. Line Awesome

    2. Font Awesom

    3. Google Material Icons

    4. IonIcons

    5. Foundation

    6. Glyphicons

    7. Icomoon Free

    8. Webhostinghub

    9. Entypo

    10. Elusive

    11. Mfglabs

    12. Raphael

    13. Simple Line

    14. Weather Icons

    15. Linecons

    16. Meteocons

    17. Metrize

    18. Octicons

    19. Iconic

    20. Maki

    21. OpenWeb icons

    22. Stroke7

    23. Typicons

    24. Zocial

    25. Brandico

    26. Fontelico

  8. Иконки для категорий сайта на базе WordPress

  9. Виджет "ссылки с иконками" для сайдбара на сайте на базе WordPress

  10. Дополнительные визуальные параметры

    Практически все иконки с прозрачной подложкой. Можно настроить подложку чтобы иконки были на сплошном фоне с скруглёнными углами и обводкой.

    1. Подложка под иконку разного цвета и формы

    2. Обводка подложки разного цвета и толщины

    3. Дополнительные CSS классы для стилизации всех иконок

  • 67121
  • 20 апреля 2017, 06:11

Вывод

127день
Pavel Volyntsev24 авг. 2017, 03:18

Предупреждение для самого себя в будущем или прошлом

Для любых серьёзных экспериментов с чем-либо неизвестным нужны запасы ресурсов: сил, знаний, времени и финансов. Если чего-то будет не хватать, то на "закрытие прорехи" ресурсы придётся перераспределять. И цель начнёт страдать от недостатка скорости.

WordPress оказался орешком, над которым я сломал два зуба. Я рискнул взяться за это без подготовки, не изучив инфраструктуру WordPress и маркетинг плагинов + рискнул отказаться от основной работы ради проекта. Однако сразу же после принятых решений всё пошло наперекосяк. У меня образовался недостаток знаний (спасибо, помогли ребята в команде), и пришлось перераспределять финансы, которые тоже не бесконечны. Для компенсации расходов начал тратить время на сторонние проекты. В итоге нет ничего, кроме текущей версии плагина и списка задач длинной в 40 пунктов с направлениями, по которым можно было бы вести разработку и маркетинг.

По поводу цели "6000 установок"

Плагин опубликован, работает стабильно, сайт поддержки работает, количество установок потихоньку прибывает. Без киллер-фичи плагин не сильно отличается от аналогов. Только интерфейс поинтереснее.

По поводу указанных в цели пунктов

Готова "порция кода" для расширения функциональности плагина: иконки от Icons8 и встраивание в меню, категории, совместимость с WooCommerce. Ещё одну версию выпустить можно. Вопрос свободного времени. Возможно, в начале сентября.

Вывод по всей цели

Либо я повторю опыт позже, имея запасы. Либо больше вообще не сунусь в область маркетинга таких мелких независимых вещей, как один-единственный плагин под WordPress, каким бы удобным он не был. Это как бросать силы на разработку и маркетинг одной единственной пары золотых серёжек среди всего разнообразия украшений из разных материалов.

Большое спасибо

Команде Icons8 за то, что позволили экспериментировать, за финансирование и ценные советы.
Алексею и Розе за помощь в разработке плагина и сайта поддержки.
Команде SmartProgress за спец проект.
И всем подписавшимся на цель за поддержку.

Компенсация за разрушение надежд
Тем, кто ждал плагин с убойным количеством классных иконок чтобы оформить свои сайты на базе WordPress, но не дождался - выдам секретный имейл и пароль от сервиса icons8.com.

Срок действия до 30 сентября 2017 года.

Чтобы получить - отправьте мне сообщение со страницы https://enricher.icons8.com/contact или тут в личной переписке на SmartProgress.

"Хотели заработать денег, но нет - опять опыт" - я с этим тоже сталкивался и сталкиваюсь сам. Спасибо за развернутый итог по цели - полезная информация.

Я вот только не сообразил icon8 это и есть ваша компания и плагин? Или плагин и icon8 это разное? Немного запутался.

Как получить секретный email? )

Pavel Volyntsev24.08.2017

Я работал в Icons8. Это не моя компания. Я хотел "отпочковаться" и заняться интеграцией. Такими решениями, которые расширяют возможности сторонних продуктов, добавляют в них работу с векторными иконками от команды Icons8. Важный самостоятельный шаг, но запутался в своих же шнурках.

Про "денег и опыт" - золотые слова.

Pavel Volyntsev24.08.2017

Ян Швейковский, напиши мне в личке, пожалуйста.

Дневник цели

Комментарии

на чем будут зарабатываться деньги?

Pavel Volyntsev07.07.2017

Иконки Icons8 доступны по платной подписке

Pavel Volyntsev, Цель продолжается?

Pavel Volyntsev24.08.2017

ibrokhimdofficial, пришлось отложить. Форс мажор в личной жизни. Даже не уверен, что найду время для продолжения.

56день
Pavel Volyntsev14 июня 2017, 17:49

Вышел из строя ноутбук. На восстановление рабочего окружения уйдет некоторое время. Диски HDD/SSD не пострадали, проект продолжает жизнь.

Комментарии

На сайте появятся смайлики?)

Pavel Volyntsev09.06.2017

Ты про сайт на WordPress? Да, можно будет вставлять в свой сайт разные смайлы: вот примеры https://icons8.com/icon/set/smiles/all

У уже использованных OpenSource иконок и иконок от Icons8 не очень большой выбор смайлов. К сожалению. Но можно вставить иконки как иллюстрации практически на любую тему. Мы даже выпускали набор смайлов для приложения iMessage чтобы люди могли переписываться вообще без слов :) https://icons8.com/imessage

Пример переписки

http://a3.mzstatic.com/us/r30/Purple71/v4/89/b3/b3/89b3b37b-5334-c27d-d02b-5b7c9e0185c9/screen696x696.jpeg

49день

Запись к этапу «Изучение библиотеки Vue»

Pavel Volyntsev7 июня 2017, 16:44

Отличная подборка ресурсов по библиотеке Vue

https://github.com/vuejs/awesome-vue

46день

Запись к этапу «Интеграция наборов иконок Icons8 в плагин »

Pavel Volyntsev4 июня 2017, 07:38

Код JS получается очень громоздким, если реализовать все-все-все такие же проверки, как реализованы на https://icons8.com/

  • Некоторые иконки доступные в формате PNG размером до 100px
  • Некоторые иконки доступны всегда во всех размерах и форматах
  • Иконки, которые пользователь уже использовал, должны остаться в WordPress доступными для дальнейшего использования

Упрощаем логику, понимая, что в итоге часть пользователей сайтов на WordPress может найти плагин не очень полезным:

  • Не используем иконки в формате PNG - такие иконки придётся хранить во всём разнообразии выбранных цветов и размеров, а также учитывать экраны высокого разрешения (Retina) и хранить по две-три копии разного размера (x1, x2, x3)

И при это сохраняем в WordPress реестр уже использованных иконок, а также подсвечиваем их в результатах поиска. Как утверждает лицензия Icons8 - "если вы что-то получили от нас, вы можете пользоваться этим вечно".

46день

Запись к этапу «Интеграция наборов иконок Icons8 в плагин »

Pavel Volyntsev4 июня 2017, 07:23

Иконки Icons8 доступны через API. Есть три версии документации:

1. Старая публичная https://api.icons8.com/

2. Новая публичная http://docs.icons8.apiary.io/

3. Закрытая

Смесь - некоторые операции возвращают JSON, некоторые - XML. Много лишних и служебных данных. Некоторые операции не описаны, например, авторизация и получение информации об отдельной иконке. Если бы я не имел доступа к исходникам, на этом можно было уже закончить разработку и попрощаться с этой огромной коллекцией иконок. А там уже не 40 000, а 50 000+ иконок, потому что ребята выпустили 6 новых пакетов
И всё это должно работать на PHP разных версий, даже если там не подключены такие библиотеки, как php_xml. Приходится "расковыривать" XML через регулярные выражения.

Работаем над тем, чтобы иконки, полученные от сервиса Icons8 сохранялись в директориях сайта на базе WordPress. Чтобы не надо было забирать их каждый раз по сети.

43день

Запись к этапу «Интеграция наборов иконок Icons8 в плагин »

Pavel Volyntsev1 июня 2017, 02:03

Небольшая пауза с новым релизом. Сделали много, но чтобы изменения прошли на wordpress.org и не испортили сайты, надо оптимизировать, защитить и ускорить код.

Иконки Icons8 уже интегрированы. Выглядят отлично.

35день
Pavel Volyntsev24 мая 2017, 17:17

Вчера выпустил релиз плагина - теперь там 3067 иконок и новая фича - можно установить иконки для меню навигации.
Уже залил себе в блог - выглядит очень аккуратно.

На этой неделе тестирую и выпускаю ещё одну фичу - отображение иконок вместе с заголовками статей.
Готовится подключение иконок Icons8 - 40 000 иконок прям ждут, когда они встроятся в плагин :)

30день
Pavel Volyntsev19 мая 2017, 17:09

Немного картинок из процесса разработки новых фич и новых наборов иконок.

Вы тоже можете
опубликовать свою
цель здесь

Мы поможем вам ее достичь!

309 000

единомышленников

инструменты

для увлекательного достижения

Присоединиться
Регистрация

Регистрация

Уже зарегистрированы?
Быстрая регистрация через соцсети
Вход на сайт

Входите.
Открыто.

Еще не зарегистрированы?
 
Войти через соцсети
Забыли пароль?
Maksim Malikov
МКС
светлана
Наталья
Ehhhhh
Алексей Щепкин
Ян Швейковский
Ян Швейковский
Илья
Ян Швейковский
Айдар
Денис Янчевский
Людмила
Андрей
Ян Швейковский
Ян Швейковский
Allii
Ян Швейковский
Илья
Ян Швейковский
Илья
Ян Швейковский
Илья
Ян Швейковский