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

Вообще говоря, я бы так и продолжал делать редкие интерактивные карты на flash, но затем произошло кое-что интересное, после чего я снова взглянул на html как на средство создания эффектных интерактивных карт.

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

Некоторые из них напрямую или косвенно связаны с когнитивными искажениями человеческого сознания – в этих случаях я даю ссылки на соответствующие вики-статьи. Также интересен список известных когнитивных искажений.

1 Преждевременная оптимизация

В 97% случаев надо забыть об эффективности малых частей программы: преждевременная оптимизация – корень всех зол. Но в 3% случаев об оптимизации забывать не нужно.
Дональд Кнут

Хотя никогда зачастую лучше, чем прямо сейчас
Тим Питерс, Зен языка Python

Что это

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

Почему плохо

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

Как избежать

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

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

Такой подход казался мне логичным, но он оказался неверным.

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

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

Давайте взглянем на небольшое количество показательных примеров.

Вам когда-нибудь хотелось прямо в CSS коде посчитать, в меню 4 элемента или 10? Для четырех задать им ширину по 25%, а если набралось десять — прижать их друг к другу и уменьшить отступы?
Как выяснилось, CSS умеет работать с разным количеством элементов, позволяя избавиться от головных болей и лишнего кода на js.

Когда меня развернули на 180 градусов в аэропорту перед полётом в Грецию, я начал звонить в сервисы по билетам и отелю. AWAD, фактически, положил на меня как на клиента – «посмотрите на сайте», «войдите в личный кабинет» и так далее. С другой стороны, Букинг внимательно выслушал, в прямом эфире набрал отель и чётко перенёс моё бронирование, пока я шёл к аэроэкспрессу. Хотя в правилах отеля если что не так – постоялец идёт на хрен. Так я оценил разницу в сервисе.

Но я не про это. Дело в том, что Букинг предложил мне контракт на проверку адекватности перевода их сайта на русский. Сразу покажу, с чего началось:



А вот чем продолжилось:



А теперь расскажу и покажу, что и как с текстами интерфейсов.

Недавно мы рассказывали про морфинг форм в SVG, когда одна форма преобразуется в другую. А теперь давайте взглянем как формы могут перетекать друг в друга. Этот липкий тянучий амебный эффект многим знаком из видео c каплями ртути на поверхности.

Привет, Хабр! Недавно мы запустили большой образовательный спецпроект про продажи и маркетинг для студий и агентств. В его рамках я подготовил текст про подготовку коммерческого предложения на боевом примере — и хотел поделиться им с аудиторией Хабра.

Мы пишем много разных теоретических материалов, и меня часто спрашивают "Андрей, теория — это хорошо, ну а покажи, как должно выглядеть конкретное предложение, которое ты считаешь хорошим?". Этот текст — мой развернутый, почти на 20 страниц, ответ на этот вопрос.

Я выбрал кейс, максимально приближенный к реалиям — и в виде полу-художественного повествования провел своего лирического героя Бубликова по всем этапам подготовки КП и участия в тендере. Давайте начнем:

Итак, в рамках кейса мы представляем выдуманную компанию «Студия Бубликова», работаем в Москве, основаны в 2008 году, в нашем штате 17 человек, мы специализируемся на продакшн-услугах, работаем на UMI, для пары-тройки давних клиентов ведем контекст и немного SMM, работаем по средней ставке в 1700 руб./час, имеем хорошую поддержку (с выстроенными процессами и выделенными ресурсами). Мы есть в некоторых рейтингах веб-студий в середине списка, пару раз в год выступаем с докладами на среднего размера конференциях, позиционируемся как хороший продакшн второго эшелона с сильной поддержкой. Наши клиенты — сфера услуг, ecommerce, несколько добывающих компаний, пара агентств недвижимости. Делаем, в основном, корпоративные сайты, магазины, иногда промо-сайты. Сложные большие сервисы и порталы особо не умеем.

Я тот самый Бубликов, чьим именем названа наша студия.

Двадцать пять лет назад IBM представила генеральный план восстановления контроля над рынком PC. В ноябре 1987 года в магазины отправились первые дискеты с OS/2 версии 1.0. Microsoft разрабатывала ее вместе с IBM и в случае успешной реализации этих планов мир был бы совсем иным. И мир уже начал меняться.

Сейчас о OS/2 обычно вспоминают только в связи с той ролью, которую она сыграла в промышленной войне, окончившейся триумфальной победой Microsoft. На момент выпуска OS/2 в Microsoft работало 1800 человек, меньше, чем сейчас работает в ливерпульском телемагазине QVC. Microsoft даже не была крупнейшим производителем программ для PC. Но всего через несколько лет компания стала не только крупнейшим игроком отрасли, но и одной самых дорогих компаний в мире; один лишь слух о выходе Microsoft в новую нишу вызывал панику у существующих игроков.

Согласно традициям нашего издания я вернул старые программы к жизни и оценил OS/2 с современной точки зрения. Но гораздо интереснее вновь задать иной вопрос: могла ли IBM победить? Если именно OS/2 стала причиной поражения Синего Гиганта, то смогли бы они остановить Microsoft с помощью более хитрых планов? Давайте вернемся в те времена, когда мир еще не знал слов «платформа» и «экосистема» и вспомним, как выглядела отрасль информационных технологий в середине 1980-х.

Хабравчанам предлагается тест на сообразительность. Догадайтесь, что за канцелярские приспособления изображены на картинках. Подсказываю, что машинка, изображенная под номером один, использовалась в основном в банках (используется ли сейчас, не знаю, но вряд ли), а устройство под номером шесть – специфически бухгалтерское. Последний вопрос самый каверзный, что называется на засыпку.
Ответы находятся под катом.

Этот топик никем не проплачен, и автор не имеет никакого отношения ни к одному из упомянутых в тексте авторов. В тексте присутствует только одна ссылка на источник информации

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

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

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



Кстати, в этой статье не забудем мы и про «вот-вот-вот-уже-скоро-выйдет» Windows Phone 8, и Windows RT.

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

Т.к. моя работа в последнее время связана с разработкой под iOS, мне периодически приходится пересекаться с Mac OS. В этой статье я расскажу о своих впечатлениях об этой системе глазами человека, который всю свою сознательную жизнь провел за виндами.

Сразу скажу — что Mac OS — это не обязательно Apple. Т.к. есть такие проекты, как «Хакинтош», которые позволяют ставить эту OS на любые компьютеры. Конечно, в этом случае вам понадобится нефиговый бубен (особенно если у вас АМД), но факт остается фактом — это возможно. Правда, не всегда гладко. Например, я ставя хакинтош на свой AMD, два дня сидел в гугле в поисках сначала сборки, потом драйверов и прочих фиксов. Кстати, один критичный баг, когда весь флэш-контент (в т.ч. и видео) периодически фризился в браузере — я не поборол. Но про установку макоси на PC я распространяться не буду — это тема для целого отдельного топика.

Есть у меня опыт и работы с родной Mac OS на Mac Mini (кстати, несмотря на свою дороговизну — эта машинка определенно обладает своим очарованием! особенно когда понимаешь, что эта алюминиевая коробочка чуть больше роутера размером может тягаться с огромным шумным компом 3-летней давности).

Итак, начнем…

Плавность и красота.

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

 

В продолжении тематики, решил сделать свой вариант:

Часть 1. 1—20

Зачастую хороший и отличный сайт отличает наличие качественных визуальных элементов в его дизайне. Хотя для своего создания иллюстрации и требуют довольно много времени и таланта, результатом часто является потрясающий дизайн, который действительно могут потрясти и зацепить вашего посетителя. Следующий обзор как раз и включает в себя 40 примеров таких работ, помогая вдохновить вас для следующего проекта.

(Если обзор придется вам по вкусу, переведу вторую часть)

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



Варнинг! Много графики!

Разработчик приложений под OS X Евгений Зуев рассказывает о лаге рендеринга курсора под Mac OS X, который они никак не могут побороть. Имеется в виду задержка между получением информации от мыши и рендерингом нового положения курсора.

Оказывается, сейчас лаг составляет 32 мс, из-за чего на «маках» не так комфортно играть в игры, как на Linux или Windows, где более высокая скорость реакции на движения мыши. Излишне восприимчивых пользователей тоже раздражает едва уловимое «подтормаживание» курсора в OS X.