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

Рейтинг фотоальбома = кол-во «Share» в Facebook + кол-во «Сохранить» в Вконтакте + кол-во «Retweet» в Twitter

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

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

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

Итак:

• количество лайков будем получать от REST сервисов каждой социалки
• кнопки рисуем свои и обрабатываем событие click

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

Пример кросс-авторизации

Вернемся в 2005-й год и представим, что мы пишем социальную сеть. В ней имеется форма импорта контактов из адресной книги GMail. Что нужно для доступа к контактам GMail? Конечно, логин и пароль от ящика. Но если мы попросим ввести их на нашем сайте, пользователь заподозрит неладное. Где гарантия, что мы не сохраняем на сервере введенные пароли? Поэтому нам хочется, чтобы пароль вводился только на сайте GMail, и после этого доступ к контактам через API GMail предоставлялся нашей социальной сети (возможно, на время).

Каталог:
Один
Два
Три

μTorrent

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

Каталог:
Один
Два
Три

Оказывается длинные опусы нужно разбивать. А я то думал «многосерийные» топики публикуют исключительно для зарабатывания рейтинга :-)

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

Каталог:
Один
Два
Три

Менеджер памяти (и связанные с ним вопросы контроллера кеша, менеджера ввода/вывода и пр) — одна из вещей, в которой (наряду с медициной и политикой) «разбираются все». Но даже люди «изучившие винду досконально» нет-нет, да и начинают писать чепуху вроде (не говоря уже о другой чепухе, написанной там же):

Грамотная работа с памятью!!! За все время использования у меня своп файл не увеличился ни на Килобайт. По этому Фаерфокс с 10-20 окнами сворачивается / разворачивается в/из трея как пуля. Такого эффекта я на винде добивался с отключенным свопом и с переносом tmp файлов на RAM диск.

Или к примеру μTorrent — у меня нет никаких оснований сомневаться в компетентности его авторов, но вот про работу памяти в Windows они со всей очевидностью знают мало. Не забываем и товарищей, производящих софт для слежения за производительностью и не имеющих ни малейшего понятия об управлении памятью в Windows (и поднявших по этому поводу истерику на пол интернета, на Ars-е даже был разбор полетов). Но самое потрясающее, что я видел всвязи с управлением памятью — это совет переместить pagefile на RAM-диск:

Из моих трех гигабайт под RAM disk был выделен один (на тот момент, когда на лаптопе еще была установлена XP), на котором я создал своп на 768МБ ...

Цель данной статьи — не полное описание работы менеджера памяти (не хватит ни места ни опыта), а попытка пролить хоть немного света на темное царство мифов и суеверий, окружающих вопросы управления памятью в Windows.

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

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

Что заставляет дизайн выглядеть скоординированным, спланированным и профессиональным? Ответ: 'цвет'.

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

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

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

У вашего нового сайта современный актуальный дизайн. Пуленепробиваемая верстка. Хрустально чистый код, способный в легкую держать 50 000 уников. Осталось только написать ясные и четкие тексты.

Это правило поможет вам. Не смотря на то, что оно простое, оно очень эффективно.

Стив Круг и Якоб Нильсен учат нас: если пользователь быстро не понял, нужна ли ему информация – он уйдет. Текст будет прочитан очень бегло, буквально одно-два предложения.

Как правильно составить текст для сайта? Что поставить вперед, а что приберечь на потом? Когда я впервые задался этим вопросом, мой отец, в прошлом журналист ТАСС, рассказал о правиле пирамиды. Его, в свое время, научили коллеги из BBC (Би-би-си, а не вэ-вэ-эс, если что).

Ни одна CAPTCHA не выстоит в противостоянии с армией низкооплачиваемых юзеров, которые готовы сутками распознавать «каптчи» Google и Myspace за скромное вознаграждение $2 за 1000 картинок. В Индии сформировалась целая индустрия «дата-процессинга», которая специализируется именно на этом, там работают тысячи и тысячи индусов.

Эти люди сидят за дисплеями и решают «каптчи» в реальном режиме времени. Их рабочий интерфейс выглядит примерно так.

На Flickr появилась отсканированная энциклопедия логотипов (70-е годы).

Логотипы проранжированы от А до Z. В книге 120 страниц vintage логотипов.
Полную версию книги (23,6 МБ в формате pdf) можно взять на Logoblink.com

Черпаем вдохновение в прошлом!

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

Начинал я рисовать сайты, как и все, в Фотошопе. Но чем сложнее становились задания, тем сильнее ощущалась его неприспособленность для проектирования интерфейсов. Оно и понятно: Адоби никогда не говорили, что он предназначен для интерфейсных дизайнеров, это дизайнеры как-то сами себе придумали. Всегда хотелось иметь инструмент с двумя кнопками и тремя ползунками — все равно я больше не использовал ни в Фотошопе, ни в Фаерворксе ни в ИнДизайне. Сейчас у меня из «адобовского» набора есть только доставшийся бесплатно (в нагрузку к планшету) Фотошоп Элементс, установленный из принципа (халява же), а все остальное я уже давно заменил другими приложениями. И вот одно из.

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

• var id = setTimeout(fn, delay); — Создает простой таймер, который вызовет заданную функцию после заданной задержки. Функция возвращает уникальный ID, с помощью которого таймер может быть приостановлен.
• var id = setInterval(fn, delay); — Похоже на setTimeout, но непрерывно вызывает функцию с заданным интервалом (пока не будет остановлена).
• clearInterval(id);, clearTimeout(id); — Принимает таймер ID (возвращаемый одной из функций, описанных выше) и останавливает выполнение callback'a.

Главная идея, которую нужно рассмотреть, заключается в том, что точность периода задержки таймера не гарантируется. Начнем с того, что браузер исполняет все асинхронные JavaScript-события в одном потоке (такие как клик мышью или таймеры) и только в то время, когда пришла очередь этого события. Лучше всего это демонстрирует следующая диаграмма:

Все мы слышали про ajax и node.js. Они прочно обосновались уже не просто в словарном запасе, но и в наборе инструментов веб-разработчика. Ajax — асинхронное подтягивание данных с сервера на страницу, node — фреймворк с асинхронным IO. Но как в таком однопоточном языке, как Javascript, реализуется та самая асинхронность?

Вы, наверное, уже догадались из заголовка, речь пойдет об основном цикле («main loop»).

Термин «игровая механика» имеет много значений, но сегодня я буду говорить об игровой механике как об абстракции, определяющей состояние игры. Очень упрощённо это выглядит вот так:



Есть только два фактора, которые определяют любое текущее состояние игры: механика (правила) и игроки своими действиями.

Уровень ядра

Такт 1: определение состояния
Всегда есть некое текущее состояние системы (например, начало хода). Оно определяется на первом такте инициализирующей последовательностью, когда игроки «загружают» игру, раскладывая поле, выбирая фишки, распределяя начальные ресурсы и так далее. Затем оно меняется в зависимости от происходящего в игре.

Я учился в Канаде (в моих старых постах на Хабре можно проследить за тем процессом) благодаря стипендии правительства Казахстана под названием «Болашак» (каз. «будущее»). Ребята с сайта essay.kz совместно с администрацией этой стипендии регулярно приглашают выпускников «Болашака» и снимают мини-лекции. Недавно позвали и меня, решил рассказать об алгоритмах.

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

• Что такое информатика и computer science?
• Что такое алгоритм?
• Лучшие решения обычно не очевидны
• Машина Тьюринга и фундаментальные ограничения копьютеров
• Что такое простые и сложные задачи?
• Задача Коммивояжера
• Почему языки программирования не похожи на человеческие языки?

Видео разбито на две части (один, два). Чтобы пропустить введение – начинайте смотреть с 2:56.

Часть 1:

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

Бен Кэменс обнаружил, что в выпадающем списке Shop by Department на сайте «Амазон» ховер-эффект происходит очень быстро, абсолютно без какой-либо задержки. Тем самым происходит нарушение старого, выработанного ещё в 90-х годах прошлого века правила: перед отображением пункта подменю необходим так называемый гистерезис, запаздывание.



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

Привет!

Как известно, одним из основных правил использования облачных сервисов является оптимизация всего, а особенно финансовой стороны вопроса. В Amazon Web Services есть 3 основных метода оптимизации стоимости сервиса:

• автомасштабирование
• резервирование
• использование спот инстансов

Сегодня я расскажу о резервировании в EC2, как, что и зачем это нужно обязательно делать.

Reservation — это предварительная оплата серверных мощностей, позволяющая значительно уменьшить расходы на эти же самые мощности. Существует 3 вида резервации:

• Облегчённого использования — Light Utilization
• Среднего использования — Medium Utilization
• Усиленного использования — Hard Utilization

В данный момент я занимаюсь поиском подходящих серверов для инфрастуктуры моего проекта. Я остановился на EC2 и решил проанализировать, какое решение будет наиболее экономически выгодным для меня. Эта статья по сути является продолжением AWS Insight: Резервации в EC2 — как это работает, но приводит анализ для молодого веб-стартапа (24x7).

Проблема

Сервер должен работать 24 часа в сутки напротяжении X месяцев (количество не определено). Какой вариант (On Demand / Light Utilization Reserved / Medium Utilization Reserved / Heavy Utilization Reserved) выбрать для Micro/Small/Medium/Large серверов?

Не так давно мне стало любопытно, насколько сносно современные браузеры поддерживают HTML5 и я не нашел лучшего
способа, чем написать простейший 2D платформер. Помимо удовольствия от разработки игрушки и улучшения навыков в использовании JavaScript, в ходе развлечения кропотливой работы был накоплен определенный опыт и эмпирическим путем были найдены основные грабли, на многие из которых мне пришлось наступить. В этой статье я попробую кратко и с примерами резюмировать то, что вынес для себя из проделанной работы. Желающих создать свое высокопроизводительное JavaScript приложение, эффективно работающее с графикой, прошу под кат.