2011/11/27

Юзабилити не существует x2


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

Пару недель назад в южной столице прошла товарищеская встреча #wudru с помпой и бойлерами. И в качестве обещанного примера попинаем сайт конференции. В самом деле, хватит уже издеваться же над уй-тринити всея рунета, они как тот сапожник совсем же, и сайты их вы знаете: "купи винду", "вырви глаз" и "многа букв".
Про саму конфу пусть другие пишут. "Открывающих" копылова и ветрова не было слышно вообще, после отжигов роцк-дезигнера и павлова от тестирования народ вздремнул под колыбельную бескова, и вышел на обед. Бодрячковски затусив вместе с человеком-киборгом и не менее прекрасными парнями "компута шоу май пича" и "ошибайся, жди ответного гудка" народ перешёл к разного рода мимими и печенькам.
Хм, расписав предудущий абзац, даже как-то невольно проникаешься красотой и внутренней гармоничностью расписания...

Так вот, для проверки сайтегов у меня есть специальнозаточенный огнелис с плагинами. Они легли таким образом, прям по Маркову, что одна загрузка показывает практически все типические проблемы: скролинг, шрифт, вёрстка, загрузка итд; здесь всего лишь убежала кнопка регистрации, но это просто неприятная мелочь, это через гугл, это не лечится.

И под закрытие сладкая-сладкая вкусняшка - "место проведения". У меня мгновенно случается приступ острого когнитивного диссонанса со страстью к укладочными работам. Приведу целиком федевр
От метро Новослободская выход к Селезневской улице. Около ресторана «Елки-Палки» переходите улицу Селезневская на другую сторону, идете по направлению движения транспорта. Через 600 метров справа будет магазин «Богатырь», располагающийся на первом этаже жилого дома. Идете вдоль этого здания, проходите 2 арки, ведущие во двор. После Аптеки поворачиваете направо в третью арку.
От метро Достоевская по указателю на ул. Селезневская (из перехода направо), 30 метров из перехода вперед и налево в арку между магазином "Немецкая обувь" и кафе "Зам-Зам".

ЧТО ЭТО?! КТО МНЕ ГОВОРИТ ПЕРЕХОДИТЬ УЛИЦУ?! МНЕ НУЖНО СЧИТАТЬ АРКИ?! да вы там все ебанулись!
Если вы попробуете найти схему проезда на сайте "многабукв" компании У, вы узнаете стиль. Помня, что по той схеме невозможно попасть в их офис (который располагается в шиномонтаже), я просто записал названия улиц. Кстати, соционическое замечание: в офисе ведущей в отрасли компании нет ни одного нормального сенсорика; компания занимается удобствами - сенсорика нет. радость веселье острые углы уёбищные решения.

Нет, я пытаюсь разобраться.
Почему я должен идти от метро? Я уже вышел на поверхность? Тогда почему я иду по указателям "выход"? Ну это случается. иногда. успокаиваю я себя.
Зачем мне искать ресторан и переходить проезжую часть около него? я неплохо знаю правила дорожного движения и умею их применять. я способен самостоятельно определиться с местом перехода. может, быть это часть для людей с ограниченными возможностями? успокаиваю я себя дальше
почему я должен ориентироваться на направление движения? может быть, оно там одностороннее? пытаюсь догадаться я
600метров... мне нужен лазерный дальномер?! тихо матерюсь я
ах, может быть, описание составлял человек на машине и с навигатором! внезапное озарение! ну конечно, именно в таком случае он издалека заметит магазин, как бы идя по его же стороне, а на самом деле передвигаясь в другой области обзора. но это, сцуко, описание для пешеходов! оторви жопу, пройдись пешком

Здесь я устал. Я выбрал ближайшее с поверхности решение - (м)Достоевская и включил автопилот, запомнив арку между магазином и кафе. Часть про то, что дырку в доме для проезда транспорта во внутренний двор аркой называют чаще в питере, а в москве - подворотней, и то что "арка" оказалась на поверку тоннелем, мы опустим.
Пройдя по длинному переходу я вышел из метро и пошёл вперёд, выискивая кафе. Пройдя половину пути до перекрёстка, я повернул обратно. Конечно же, прилежный читатель уже обо всём догадался! И не важно, что кафе оказалось баром, а "немецкая обувь" "европейской обувью", это же мелочи, правда?
Тридцать сука метров - это сорок одинарных (непарных) шагов, я померял потом специально.
Какой нормальный человек будет считать шаги при ходьбе?
При средней скорости московского пешехода в шесть-семь километров в час, вылетая из метро, тридцать метров проскакиваешь за восемь секунд. Восемь секунд, чтобы сориентироваться в интерфейсе и принять верное решение. в действительности ещё меньше. после ёлок остаётся пара секунд, чтобы заметить кафе, и то, если вам хочется повернуть голову влево.

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

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

И эти люди учат нас чему? нувыпонели. юзобыдлити.


зы: юзабилити не существует, ч.1

2011/09/10

Человек информационный, часть вторая: Инфопесочница

-What do you read, my lord?
-Words, words, words.

┌────────────┐
│ ╔════════╗ │
│ ║        ║ │ 
│ ║        ║ │ 
│ ║        ║ │ 
│ ╚════════╝ │ 
└────────────┘ 

══╤════════╤══
  │        │

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

А теперь внимание, концепт! Я берусь утверждать, что этот предмет представляет собой ни что иное, как модель работы человека с информацией.
Надо ли напомнить, что делает ребёнок в песочнице? Правильно! он в ней ковыряется. Сколь угодно долго, то бишь, пока не надоест переворачивать песок руками и ногами, засовывать его в рот и карманы, и искать "сокровища" типа крупных песчинок, гальки, ракушки и чего туда могло ещё прилететь.
Стоит дать лопатку - и копание пойдёт эффективней.
Стоит дать пасочку - и на бортах выстроятся рядами куличики.

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


Слегка изменим пропорции
┌──────────────────┐
│ ╔══════════════╗ │
│ ║              ║ │ 
│ ║              ║ │ 
│ ║              ║ │ 
│ ╚══════════════╝ │ 
└──────────────────┘ 
Не правда ли, знакомый формат тачскрина?
Из чего и формируется принцип работы с инфопесочницей, он внедрён и известен. Но только в горизонтальной плоскости.

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

Так как вся информация сваливается в песочницу при ограничении её абсолютных размеров - вторым параметром работы с инфопесочницей является относительная ограниченность её объёма.

И чтоб не томить, третье ограничение: в каждый момент времени объём рассматриваемой человеком информации ограничен не сколько фреймом просмотра, но и фокусом внимания. Это в большей степени касается, конечно, матмодели и реализации интерфейса.
В части третьей, про нооматрицу, попробую рассказать про инфолупу и трёхпальцевые жесты. Часть первая должна была представлять общий вид формул матмодели; сделаю, как найду матредактор с интегралами.

на этом пока всё.

комментарии:
Концепты и всё-всё-всё было придумано за время гугло-хакатона 27-28 августа 2011 года с подачи Данилы Корнева, интегралы нарисованы чуть позднее; на тот момент я не был знаком с его наработками.

Является ли уменьшение энтропии врождённым или социальным инстинктом целовека - пусть антропологи разбираются :)

2011/09/09

NOSQL, MySQL и AJAX

Каким бы интригующим ни был бы заголовок, код посвящён программерской пятнице. Вот он http://code.google.com/p/angry/source/browse/#svn%2Ftags%2FajaxSQL
В спасаемой отрасли давно наметилось разделение веб-мастеров на тех, кто больше предпочитает серверный кодинг (пхп и мускл, на мейнстриме) и кто - клиентский (яваскрипт и дом). Плюс к тому, клиентсайд - пользовательские машины и их браузеры достигли такого уровня мощностей, что позволяют перекладывать большую часть технологических процессов (бизнес-логики, ага) на свои нехрупкие плечи (да-да, вспомните: сейчас мощность клиентского десктопа превышает, а планшетника - примерно соответствует мощности среднего VDS по 300 руб. в месяц).
Так вот, я не первый догадался делать цмс на аяксе. Но, наверное, мне стало больше всех лень писать RESTовые обвязки на пхп, и я написал враппер к SQL. Он принимает специфичный формат данных, формирует запрос, обрабатывает плейсхолдеры, и результат запроса отправляет JSONом клиенту. Сто строк вместо двадцати мегабайт пхпшного фреймворка.
При некотором напряжении, можно даже исключить монструозные апачи и допилить сокет-сервер (см. где-то в этом бложике), и\или вкомпилить код сразу в постгрю.
Как обычно, не советую пихать на продакшн в миллионы запросов, советую сформировать в базе виды (view) и рекомендую озаботиться секьюрностью передачи данных. Хотя защита от тупого лома уже инсайде и её хватит на 97%; кто найдёт - тому плюшки радость веселье ;)

Оставайтесь на нашем канале :)

зы: требует PHP::PDO и, если хотите, jQuery

2011/06/30

Темны дела твои, эйчар, в отрасли

Билли, можно тебя буквально на два слова?!
// Гарри


Состояние дел, так сказать, здоровье любой практически отрасли можно наотлично отследить по состоянию рынка труда, спрос и предложение, занятость и т.д. Я уже имел неосторожность высказаться за юзабелизм, так сейчас я ещё за прикладное к нему эйчарство расскажу.

Попалось давече мне на глаза совершенно типическое-типическое для отрасли объявление (цитируется с произвольными выдержками)
Вакансия: Проектировщик интерфейсов
Департамент: коммерческий
Задачи: проектирование интерфейсов Web\iOS\Android\etc, анализ пользовательских требований и составление сценариев, опыт, проведение оценок и тестирования,
Профессиональные требования: понимание психологии пользователей, знание методик анализа и проектирования п\и, знание стандартов п\и, прикладных систем анализа и проектирования...
Молодая демонично развивающаяся компания, дружный коллектив, чай, кофе, печеньки...

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

Читаем сначала и внимательно:
Позиция: Проектировщик. Хорошо.
Департамент: коммерческий. Допустим, что там везде коммерческий, что люди деньги делают.

Дальше смешнее: проектирование интерфейсов для etc... Веб, Андроид, иОС, хоть как-то понятно и оправданно, пусть даже хотят многостаночника, но etc? Для мобилочек штоле? Или тумбочек системы телеящик? там тоже бывают интерфейсы, я слышал.
Анализ пользовательских требований хорошие красивые слова. Человека, который ни разу не пытался анализировать пользовательские требования...
Мимоходом заметим, что опыт отнесён к задачам - это типа постановка опытов над многострадальными пользователями?..

Внимание! переходим к профессиональным требованиям, то есть требованиям компании к профессионалу: три однотипных запроса и "понимание психологии пользователей". Здесь мой мозг тормознул и пошёл юзом. Позиция проектировщик, требования психология. Проектировщик - психология. Психология - проектировщик. Проектировщик-психолог?! о_О
Здесь читатель с богатым воображением сам способен представить верстальщика-специалиста по вопросам семьи, или с небогатым - вспомнить месильщика карамельной массы из списка смешных профессий.

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

Автор академиев кончал, но с трудом может вспомнить что-то из психологии; способен предположить поведение некоторой группы пользователей, но с ними ж, как с динозаврами - 50/50.
Возвращаясь к айтишным вакансиям: разного рода оксюмороны, ляпы в описании, запросы, несовместимые с профессией - обычным стали делом. Это говорит нам о чём? О том, что так называемые специалисты по кадрам не понимают, чем же эти кадры на самом деле занимаются. А раз не понимают суть работы компании, то (делаю я вывод) разоряют компанию, которая им доверяет поддержание себя в рабочем состоянии. Такое моё мнение.
HR не существует.

а в следующий раз я вам за скрамный, пр-ти г-ди, аджайл расскажу

2011/03/05

Сервер на ПХП

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

Однажды мне понадобился быстрый сервер-преобразователь, только не спрашивайте для чего, что-то вроде фильтрующего прокси: принял один контент - выдал другой. Я уже начал присматриваться к mod_proxy и mod_filter апача, но большие мощные штуки тем и хороши, что они большие мощные штуки. Здесь затраты не стоят результата.
Поискал маленькие сервера... Но в самом деле, не вешать же ещё один веб-сервер, когда есть апач?

И идея вернулась на круги своя: сделать сервер на самом php - сокеты есть в каждой операционке. По сокетам вполне внятный ман с несколькими примерами эхо-серверов. Но в задаче требуется не эхо-сервер, а обработчик контента, в задаче-максимум - с запуском внешних утилит.
Следующим этапом гугления был гайд от http://i-novice.net/sokety-v-php/, но и там эхо, хотя уже расширенный. Кстати, рекомендую закинуть сайт в закладки: интересно, доступно и практично.
Сервер из примера я и взял за основу для работы. Программирование "от ошибок" показало, что:
  • необходимо помнить и правильно указывать параметры при socket_create - типы сокетов, и socket_bind - действительно свободный порт;
  • вложенные циклы выбраны не просто так, а socket_accept выполняет очень важную миссию как бы клонирования ресурса сокета.
Результаты смотрим в известном месте. (upd: просто сложил все примеры кучей)

Несомненно порадовал свежак веб-сервера встроенного в пхп http://wiki.php.net/rfc/builtinwebserver ;) Но это для тех, кому не лень ещё раз скомпилить ядро. Также в процессе работы не раз всплыл нановеб с известного казахского сайта. Но сто строк своего родного велосипеда выглядят гораздо приятней против 43кб его исходников.

Как можно использовать это чудо природы пока без названия?
По прямому назначению после допиливания конфигов и массивов заголовков: как веб-сервер. Может быть также полезен работникам клиент-сайда для проверки аяксов, как фейковый сервер при падении основного, ибо для работы требует только php-cli.
Как MyNoSQL сервер - прокси между клиентским аяксом и MySQL базой - есть такая модная тенденция.
Как PostNoSQL сервер - через PL\PHP из прошлых постов я запущу его прямо в постгре и получу прямой доступ к XML-хранилищу.

На сегодня всё.
Оставайтесь с нами

ps: поделюсь демотиватором на прощанье: http://habrahabr.ru/blogs/lisp/114981/
и хитрые задачи по SQL http://www.xt-r.com/2011/03/1.html

2011/02/01

Нано-роутер в одну строку, или ЧПУ на PHP за пять минут

RTFM!
//непереводимая игра идиоматических выражений

Давно обещал написать и показать. Сейчас выложу в одно известное место, и можете там посмотреть. Но если вы посмотрите, будет неинтересно читать. Как обычно случается с функциями подобных объемов, каментов в файле больше, чем кода =;)

Так вот, каждый пхпшник в своё время узнаёт три волшебные буквы "ЧПУ". Если мне не изменяет мой склероз, впервые в рунете их произнёс дядька Спектатор и вложил в них смысл "человекопонятный урл". Такие урлы удобно набирать ручками через слеш. Но не очень удобно подстраивать систему каталогов.
Настоящий пхпшник - существо ленивое и поэтому изобретает велосипеды не для того, чтобы кататься, а потому, что они красиво выглядят, просты в изобретении и ближе к телу. Как только мысль про ЧПУ внедряется в межушный нервный узел, тут же изобретается обработчик и кладётся в докрут. Задача обработчика элементарна: ловить урл и по табличке соответствий запускать метод из очередного Class Pager extends GodObject.

Постановка задачи, думаю, уже ясна. И функция, которая запускает колбек, как реакцию на шаблон, в пхп есть. Остальные двадцать девять строк кода это обвязка: сборка данных в массивы, обработка параметров и прочие хитрые штуки. Если ещё не открывали, предупреждаю: в коде присутствуют хаки и много си-стайла.
https://code.google.com/p/angry/source/browse/#svn%2Ftags%2Fnano.router%40ETC
Специальный нано-роутер, для тех кто не осилил большого красивого бота-обработчика потоковых команд. Функция выполняет примерно те же задачи - то есть, реагирует на подаваемые строки, но проще и без вкусных пост- и предобработчиков.

По сложившейся традиции, функция упрятана в "рамку", начинается с подчёркивания и занимает не больше двух экранов. Работает не просто, а очень просто. С вариативным количеством параметров.
Сначала набираются два массива: регулярок - которые мы юзаем в качестве фильтров, ведь ничего проще не придумаешь, а именованные плейсхолдеры, по здравому размышлению, оказывают не нужны; и колбеков - которые, собственно, и вызываются на попадание в регулярку. Специально для ленивцев сделан финт ушами про загрузку массивов и имен конфигурационных ini-файлов.
Затем, когда роутер вызывается с одним строковым параметром или без параметра, массивы всей пачкой скармливаются той самой волшебной, я бы даже сказал уникальной в своём роде, функции. Нашли? Правильно, это preg_replace($regexp_route_array, $callback_array, $URL);

У роутера есть несколько багофич, к которым можно привыкнуть или переделать: например, поменять порядок следования роутов и экшнов на обратый, чтобы добавленные позднее имели более высокий приоритет; или, например, доделать возврат из функции в строку только из отработавших роутов; или что ещё подсказывает вам фантазия.

на сегодня всё.
скоро выкачу те обрывки ::ETC, которые могут работать. подчёркиваю, всё, что есть по ::ETC, но без комментариев

Хорошая, кстати, идея со словом "нано"; я и так слил все хелперы, функции и фильтры в один каталог, теперь переименую - и будут наниты вместо хелперов.
Оставайтесь с нами =;)

зы: в роутере трёхэтажный мат с call_user_func и explode\implode это своеобразная защита от совсем дурака и такое нужное обкавычивание, которое легко забывается особенно в ини-шках.

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

2011/01/01

фильм соцсеть кг\ам социальная сеть скачать бесплатно без смс смотреть онлайн

ПАДКАТ!
боевой клич карма-наци

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