Рерайт №5. Главная страница Орфограммки
Орфограммка — сервис проверки правописания и стилистики. Находит ошибки, которые пропускает Ворд и Гугл-док.
Вот её главная страница в 2016 году:
Формально все на месте. Заголовок объясняет что это, картинка показывает, текст раскрывает подробности, а кнопки предлагают дальнейшие действия.
Попробуем разобраться, что не так и как сделать лучше из того, что есть. Начнем с кнопок и текста, потом разберем картинку и нарисуем свой вариант.
Кнопки
Кнопки стоят в ряд и не подсказывают, какое действие главное: поддержать, посмотреть или проверить.
Действия кнопок разнородны. Если «посмотреть пример» и «проверить» относятся к работе с текстом, то «поддержать проект» — нет.
Предположим, что главное действие на первой странице — пригласить пользователя к самостоятельной работе с программой. Эту кнопку сделаем крупнее и отделим её от других элементов пустым пространством.
«Поддержать» перенесем в раздел «О нас». Орфограммка платная и давно вышла из возраста стартапа. Если проекту нужна поддержка, расскажем об этом подробнее и в уместном контексте.
Кнопку «Посмотреть пример» тоже уберем. Лучше сделать ссылку на страницу с примерами или поставить вместо картинки видео с работой в программе.
Текст
Почитаем внимательнее.
Орфограммка — это интеллектуальный веб-сервис проверки орфографии, грамматики, пунктуации и стилистики. Всего за несколько секунд она проверит ваш текст на ошибки, подробно расскажет об их происхождении и предложит варианты исправления.
Также она проверяет курсовые и дипломные работы на соответствие требованиям ГОСТа.
Специальное предложение для пользователей сервиса Дневник.ру: скорее прочитать
А ещё у Орфограммки появилась партнёрская программа!
Попробуем убрать туманное «интеллектуальный веб-сервис» и добавить описание действий:
Орфограммка проверяет орфографию, грамматику, пунктуацию и стилистику.
Получилось сухое перечисление. Хочется, чтобы продукт не просто выполнял функции, а повышал качество жизни. Вернем про сервис и разобьем описание на пользу и конкретные функции.
Орфограммка — сервис, который помогает писать грамотно и красиво. Проверяет орфографию, грамматику, пунктуацию и стилистику.
Не идеально, но жизнь в этом есть. Идем дальше.
Всего за несколько секунд она проверит ваш текст на ошибки, подробно расскажет об их происхождении и предложит варианты исправления.
На картинке 2 минуты, а в тексте несколько секунд. Про две минуты писать не хочется, уберем из текста упоминание времени вообще. Процесс проверки раскроем подробнее:
Выделяет ошибки, объясняет их суть и предлагает варианты исправления.
Чего-то не хватает. Изучаем сервис, читаем справку и добавляем неочевидные фичи. Про курсовые и дипломы переносим туда же.
Орфограммка находит опечатки, проверяет имена собственные, названия теорем, открытий и алгоритмов. Проверяет курсовые и дипломные работы на соответствие ГОСТу.
Последние два предложения выглядят прилепленными. Как будто писали разные люди в разное время. Первое предложение сухо информативно, второе — игривое и в новостном стиле.
Специальное предложение для пользователей сервиса Дневник.ру: скорее прочитать
А ещё у Орфограммки появилась партнёрская программа!
Текст ссылок не сообщает для кого это и куда ссылка ведет. Почитаем о специальном предложении и партнерской программе, выделим главное:
Специальное предложение для пользователей Дневника.ру
Партнёрская программа для организаций и предпринимателей.
Выглядит спорно, но стало понятнее, кому кликать. Соберем все вместе:
Орфограммка — сервис, который помогает писать грамотно и красиво. Проверяет орфографию, грамматику, пунктуацию и стилистику. Выделяет ошибки, объясняет их суть и предлагает варианты исправления. Находит опечатки, проверяет имена собственные, названия теорем, открытий и алгоритмов. Проверяет курсовые и дипломные работы на соответствие ГОСТу.
Специальное предложение для пользователей Дневника.ру
Партнёрская программа для организаций и предпринимателей.
Получилось жестко — бам-бам-бам, одни глаголы, — но теперь мы знаем, что Орфограммка умеет.
Картинка
Если вы забыли и вам лень крутить, на картинке изображена девушка-филолог с книгой о русском языке, абстрактный документ до и после, секундомер и перечень проверки.
Формально картинка объясняет, что перед нами и как работает. Но можно сделать конкретнее и нагляднее. Чтобы не нудить о вреде абстракции и пользе наглядности, приведу пример познания через непосредственный опыт.
Дзенская притча о кувшине воды
Новому монастырю требовался наставник. Чтобы выявить самого способного, настоятель собрал монахов, поставил перед ними кувшин с водой и спросил:
— Скажите, что это такое, не называя это кувшином.
Монахи принялись перебирать: чем нельзя назвать кувшин, на что он похож и на что не похож. Пока они гадали, повар молча пнул кувшин и разлил воду.
Наглядная демонстрация хорошо работает.
Чтобы показать Орфограммку в работе, пнём кувшин: скормим ей текст с ошибками и покажем, как она его обработает.
Результат
Соберем все вместе, расставим, продумаем акценты. Перепишем первое предложение под заголовок, а «сервис» перенесем в начало абзаца. Ссылки на спец. предложение и партнерку оформим отдельными блоками. Проредим и приглушим социальные кнопки.
Стало и было:
Картинка в натуральную величину.
Чтение по теме
Как ставить ссылки — Максим Ильяхов о гигиене ссылок и привлечении внимания.
Лучший способ убедить читателя — дать ему убедиться самому. Совет Бюро.
Убеждающий веб-дизайн — статья на Хабре.
Плоть и кости дзен: опрокинутый кувшин — оригинальный текст притчи. Выше приведена адаптированная версия.
Добрый день, Виталий!
Спасибо за отличную статью. Мы наконец-то взяли себя в руки (не прошло и года) и сделали новую главную страницу. Всё немного не так, как Вы описали, но довольно похоже.
В общем-то, то, как Вы описали нашу главную сильно созвучно с тем, что мы и сами хотели задизайнить, но все ресурсы были направлены на развитие движка проверки, поэтому только сейчас.
Очень рад! )