Уже около 10 лет я использую компьютер для различных целей. Все действия, которые я производил на нём, чтобы достичь какого-нибудь определённого эффекта я считал долгое время правилом. Но в один прекрасный день понял, что интерфейс всех программ, с которыми я имел дело отнюдь не правило и что выполняемые мною действия могут быть разными, но эффект будет тем же. И с того дня у меня появился интерес к разработке интерфейсов и программированию. В данный момент я достиг того уровня знаний программирования, что могу воплощать свои идеи почти в полной мере. Однако эти идеи не основаны на каком-нибудь там расчёте коэффицента юзабилити, они основаны на чувстве красивого и на том, что приходит в голову. Я не в коем случае не утвержадаю, что чувство прекрасного у меня развито замечательно, тем не менее оно мне позволяет говорить о «симпотичности» какого-нибудь интерфейса с с моей стороны.
Сразу хотелось бы оговориться, что слово «интерфейс» в моём рассказе в большей мере можно заменить словосочетанием «внешний вид» нежели «совокупность внешнего вида и удобства использования». Насчёт удобства использования разработанных мною элементов интерфейса я порассуждаю в следующем топике.
Я вам предлагаю посмотреть обзор некоторый идей реализации интерфейса на примере конкретной программы, которую я сейчас пишу: редактор электронных словарей.
Вот такую вот картинку видит пользователь после старта программы. Мне кажется, что когда пользователь запускает программу в первый раз он слабо понимает как ею пользоваться и с чего вообще начинать, поэтому я решил предоставлять первоначальную информацию пользователю в виде текста в текстовом поле. А также в текстовое поле был добавлен список недавно открытых/редактированных словарей, тем самым делая открытие словаря делом одного нажатия.
Здесь комментировать в принципе нечего. Разве что обратить ваше внимание на отсутсвие диалога ошибки, которая предупреждает, что словарь с таким же именем уже существует. Кстати, то что сам виджет создания нового словаря не является диалогом является довольно спорным моментом. Я всё больше склоняюсь к тому, что всё-таки лучше сделать это диалогом. А вы как считаете?
Словари того формата, который использует этот редактор — текстовый файл определённого формата, причём размер этих файлов может достигать 50Мб, поэтому очевидно, что работать с этим файлов в течение работы программы тяжело, так как добавление новой строки в 50мб файл будет относительно долгим, а поиск набранного слова тем более. Поэтому было принято решение, чтобы загружать текстовый файл в SQLite базу данных, проводить с ней различные манипуляции, а потом уже из неё создавать файл нужного формата. Загрузку можно остановить, возобновить и отменить, что логично. Обратите внимание на то, что прогресс строку можно скрыть с помощью специальной горизонтальной кнопки.
Из-за того, что можно манипулировать только загруженными словарями, пришлось создать управление этими словарями. Я постарался максимально упростить эту часть программы. Нижние иконки однозначны, поэтому проблем с понимаем быть не может. Хотя плюсик всё-таки может быть непонятен с первого взгляда, но когда пользователь наведёт на эту кнопку курсор мыши он увидет небольшой ToolTip popup с описанием возможностей кнопочки.
Почти во всех программах настройки реализованы в качестве диалога, однако так как я являюсь поклонником однооконности, настройки в редакторе выглядят так, как на скриншоте снизу. Каждый пункт настроек имеет подробное описание, которое появляется в виде popup окна после нажатия на кнопочку «Info». Тем самым не должно возникать ощущения нагруженности текстом, но в то же время пользователь всегда сможет понять что это за опция такая.
Основная часть программы, которую очень тяжело сделать лёгкой и удобной. Тем не менее я считаю нынешний интерфейс удачным. Однако в то же время, я расчитываю на то, что пользователь будет использовать горячие клавишы, поэтому их значение указано в ToolTip'е кнопки.
Во многих программах есть такие диалоги, которые появляются после запуска программы и называются они «Tip of the day», однако читать их малое удовольствие. То решение, которое пришло в мою голову основывается на том, что пользователю необходимо сообщить пользователю о функциях программы незаметно и чтобы пользователю было приятно смотреть на эти подсказки. Поэтому в правой нижней части редактора каждые 10 секунд обновляется подсказка, которые можно отключить в настройках. Статусная строка же привлекает к себе внимание буквально на 5 секунд своим миганием, после чего исчезает.
Скриншоты на PicasaWeb
Для тех, кто хочет потрогать всё это: svn checkout lightlang.googlecode.com/svn/trunk/lightlang-editor lightlang-editor
Программа спокойно компилируется в Windows на MinGW c Qt4.4 и Linux, а на Маке не пробовал.
Да, возможно, моя первая попытка придумать что-то новое и не увенчалась успехом, но ведь главное на данном этапе не это, а то, что есть желание творить и улучшать, а не топтаться на месте. В качестве комментариев я бы хотел услышать как минимум ответ на вопрос: «Кажется ли Вам эти идеи удобными, приятными для глаза и актуальными?». Спасибо.
P.S. Хотел сделать скринкаст, но не получилось. Подскажите, пожалуйста, какие-нибудь хорошие программы для записи скринкастов. XVidCap — у меня не работает(segment fault).
Сразу хотелось бы оговориться, что слово «интерфейс» в моём рассказе в большей мере можно заменить словосочетанием «внешний вид» нежели «совокупность внешнего вида и удобства использования». Насчёт удобства использования разработанных мною элементов интерфейса я порассуждаю в следующем топике.
Я вам предлагаю посмотреть обзор некоторый идей реализации интерфейса на примере конкретной программы, которую я сейчас пишу: редактор электронных словарей.
Вид сразу после запуска
Вот такую вот картинку видит пользователь после старта программы. Мне кажется, что когда пользователь запускает программу в первый раз он слабо понимает как ею пользоваться и с чего вообще начинать, поэтому я решил предоставлять первоначальную информацию пользователю в виде текста в текстовом поле. А также в текстовое поле был добавлен список недавно открытых/редактированных словарей, тем самым делая открытие словаря делом одного нажатия.
Создание нового словаря
Здесь комментировать в принципе нечего. Разве что обратить ваше внимание на отсутсвие диалога ошибки, которая предупреждает, что словарь с таким же именем уже существует. Кстати, то что сам виджет создания нового словаря не является диалогом является довольно спорным моментом. Я всё больше склоняюсь к тому, что всё-таки лучше сделать это диалогом. А вы как считаете?
Загрузка словарей в БД
Словари того формата, который использует этот редактор — текстовый файл определённого формата, причём размер этих файлов может достигать 50Мб, поэтому очевидно, что работать с этим файлов в течение работы программы тяжело, так как добавление новой строки в 50мб файл будет относительно долгим, а поиск набранного слова тем более. Поэтому было принято решение, чтобы загружать текстовый файл в SQLite базу данных, проводить с ней различные манипуляции, а потом уже из неё создавать файл нужного формата. Загрузку можно остановить, возобновить и отменить, что логично. Обратите внимание на то, что прогресс строку можно скрыть с помощью специальной горизонтальной кнопки.
Управлени загруженными словарями
Из-за того, что можно манипулировать только загруженными словарями, пришлось создать управление этими словарями. Я постарался максимально упростить эту часть программы. Нижние иконки однозначны, поэтому проблем с понимаем быть не может. Хотя плюсик всё-таки может быть непонятен с первого взгляда, но когда пользователь наведёт на эту кнопку курсор мыши он увидет небольшой ToolTip popup с описанием возможностей кнопочки.
Настройки программы
Почти во всех программах настройки реализованы в качестве диалога, однако так как я являюсь поклонником однооконности, настройки в редакторе выглядят так, как на скриншоте снизу. Каждый пункт настроек имеет подробное описание, которое появляется в виде popup окна после нажатия на кнопочку «Info». Тем самым не должно возникать ощущения нагруженности текстом, но в то же время пользователь всегда сможет понять что это за опция такая.
Добавление/Редактирование/Удаление слов
Основная часть программы, которую очень тяжело сделать лёгкой и удобной. Тем не менее я считаю нынешний интерфейс удачным. Однако в то же время, я расчитываю на то, что пользователь будет использовать горячие клавишы, поэтому их значение указано в ToolTip'е кнопки.
Информирование пользователя(подсказки и статус-строка)
Во многих программах есть такие диалоги, которые появляются после запуска программы и называются они «Tip of the day», однако читать их малое удовольствие. То решение, которое пришло в мою голову основывается на том, что пользователю необходимо сообщить пользователю о функциях программы незаметно и чтобы пользователю было приятно смотреть на эти подсказки. Поэтому в правой нижней части редактора каждые 10 секунд обновляется подсказка, которые можно отключить в настройках. Статусная строка же привлекает к себе внимание буквально на 5 секунд своим миганием, после чего исчезает.
Скриншоты на PicasaWeb
Для тех, кто хочет потрогать всё это: svn checkout lightlang.googlecode.com/svn/trunk/lightlang-editor lightlang-editor
Программа спокойно компилируется в Windows на MinGW c Qt4.4 и Linux, а на Маке не пробовал.
Да, возможно, моя первая попытка придумать что-то новое и не увенчалась успехом, но ведь главное на данном этапе не это, а то, что есть желание творить и улучшать, а не топтаться на месте. В качестве комментариев я бы хотел услышать как минимум ответ на вопрос: «Кажется ли Вам эти идеи удобными, приятными для глаза и актуальными?». Спасибо.
P.S. Хотел сделать скринкаст, но не получилось. Подскажите, пожалуйста, какие-нибудь хорошие программы для записи скринкастов. XVidCap — у меня не работает(segment fault).
