Хабрахабр / Дизайн в IT / Захабренные http://habrahabr.ru/rss/blog/design/ ru editor@habrahabr.ru habrahabr.ru Sat, 11 Feb 2012 04:58:50 GMT http://habrahabr.ru/ http://habrahabr.ru/i/logo.gif Хабрахабр <![CDATA[Дизайн в IT / Интерфейсы бытовой техники отстали на 20 лет]]> http://habrahabr.ru/blogs/design/137953/ http://habrahabr.ru/blogs/design/137953/ За последние 10—20 лет мир IT далеко ушёл вперёд. Способы взаимодействия с устройствами сильно изменились изменив при этом многие стороны жизни. Но некоторые отрасли продолжают упорно сопротивляться прогрессу. И одна из них: интерфейсы бытовой техники.

Так не может продолжаться вечно, и рано или поздно производителям придётся начать наверстывать упущенное.

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

Читать дальше →
]]> Fri, 10 Feb 2012 11:55:30 GMT Adrior бытовая техника <![CDATA[Дизайн в IT / [Перевод] Психологические аспекты человеко-машинного взаимодействия]]> http://habrahabr.ru/blogs/design/137603/ http://habrahabr.ru/blogs/design/137603/

Предлагаю вашему вниманию перевод и адаптацию статьи Сьюзан Вайншенк — «The Psychologist’s View of UX Design».
Предупреждаю, что статья может содержать много «банальных» утверждений. Однако, считаю, что это ничуть не умаляет её общеобразовательной ценности.

… Все вы, наверное, слышали притчу о слепцах и слоне:
Читать дальше →
]]> Sat, 04 Feb 2012 11:43:48 GMT Lynx_Levy психологияюзабилитиpsychology <![CDATA[Дизайн в IT / Как прокачать Яндекс.словари только за счёт дизайна]]> http://habrahabr.ru/blogs/design/137525/ http://habrahabr.ru/blogs/design/137525/ В этой статье я расскажу о том, как за счёт несложного редизайна Яндекс.словари могли бы помогать в изучении иностранных языков. Нет, для этого не придётся вводить 25-й кадр или методику Илоны Довыдовой. Достаточно просто немного поработать над логикой и интерфейсом, всё остальное уже есть.

В статье я буду рассказывать про английский язык, как наиболее популярный и актуальный для айтишников, но те же принципы применимы к изучению практически любого другого иностранного языка.
Читать дальше →
]]> Fri, 03 Feb 2012 05:14:58 GMT Adrior яндекс.словариредизайн <![CDATA[Дизайн в IT / [Из песочницы] Человеко-компьютерный интерфейс – миф или реальность?]]> http://habrahabr.ru/blogs/design/137297/ http://habrahabr.ru/blogs/design/137297/

Что же такое интерфейс в целом?


Согласно Википедии, интерфейс является совокупностью средств, методов и правил взаимодействия (управления, контроля и т. д.) между элементами системы, ну а если выражаться русским не-матерным языком, то интерфейс — это способ взаимодействия чего-то с чем-то, т.е. все окружающее нас ничто иное нежели интерфейс, ведь само понятие нашей жизни раскрывается через взаимодействие с чем-то. Нет, небыло и не будет никого кто существовал бы без взаимодействия с чем-либо: например, кушаете макароны — интрефейсом является ложка (предвосхищая некоторое недовольство — да-да!, ложка — не интерфейс, а средство ввода, ну про средство вывода не будем упоминать, ну ладно — вы поняли о чем я) в рамках этого потока сознания (ЭССЭ — я сказал это — ЭССЕ) мы поговорим о человеко-компьютерном интерфейсе (хотя и это не совсем верно, но давайте убьем этого скобочного зануду и продолжим), итак сегодня мы говорим о ЧКИ.
Читать дальше →
]]> Tue, 31 Jan 2012 13:21:24 GMT mobile54 интерфейстеорияинтересно <![CDATA[Дизайн в IT / [Перевод] Как улучшить выбор страны из списка]]> http://habrahabr.ru/blogs/design/136334/ http://habrahabr.ru/blogs/design/136334/ Представляю вашему вниманию перевод статьи под названием "Redesigning The Country Selector" от Christian Holst. Перевели в компании UXDepot специально для пользователей Хабрахабра с одобрением издания Smashing Magazine.
Выбор страны. Обычно он встречается тогда, когда вы регистрируетесь на новом веб-сервисе, оформляете заказ в интернет-магазине, или же оформляете участие в конференции. Что обычно представляет из себя выбор страны? Выпадающий список с перечнем всех доступных стран.



Однажды, проводя масштабные юзабилити-тестирования (о которых мы писали на Smashing Magazine в апреле 2011. Примечание переводчиков: мы перевели и эту статью тоже. Обязательно ознакомьтесь :), мы последовательно столкнулись с несколькими проблемами, связанными с выбором страны. Якоб Нильсен сообщал о похожих моментах в 2000 и 2007 годах, когда он тестировал выпадающие списки с большим количеством внутренних элементов, к примеру, таких, как перечни штатов или стран.

Читать дальше →
]]> Mon, 16 Jan 2012 11:30:41 GMT DezmASter дизайнпроектированиеюзабилитиинтерфейсывыпадающий списоксписок странuxuiuxdepouxdepot <![CDATA[Дизайн в IT / Календарь настоящего программиста 2012]]> http://habrahabr.ru/blogs/design/135962/ http://habrahabr.ru/blogs/design/135962/ календаря для программистов, мой коллега NoZDR разработал свой вариант календаря на 2012 год, который c его любезного разрешения предлагается вашему вниманию.

image

gif, pdf

UPDATE: Исходник для желающих (Excel). Открываем, нажимаем «Run», радуемся.
UPDATE2: Олдскульный ANSI art.]]> Tue, 10 Jan 2012 14:01:04 GMT eng календарьс новым годом2012 <![CDATA[Дизайн в IT / Вам календарик 2012]]> http://habrahabr.ru/blogs/design/135558/ http://habrahabr.ru/blogs/design/135558/

И вот опять вам календарик!

По сложившейся традиции канун 31 декабря я провожу поедая мандарины и обновляя календарик для Хабра.

В карман (100×70мм):
pdf, eps, svg или png (1185×836, 300dpi)

На стенку (A4):
pdf, eps, svg или png (3512×2487, 300dpi)

Сделай сам:
Генератор календариков (Python, CC-BY)

Читать дальше →
]]> Fri, 30 Dec 2011 20:00:08 GMT anatoly_rr календарьс новым годом!традиции <![CDATA[Дизайн в IT / Интерфейсная помощь МТС Интернет-помощнику]]> http://habrahabr.ru/blogs/design/135097/ http://habrahabr.ru/blogs/design/135097/
Всем привет.

Сегодня пойдет речь об интерфейсе украинского МТС «интернет-помощника» (ihelper.mts.com.ua). Этот онлайн-сервис призван помогать пользоваться услугой 3G-интернет: проверять остаток на счету и количество использованного трафика, а также многое другое. Но мне кажется, что «интернет-помощнику» самому нужна помощь… С интерфейсами.

Почему я решил написать этот топик:
  1. Я сам пользуюсь 3G интернетом от МТС. И у меня постоянно возникает ряд проблем при использовании «интернет-помощника». Например, я не знаю, когда снимаются деньги со счета или сколько трафика я уже использовал в этом месяце. Дошло до того, что я, либо жду пока отключат интернет, либо пополняю счет заранее.
  2. Во-вторых, в «помощнике» есть много функций и фич, смысл которых не совсем понятен. А действительно важных функций, нет.
  3. Мне хотелось бы обратить внимание компании МТС на этот вопрос. Понятно, что это далеко не самый важный интерфейс на сайте. Но все же это сервис, который призван помогать и давать возможность контролировать свои расходы. Сейчас совершенно не понятно как это сделать. Поэтому о прозрачности предоставления услуги говорить сложно, что непосредственно влияет на лояльность пользователей.
  4. Опираясь на практику общения на хабре, я уверен, что в комментариях могут родиться замечательные идеи по улучшению этого сервиса.


Итак поехали.
]]> Thu, 22 Dec 2011 12:48:16 GMT iwebster интерфейсыюзабилитимтс-украинапрототип <![CDATA[Дизайн в IT / В России умеют не только программировать]]> http://habrahabr.ru/blogs/design/134837/ http://habrahabr.ru/blogs/design/134837/
Однако, при наличии в Вашем проекте связки софт+железо шансы на успех возрастают многократно. Китай, конечно, все скопирует, но не сразу.

image

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

Читать дальше →
]]> Mon, 19 Dec 2011 07:01:19 GMT PapaBubaDiop проектированиедизайнпромышленныйiPhoneнахлобучка <![CDATA[Дизайн в IT / О регистрации на сайтах]]> http://habrahabr.ru/blogs/design/134595/ http://habrahabr.ru/blogs/design/134595/

Пример удачной регистрации на сайте Tumblr.

Начну с определения самого понятия «регистрация», с ним всё не так просто, как может казаться. В результате полевых исследований нашей компании оказалось, что разные люди (клиенты, посетители и мы сами) нередко воспринимают это слово по-разному. Для того, чтобы избежать непонимания, опишу то, как я сам вижу регистрацию.
Читать дальше →
]]> Wed, 14 Dec 2011 13:32:21 GMT DezmASter регистрациясоциальные сетисайтысервисыпроектыopenidпарольuxdepot <![CDATA[Дизайн в IT / Красивый и эффективный email маркетинг]]> http://habrahabr.ru/blogs/design/134414/ http://habrahabr.ru/blogs/design/134414/ Доброго времени суток!

Есть немаловизвестная проблема в рунете — очень много пользователей негативно относится к html письмам, говоря о том, что plain/text — наилучший вариант для получения web корреспонденции. Но лично я считаю, что мы слишком перенасытились говнодизайном российского дизайн-конвеера. Я не говорю, что в России нет хороших дизайнеров, они бесспорно есть! Но большинство из них уже давным давно работает на западного дядю, а те, что по прежнему работают на российском рынке так редки, что мы не способны оценить их работу по достоинству.

В данном топике я бы хотел привести примеры дизайна отличных западных регулярных рассылок. У них есть чему поучиться.
Читать дальше →
]]> Wed, 14 Dec 2011 02:06:05 GMT dudeonthehorse html рассылкидизайн рассылокпочтовые рассылки <![CDATA[Дизайн в IT / [Перевод] Исследование о мобильных интерфейсах]]> http://habrahabr.ru/blogs/design/133684/ http://habrahabr.ru/blogs/design/133684/ Представляю вашему вниманию перевод статьи под названием "A Study of Trends in Mobile Design" от Alexander Dawson. Перевели в компании UXDepot специально для пользователей Хабрахабра с одобрением издания Smashing Magazine.
Индустрия веб-дизайна развивается сразу во многих направлениях, но одна ее область повлияла на то, как мы строим сайты, больше чем любая другая. Всплеск количества мобильных устройств, позволяющих выходить в интернет, породил субкультуру пользователей, которые нуждаются в том, чтобы веб-сайты адаптировали под их устройства. Несмотря на то, что веб-дизайн для мобильных устройств все еще находится в зачаточном состоянии (и первичных исследований насчет тенденций в этой области очень мало), нам следует понаблюдать, как развивается этот критичный элемент веб-индустрии, а также следует знать паттерны, которые появились в результате развития этой области.



Цель этой статьи — рассказать вам о методах, которые используются на самых популярных сайтах для того, чтобы предоставить пользователям мобильных устройств удобное и (надеемся) полезное взаимодействие. Среди проанализированных сайтов много известных компаний, например Facebook и Amazon. Мы приготовили для вас настоящий экскурс в мир мобильного веб-дизайна, со статистикой и по-настоящему интересными открытиями.
Читать дальше →
]]> Tue, 06 Dec 2011 06:48:11 GMT DezmASter дизайнпроектированиедизайн интерфейсовюзабилитиинтерфейсыuiuxguiмобильные сайтымобильные телефонытрендыuxdepot <![CDATA[Дизайн в IT / Мой взгляд на μHabr]]> http://habrahabr.ru/blogs/design/133967/ http://habrahabr.ru/blogs/design/133967/

В последнее время я внедряю по отношению к себе правило — на выходных посвящать некоторое время рисованию «для души», работе над концептами или даже странными идеями.

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

Далее большие картинки
]]> Sun, 04 Dec 2011 11:51:09 GMT AlekseyPopov Хабрмысли вслухxeoart <![CDATA[Дизайн в IT / Еще одна флешка-криптекс с серьезной защитой]]> http://habrahabr.ru/blogs/design/133922/ http://habrahabr.ru/blogs/design/133922/

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

Читать дальше →
]]> Sun, 04 Dec 2011 08:43:22 GMT marks криптексusb-флэшки <![CDATA[Дизайн в IT / Правильный бейджик для IT-конференции]]> http://habrahabr.ru/blogs/design/133926/ http://habrahabr.ru/blogs/design/133926/

Вчера я посетил конференцию .тостер {мобильные приложения}, и у меня родилась идея, как можно более толково оформить бейджики участников. Вроде бы, зачем вообще оформлять такую бестолковую вещь? Но дело в том, что при должном подходе бейджик может превратиться из бесполезной бумажки на шее участника в мостик между двумя мирами: реальным и виртуальным.

Читать дальше →
]]> Sat, 03 Dec 2011 11:26:15 GMT Adrior бейджи <![CDATA[Дизайн в IT / [Перевод] Проектирование и дизайн сайтов Би-Би-Си]]> http://habrahabr.ru/blogs/design/133681/ http://habrahabr.ru/blogs/design/133681/ Представляю вашему вниманию перевод статьи под названием "User Experience and the design of news at BBC World Service" от Tammy Gur. Перевели в компании UXDepot специально для пользователей Хабрахабра с одобрением компании BBC и издания Johny Holland Magazine.



Проектирование окружающей среды для стремительного потока информации, проходящего через новостной веб-сайт в режиме нон-стоп — это вызов, не похожий ни на что другое. Команда дизайнеров и специалистов в области UX в BBC World Service создает новостные сайты для десктопных и мобильных браузеров на 27 языках, удовлетворяя различные аудитории по всему миру. В этой статье мы поделимся этим опытом с вами.
Читать дальше →
]]> Wed, 30 Nov 2011 06:40:02 GMT DezmASter bbcuxuiдизайнпроектированиедизайн интерфейсовпроектысайтновостиюзабилитиuxdepot <![CDATA[Дизайн в IT / [Перевод] Ничего не нашлось в поиске по сайту? Нет проблем]]> http://habrahabr.ru/blogs/design/133557/ http://habrahabr.ru/blogs/design/133557/ Представляю вашему вниманию перевод статьи под названием "Site Search: Strategies for No Results Found" от Linda Bustos. Перевели в компании UXDepot специально для пользователей Хабрахабра с одобрением компании Elastic Path.

Эта статья написана по мотивам книги Грега Ньюдельмана "Designing Search: UX Strategies for Ecommerce Success". Необычно видеть книгу на 300 страниц, посвященную одному единственному аспекту создания интернет-магазинов, но оптимизация поиска по сайту действительно заслуживает такого внимания!

image

Есть одна составляющая оптимизации поиска по сайту, на которой мы часто зацикливаемся: как удержать пользователя на сайте, даже если в результате поиска ему не удалось найти то, что требовалось. Статья основана на разделе "No Search Results Strategy: Not a Zero-Sum Game" вышеупомянутой книги. Ньюдельман говорит о том, что «нет простого набора правил, которые гарантировали бы успешное внедрение страницы результатов поиска в случае, когда не было найдено ни одного совпадения. Но есть четыре принципа, от которых стоит отталкиваться»:
Читать дальше →
]]> Mon, 28 Nov 2011 18:30:12 GMT DezmASter поискинтерфейсыдизайнпроектированиевыдачапомощьhowtouiuxuxdepot <![CDATA[Дизайн в IT / Компьютерные интерфейсы повсюду]]> http://habrahabr.ru/blogs/design/132993/ http://habrahabr.ru/blogs/design/132993/ как это адекватно передать на русском языке?)-, университет Токио), направленный на то, чтобы превратить совершенно обычные бытовые предметы в квартире в инструменты взаимодействия с компьютером без использования мыши, клавиатуры или «тач»-экрана как таковых.

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

Узнать подробнее и видео под катом
]]> Sun, 20 Nov 2011 10:47:46 GMT jeston интерфейсдизайнбудущеедополненная реальность <![CDATA[Дизайн в IT / Правильные барабаны для выбора времени]]> http://habrahabr.ru/blogs/design/132528/ http://habrahabr.ru/blogs/design/132528/ Недавно я написал о том, каким вижу будильник своей мечты для Андроида. Спасибо всем, кто предложил свою помощь с его воплощением.

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

А сегодня я расскажу о то, как сделать качественный барабан выбора времени для этого приложения. Эти же принципы можно применить на любые другие барабаны-выбиралки.
Читать дальше →
]]> Mon, 14 Nov 2011 08:23:01 GMT Adrior андроидбарабанывремя <![CDATA[Дизайн в IT / Экспериментальный дизайн Birch мобильного Firefox для Android]]> http://habrahabr.ru/blogs/design/132440/ http://habrahabr.ru/blogs/design/132440/

Ранее мобильное подразделение Mozilla, разрабатывающее браузер для Android, использовало для создания интерфейса приложения XUL-разметку, привычную для настольной версии Firefox (интересно, что самим проектом XUL также занимается фонд Mozilla Foundation). Теперь выбор сделан в пользу «родных» для Android элементов управления, что должно обеспечить более гибкий и отзывчивый интерфейс.

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

Под катом скриншоты браузера.

Посмотреть
]]> Fri, 11 Nov 2011 17:58:29 GMT jeston дизайнbirchfirefoxandroidmozilla