• Принципы дизайна веб-форм для мобильных устройств

    • Tutorial
    Представляю вашему вниманию перевод статьи "Mobile Form Design Strategies" от Chui Chui Tan. Перевели в компании UXDepot. Специально для пользователей Хабрахабра с одобрением издания UX Booth.


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

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

    Читать дальше →
  • Как делали новый дизайн сайта Expression Engine

    • Translation
    • Tutorial
    Представляю вашему вниманию перевод статьи "Redesigning the ExpressionEngine Site" от Jesse Bennett-Chamberlain. Перевели в компании UXDepot. Специально для пользователей Хабрахабра с одобрением издания Digital Web Magazine.


    Офицер-пограничник на границе между США и Канадой: «Вы направляетесь по делам или же отдыхать, сэр?»
    Я: По делам.
    Офицер: Уточните причину, пожалуйста.
    Я: Я веб-разработчик и еду на встречу со своим клиентом в штате Орегон для обсуждения проекта.
    Пограничник: Как называется компания вашего клиента?
    Я: «pMachine».
    Пограничник: Вы везете какие-либо сайты с собой?
    Я: *недоумевающий взгляд*
    Пограничник: В вашей машине есть какие-либо сайты, сэр?
    Я: Хмммммм… нет, сайты сейчас на серверах. В машине я ничего не везу.
    Пограничник: Тогда как вы хотите показать их вашему клиенту?
    Я: Хмм… вообще-то я просто еду на встречу с клиентом для обсуждения сайта, пока я ему ничего не везу.
    Пограничник: Хорошо, тогда наслаждайтесь поездкой, сэр.

    (30 секунд молчания)

    Хизер: В следующий раз скажи, что мы едем на отдых.
    Читать дальше →
  • UX Ukraine 2011

      Здравствуйте, уважаемые читатели Хабра!
      Хочу поделиться с вами информацией о предстоящем юзабилити-событии в Киеве.
      26-27 февраля в Киеве пройдет конференция User Experience Ukraine с ключевой темой «Потребности пользователей».



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

      Ожидаются и гости из-за рубежа, Дейв Рот из Misi Company и Эрик Райс из FatDUX Group, а также несколько гостей из России. Организаторы решили совместить доклады с практическими работами и выжать по максимуму из двух выходных в отеле на Киевском море.

      Должно быть весело, интересно, полезно и увлекательно. Предлагаю вам ознакомиться с мероприятием и присоединиться. Буду рад встрече на UX Ukraine.
      Читать дальше →
    • Вышел Starcraft 2

        image

        Событие, которое ждали миллионы людей на протяжении 12 лет наконец-то свершилось!
        Эпическая игра, на которую затрачены много-много миллионов только что вышла в релиз.

        Счастливые обладатели ключей, которые они купили в электронных магазинах уже активировали игру в Battle.Net и загружают клиент игры.
        Остальные ждут начала розничных продаж, чтобы купить коробочку пахнущую новым пластиком.

        Судя по общению с несколькими знакомыми — немногие знают, что происходит с ключами, как активировать игру и прочие полезные вещи.
        Читать дальше →
      • Вдохновляйтесь с InspireMe

          Привет, уважаемые посетители хабра :)

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

          image

          Читать дальше →
        • Starcraft 2 Battlereport 3

            Вот и дождались мы третьей части Боевой сводки из Starcraft 2. На этот раз игра происходит между Зергами и Протоссами (несложно было угадать, не так ли? :)

            Пока видео не появилось на официальном сайте, но утекло в сеть.
            Не очень хорошая версия на YouTube:
            http://www.youtube.com/watch?v=VNU21qess4c
            http://www.youtube.com/watch?v=a2WkwEuZsa4

            HD-версия от EuroGamer.

            Сделаны зеркала на несколько хостингов. Пользуйтесь :)

            Ссылки на скачивание
          • Удивительные интерфейсы

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



              Такие встречаются преимущественно именно на flash-сайтах, которые обычно создают незаурядные люди, но не всегда с задатками ucd-специалистов. Хоть и в этой братии зачастую встречаются ОЧЕНЬ любопытные экземпляры человеческой мысли.

              Читать дальше →
            • Идеальное комментирование 2

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

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

                  Читать дальше →
                • Цветовые миксеры. ColorSchemer Studio vs Adobe Kuler



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

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

                    Читать дальше →
                  • Сумасшедшие яйца, или сервис для отслеживания посетителей

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

                      Сумасшедшее яйцо

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


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

                      Тепловое отслеживание популярности


                      Читать дальше →
                    • Сумасшедшие яйца, или сервис для отслеживания посетителей

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

                        Сумасшедшее яйцо

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


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

                        Тепловое отслеживание популярности


                        Читать дальше →
                      • Пассивная защита от дурака

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

                          Защита от дурака

                          Что я понимаю под защитой от дурака? Это некоторые детали интерфейса, которые препятствуют случайному удалению информации, которое, естественно, приведет к потере данных, и нервных клеток пользователя.

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

                          Читать дальше →
                        • Ссылки при наведении курсора: нужна ли реакция?

                            Приветствую, уважаемые хабралюди.

                            На ночь глядя у меня возник некоторый жаркий спор сtheonlyboy, по поводу того, стоит ли при наведении на ссылку — как-то это ссылку изменять: убирать\добавлять подчеркивание ссылки, изменять цвет?

                            Полный пипец, или нормальное выделение? 4 Крайности - какую выбираете?


                            Данный топик был создан исключительно для того, чтобы почерпнуть новые знания и всё таки разобраться — как с точки зрения юзабилити и дизайна UI правильно, и наконец прекратить бессмысленный, но жаркий спор.
                            Читать дальше →
                          • ПравоЗнать — закрытый бета тест

                              Всем добрый день.

                              Мы давно готовились к этому моменту, и вот он, наконец, настал.
                              Страница-заглушка

                              Мы анонсируем бета версию проекта ПравоЗнать.


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

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

                              Нам показались недостаточными только лишь возможности публикации материалов и проектов, поэтому мы позволили комментировать всё, что только можно: статьи, проекты, юристов, компании и даже сами комментарии.
                              Для вашего удобства были созданы подробные и удобные профили пользователей, в которых можно найти как информацию о исполнителе, заказчике или компании, так и отзывы о них.
                              Как уже упоминалось выше, проект дает возможность к прочтению и добавлению своих статей на юридическую тему. Также имеется свой аналог FAQ по юридическим вопросам. Данные функции выводят проект на новый «образовательный» уровень для специалистов.
                              Читать дальше →
                            • Пасхальное яйцо в ролике к StarCraft 2

                                Я думаю, уже многие наслышаны об объявлении сиквела к нашумевшей (кстати говоря, и до сих пор шумящей) стратегии 1998 года — StarCraft.

                                В связи с этим было выпущено 3 ролика:

                                1. Зератул
                                2. Сборка Марина
                                3. Видео геймплея (в двух качественных вариациях)

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

                                Узнать про пасхальное яйцо
                              • Об удобстве интерфейсов

                                  Сегодня, дорогие друзья, мне бы хотелось поговорить об насущной проблеме всеобщего одваноливания (прим. автора: веб 2.0) — проблеме хороших графических интерфейсов на веб-сайтах.
                                  Многие дизайнеры совершают некоторые довольно типичные ошибки при проектировании пользовательских интерфейсов, и это приводит к различным неудобствам при их использовании конечными пользователями.
                                  Читать дальше →
                                • Хабрапопап. Предложение по улучшению.

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

                                    В связи с этим у меня возникло несколько замечаний.

                                    1. Читать неудобно — полей нет.
                                    2. Попап попапом — но никаких индентификаторов того, что они именно хабрапопап — нет.
                                    3. Кегль шрифта выбран неудачный, и цвет заголовков не выделяется.

                                    Вот что было.

                                    Под катом лежит мой вариант — как я вижу хабрапопап.
                                    Читать дальше →