Архив метки: юзабилити

Тяжёлое наследие реального мира

Я, несмотря на общую нелюбовь к продукции Microsoft, весьма тепло принял новую, продвигаемую ими концепцию интерфейса — Metro. Прежде всего, потому что используемый сейчас интерфейс устарел.
Хотите спросить, какой именно? Отвечу: все. Концептуально любой интерфейс пользователя любой операционной системы сейчас основан на переносе объектов физического мира на экран. Все эти пуговицы-кнопки, флажки, радиокнопки, папки, файлы и страницы… Вспомним ещё, сколько аппаратных ресурсов тратится для достижения всё большей реалистичности интерефейса — эффекты схлопываний, поворотов, прозрачности. Если пожертвовать красотой во имя производительности, можно было бы смело забыть о ежеквартальной плановой смене компьютера.
Выглядеть элементы управления в разных операционных системах или программах могут по разному, но основа одна и та-же: эмуляция объектов физического мира. Разработчики аргументируют, что иначе нельзя, не поймут.
Уверен, что если мы проведём «коридорное тестирование» на людях, крайне далёких от компьютеров — то не увидим разницы в скорости освоения командной строки и кнопки «Пуск». Например, много-ли времени понадобится человеку, чтобы осознать, что подчёркнутый текст на странице — это ссылка? Секунда после объяснения, и знание это останется с ним навсегда. Кстати, в реальном мире подчёркнутый текст не вызывает гиперпространственный прыжок или нуль-транспортировку. Следовательно, эффективный интерфейс не означает интуитивный.
Не знаю, удобен ли Metro, приживётся ли или разделит судьбу Microsoft Bob (как апогея интуитивности, кстати) — но я рад, что хоть кто-то экспериментирует.

И о рассылках

Любая почтовая рассылка любого сервиса должна содержать ссылку «прекратить получать письма». Более того, ссылка должна содержать уникальный идентификатор, позволяющий не авторизовываться на сервисе, чтобы «настроить доставку уведомлений».

Ага, конечно, вот сейчас я буду вспоминать логин и пароль от мелкого интернет-магазина, где сменный шарик  для мышки десять лет назад заказывал. Буду заходить, копаться в настройках…

Я просто нажму кнопку «спам» в почтовом ящике, и проблемы пропадут.

 

О резиновых сайтах

Замечали, что в америке большинство сайтов имеет ограниченную ширину, а у нас большинство предпочитает “резиновые”, то есть растягивающиеся по ширине экрана? Провёл небольшой опрос и выяснил, почему так.

  • Наши хозяева сайтов терпеть не могут пустые пространства. Ведь туда можно сунуть ещё баннеры, ещё тексты и ещё акции.
  • Так принято.
  • Так у Васи.

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

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

Есть замечательные исключения – российский клон FaceBook, сайт “вКонтакте”, при “заимствовании” дизайна внёс изменение – сделал фиксированной ширину. В результате выглядит он лучше, и навигация по странице удобнее.

Вопреки мнению “Васи”, сайты с фиксированной шириной оказалось делать ещё и выгоднее. Гугл сузил область выдачи поисковика до 800px. В итоге рекламные объявления отображаются ближе к выдаче, месту, на которое смотрит пользователь. До введения ограничения на широкоэкранном мониторе объявления находились на границе области видимости. В итоге доход вырос с $5,5 миллиардов до $5,9 миллиардов. Рамблер тоже сузил область выдачи, но до 1400px.

P.S. Бытует мнение, что резину верстать сложнее. Это не так. Чуть больше работы у дизайнера становится при нарезке картинок, шапка сайта, например, может состоять из крайне левой, крайне правой и центральной повторяющейся вместо одной полосы.

Как в NetBeans включить автодополнение CodeIgniter?

Стандартный совет: создайте в корне проекта файл autocomple.php и перечислите там классы CodeIgniter. А чтобы  автодополнение работало по всему приложению, добавьте также свои собственные модели и классы.

Copy Source | Copy HTML

  1. <?php
  2. /**
    * @property CI_Loader           $load
    * @property CI_Form_validation  $form_validation
    * @property CI_Input            $input
    * @property CI_Email            $email
    * @property CI_DB_active_record $db
    * @property CI_DB_forge         $dbforge
    * @property CI_Table            $table
    * @property CI_Session          $session
    * @property CI_FTP              $ftp
    * @property CI_Benchmark        $benchmark
    * @property CI_Calendar         $calendar
    * @property CI_Image_lib        $image_lib
    * @property CI_Email            $email
    * @property CI_Encrypt          $encrypt
    * @property CI_Exceptions       $exception
    * @property CI_Language         $language
    * @property CI_Pagination       $pagination
    * @property CI_Parser           $parser
    * @property CI_Trackback        $trackback
    * @property CI_User_agent       $user_agnet
    * @property CI_Validation       $validation
    * @property CI_Security         $security
    * @property Excel               $excel
    * @property Blog_model          $Blog_model
    * @property Test_model          $Test_model
    * @property Categoryes_model    $Categoryes_model
    * @property Gallery_model       $Gallery_model
    * @property Menu_model          $Menu_model
    * @property MPTtree             $MPTtree
    * @property Pages_model         $Pages_model
    * @property Portfolio_model     $Portfolio_model
    * @property Rights_model        $Rights_model
    * @property Users_model         $Users_model
    * ...
    */
  3. Class Controller {
  4.  
  5. }

В NetBeans меня немного раздражает, что что открывающая скобка находится на одном уровне с оператором. По гайдлайнам CodeIgniter это не приветствуется, да и мне после C# не особенно облегчает просмотр кода. Глаз быстрее находит открывающую скобку, чем оператор или объявление. Как побороть?

Идём в меню “Tools”, пункт “Options”, закладка “Formatting”. Далее выставляем всё так:

imageПосле этого используем автоформатирование кода (Alt+Shift+F). 

Юзабилити для дурака

image В рунете часто путают две абсолютно разные вещи – юзабилити и ориентацию на дурака. Как часто приходилось слышать от разработчиков: «Да пользователь дурак, не будет он вводить», «да не знает он», «да не будет регистрироваться».

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

Не дурак пользователь вовсе, как считают заносчивые айтишники,  он просто ленив. Технари забывают, что кроме компьютеров, в мире ещё много всякого разного, и во всём специалистом быть невозможно. А что зарегистрироваться не может – так помоги ему. Может, новый Эйнштейн на форум твоего сайта заглянуть решил, или старичок буржуй-инвестор денег хотел дать, да не смог. А дураками их назвать только дурак и может. Поэтому проектируйте просто, но не жертвуйте функционалом и защитой ради этой простоты. Лучше при клике на большой вопросительный знак красиво с помощью jQuery подсказку по регистрации на страницу вывести, чем убрать защиту от ботов и получить загаженный спамом блог или форум.

О подсказках, кстати. Размещайте их или до непонятностей на самой странице, или выводите на ту же страницу скриптами. Кликать по ссылке, чтобы получить помощь будут единицы. Да, все ленивы.

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

Интерфейсы Microsoft

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

Знакомый с детства консольный интерфейс. Представляет из себя приглашение и мигающий курсор в области ввода. Пользователь вводит команды, операционная система печатает ответы. Интерактивность минимальна, но и перимущества в скорости и возможности пакетной обработки настолько велики, что в обозримом будующем никто от командной строки отказываться не будет. Используется в Microsoft POSIX, MS DOS и всех версиях ОС Windows.

Clipboard

Первый графический интерфейс в первой версии линейки новых операционных систем. Элементы управления — графические. Это не означает, что концепция кнопок, окон и меню появилась непосредственно в Windows 1.01 в 1985 году. И конкуренты не дремали в это время, и программы для DOS отображали кнопки, полосы прокрутки с окнами при помощи псевдографических символов. Но тем не менее здесь появились окна с заголовками, двумя кнопками управления, главным меню и полосой прокрутки. Несочетаемые цвета объяснялись использованием 16-цветной палитры и видеоадаптеров CGA, Hercules и EGA. Использовался в Windows 1.01, 1.02 и 1.03.

windows_01
Читать далее Интерфейсы Microsoft