Прототип интерфейсов (в нашем случае сайта) — это не только один из этапов проектирования, но и самостоятельный продукт, с которым далеко не всегда работает та же команда, что его создавала. Поэтому мы составили требования к оформлению прототипов. Сначала они были внутренними, но как только мы начали поиски новых проектировщиков, оказалось, что эти требования могут быть полезны не только нам, и мы сделали этот материал.
Ни в коем случае не претендуем на исчерпывающий список, более того, ждем от вас дополнений. Некоторые правила могут быть актуальны только для Axure.
26 ноября в конференц-зале гостиницы «Юбилейная» прошла открытая конференция, посвящённая Всемирному дню юзабилити. Конференцию посетило около 200 человек.
Предлагаем Вашему вниманию видео с прошедшей конференции:
Мы постоянно работаем над улучшением качества, проводимых нами мероприятий. Обратная связь очень важная для нас. Пожалуйста, напишите Ваши впечатления и пожелания для организаторов.
Если Вы написали свой отчёт, делали фотографии или задавали вопросы, то напишите нам на почту wud@usability.by - у нас ещё остались призы.
Быть в курсе мероприятий сообщества Usability.by вы можете, следуя за нами в Twitter и Facebook или подписаться на RSS. Прочитать в твиттере сообщения о конференции и оставить своё можно, используя хэш-тег #wudby.
Что веб-дизайнер может почерпнуть из игр, а точнее видео игр?
Хороший интерфейс игры должен быть удобным для пользования и интуитивно понятным, способным выполнять множество повторяющихся действий с как можно меньшим количеством кликов. Он должен быть привлекательным и цепляющим. Он должен быть приятным взгляду. Хороший интерфейс увеличивает удовольствие от игры: людям нужно получить контент в таком виде, который не разрушает игру воображения. Любой диссонанс с интерфейсом может стать причиной провала игры, которая во всех остальных отношениях прекрасна.
Примеры паттернов интерфейсов на сайте Androidpatterns помогут Вам при проектировании приложения под Андроид. Каждый паттерн снабжён прототипом, кратким текстовым описанием и примером в реальных приложениях. Авторы советуют использовать библиотеку для вдохновления и поиска решений, а не как непреложными законами.
Сделать в России простую и удобную платёжную систему как для продавца, так и для покупателя - серьёзный вызов для любого UX-специалиста/проектировщика интерфейсов. Чем интереснее и сложнее задача, тем больше опыта и знаний получаешь в процессе работы. Именно над такой задачей я работаю и в этой статье хотел бы поделиться полученным опытом по перепроектированию и доработке системы интернет-платежей A1Pay.
В статье рассмотрены этапы работы, решения, которые были приняты и то, на чём они основывались. Описать в одной статье все интересные идеи, возникшие трудности и их решения, находки и т.д. -. не простая задача. Часть важных вопросов, например, измеряемые KPI и их значения, по понятным причинам, остались совсем за рамками.
Билл Бакстон – ведущий исследователь Microsoft Research и автор книги “Sketching User Experiences: Getting the Design Right and the Right Design”. У него 30-летний опыт исследований и разработки в области HCI, а также разработки электронных инструментов для творчества, включая музыку, кино и промышленный дизайн. Говоря о себе он часто упоминает о коллекции гаджетов, которой он распологает и по которой можно изучить историю развития цифровых устройств и интерфейсов. И вот коллекция Билла Бакстона появилась в сети.
Эта статья была опубликована еще в 2008 году на официальном сайте Adobe. В ней Nick Myers (ведущий визуальный дизайнер компании Cooper) рассказывает о преимуществах Fireworks в проектировании интерактивных продуктов. Сегодня перевод статьи опубликован на Хабрахабре:
Мне часто задают вопрос: «Какие инструменты вы используете при проектировании ваших продуктов?». Мой ответ «Fireworks» часто встречали с недоумением. Я провожу много времени чтобы объяснить наше предпочтение и это помогает, но я чувствую себя несколько защищающимся, так как Adobe Fireworks не является стандартным инструментом в нашей отрасли.
Когда я впервые пришел в консалтинговую компанию Cooper, я понял, что мне придется расстаться с всемогущим Adobe Photoshop (моим союзником с тех времен, когда слоёв в нем еще не было), и я немного беспокоился и был настроен скептически, но спустя несколько недель я изменил свой подход к проектированию свободный от опасностей Marquee Tool. Правда в том, что Fireworks имеет много преимуществ для разработки интерактивного дизайна, и это превосходно поддерживает наш рабочий процесс. В этой статье описывается, как Fireworks помогает нам в разработке интерактивных продуктов.
Если вам интересно то, как мы используем Fireworks в нашем рабочем процессе и разработке визуального дизайна, а также хотите получить представление о новом продукте, который мы разработали (упоминается далее в этой статье), то в первую очередь посмотрите это видео.
Студенты Массачуссетского Технологического Института представили свою разработку интерфейса навигации в будущем.
Известная под названием AIDA 2.0, представляет из себя концепт интерактивной системы навигации подсказывающей маршрут движения, учитывающий привычные дороги, необходимость заправки и прочие моменты вождения. AIDA 2.0 также включает отображение показателей приборов и 3х-мерное отображение карты прямо перед водителем, что добавляет наглядности.
Отдельные элементы концепта (например размер виртуального экрана) вызывают некоторые вопросы и тем не менее он интересен как развивающийся тренд.
PowerMockup — простой плагин для Microsoft PowerPoint для создания низко детализированных прототипов. Инструмент для широкого круга пользователей, т.к. создание в нём прототипов похоже на создание презентаций Power Point — вы перетаскиваете элементы интерфейса на слайд. Слайды можно линковать друг с другом, а значит в прототипе можно реализовать некоторую интерактивность.
В рамках внутренних образовательных семинаров в гости к компании e-Legion пришла Таня Мисютина — дизайнер интерфейсов и инфодизайнер, в данный момент руководитель группы проектирования интерфейсов в NetCracker Technolgy Corp.
В ходе лекции, лаконично названной «Об интерфейсе», Таня рассказала о принципах создания хорошего интерфейса: чем плохой интерфейс отличается от хорошего, какие существуют этапы проектирование интерфейса и о многом другом.
“Несколько лет назад я бы кинулся работать над таким проектом сломя голову, и с первого дня начал бы прорабатывать макеты в подробностях. Этот подход заставлял меня принимать несколько решений о разметке, цветах, типографике и других вещах одновременно, и обычно это заводило меня в тупик. Поэтому теперь я стараюсь разделить процесс на несколько этапов: разметка, проработка и детализация. В этой статье я постараюсь рассказать об этих этапах подробнее на примере работы над сайтом ExpressionEngine.com, а также продемонстрировать, что делать, если в процессе работы вы столкнулись с трудностями.”
“Самая большая в интернете” - звучит наверно громко, но это действительно так. Кропотливо, целый год, с различных зарубежных сайтов участниками нашего сообщества скачивались и собирались библиотеки и стенсилы для проектирования интерфейсов. В архиве вы найдёте стенсилы для проектирования веб-сайтов, приложений для iPad и iPhone для программ:
Axure
Visio
Photoshop
InDesign
PowerPoint
Keynote
Illustrator
OmniGraffle
Бумажные шаблоны
Несколько причин, по которым стоит приобрести эту коллекцию:
Все средства от продажи коллекции поступают кошачьему приюту “Суперкот“. Ваши интерфейсы помогут людям, а средства животным.
Чтобы найти и скачать подобное количество стенсилов и библиотек, Вам понадобится намного больше часа. Час Вашего времени, мы полагаем, стоит выше 30 рублей (1$)
Если по какой-то причине Вы захотите получить свои деньги обратно - мы сделаем это для Вас (через Webmoney)
Размер: 306,73 мб (zip файл) Стоимость: 30 рублей или 1$
С начала работы нашего ресурса мы постоянно публикуем для Вас ссылки на библиотеки и стенсилы для различных инструментов прототипирования. На наших винчестерах уже скопилась огромная коллекция, которой хотелось бы поделиться. В этой подборке мы собрали библиотеки и элементы для программы Axure. Есть мнение, что это самая большая коллекция в интернете. Мы предлагаем Вам получить её за символическую плату в 1$ или 30 рублей. Все вырученные средства мы направим для приюта котов в Минске. Вы экономите время, т.к. получаете коллекцию, которая собиралась около года. Ваши прототипы помогают людям, а затраченные средства помогают животным.
Размер: 10 мб (zip файл)
Стоимость: 30 рублей или 1$
На сайте института медиа, архитектуры и дизайна «Стрелка» (Москва) опубликовано видео с прошедшей там лекции профессора Потсдамского Университета Прикладных Наук Рето Веттаха об интерактивном дизайне интерфейсов и о том, как создать взаимосвязанный диалог между людьми и окружающими нас системами.
Рето Веттах рассказал о физических и тактильных интерфесах. О том, почему надо перестать игнорировать тело, об интерактивных проектах Потсдамского Университета и об open sourse платформе для прототипирования физических, жестовых интерфейсов.
Становится нормальной практикой, когда компания производитель мобильной ОС выпускает программное обеспечение или аппарат, чтобы показать (задать) уровень взаимодействия со своим устройством или операционной системой. Так сделали Google с телефоном Nexus One и похожим способом решили поступить в Microsoft, создав приложение для подсчёта очков в гольфе для Windows Phone 7.
На сайте DeepApple опубликована ссылка на PSD с элементами интерфейса iPhone 4:
“Не Xcode единым — макетировать интерфейс iPhone-программы можно не только средствами Apple, привычный Photoshop выглядит более чем достойной альтернативой. А если вы нацелились на iPhone 4 с его роскошным Retina Display, то здесь никак не обойтись без последней работы студии Teehan+Lax — втиснутые в гигантский PSD-файл размерами 4074 × 2986 точек все базовые элементы графического интерфейса iOS, перерисованные под экранные 640 × 960 пикселей iPhone 4.
Объем собственно файла получился не менее устрашающим — в разархивированном виде iPhone_4_GUI_PSD_Retina_Display.psd занимает на жестком диске 62,7 Mb. Распространяются эти шестьдесят два целых и семь десятых мегабайта совершенно бесплатно, но с предложением заплатить за титанические усилия дизайнеров Teehan+Lax сколько не жалко. На данный момент времени среднестатистический взнос «сколько не жалко» составляет 10 долларов и 55 центов.”
“Недавно (весной этого года) Твитер перепроектировал процесс регистрации, чтобы увеличить количество новых пользователей. И хотя в новой версии в регистрацию добавилась ещё одна страница, то есть дополнительный шаг, конверсия всё равно выросла на 29%. Почему это произошло? Благодаря постепенному вовлечению.
Постепенное вовлечение — это процесс перемещения пользователя по приложению или сайту, фактически “пробуя” его и видя все его преимущества. В обычном процессе регистрации пользователю показывают форму, которую необходимо заполнить. Здесь наоборот, регистрация или отложена на потом, или происходит в фоне, а первый опыт пользователя сфокусирован на том, чтобы показать, как использовать сервис и зачем он вообще нужен.
Правильное постепенное вовлечение рассказывает пользователю об основной сущности сервиса путём простых взаимодействий. Если вы при этом осчастливите человека — даже лучше. Уилл Райт, создатель Sims & Spore, верит, что игры должны позволять человеку выигрывать в течении первых 5 секунд. Это хорошая философия, чтобы добиться постепенного вовлечения. На самом деле вы можете позволить людям за одно-два простых взаимодействия сделать то, в чём смысл вашего сервиса. Это наилучший вариант.”
“Как бы мы не хотели, чтобы все проекты имели достаточное количество требований, пользовательских исследований и отдельных UX-фаз в проектировнии. Часто, в реальном мире, перед UX-специалистами поставлена задача сделать много работы, за короткий промежуток времени. Это приводит к тому, что мы должны изобрести что-то новое, что поможет нам сфокусироваться на проблеме и увеличить собственную эффективность при работе над ней, чтобы представить достойные результаты в те временные рамки, в которые мы поставлены.
Я хотел бы поделиться с вами примером одного своего проекта, над которым недавно работал. Это была инструментальная панель, которая давала возможность получать разнообразную информацию о земельных ресурсах и недвижимости по всему миру и управлять ею. Изначально ставя перед собой задачу тесного сотрудничества с клиентом, мы имели возможность получения быстрых результатов, которые нравились бы обеим сторонам.
Как в случае с большинством проектов, этих самых ресурсов было немного и время было ограниченно. Используя информацию из проведенных фокус-групп, проект был передан мне с некоторыми заметками, изображениями и логотипами, а также общими набросками интерфейса. Но, в то же время, детальные ожидания клиентов и потребности пользователей были все еще очень туманными.”
Юрий Ветров опубликовал обзоров свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов за май-июнь 2010.
Рекомендуем нашим читателям ознакомиться с этой публикацией.