Usability.by Инструменты | Usability.by
Улучшаем взаимодействие пользователей с вашим сервисом Повышаем конверсию
в продажи, заявки или
звонки
Проектируем
новые
продукты
Компания 1Point осуществляет весь спектр услуг в области юзабилити, дизайна, user experience
и веб-аналитики

Категория ‘Инструменты’

Как прошла конференция UXPeople 2015

5 июня в Москве прошла ежегодная конференция UXpeople 2015, посвящённая дизайну, проектированию пользовательских интерфейсов, user experience и юзабилити. На ней собрались руководители, практики и мастера своего дела, чтобы поделиться своими знаниями о пользовательских интерфейсах, результатами своей работы, и узнать что-нибудь новое.

UXPeople 2015

В этом году конференция из Минска перебралась в Москву, в event-холл «Инфоространство», и собрала вместе более 300 дизайнеров, проектировщиков интерфейсов, специалистов по юзабилити, менеджеров продуктов, маркетологов и программистов со стран СНГ и зарубежья, чтобы обсудить новые веяния в индустрии UX.

Читать полностью »

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

5 июня в Москве пройдет UXPeople — конференция по проектированию и дизайну интерфейсов

UXPeople - конференция по проектированию и дизайну интерфейсов в Минске 5 июня в Москве («Инфопространство», Зачатьевский пер., д.4) пройдет конференция UXPeople, посвященная вопросам проектирования пользовательских интерфейсов, user experience, дизайну и юзабилити. В качестве докладчиков приглашены опытные специалисты и руководители из России. Среди докладчиков: Юрий Ветров (mail.ru), Максим Ильяхов (Дизайн-бюро Артема Горбунова), Михаил Жашков (Прототип), Алексей Скобелев (Markswebb Rank & Report), Михаил Жарчев (Coub), Павел Манахов (USABILITYLAB) и другие.

Докладчики расскажут про свои кейсы, продуктовую аналитику, процессы взаимодействия специалистов по UX внутри компании, инструменты, автоматизацию и стандартизацию работы, фреймворки, исследования и их результаты, инсайты и т.д. Отрасли: электронная коммерция, веб-сервисы, финтех, интернет-банкинг и ДБО, мобильные приложения, медиа, государственные сайты и т.д.

Среди кейсов: новый сайт Президента России kremlin.ru, российские онлайн-банки, кассы самообслуживания, сервис Tilda.cc, Coub, процессы в Билайн, Look at me, М.Видео и т.д.

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

Слушателями конференции станут около 300 человек из стран СНГ и ближнего зарубежья. Конференция будет интересна: дизайнерам, проектировщикам интерфейсов, специалистам по юзабилити, менеджерам продуктов, маркетологам, программистам и студентам.

Ждем вас на конференции.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

24 августа в Минске главный редактор Smashing Magazine Виталий Фридман проведет полноценный 10-часовой мастер-класс “Responsive Web Design”

Главный редактор Smashing Magazine, европейский эксперт в области веб-дизайна, наш друг и харизматичный докладчик Виталий Фридман едет в Минск!

24 августа (воскресенье) Виталий проведет полноценный 10-часовой мастер-класс “Responsive Web Design”.

C прошлого посещения Беларуси (выступал докладчиком на конференции FDConf) он переработал свои доклады и слайды, структурировал самую актуальную информацию по responsive design и будет рад представить её Вам.

**Для тех, кто был на его воркшопе в Апреле: Появилась возможность на целый день окунуться в мир Responsive Web Design + Виталий добавил порядка 30% нового материала.

На мастер-классе Вы узнаете о:

  • Новых паттернах и инновационных подходах к проектированию адаптивных модулей;
  • Способах дебага и поддержки сайтов с адаптивным дизайном;
  • Оптимизации адаптивных сайтов для лучшей mobile UX и offline UX;
  • Проектировании интерфейсов и разработке фронтенд стратегий для проектов с адаптивным дизайном;
  • Управлении дизайн-процессами, результатами и стратегиями проекта.
  • Виталий покажет десятки примеров «правильных» и «неправильных» дизайнов, рассмотрит с Вами реальные кейсы, обсудит интересные практичные решения.

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

Узнать подробности, зарегистрироваться на мастер-класс и купить билет можно на сайте.

Также подписывайтесь на мероприятие в Facebook, чтобы оперативно получать все новости о мастер-классе.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Проектирование интерактивных продуктов в Fireworks

Проектирование интерактивных продуктов в Fireworks

Эта статья была опубликована еще в 2008 году на официальном сайте Adobe. В ней Nick Myers (ведущий визуальный дизайнер компании Cooper) рассказывает о преимуществах Fireworks в проектировании интерактивных продуктов. Сегодня перевод статьи опубликован на Хабрахабре:

Мне часто задают вопрос: «Какие инструменты вы используете при проектировании ваших продуктов?». Мой ответ «Fireworks» часто встречали с недоумением. Я провожу много времени чтобы объяснить наше предпочтение и это помогает, но я чувствую себя несколько защищающимся, так как Adobe Fireworks не является стандартным инструментом в нашей отрасли.

Когда я впервые пришел в консалтинговую компанию Cooper, я понял, что мне придется расстаться с всемогущим Adobe Photoshop (моим союзником с тех времен, когда слоёв в нем еще не было), и я немного беспокоился и был настроен скептически, но спустя несколько недель я изменил свой подход к проектированию свободный от опасностей Marquee Tool. Правда в том, что Fireworks имеет много преимуществ для разработки интерактивного дизайна, и это превосходно поддерживает наш рабочий процесс. В этой статье описывается, как Fireworks помогает нам в разработке интерактивных продуктов.

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

Читать полностью

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Прототипирование в Power Point

Прототипирование в Power Point

PowerMockup — простой плагин для Microsoft PowerPoint для создания низко детализированных прототипов. Инструмент для широкого круга пользователей, т.к. создание в нём прототипов похоже на создание презентаций Power Point — вы перетаскиваете элементы интерфейса на слайд. Слайды можно линковать друг с другом, а значит в прототипе можно реализовать некоторую интерактивность.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Самая большая в интернете коллекция стенсилов и библиотек для проектирования интерфейсов

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

  • Axure
  • Visio
  • Photoshop
  • InDesign
  • PowerPoint
  • Keynote
  • Illustrator
  • OmniGraffle
  • Бумажные шаблоны

Несколько причин, по которым стоит приобрести эту коллекцию:

  1. Все средства от продажи коллекции поступают кошачьему приюту «Суперкот«. Ваши интерфейсы помогут людям, а средства животным.
  2. Чтобы найти и скачать подобное количество стенсилов и библиотек, Вам понадобится намного больше часа. Час Вашего времени, мы полагаем, стоит выше 30 рублей (1$)
  3. Если по какой-то причине Вы захотите получить свои деньги обратно — мы сделаем это для Вас (через Webmoney)

Размер: 306,73 мб (zip файл)
Стоимость: 30 рублей или 1$







Подробнее о приюте «Суперкот»

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Самая большая коллекция стенсилов и библиотек для Axure

Коллекция стенсилов и библиотек для Axure

С начала работы нашего ресурса мы постоянно публикуем для Вас ссылки на библиотеки и стенсилы для различных инструментов прототипирования. На наших винчестерах уже скопилась огромная коллекция, которой хотелось бы поделиться. В этой подборке мы собрали библиотеки и элементы для программы Axure. Есть мнение, что это самая большая коллекция в интернете. Мы предлагаем Вам получить её за символическую плату в 1$ или 30 рублей. Все вырученные средства мы направим для приюта котов в Минске. Вы экономите время, т.к. получаете коллекцию, которая собиралась около года. Ваши прототипы помогают людям, а затраченные средства помогают животным.

Размер: 10 мб (zip файл)
Стоимость: 30 рублей или 1$







Подробнее

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Весь интерфейс iPhone 4 в одном PSD-файле

Весь интерфейс iPhone 4 в одном PSD-файле

На сайте 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 центов.»

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Программа для проектирования сайтов и интерфейсов на iPad

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

Из других «вкусностей»:

  • выравнивае по гайдлайнам
  • управление цветами обводки/заливки/текста
  • управление размером шрифта
  • экспорт в Фотоальбом, ПНГ и формат Бальзамик Мокапс популярный в кругах разработчиков
  • опции заморозки и клонировая шаблона
  • возможность создать ссылку из одного документа на другой

Прочитаnь описание программы и задать вопросы автору вы можете в топике на Хабрахабре

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Прототипирование в Google Drawings

Прототипирование в Google Drawings

Мы периодически публикуем информацию об инструментах прототипирования и сегодняшняя заметка тоже об этом.

Мортен Джаст изучал Google Drawings, новое дополнение к Google Docs, и решил попробовать его как инструмент для прототипирования. По ощущениям дизайнера, создавать wireframes в Google Drawings у него местами получилось лучше чем в Omnigraffle или Fireworks.

В статье A wireframe kit for Google Drawings and 5 reasons it beats Omnigraffle and Visio он называет 5 причин, почему Google Drawings лучше Visio или Omnigraffle:

  1. Совместное творчество. Команда может работать над одним документом и видеть изменения друг друга.
  2. Wireframes физически находится в облаке. У вас нет необходимости пересылать друг другу версии файлов, которые мгновенно устаревают.
  3. Риск потерять данные равен нулю. Сохранение версии происходит после каждой операции.
  4. Это бесплатно.
  5. У большого количества людей уже есть аккаунт Google, поэтому им не требуется регистрация.

Кроме скриншотов и своих впечатлений Мортен опубликовал набор стенсилов для Google Drawings.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Элементы интерфейса для проектирования под iPad

Элементы проектирования для iPad

В первые дни продаж iPad в США Apple продала более 300 тысяч устройств и это количество будет только расти. Как мы уже писали, iPad может изменить всю компьютерную индустрию. Предлагаем вашему вниманию подборку стенсилов для проектирования интерфейсов для iPad.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

20 рекомендаций для прототипирования в Axure RP Pro

20 рекомендаций для прототипирования в Axure RP Pro

На сайте Usabilist.com.ua опубликованы рекомендации по созданию прототипа в Axure RP Pro:

1. Скачать программу Axure RP Pro. На сайте можно скачать 30- дневную триал версию. Программа создана специально для прототипирования, это хороший инструмент для профессионалов.

2. Перед прототипированием желательно знать что вы прототипируете. Получить задание от начальства, собрать требования, провести исследования решений. Должен быть конкретный документ (Сжатый бриф ), в котором должна коротко (это не ТЗ) описываться функциональность, требования будущего сайта.

3. Если проект большой, то нужно убедиться что на диске есть достаточно места. В условиях офиса и злых IT-шников, у которых нужно выбивать дополнительное место на корпоративном сервере это может быть проблемой. Поэтому лучше подумать об этом заранее.

4. Скачайте с сайта готовые нужные библиотеки. Эти библиотеки существенно помогут при проектировании.

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

Прочитать остальные рекомендации

Ещё одной новостью стало выход этой программы под Mac. Trial-версию вы можете скачать прямо на сайте Axure.com

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

WebVisor — система исследования и анализа поведения посетителей сайта

Мы уже публиковали ссылку на разбор кейса по увеличению продаж c использованием инструмента WebVisor. 15 февраля в программе «Бизнес.net» вышел сюжет об этом сервисе:

Система исследования и анализа поведения посетителей сайта WebVisor обладает большим количеством возможностей:

  • Проводить исследование поведения посетителей
  • Определять ошибки взаимодействии с сайтом
  • Выделить на сайте зоны внимания — определить «горячие» и «холодные» зоны
  • Построить и исследовать модели поведения посетителей
  • Проверить ваши гипотезы

Попробуйте WebVisor для своего сайта

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Balsamic Mockups

Balsamic Mockups

Влад Головач в блоге компании Usethics опубликовал рецензию на Balsamic Mockups:
«В комментариях к моим стенаниям про средства прототипирования один из читателей признался, что пользуется Balsamic Mockups. Примерно год назад я рассматривал этот вариант и он мне не показался; но время идет, так что дай, думаю, попробую снова, более внимательно. Специально для таких случаев Balsamiq раздает бесплатную лицензию в обмен на публичную рецензию, так что вот, пишу.

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

Прочитать всю рецензию

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Создание прототипа в Serena Prototype Composer

Создание прототипа в Serena Prototype Composer

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

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

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

Возможна более сложная динамика по сравнению с Axure Pro, но в ней соответственно сложнее разобраться.

До 2008 года продукт был платным, в 2008 году компания Serena сделала подарок разработчикам.

Читайте описание работы в Serena Prototype Composer в блоге mobilelive.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Ещё один UI Design Wireframe Kit для Photoshop

Ещё один UI Design Wireframe Kit

Когда перед вами не стоит задача создать интерактивный прототип, то вы можете открыть Photoshop, которому на днях исполнилось 20 лет и нарисовать wireframe там. Именно для этого создан UI Design Wireframe Kit, все объекты которого полностью масштабируемые, а некоторые выполнены как SmartObjects.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Шаблоны для рисования прототипов

Шаблоны для рисования прототипов
Прежде чем создавать прототип, используя один из инструментов для прототипирования, удобно продумать и набросать его от руки на бумаге. Приступать к рисованию с чистого листа психологически труднее. Рисовать на специальном шаблоне гораздо продуктивнее, чем на обычном листе бумаги. В подборке «A Collection of Printable Sketch Templates and Sketch Books for Wireframing» Ивана Юрчич, автор подборки I ♥ wireframes, собрала около 20 шаблонов для рисования прототипов на бумаге.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

21 инструмент для создания прототипов и wireframes для iPhone

21 инструмент для создания прототипов и wireframes для iPhone

Мы уже не раз писали об инструментах и способах прототипирования для iPhone. Даже сделали собственную подборку стенсилов для для Axure RP, Fireworks, Illustrator, OmniGraffle, Powerpoint и Keynote.

Сегодня мы публикуем ссылку на статью «21 Prototyping, Mockup, and Wireframing Tools for iPhone App Development» на случай, если какой-то инструмент мы всё же упустили.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Cтенсилы для проектирования UI под iPhone от сообщества Usability.by

Стенсилы интерфейсных элементов под iPhone для многих инструментов проектирования

Мы уже много раз писали о различных инструментах проектирования и о проектировании для iPhone. По случаю проведения в Минске открытой конференции WUD (Всемирного дня юзабилити) участники сообщества Usability.by собрали для вас в одном наборе стенсилы для проектирования интерфейсов под iPhone для Axure RP, Fireworks, Illustrator, OmniGraffle, Powerpoint, Keynote, шаблоны для бумажного прототипирования и html/css+jquery для динамических прототипов. Скачать стенсилы можно на сайте конференции

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua

Рисуем User Experience

Рисуем User Experience

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

В статье «Tools for Sketching User Experiences» Джейсон Робб делится своим богатым опытом работы с бумагой и маркерами, которые он использует каждый день при разработке интерфейсов. Кстати автором упомянутой в статье книги является Билл Бакстон, о котором мы уже писали сегодня и который выступит с докладом на конференции User Experience 2009 в Москве.

Twitter Facebook Google Buzz Вконтакте МойМир Google Bookmarks delicious Memori.ru БобрДобр.ru Mister Wong Technorati МоёМесто.ru I.ua