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

^{*или чем занять все выходные на полгода вперёд.}

Вторая часть грандиозной подборки инди-игр для читателей Хабрахабра. Начало положено в этом посте.

Почему всё растянуто на четыре части, а не в одном посте? Нет, я не гонюсь за рейтингом. Изначально я хотел засунуть всё в один пост, но что-то не получалось с технической стороны. Пост достаточно большой выходил — около 85 килобайт одного текста. Тогда я написал в техподдержку, и уважаемый Shoohurt мне ответил:

Игорь <xrazont@gmail.com>
Я хочу запостить относительно большой топик(~85 килобайт текста с тегами), но не получается — после нажатия на кнопку «отправить» сначала ничего не происходит, а потом вылезает сообщение «Some error… We know...». Мне действительно лучше подождать, пока эту проблему(если это проблема вообще) починят, или же запостить как-нибудь по-другому? Очень не хотелось бы резать пост на части.

Alexander Savitsky <as@thematicmedia.ru>
Это не совсем баг, а, скорее, особенность механизма постинга на Хабре. В идеале столь большие топики лучше все-таки постить частями (можно одну за другой сразу). В противном случае нам придется возиться с этим топиком вручную, что едва ли хорошо :)

Я тут подумал, что препираться не стоит и разделил пост на четыре. Зато теперь можно ещё с десяток написать! Правда вот столько игр не наберётся хороших…

World of Goo

Вдохновлённая Pontifex, World of Goo, выстрелившая на весь мир, стала одной из самых популярных инди-игр. Удивительно, но собирать башни и другие шедевры архитектурного Goo-искусства из живых капель грязи может быть весьма медитативным процессом, требующим некоторой подготовки и доставляющий истинное наслаждение прочностью всей конструкции. А прекрасный саундтрек отлично способствует всему этому!

$20.
Windows, Linux, Mac OS X, Wii.
Пост на Хабре про World of Goo

Caster

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

$5.
Windows, Linux, Mac OS X, iPhone.

Интересная программа на технологии Adobe AIR. Суть программы Color Browser заключается в приятном подборе палитр для сайта или дизайна. Сделана программа как приложения к сайту ColourLovers (где можно скачать чужие палитры)

Скачать программу Adobe AIR можно на сайте Adobe а Color Browser от сюда.
После установки Adobe AIR запустите файл ColorBrowser.air

Другие приложения работающие на Adobe AIR можно посмотреть здесь.
Источник: mmaxis.info

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

система делится на несколько зон, которые сливаясь образуют знание языка:

1. грамматика
2. понимание написанного
3. понимание на слух
4. чтобы поняли вас

теперь более детально по инструментам, которые могут применяться внутри зон:

В прошедшие выходные Хабр обзавелся официальным приложением-читалкой под всеми любимый iPhone.

картинка кликабельна

В первый день релиза приложение было доступно только в Российском AppStore, вчера добавили еще несколько стран. Теперь его можно скачивать и с US-аккаунтов.

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

Итак, дорогие хабраюзеры. Если вы уже успели воспользоваться приложением для Habrahabr, то у вас, наверняка, есть свои комментарии и советы, как сделать приложение еще лучше. Все найденные баги, возможные улучшения и пожелания оставляйте в комментариях к топику, или присылайте на нашу хабрапочту. Отзывы в AppStore тоже читаем (привет, scroll89).

Всем снова привет.
Сегодня буду рассказывать о моем любимом — о Юзабилити.

В русском языке есть этому модному слову замена — Удобство. Но когда речь идет об удобстве взаимодействия человека с компьютером, то мы сразу говорим юзабилити.

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

Сначала окунемся в историю.

Это вторая часть перевода интересного исследования, которое проводили авторы популярного интернет сайта Smashing Magazine. Первую часть вы пожете прочитать здесь. В этот раз авторы затрагивают вопросы капчи, сообщения «Спасибо за регистрацию», кнопки «Отмена» на формах и некоторые другие интересные вопросы.

3. Функциональность форм

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

Это перевод довольно новой статьи, которая вышла 4 июля 2008 года. Если вы уже читали ее, то навряд ли найдете что-то новое, но для тех, кто не знаком с оригиналом в статье найдется масса интересного. Сначала я хотел перевести и подписи к картинкам, но позже понял, что не стоит этого делать, так как статья ориентирована на грамотного читателя, который способен сам определить простейшие фразы.

UPD: Опубликована вторая часть статьи habrahabr.ru/blogs/ui_design_and_usability/45680

Когда вы хотите увеличить доход вашего сервиса вы должны увеличить количество заполнений ваших веб-форм. Даже, если, на первый взгляд, у вас есть какие-то революционные идеи для того чтобы удивить посетителей, недостаточно просто добавить возможность регистрации на вашем сайте. Для того, чтобы сервис достиг максимальных посещений мы, дизайнеры, должны предоставить пользователю хорошие решения (good user experience). Мы должны завлечь их, описать им, как работает сервис, объяснить им, почему стоит заполнить форму и описать выгоду, которую они от этого получат. И, конечно, мы должны сделать их участие максимально простым.

Тем не менее, разработка дизайна веб-форм — это не простое дело. И здесь есть одна простая причина: никто не любит заполнять формы — ни в оффлайне ни в онлайне. Следовательно, как дизайнеры, мы обязаны найти дизайнерские решения, чтобы сделать заполнение форм делом простым, интуитивным и безболезненным.

Но как на самом деле мы находим такие решения? Где в разметке должна располагаться ссылка на форму? Какой у нее должен быть дизайн? Как мы должны выделить подписи, и какое выравнивание у них должно быть? Какие паттерны дизайна применяются в современных веб-сайтах? Это именно те вопросы, которые мы задавали себе. И чтобы получить ответы мы провели наше обозрение.

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

Сейчас мы с вами поговорим о веб-формах. Я с высоты собственного невысокого полета успел накопить кое-какой опыт и жажду непременно им поделится. Все о чем пойдет речь ниже не является черепахой на которой стоят слоны. Речь пойдет о скотче на котором держится черепаха.

Итак…

Первое – Откуда ноги?

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

• Для кого делается форма?
• Какая информация нужна, что бы понять и заполнить форму?
• Каков результат заполнения формы?
• Какие у нас есть возможности?

Давайте соберем ссылки на твиты тех российских стартапов, инвесторов и ресурсов, которые регулярно и интересно пишут о своих проектах, фондах или о новостях.

Стартапы и их основатели:

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

Поэтому я попробую исправить этот недочёт.

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

Welcome!

Однажды вечером я почувствовал, что пришло время расширить 97‐ й параграф «Ководства» Артемия Лебедева.

На клавиатуре одна чёрточка, она обычно правее нуля и повыше букв «З» и «Х». Неосведомлённые люди называют её попеременно то дефисом, то минусом, то тире. Лебедев объясняет нам, что это четыре (учитывая две разновидности тире) различных символа. На самом деле их как минимум девять, и об этом я и расскажу вам сейчас.

Вашему вниманию предлагается перевод статьи 10 colour contrast checking tools to improve the accessibility of your design от Roger Johansson. Перевод alexbig

10 инструментов проверки контраста вашего дизайна для улучшения его „читабельности“

В моей повседневной работе мы создаём графический дизайн для большинства сайтов наших клиентов, но не для всех. Некоторые из них сами или с помощью дизайн студий делают визуальный дизайн и оставляют переход на HTML + CSS + JavaScript и CMS для нас. Когда такое происходит, я практически всегда сталкиваюсь с проблемами недостаточного цветового контраста в дизайне. Иногда эти проблемы достаточно второстепенные и допустимые, но зачастую, есть области, которые необходимо скорректировать.

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

Данное рассуждение явилось разросшимся комментом на публикацию dezmasterdezmaster, опубликовавшему сегодня статью под заголовком "Ссылки при наведении курсора: нужна ли реакция?". Честно говоря, меня давно мучают схожие вопросы (= И вот, наконец, удалось немного понаводить порядок в своей голове.

Основной смысл всего мною сказанного: сила реакции ссылки на курсор мыши уменьшает время прицеливания (точно также как и размер ссылки, и ее расстояние от курсора), а значит уменьшает время между нашим желанием и его реализацией. Однако, вместе с тем, слишком сильная реакция может угнетает наши органы чувств и вызывать раздражение.

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

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

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



Пользователь искал ссылку «Фотки». Потратил на это 38 секунд. Он дважды обошёл глазами экран по кругу, и только 78-фиксация взгляда попала на тот объект, который он искал.

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



15 секунд на то, чтобы обнаружить ссылку на другом портальном сайте. Ссылка находится в ряду (в списке) других ссылок. Оформление списка направляет взгляд.

Истина заключается не в том, что вы знаете, а в том, что вы знаете о своих знаниях.

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

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

Мы, сотрудники Behavior, как и коллеги из огромного количества других user experience design компаний, стараемся при любой возможности проводить исследования пользователей. Исследования, настолько глубокие, насколько нам это позволяют бюджет и сроки проекта.

В своей практике мы применяем такие методы исследования: юзабилити тестирование (включая лабораторные и неформальные тесты), сортировку карточек, интервью и опросы пользователей, статистический анализ, полевые этнографические исследования, анализ контекста и/или дополнительные маркетинговые исследования.

Мы стараемся как можно больше узнать о наших клиентах, о их заказчиках и конкурентах. А после — как можно более полно применить это знание в процессе проектирования.

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

На рисунке справа приведен пример так называемой «heatmap», получаемой в результате регистрации движения глаз пользователя. Те точки на экране, на которые пользователь смотрел на протяжении большего времени подсвечены красным цветом.

По моему мнению, так называемое «эмпирическое» тестирование пользовательского интерфейса имеет ограниченную полезность. Объем информации, которую вы можете получить – конечен. Рано или поздно вы достигните того момента, когда информацию придется начать интерпретировать. Именно во время процесса интерпретации риск совершить ошибку наиболее высок. В этот момент вы можете не заметить влияния какого-то важного фактора или даже прийти к ложным заключениям, особенно, если не обладаете достаточным опытом и умениями в проектировании.

Регистрация движения глаз (eyetracking), которую в одной статье опрометчиво назвали «будущим веб дизайна», является замечательным примером «инструмента проектирования», который недавно привлек к себе значительное внимание. Джаред Спул считает, что эта методика, возможно, не заслуживает такого внимания, и я с ним полностью согласен. Моим первым возражением будет то, что система регистрации движения глаз может сказать вам только на что люди смотрят в данный момент, но не то, что они там видят. Во вторых, результаты полученные при регистрации движения глаз редко являются чем-то неожиданным для хорошего проектировщика. Наконец, одни и те же результаты можно истолковать по-разному, что и происходит при каждой попытке анализа субъективного опыта.

Сегодняшняя заметка будет о сервисе отслеживания активности пользователя — CrazyEgg. Я не знаю кому обязан сервис таким говорящим именем, но оно работает, и хорошо. Запоминается? Отлично!

Что это такое?

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

В эпоху вебдванольности удивляет, что никак не эволюционируют формы для авторизации на сайте. Как были 10 лет назад на Hotmail два поля и кнопка, так и остаются по сей день.
Предлагаю усовершенствовать процесс авторизации, сократив форму до минимума: оставить одно поле.
Суть в том, что пользователь последовательно вводит в одно и то же поле логин и пароль, нажимает два раза на Enter и попадает на сайт. Таким образом экономится место на сайте и уменьшается количество нажатий на кнопки.


В качестве примера сделал такую формочку.
Интересно было бы услышать мнения.