На сайте 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 центов.”
SketchyPad — это программа для быстрого проектирования веб-сайтов и интерфейсов приложений «на коленях». В текущей версии в распоряжении пользователя 56 шаблонов, из которых вы можете «собирать» сайты и интерфейсы. Большинство шаблонов динамические, т.е. изменяют свой внешний вид в зависимости от ввода пользователя.
Из других «вкусностей»:
выравнивае по гайдлайнам
управление цветами обводки/заливки/текста
управление размером шрифта
экспорт в Фотоальбом, ПНГ и формат Бальзамик Мокапс популярный в кругах разработчиков
опции заморозки и клонировая шаблона
возможность создать ссылку из одного документа на другой
Мортен Джаст изучал 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:
Совместное творчество. Команда может работать над одним документом и видеть изменения друг друга.
Wireframes физически находится в облаке. У вас нет необходимости пересылать друг другу версии файлов, которые мгновенно устаревают.
Риск потерять данные равен нулю. Сохранение версии происходит после каждой операции.
Это бесплатно.
У большого количества людей уже есть аккаунт Google, поэтому им не требуется регистрация.
Кроме скриншотов и своих впечатлений Мортен опубликовал набор стенсилов для Google Drawings.
1. Скачать программу Axure RP Pro. На сайте можно скачать 30- дневную триал версию. Программа создана специально для прототипирования, это хороший инструмент для профессионалов.
2. Перед прототипированием желательно знать что вы прототипируете. Получить задание от начальства, собрать требования, провести исследования решений. Должен быть конкретный документ (Сжатый бриф ), в котором должна коротко (это не ТЗ) описываться функциональность, требования будущего сайта.
3. Если проект большой, то нужно убедиться что на диске есть достаточно места. В условиях офиса и злых IT-шников, у которых нужно выбивать дополнительное место на корпоративном сервере это может быть проблемой. Поэтому лучше подумать об этом заранее.
4. Скачайте с сайта готовые нужные библиотеки. Эти библиотеки существенно помогут при проектировании.
5. Настройте программу под себя. Если вы любите чтоб все окна с инструментами были свернуты, сверните их. Если вы любите чтоб панель инструментов была не сверху, а снизу сделайте это… Лучше это сделать сразу, чем потом раздражаться по таким мелочам.
Мы уже публиковали ссылку на разбор кейса по увеличению продаж c использованием инструмента WebVisor. 15 февраля в программе “Бизнес.net” вышел сюжет об этом сервисе:
Система исследования и анализа поведения посетителей сайта WebVisor обладает большим количеством возможностей:
Проводить исследование поведения посетителей
Определять ошибки взаимодействии с сайтом
Выделить на сайте зоны внимания — определить “горячие” и “холодные” зоны
Построить и исследовать модели поведения посетителей
Влад Головач в блоге компании Usethics опубликовал рецензию на Balsamic Mockups:
“В комментариях к моим стенаниям про средства прототипирования один из читателей признался, что пользуется Balsamic Mockups. Примерно год назад я рассматривал этот вариант и он мне не показался; но время идет, так что дай, думаю, попробую снова, более внимательно. Специально для таких случаев Balsamiq раздает бесплатную лицензию в обмен на публичную рецензию, так что вот, пишу.
Начну с хорошего. Встроенные контроллеры для таблиц, вкладок и меню, серьезно экономящие время по сравнению с рисованием на бумаге. При изменении размеров объектов хорошо и наглядно показываются размеры в пикселях, что защищает от появления в прототипе либо слишком больших, либо слишком маленьких объектов (это серьезная проблема при рисовании на бумаге). Динамическая привязка объектов к координатам других объектов позволяет без всяких усилий делать ровно даже без сетки. Очень милая функция, при желании делающая любую (почти) вставленную растровую картинку монохромной. Контроллеры часто управляются тестом внутри (например, для полоски вкладок достаточно в полоске напечатать названия всех вкладок разделенными запятыми, а программа сама построит картинку этих вкладок; весьма удобно). Многие сравнительно простые элементы управления (вроде слайдера) рисуются очень быстро.”
Serena Prototype Composer предназначен не только для визуального прототипирования, но и ведения полноценной документации по проекту. Вы можете описать всех участников разработки и при необходимости легким нажатием кнопки извещать их по почте об изменениях, внесенных в прототип.
Командная работа подразумевает возможность редактирования и просмотра прототипа всеми участниками группы разработки, некий механизм контроля версий.
Работа с визуальной частью прототипа включает в себя возможность создания шаблонов, импорт существующих веб-страниц (и автоматическое преобразование их составных частей во внутренние объекты с возможностью дальнейшего редактирования), скриншоты страниц.
Возможна более сложная динамика по сравнению с Axure Pro, но в ней соответственно сложнее разобраться.
До 2008 года продукт был платным, в 2008 году компания Serena сделала подарок разработчикам.
Когда перед вами не стоит задача создать интерактивный прототип, то вы можете открыть Photoshop, которому на днях исполнилось 20 лет и нарисовать wireframe там. Именно для этого создан UI Design Wireframe Kit, все объекты которого полностью масштабируемые, а некоторые выполнены как SmartObjects.
Мы уже много раз писали о различных инструментах проектирования и о проектировании для iPhone. По случаю проведения в Минске открытой конференции WUD (Всемирного дня юзабилити) участники сообщества Usability.by собрали для вас в одном наборе стенсилы для проектирования интерфейсов под iPhone для Axure RP, Fireworks, Illustrator, OmniGraffle, Powerpoint, Keynote, шаблоны для бумажного прототипирования и html/css+jquery для динамических прототипов. Скачать стенсилы можно на сайте конференции
Наш мозг достаточно эффективный инструмент для решения задач. Возникает только одна проблема - это обмен и обсуждение идей. Идеи заперты в нашей голове и доступны только их автору. Рисование высвобождает идеи и позволяют другим увидеть и понять их. Визуальное представление позволяет совместно работать над обсуждением и улучшением ваших идей. Что бы я не пытался отобразить, иерархию в информационной архитектуре или документ с особенностями взаимодействия с веб-сайтом, рисование набросков зарекомендовало себя как наиболее подходящий и ценный инструмент для выражения моих идей.
В статье “Tools for Sketching User Experiences” Джейсон Робб делится своим богатым опытом работы с бумагой и маркерами, которые он использует каждый день при разработке интерфейсов. Кстати автором упомянутой в статье книги является Билл Бакстон, о котором мы уже писали сегодня и который выступит с докладом на конференции User Experience 2009 в Москве.
Не так давно появился отличный инструмент для A/B тестирования — Google Web Optimizer. Чтобы наилучшим образом представить результаты такого тестирования был создан сервис Abtests.com. Он позволяет представить результаты в виде кейса, где описано чем отличались варианты дизайна, каких показателей удалось достигнуть и какие инструменты были использованы.
По ощущениям Abtests.com пока находиться в стадии бета-версии, но посмотреть примеры результатов можно уже сейчас.
Способы организовать юзабилити-деятельность по дешёвке интересует не только отечественных специалистов. “Мы не будем проводить юзабилити-тестирование для этого проекта. У нас просто нет на это бюджета и времени”. Часто приходиться слышать такое? Нам особенно, ведь мы работаем в Ирландии - небольшой стране с такими же небольшими компаниями и бюджетами. Однако мы считаем анализ и исследования слишком важными, чтобы быстро сдаться. Часто мы вынуждены проводить тесты для наших клиентов быстро и недорого. Чтобы заинтересовать клиента нам необходимо четко показать, как тестирование помогает повысить прибыльность его бизнеса. Вот почему мы разработали методику и подобрали набор инструментов для быстрого и дешевого исследования UX.
В статье “Low-budget Prototyping Techniques” рассказывается о технологии, известной как быстрое прототипирование, и каким образом авторы смогли эффективно использовать его в проекте Vodafone Ireland.
Існуюць розныя школы па дызайну дастасаванняў пад iPhone. Хтосці аддае перавагу дызайну на паперы (я аддаю), хтосці будзе паслугавацца кампутарам, каб стварыць свой чарговы GUI, ад каторага будзе займаць дух.
Вось спіс некаторых прыладаў і шаблонаў для дызайну вашага наступнага аппліку.
У кніжцы Pragmatic Thinking and Learning: Refactor Your Wetware аўтар Andy Hunt раіць ужываць асадку і паперу, каб выкарыстоўваць правае паўшар\’е галаўнога мозгу і вызваліць свой творчы патэнцыял. Тым часам пры ўжыванні кампутару, вы будзеце сканцэнтраваныя на дэталях, а не на дасканалым user experience.
Яшчэ адна хіба пры ужыванні кампутару - гэта калі вы пакажаце свой дызайн кліенту, ён таксама сканцэнтруецца на дэталях:
- Калі ласка, ці можна змяніць цень гэтае чырвонае кнопкі, ён надта чырвоны?
Паказваючы дызайн намаляваны ўручную, вы дазволіце кліенту толькі ўявіць, як фінальны продукт можа выглядаць. Так што такая тут справа, што ўлева, што ўправа: вам лепей напэўна ведаць, на што чакае кліент, і ужываць адпаведную тэхніку.
Мы неоднократнописали о различных инструментах проектирования под iPhone. Сегодня мы представляем разработку Mockapp.com, которая доступна для скачивания и позволяет проектировать интерфейсы iPhone в PowerPoint (для Windows) и Keynote (для Mac).
Основатель и генеральный директор Balsamiq Mockups Джакомо “Пелди” Гуилиццони открывает обзор решений для прототипирования. Пелди, проницательный предприниматель с уникальным бизнес-видением, рассказывает о том, что стоит за успехом Balsamiq: команда всего из 3 человек, антикварный кассовый автомат и уникальный маркетинговый подход.
В разделе “Инструменты” на Usability.by постоянно публикуются заметки об инструментах прототипирования. Сегодня мы представляем Вам Coutline — систему проектирования веб-интерфейсов онлайн. Мы решили, что никто не сможет представить инструмент лучше, чем его разработчики и поэтому публикуем описание Михаила Босина, который занимается интерфейсами и логистикой этого приложения. Читать полностью »
В блоге компании Adaptive Path опубликована сводная таблица современных десктопных и онлайновых средств проектирования интерфейсов, которая содержит описание инструмента, платформу, стоимость и т.д.
