UseShots Editor v0.4 released

1. Выпущен UseShots Editor v0.4

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

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

2. Таймер

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

У таймера 3 режима:

1. Off (отключен) - Снимок делается сразу же после нажатия кнопки “Shoot” .
2. 5s - Снимок делается через 5 секунд после нажатия кнопки “Shoot” .
3. 10s - Снимок делается через 10 секунд после нажатия кнопки “Shoot” .

3. Как использовать таймер, чтоб сделать скриншот?

1. Спозиционируйте камеру UseShots так, чтоб нужная область экрана попала внутрь красной рамки камеры.
2. Убедитесь, что нужный вам элемент при активации полностью попадает в зону съёмки.
3. Выберите задержку таймера (5 с или 10 с). Убедитесть, что этого времени достаточно, чтоб активировать нужный элемент интерфейса.
4. Нажмите “Shoot”. Начнётся обратный отсчёт таймера.
5. Активируйте нужный элемент. Когда обратный отсчёт закончится, будет сделан снимок выбранной области экрана и вставлен в редактор UseShots.

Подсказка: Область внутри красной рамки камеры может рассматриваться как дыра в окне камеры. Вы можете работать мышью с окнами, расположенными под камерой внутри красной рамки.

4. Вставка изображений из буфера обмена

Чтобы вставить изображение из буфера обмена в редактор UseShots, сделайте щелчёк правой кнопкой мыши в области для втавки изображения и выберите Paste image. Эта опция доступна, только если в буфере обмена уже находится изображение.

С помощью этой функции легко делать скриншоты всего экрана и отдельного активного окна.

• Чтоб сделать снимок всего экрана и поместить его в буфер обмена, нажмите Print Screen на клавиатуре.
• Чтоб сделать снимок активного окна и поместить его в буфер обмена, нажмите ALT + Print Screen на клавиатуре.

Далее втавляйте этот снимок в редактор UseShots, выбирая “Paste image” из меню по щелчку правой кнопкой мыши.

Таким образом (по ALT + Print Screen) можно сделать скриншот окна UseShots Editor’а, которое прячется, когда делаются скриншоты с помощью камеры.

5. Вставка изоброжений из файлов

То же самое меню (пункт Load image…), открываемое по щелчку правой кнопки мыши, можно использовать для вставки скриншотов (и других изображений) из файлов.

В текущей версии можно загружать изображения из BMP, JPG и GIF файлов.

6. Другие улучшения

• Улучшенное качество изображений, сохраняемых в GIF формате.
• Тэги em и strong добавлены в список HTML тэгов, которые можно использовать при написании статей вUseShots Editor’e. Другие тэги из этого списка a, b, i, u, div, span.
• * Use Agent - теперь UseShots Editor можно легко обнаружить в логах вашего веб сервера по строке “UseShots Editor <версия>”

7.

UseShots Editor v0.4 был протестирован на блогах на основе WordPress 2.3 и WordPress 2.5 (Можете посмотреть статью о редакторе постов в WordPress 2.5, созданную в UseShots Editor v0.4 и опубликованную в моём блоге, работающем на движке WordPress 2.5.)

Скачать последнюю версию UseShots Editor’a можно здесь.

Версия 0.4 совместима с предыдущими версиями, и может быть установлена поверх них. (Уже созданные статьи сохранятся).

Так же была обновлена инструкция Первые шаги с UseShots Editor’ом.

Приветствуются любые пожелания, баг репорты и комментарии.

Tags: clipboard, timer, update, v0.4

My favorite WordPress 2.5 improvement: the new post editor.

1. Редактор

Уже несколько дней я тестирую WordPress 2.5 на своём компьютере и должен признать, что новая версия мне нравится.

А больше всего мне нравится новый редактор постов. В версии 2.5 используется TinyMCE v3.06 (v2.1.1.1 использовалась в WP 2.3.2) , и он показывает себя значительно лучше своего предшественника.

Позвольте мне по-подробнее остановиться на улучшениях.

2. Полноэкранный режим

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

3. Пермалинк

Прямо под заголовком статьи теперь можно видеть пермалинк (URL), по которому статья будет доступна после публикации. И если вам пермалинк не нравится, то вы тут же можете его изменить. Это куда более красивое и удобное решение, чем невнятный “post slug” в предыдущих версиях.

4. Add media toolbar

Тулбар “Add media” для меня не является особым улучшением, скорее изменением в интерфейсе. Это то, что пришло на замену секции для закачки файлов, которая была располагалась раньше под редактором. Если вы ищете, как теперь закачивать файлы на сервер, то нажимайте на одну из четырёх кнопок этого тулбара, позволяющего добавлять картинки, видео, аудио и прочие файлы.

5. Media Library

А вот Media Library (то, что раньше называлось “Browse All” в секции для закачки файлов) - это действительно заметное улучшение. Здесь теперь не просто показывается список закачанных файлов. Теперь можно отдельно увидеть файлы определённого типа (только картинки или только музыку, или только видео.), а также ограничить список файлами, закачанными в определённый месяц. Есть и возможность поиска файлов. Всё это сильно упрощает процедуру выбора файлов, если у вас их очень много.

6. Режим HTML

Есть приятная новость и для тех, кто привык работать напрямую с HTML. Теперь WordPress сохраняет его без изменений.

Раньше за редактором водился неприятный грешок менять без спроса HTML код по своему разумению. Даже если не была включена опция “WordPress should correct invalidly nested XHTML automatically” (WordPress должен автоматически исправлять неверно вложенный XHTML). Например, он менял div‘ы на старомодные p, совершенно не учитывая вложенность этих div‘ов, тет самым портя фоматирование.

Такое поведение редактора косвенно сказывалось и на статьях созданных в UseShots Editor’е. Для большей гибкости в форматировании статей, UseShots Editor использует CSS и div‘ы. Вся статья - это div. В ней каждый экран - это div. В каждый экран вложены div‘ы скриншота и аннотации. Если публиковать статью напрямую из UseShots Editor’а, то она сохранятся корректно, с неизменённым форматированием. Однако, если вы захотите после публикации отредактировать статью в онлайн редакторе WordPress’а, то все div‘ы будут без предупреждений изменены на p. В результате, форматирование статьи нарушается. К счастью, внешний вид статей созданных в UseShots Editor’е не сильно страдает от подобных фокусов с HTML кодом, но сам факт того, что WordPress не в состоянии сохранить ваш код в том виде, в каком вам надо, означает, что вы не можете расчитывать на то, что CSS в ваших статьях будет работать как надо, и что можно использовать только простейшие конструкции HTML, а это довольно паршиво.

Теперь, с выходом WordPress 2.5, эта проблема, хочется надеяться, осталась в прошлом. Во всяком случае, те конструкции, которые я тестировал, оставались в неизменном виде после сохранения статей. А это значит, что теперь можно спокойно редактировать статьи, созданные с помощью UseShots Editor’а, не опасаясь за сохранность форматирования.

Приятно видеть, что творческие замыслы больше не ограничены бестолковым редактором.

7. Время апгрейдить блог

Подытоживая, могу сказать, что WordPress 2.5 оставляет очень приятные впечатления. Он стоит того, чтоб потратить полчаса на апгрейд.

P.S.

Если вы желаете читать этот блог преимущественно по-русски, кликните на российском флаге в правой колонке. Тогда автоматически будут открываться русские версии страниц.

Tags: post editor, TinyMCE, WordPress 2.5

Предварительный анонс версии 0.4

Версия 0.4 почти готова. Осталось только протестировать её с новой
версией WordPress’а 2.5 и переписать инструкцию “Первые шаги с …“, и
тогда можно будет делать официальный релиз.

Что нового в версии 0.4?

• Таймер. Нужен, например, чтоб делать скриншоты открытых пунктов меню.
• Вставка картинок из буфера обмена.
• Вставка картинок из файлов.
• Некоторое улучшение качества скриншотов сохраняемых в GIF формате.
• Теперь UseShots Editor можно будет находить в логах веб сервера по  строке “UseShots Edition <версия>” в поле User Agent.

Если к тому времени, когда вы читаете это сообщение, версия 0.4 ещё не будет официально выпущена, то можете скачать предварительную версию со станицы для скачивания, найдя там внизу ссылку development version.

Версия 0.4 совместима с предыдущими версиями 0.2.х.х, и её можно ставить поверх уже установленных копий.

Любые замечания и пожелания только приветствуются.

Tags: update, version 0.4

Новая версия: UseShots Editor теперь легко использовать для работы с несколькими блогами.

1. UseShots Editor v0.2.3.37

UseShots Editor - это программа, с помощью которой можно легко создавать и публиковать блогпосты со скриншотами (инструкции, обзоры, баг репорты). Сегодня для скачивания на сайт выложена версия 0.2.3.37.

2. Профили сайтов

В этой версии я добавил профили сайтов в UseShots Editor. Профили сайтов позволяют публиковать статьи на различные сайты. Если у вас, как у меня, несколько блогов, то вы оцените эту фичу. Теперь не надо каждый раз, когда вы захотите опубликовать статью не на том же сайте, что и прошлую, полностью менять настройки (размер скриншотов, адрес, имя пользователя). Нужно лишь заранее заполнить профили для всех блогов, с которыми вы работаете. После этого выбор сайта, на котором нужно опубликовать статью, сведётся к одному щелчку мыши.

3. Редактирование профилей

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


Для тех, кого беспокоит сохранность паролей, я добавил чек-бокс “Save username and password” (сохранить имя пользователя и пароль). Снимите с него галку, если не хотите, чтоб UseShots Editor сохранял ваши данные для авторизации. Оставьте галку, если не хотите каждый раз заново вводить имя пользователя и пароль.

4. Другие блог-платформы

Добавление профилей сайтов - это ещё один шаг в напралении работы в различными блог-платформами. Скоро вы сможете публиковать UseShot’ы (статьи со скриншотами, созданные в UseShots Editor’е) не только в WordPress’овских блогах.

5. Тестирование и отзывы

Кое-кто возможно заметил, что на прошлой неделе можно было скачать с сайта неофициальные версии 0.2.3.35 и 0.2.3.36. Я собираюсь продолжить эту практику и делать доступными для скачивания новые версии, не прошедшие ещё полного тестирования. Заходите время от времени на страницу для скачивания и ищите ссылку “development version”. Эта ссылка только для тех, кто не хочет ждать выхода стабильной версии и готов рискнуть поставить себе ещё сырую программу. Эта ссылка и для тех, кто хочет помочь мне с тестированием.


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

Tags: site profiles, update

UseShots Editor is on the home page of ZDNet.nl

Tags: UseShots Editor, ZDNet

Google, any idea already?

I constantly use Google as a translation tool when writing something in English. If I’m not sure I’m using some word or phrase correcly, I type it in quotes in the Google toolbar and check the search results, which usually help me identify the most appropriate usage.

Unmatching result estimates and pagination

This time I checked the “any idea already” word combination and was very surprised with the results page (larger picture)

2,700 results. 10 results per page. How many pages?

Google’s estimates on total results count have never been very accurate and they never show more than 1,000 results for any search, but you don’t usually question their trustworthiness.

4 pages. Surprise!

How come they have only 4 pages for 2,700 results?

Page #3 is the last page

And it looks like the page number estimate is more accurate than the one at the top of the page. I can browse no further than page #3.

It looks like Google has reached the size of Microsoft, and have different teams working on different parts of the search result pages. They should definitely have the “top-of-the-SERP-estimates team” use the same database as the “pagination team”. ;-)

I still don’t know if I can use the word combination. Google, any idea already? ;-)

P.S. This is a sample article created using UseShots Editor

Tags: google, sample

Обновление: Теперь можно сохранять статьи как черновики.

Спасибо всем, кто попробовал UseShots Editor. Только 5 дней назад открылся этот сайт, был лишь небольшой анонс на форуме Wеblog Tools Collection, а люди уже начали заходить, качать, оставлять отзывы, присылать баг репорты (ничего серьёзного, в новой версии почти всё починено).

И вот уже готово первое обновление. (Я не Майкрософт, мне не нужно тратить месяцы на согласование и обкатку каждой новой фичи.) Версию 0.2.3.32 можно скачать здесь.

Что нового?

• 1 баг починен: в прошлой версии иногда не публиковался последний скриншот в статье.
• 1 новая фича: можно сохранять статьи как черновики (drafts).

Почему я первой добавил именно возможность сохранять статьи в WordPress’е как черновики?

1. Это был самый первый запрос в комментах блога.
2. Это очень важно для тех, кто хочет попробовать мою программу, но боится что-нибудь испортить в своём блоге. Это и понятно. Программа новая, автор неизвестный. Нет никакой гарантии, что публиковаться будет только то что нужно и как нужно, что не будет вставляться ничего лишнего (скрытых ссылок или вредоносного кода). Теперь вы можете легко развеять свои подозрения, без необходимости публиковать сразу же статьи доступные для всех посетителей вашего сайта. Просто сохраните статью как черновик, зайдите в контрольную панель сайта и откройте сохранённый черновик для редактирования (UseShots предоставит вам прямую ссылку для редактирования черновика.) Тут уже вы можете проверить весь код статьи, изменить форматирование, убедиться, что UseShots выполнил всю работу правильно, и уже после этого со спокойной душой опубликовать статью для всеобщего доступа.
3. Предварительно сохраняя статью как черновик, вы получаете возможность обойти текущие ограничения программы: отсутствие поддержки категорий WordPress’а и отсутствие WYSIWYG редактора и проверки правописания. На странице редактирования черновика в контрольной панели WordPress’a вы сможете окончательно отредактировать статью в WYSIWYG редакторе с проверкой правописания и назначить статье подходящие категории.
4. Возможно вы знаете, что не все пользователи могут публиковать статьи в WordPress’е. Есть такая роль - “contributor”. Контрибьюторы могут редактировать статьи, сохранять их как черновики, но не могут публиковать их (нужен кто-то с большими правами, чтоб публиковать эти статьи). Теперь даже контрибьюторы смогут воспользоваться UseShots Editor’ом.

Вот как бывает. Добавился в программу один маленький check box, а польза от него огромная. Теперь у вас гораздо меньше поводов не пробовать UseShots Editor. Настройки на сервере никакой не требуется, риска что-нибудь испортить нет. Скачивайте и пользуйтесь.

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

Tags: draft, update

Скриншоты для блогов (Встречайте UseShots.)

Наконец, я готов представить на суд публики программу, над которой работал в свободное время несколько последних месяцев. UseShots Editor - бесплатная специализированная программа для блоггеров, которым часто нужно вставлять в свои статьи разнообразные скриншоты (скачать здесь).

Для названия программы я придумал слово UseShots (читается ЮсШотс). Для себя я определил это слово как Useful Screen Shots (полезные скриншоты). Это скриншоты, которые совместно с текстовыми описаниями показывают, как пользоваться (use) тем, что на них изображено, и тем самым приносят пользу (use).

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

Типичная последовательность действий была следующая. Print Screen. Потом вставлял экран в графический редактор. Вырезал нужную мне часть. Смотрел, подходит ли картинка по ширине к колонке блога. Если не подходила, то было два варианта. 1. уменьшить картинку. 2. Уменьшить размеры окна программы и сделать скриншот заново.

Уменьшение изображений
Оба варианта сопряжены с определёнными проблемами. Уменьшать картинку нужно было с умом, чтоб качество изображения оставалось приемлемым и не терялись мелкие детали. В общем случае уменьшение в 2 и 4 раза давало приемлемое качество изображения, но иногда при таком уменьшении терялись важные детали, мелкий текст становился нечитаемым, при других же степенях уменьшения, картинка получалась как бы “грязная”. Поэтому приходилось прибегать ко второму способу. Изменять размеры окна и переснимать скриншот, и возможно не один раз. Тут я очень пожалел, что не могу изначально узнать, какого размера нужные мне элементы, перед тем как делать скриншот.

Формат изображений
Когда получалась картинка подходящего качества, то вставал следующий вопрос: в каком формате её сохранять. Обычно рассматривалось 2 варианта: GIF и JPEG. Основным критерием был размер получаемых файлов при сохранении хорошего качества изображения. (Меня раздражает, когда приходится скачивать скриншоты в несколько сотен килобайт, когда в более оптимальном формате их размер был бы в несколько раз меньше. Маленький размер скриншотов так же является плюсом при ограниченном месте на сервере и при минимизации траффика.) В общем случае, GIF лучше подходит для текста и элементов интерфейса, преимущественно монотонных, в которых переход цвета, происходит резко, в то время как JPEG для элементов с плавными переходами цветов (фотографии, графика, уменьшенные изображения элементов интерфейса) .

Закачка скриншотов
Текст статьи писался в веб-интерфейсе в контрольной панели блога. Чтоб там увидеть картинки, нужно указать ссылку на файл изображения в интеренете. Значит, сперва надо закачать файлы на сайт. Это можно делать по-разному, но в любом случае надо:

1. вспомнить имена файлов и куда их сохранил (скриншоты могли быть сделаны и неделю назад, и среди них есть черновые версии, которые закачивать не надо)
2. точно сопоставить ссылки на закачанные файлы с конкретными картинками, чтоб вставить их в нужные места в статье (особенно важно, если у файлов изначально были малоговорящие имена типа 1.jpg, 5.jpg, etc.).
3. ну и потом каждую ссылку нужно вручную вставлять (а картинок может быть больше десятка).

И вот, когда картинки закачаны на сайт и вставлены в черновик статьи, приходит озарение (чтоб его!), что один из шагов можно было проиллюстрировать удачнее, или обращаешь внимание, что на скриншоте светится твой личный email, и его нужно убрать. А значит снова нужно делать/переделывать скриншот и по-новой закачивать его на сайт.

В итоге, одну статью я всё таки закончил, но полностью потерял желание делать другие статьи подобным образом. Слишком уж много лишних усилий нужно было тратить на второстепенные задачи. Времени всегда мало. Других дел - по горло.

Поиск готовых решений
Но необходимость в иллюстрированных статьях не исчезла. Начал я просматривать различные оффлайн редакторы для блогов и утилиты для скриншотов, но ничего подходящего не нашёл. Редакторы могли только вставлять готовые картинки, а программы для скриншотов ограничивались только изображениями. В результате чтоб сделать и опубликовать статью, нужно пользоваться двумя-тремя различными программами, не все из которых бесплатные. Да и лишняя морока с файлами (в каком формате сохранять, куда сохранять, откуда вставлять) никуда не девается. Вот если бы в одной программе всё это делалось (мечтательно) !

Идея
А что? Это - идея! Программировать умею.Ничего супернавороченного вроде не требуется. Получился вот такой список основных требований к программе:

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

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

UseShots и цифровые фотоаппараты
Для этой задачи переход на использование UseShots Editor’ом мне показался сходным с переходом на использование цифровых фотоаппаратов, после старых плёночных мыльниц. Помните, раньше чтобы просто узнать получился ли снимок, после того как его сделал приходилось ждать, пока отснимется вся плёнка. Потом идти проявлять плёнку, печатать фотографию. И через неделю после возвращения из отпуска обнаружить, что плёнка была бракованная и все снимки безвозвратно пропали. С цифровыми фотоаппаратами жизнь наша стала легче. О плёнках больше не надо беспокоиться, щуриться в глазок видоискателя тоже - что видно на экране, то и на фотографии будет. Сразу можно посмотреть, удачный получился снимок или нет. Неудачный удалить и тут же переснять. Ничего проявлять не нужно, можно сразу же показывать отснятые кадры друзьям. Не случайно, в UseShots для снимков экрана используется “камера”, по принципу действия напоминающая цифровую фотокамеру (со скидкой на особенности работы компьютерных программ).

UseShots для всех
Начав работать над этой программой, я подумал, она могла бы пригодиться не только мне одному. В конце концов, очень многие блоггеры, особенно пишущие на компьютерные темы, вставляют в свои статьи скриншоты (от чего, имхо, их статьи только выигрывают). А сколько разработчиков программ могли бы делать серии иллюстрированных тьюториалов(как tutorial по-русски?) на своих блогах? Служба поддержки могла бы публиковать иллюстрированные инструкции для пользователей. На внутренних серверах компаний могли бы публиковаться инструкции для новых служащих, иллюстрирующие, как выполняются те или иные служебные задачи. Возможно, кто-то уже задумывался о подобном использовании блогов, но, столкнувшись с трудностями, подобными тем, что я описал в начале этого поста, решил забросить эту идею.

Поэтому, я решил выложить свою разработку на сайт для общего пользования. Пока программа только на ранней стадии разработки. Ещё много идей не реализовано, но программой уже вполне можно пользоваться. Она прошла предварительную обкатку на компьютерах моих друзей (спасибо им) и показала себя довольно работоспособной.

WordPress
Текущая версия программы (0.2) работает только с блогами на движке WordPress. Этот движок был выбран благодаря своей популярности (миллионы блогов. Думаю, он входит в тройку наиболее популярных движков), развитой системе плагинов, развитому API и возможности программно закачивать файлы (первоначально думал о Blogger’е, но не нашёл в его API фукции для закачки файлов). А также, у WordPress есть бесплатный хостинг для блогов на WordPress.com c кучей места для закачки своих файлов (3Гб). Там можно выбрать русифицированную версию. Есть сайты, пишущие о WordPress на русском языке.

Среди ограничений и недоработок текущей версии

• Работает только на Windows (2000, XP, может быть Vista). Скорее всего не будет нормально работать на Win95, Win98 и WinME. (Это ограничение не касается самого блога)
• Публикация только на WordPress-овские блоги. Тестировалось на версиях 2.3+ (Поддержка других блог-платформ планируется.)
• Нет WYSIWYG редактора текста. Но в обычный текст можно вставлять ограниченный набор html тэгов (b, i, u, a, span, div), так что при умелом использовании в купе с CSS можно получить приличное форматирование.
• Пока не поддерживаются Категории WordPress’а. Статьи постятся в категорию по умолчанию. Но поддерживаются тэги. Можете ими пользоваться как своеобразной альтернативой категориям. (Поддержка категорий планируется).

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

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

Начну с ссылки на свою статью, которая от начала и до конца была создана и опубликована с помощью UseShots Editor’a. “Первые шаги с UseShots Editor’ом” - иллюстрированная пошаговая инструкция для всех желающих познакомиться с моей новой программой

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

Tags: introduction, UseShots Editor

Первые шаги с UseShots Editor’ом

1. Введение

В этой статье я покажу, как, используя только UseShots Editor, можно меньше чем за 5 минут полностью создать статью со скриншотами и тут же опубликовать её на своём WordPress’овском блоге.

Для этого вам нужны две вещи:

1. Рабочий WordPress’овский блог, куда вы можете постить статьи. Если у вас нет своего блога, то можете получить бесплатный блог с бесплатным хостингом на WordPress.com. У них есть русифицированная версия, и сейчас они предоставляют 3Гб места для файлов.

2. Скачать и установить UseShots Editor (пока только английский интерфейс и только Windows версия).

Кстати, вся эта статья полностью создана и опубликована на этом сайте с помощью UseShots Editor’а.

2. Начнём

Запустите UseShots Editor и кликните Start new article.

3. Новая статья

Дайте статье подходящее название (оно будет использовано как название блог-поста).

Если вы впервые пользуетесь UseShots Editor’ом, то у вас ещё нет настроенных профилей сайтов. Пока оставьте “Undefined” (неопределённый). У нас ещё будет возможность настроить сайт перед публикацией статьи.

Заметьте, что в профиле “Undefined” максимальная ширина скриншотов 480 пикселей. Это значит, что более широкие скриншоты будут автоматически уменьшаться, чтоб по размеру подходить к колонке блога (480 пикселей подойдут для многих тем WOrdPress’а).

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

Чтоб создать профиль сайта, кликните “Add New” (добавить новый). Настройка профиля сайта подробно рассмотрена в шаге 10 этой инструкции.

4. Первый экран

В UseShots Editor’е вы будете создавать статьи экран за
экраном.

Каждый экран состоит из
1. Заголовка (Caption) - короткого описания экрана, которое будет
использоваться как подзаголовок в статье.
2. Скриншота - самой картинки
3. Описания (Annotation) - произвольного текста, описывающего смысл
картинки.

Для начала сделаем снимок экрана. Для этого кликните на кнопке Take screen shot (сделать снимок).

5. Камера UseShots

Основное окно скроется и появится камера UseShots - окно с прозрачной областью внутри красной рамки.

Камера работает по тому же принципу, что и ваша цифровая фотокамера. Перемещайте её по экрану и в нужный момент нажмите Enter на клавиатуре или кликните на кнопке “Shoot”. Всё, что в этот момент окажется в видоискателе (внутри красной рамки), будет на вашем снимке.

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

В правом верхнем углу камеры вы увидите текущие размеры видоискателя (ширина x высота). Они могут пригодиться вам, если нужно сделать снимок определённого размера. Также вы сможете воспользоваться камерой как своеобразным измерительным прибором, чтоб измерить или подогнать размеры нужных окон (например, чтоб их ширина не превышала установленную максимальную ширину для скриншота - в этом случае снимок не придётся уменьшать, и его качество будет наилучшим.)

6. Описание экрана

Когда вы сделаете снимок, картинка появится в центре главного окна.

Введите заголовок в поле Caption. Этот заголовок будет использован и как значение параметра alt тэга img (для тех, кто думает о поисковиках).

В поле Annotation введите расширенное описание, раскрывающее смысл скриншота. Инструкции, комментарии, в общем всё, что подсказывает вам ваша фантазия.

Кстати, каждый из элементов экрана необязательный. Достаточно лишь одного из них. Можете даже не делать скриншот - в этом случае будет чисто текстовый экран (как первый экран этой статьи), а можете делать лишь скриншоты - получится своеобразная галерея.

Чтоб добавить новый экран в статью, кликните по кнопке Add Screen>> в правом нижнем углу.

7. Ссылка предпросмотра

В любой момент вы можете посмотреть, как будет выглядеть статья целиком. Для этого кликните по ссылке preview (предпросмотр) в правом верхнем углу редактора.

8. Предпросмотр

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

Чтоб закрыть режим предпросмотра, кликните hide preview в правом верхнем углу.

9. Готовы к публикации

Когда статья готова к публикации, кликните Publish (опубликовать) в правом верхнем углу.

10. Настройки профиля сайта для публикации

Первый раз, когда вы публикуете статью, вам нужно будет ввести информацию о вашем блоге, чтоб UseShots Editor мог в дальнейшем публиковать ваши статьи без дополнительных вопросов.

Site Type - тип сайта (пока только WordPress Blog)
Profile Title - Название профиля сайта. Поможет выбирать нужный профиль среди доступных.
Home page - главная страница вашего блога (например: http://myblog.wordpress.com)
Max Width - максимальная ширина скриншотов, которые без уменьшения подходят для размещения на сайте. Более широкие скриншоты будут автоматически уменьшаться до приемлемых размеров.
XML-RPC end point можно не заполнять, если вы специально не меняли адрес этой страницы, используемый по умолчанию.
Username - имя пользователя
Password - пароль

Если не указать имя пользователя/пароль, то эти данные будут запрошены, когда вы будете публиковать статью.

Если хотите, чтоб имя пользователя/пароль сохранились после того, как вы закроете редактор, отметьте опцию “Save username and password” (сохранить имя пользователя и пароль).

11. Название статьи и тэги

Прежде чем опубликовать статью, удостоверьтесь ещё раз, что выбрано подходящее название статьи, и что вы публикуете статью на нужном блоге с нужными правами (на случай если вы пользуетесь редактором UseShots для публикации на нескольких блогах).

Также назначьте вашей статье подходящие тэги (они помогут посетителям сайта находить нужные статьи). Разделяйте тэги запятыми.

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

Когда всё готово, кликните Post >> (отправить).

12. Статья опубликована

После того, как статья будет опубликована, вы увидите ссылки, с помощью которых вы можете открыть в браузере только что опубликованную статью. С помощью кнопки “Copy to clipboard” вы можете скопировать адрес опубликованной статьи в буфер обмена (например, чтоб потом вставить в email или переслать друзьям по аське).

Внимание: UseShots Editor показывает только стандартные WordPress’овские ссылки, которые подходят для блогов с любой структурой “красивых” ссылок. Когда вы откроете статью в браузере, то в адресной строке должны увидеть уже “красивую” ссылку.

13. Опубликованная статья в браузере

А вот так выглядит только что созданная и опубликованная статья в моём тестовом блоге.

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

Теперь вы готовы создавать и публиковать свои собственные статьи со скриншотами. Это могут быть всевозможные инструкции, обзоры, баг репорты. Ну, я думаю, у вас уже есть идеи, в реализации который вам поможет UseShots Editor ;-).

14. Отзывы

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

Оставляйте свои комментарии здесь или воспользуйтесь формой, чтоб отправить сообщение напрямую мне (по-русски или по-английски).

Мне было бы интересно увидеть, что моя программа оказалась кому-то полезной - присылайте ссылки на ваши статьи, созданные с помощью UseShots Editor.

Спасибо!

Скачать UseShots Editor

P.S. Чтоб читать статьи на этом сайте на русском языке, кликните на российском флаге в правой колонке.

Tags: getting started, tutorial, UseShots Editor