Я хочу написать о онлайн приложении для создания стихов для Pinterest.
PoetryEditor - это полностью бесплатный онлайн инструмент для создания иллюстраций к вашим (и не только вашим) стихам.
Реклама ли это? в некотором смысле да, но этот сайт написал я, сам, лично, один, поэтому я имею моральное право говорить о нем как о своём детище))) тем более что созданные иллюстрации вы можете публиковать в любом месте, а не только в Пинтересте...
В этом онлайн редакторе я теперь делаю свои иллюстрации к стихам. За него не нужно никому и ничего платить, не нужна никакая аттрибуция, подписка, просмотр рекламы и так далее... всё бесплатно и свободно. Сам сайт я залил на гитхаб так что вы можете зайти и сами попробовать его по ссылке( https://deciptikon.github.io/PoetryEditor/ )...
Я не специализируюсь на создании сайтов, для меня этот опыт был довольно необычным, и я потратил целый день(даже почти сутки) на создание этого онлайн инструмента для оформления стихов как иллюстраций. (в принципе он буквально весь на банальном канвасе)
Что касается интерфейса этого сайта, в нем есть две ключевые кнопки, это круглая кнопка скачивания иллюстрации слева-снизу (в fullHD, в формате .png).
Сама иллюстрация, как это видно, располагается строго по центру страницы. Вообще я пытался сделать что бы всё было удобно и на ПК и на мобильных устройствах, но на мобилках так и не получилось достичь полноценной удобности, хотя на планшетах я думаю всё должно работать +- не плохо...
в правой части располагается выдвижная панелька инструментов.
Если нажать на неё появится специальное меню для редактирования основных параметров стихотворения. Они уже заполнены для примера, вы можете их отредактировать и поменять на свои.
Вот эта менюшка отдельно от всей страницы
Первая опция добавляет высоту
Вторая опция позволяет выбрать своё изображение в качестве заглавного для иллюстрации стихотворения, А так же третья опция, она позволяет поменять масштаб загруженного вами изображения. Позиционирование изображения на полотне иллюстрации производится мышью (или касанием для тачскрина), то есть нужно просто мышью двигать саму картинку, что бы добиться максимальной "красивости"...
Следующая опция позволяет выбрать собственный цвет заливки, лучше его подстраивать под загруженное вами изображение, что бы картинка как бы плавно растворялась в этом фоне, например как-то так (хотя это дело вкуса, мне так нравится больше). Так же вы можете поднастроить размер градиента, это нужно иногда, когда изображение имеет очень светлый участок на который попадает текст названия, и сливается с ним затрудняя чтение, во избежание этого лучше увеличить градиент и дать возможность тексту быть на чуть затемнённом изображении что бы повысить контрастность.
Настроить цвет текста (черный или белый) можно ниже, как и цвет подписи, я сделал для неё 3 цвета: светлый, тёмный и полутон(нечто среднее между светлым и темным). На картинке выше был по умолчанию выбран "полутон" и я сейчас поменяю его на светлый, так как фон и так близок к "полутону" по яркости, теперь подпись(под стихом) читается четче (а нужно ли?)
Остались собственно название стихотворения, текст стихотворения и текст подписи, я поменяю их для наглядности (а так же размер полотна, так как стихотворение короткое).
Вот и всё, можно скачивать.
Ещё кое что, этот сайт я делал в виде PWA, то есть по идее его можно установить как приложение на устройство: ПК или телефон/планшет.
Я пробовал в ЯндексБраезере... вроде всё работает. Не знаю пригодится ли это кому-нибудь, но я опишу процесс установки.
Для установки нужно, будучи на этом сайте, справа от адреса нажать на "три точки" и выбрать пункт "Установить как приложение"
А затем выбрать один из вариантов компоновки (потом их можно будет поменять)
Если установка прошла успешно, слева-внизу окна браузера появится значок приложения (и возможно само окно приложения)
Аналогично можно сделать и в других браузерах поддерживающих технологию PWA, включая мобильные браузеры, в них иконка приложения появится на главном экране смартфона/планшета как обычная программа...
Зачем это устанавливать??? ну причина только одна, эта штука работает без интернета, локально. А я, лично, добавил эту возможность просто так, я никогда не разрабатывал PWA поэтому решил потренироваться на этом проекте, вот и всё.
П.С. Если что-то сделаете, можете кинуть в комменты сюда иллюстрацию, мне будет приятно... дзен вроде позволяет картинки в комментариях, но если не хотите, то и ладно)))
П.П.С. Я ещё хотел добавить кучу других настроек по типу цвета рамки, её толщины и радиуса скруглений, но меню и так получилось очень нагруженное, для более широкого редактированию нужно переработать и меню, и возможно некоторые подходы к управлению. Я уже вряд ли буду это делать, но может когда-то сподоблюсь.