Всем известно, что для успешной разработки веб-сайта/веб-сервиса/программы (нужное подчеркнуть) очень важен этап проектирования. Грамотный план разработки — это половина всего проекта. Понятно, что прежде всего необходимо техническое задание, в котором будут описаны требования, сроки, и т.п. Но еще большее значение имеет визуальное проектирование, а именно: UML-схемы, схемы БД, пользовательские интерфейсы, эскизы страниц…

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

Не знал, как опубликовывать подобный пост. Вроде бы это и перевод, а вроде бы и переводом назвать можно с натяжкой. В общем, в фэйсбуковском акшуровском сообществе лежит полезный топик со списком горячих клавиш. Я убрал из списка те горячие клавиши, о которых все уже и так знают, а также добавил перевод к тем, которые остались. В своё время знание этого материала увеличило мою производительность при работе в Axure минимум на 20%. Удачи в работе.

Для написания ТЗ я задался вопросом поиска простого и удобного средства создания прототипов веб-страниц. Хотелось чего-то бесплатного и в онлайне, некой альтернативы Axure. Такой сервис удалось найти, его я и предлагаю вашему вниманию. Итак, встречайте www.gomockingbird.com – сервис, позволяющий создавать очень красивые прототипы легко и удобно.
Помимо представления самого сервиса, этим постом хотелось также привлечь внимание общественности к полезной практике прототипирования.

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

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

Средств для визуального проектирования становится все больше. Одни пользуются Adobe InDesign, другим нравится Visio, третьи довольствуются OpenOffice Draw. Но все больше поклонников появляется у довольно тяжелой и функциональной программы Axure RP Pro.

Мы с Андреем Сикорский посвятили 107 вебинар UX Russia обзору практик при работе с Axure.

Довольно давно на Хабре не было статей про такой удобный и эффективный инструмент для быстрого прототипирования как Axure RP.
Решил выложить свою подборку закладок по «Акшуре» в виде сводного списка ресурсов.

Сегодня я столкнулся с проблемой, решением которой хотел бы поделиться. Эта заметка будет полезна тем, кто старается делать свои прототипы Axure максимально интерактивными.

Итак, задача. Визуализировать на прототипе добавление какого-либо объекта со сдвигом других объектов. Для примера возьмем добавление вопроса в сервисе онлайн-консультации.



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

Не многие знают, что такой известный инструмент прототипирования как Axure обзавелся новой версией, Axure 7 beta. И бета эта открытая, каждый может скачать и попробовать все новинки программы.
Нововведений действительно много, начиная от внешнего оформления, и заканчивая наконец появившимися тенями для элементов!

Дорогие друзья,

Как и обещали, мы продолжаем рассказывать о процессе разработки Payler в этом блоге. Сегодняшний пост будет посвящен разработке дизайна для проекта.

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

Axure

• Действительно ли этот продукт не более чем инструмент прототипирования?
• Может ли UI designer полностью перейти на работу в Axure, отказавшись от других инструментов?
• Какие сильные и слабые стороны у этой программы?

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

Всем привет. Так случилось, что некоторое количество лет назад я отринул мирское и встал на тернистый путь проектировщика и дизайнера интерфейсов. Тогда было мало толковых материалов по теме, сейчас ситуация вроде бы исправилась, но, на мой взгляд, как то однобоко. На данный момент существует множество ресурсов, где подробно и доступно расскажут о том, как прототипировать сайты и мобильные приложения, как подобрать цвета и сделать красивую картинку. Но практически отсутствует информация по разработке интерфейсов для десктопных и сложных веб приложений, что подразумевает свою специфику в работе. Они конечно есть, но существует в них один пробел — они рассматривают общую теорию и редко дают практические советы. Попробуем исправить ситуацию.

Вот уже неделя с небольшим минула, как я решил ввязаться в дизайнерскую авантюру! Daily UI это опциональный челлендж для любого профессионального графического разработчика. Каждый день — новый дизайн. Чего угодно: кнопки, таблички, хедеры, карточки, да любой элемент вплоть до целого раздела. По итогам этого “марафона”: во-первых, прокачиваются навыки; во-вторых, прокачивается карма и последователи; в-третьих, да мало ли к каким интригующим последствиям это может привести. Обычно такой марафон длится 100 дней.

Однако, я немного адаптировал условия этого личного соревнования под себя. Количество дней не ограничиваю, в выходные отдыхаю, а результатом каждого дня будет не *.sketch / psd исходники, а HTML/CSS/JS файлы. И, да, вы всё это можете скачать и применять для своих нужд. Именно поэтому в выходные я и отдыхаю! Всё ясно? :)

Всем привет. Сегодня я расскажу еще немного о функционале репитеров и как на их основе прототипировать таблицы.

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

Солнце. Море. Песок. Наконец то первый отпуск за полтора года. Этой зимой я что-то сильно перегорел. Совершенно неожиданно. В поисках долгожданного развития придумал себе сложности: из обычных статичных макетов перешёл в интерактивное прототипирование. Так и проковырялся в этом Axure всю зиму и полвесны, а потом перегорел и закипел! «Есть же новый навык, новый рычаг, а приложить его некуда...». С такими мыслями я понимал — пора в отпуск. Чем скорее тем лучше. Иначе в моем кабинете потребуется новая мебель, новые мониторы и пучок новых манипуляторов «мышь»… Вместо разбитых, очевидно!

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



Интерфейсная анимация сейчас в тренде. Причин несколько: улучшение юзабилити и повышение привлекательности продукта в целом. И третья — развитие инструментов для анимирования на глобальном IT рынке. Сейчас так много разных утилит, чтобы оживить любой дизайн / прототип, что странно было бы пройти мимо такого движения, нужно приобретать навыки. Инструментов множество, перечислять все не буду. Но об одном конкретном упомяну…

Я работаю в Axure. Самый весомый плюс для меня оказался в нём благодаря возможности создавать интерфейсы практически сразу в браузере. Я вижу все элементы, шрифты, отступы сразу в “боевой готовности”, едва успев внести их в макет. Я знаю, что такими же увидят их разработчики. Я знаю, что в 99% ничего “не поломается” в дизайне.

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

Так было раньше и это работало. Я сам прибегал к таким хитростям неоднократно. Однако, мир вокруг стремительно меняется. Современный продукт настолько сложен, что одна картинка не даст понимания и ответов на вопрос “Как это работает?”. Схематичное или wireframe прототипирование тоже постепенно угасает в закате, так как черно-белые линии и прямоугольники не дают клиенту полного понимания. Всё больше желающих сегодня видеть живой прототип, а не серию картинок…

О чём пойдёт разговор?

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

Каков план действий?

Внешний вид компонентов не меняем, т.е. остаемся в рамках текущего UI. Но можно воздействовать на типографику: размер и плотность текста менять разрешается. Будем использовать Axure для создания максимально реальной картины. То есть в арсенале будут все доступные приемы интерактивного прототипирования: интерфейсная анимация, смена состояний, смена текста внутри меток, динамическое сокрытие/показ объектов и т.п. Каждый прием будет рассмотрен отдельно ниже. Разрешается немного манипулировать, чтобы призвать пользователя к нужным нам действиям, которые требуются бизнесу.

В процессе работы над ui дизайном мобильной версии сайта или мобильного приложения я пробовал разные способы презентации его клиентам. Пока остановил выбор на Invision, но там есть ряд моментов.



Во-первых, стоимость. Для профи это не проблема, но для многих начинающих дизайнеров минимальные $13 в месяц вполне себе приличная сумма.