В этом выпуске: видео о создании интерактивного поля в Axure 8, конспект лекций с курса Игоря Штанга, статьи о финансах «Щуки», простых приёмах улучшения дизайна, тестировании на этапе проектирования, уровнях дизайнера.
Интерактивное поле в Axure 8
Как в Axure 8 сделать интерактивное поле для ввода количества товаров в заказе — 5-минутное видео от Егора. Использование локальных переменных и работа с простыми функциями в текстовом поле.
Конспект лекций с курса Игоря Штанга
Никита Ларионов выложил конспект лекций с курса Игоря Штанга «Типографика и вёрстка», который недавно прошёл в Волгограде. Например:
Одинаковое содержание в одинаковых модулях выглядит скучно. Чтобы интересно расположить его в рамках готового пространства есть 7 приёмов.
- Заполнить модули не до конца. Оставьте некоторые модули пустыми, обтравите фотографии;
- Оформить элементы по-разному. Разделите их цветом или шрифтом. Представьте себе однообразную структуру, в которой расставлены акценты;
- Заполнить элементами разных классов или разного качества. Вставьте в каталог товаров ссылку на статью или цитату из отзыва;
- Предусмотреть область, которая будет выглядет по-другому. Сетка одна, но модули объединяются по-разному;
- Выйти за пределы модуля. У вас есть чёткие куски, но некоторые изображения вылетают за пределы своих модулей. Если у вас прослеживается деление на модули, то можно подумать, как заводить элементы один на другой. Если у вас «каша из элементов», то лучше в это не лезьте;
- Добавить новый слой. Подчеркните особенную динамику и направление. Например, текст стоит с чётким ритмом, а картинки летают как хотят;
- Соблюсти баланс порядка и хаоса. Структура должна остаться читаемой. В хорошем макете сначала думают о структуре, а потом о разнообразии.
Финансы «Щуки»
Иван Величко рассказал о финансах дизайн-бюро «Щука».
Формат оплаты:
- Почасовая оплата только с Pure. Такая модель не интересна, так как размер прибыли зафиксирован и может только уменьшиться, если сотрудник напортачил;
- Остальным клиентам предлагаются фиксированные бюджет и время;
- Сколько часов дизайнеры потратят на проект, прикидывает арт-директор.
Как считают часы:
- Для западных заказчиков час работы стоит 60 евро, для российских — 3000 рублей;
- Повышение стоимости не привело к уменьшению количества заказов;
- Сотрудники работают максимум 6 часов в день;
- Они склонны занижать потраченное время, боясь показаться неэффективными.
Общие показатели:
- В штате 14 сотрудников;
- В 2017 году выручка составила 25 млн рублей;
- За счёт повышения стоимости и более точной оценки проектов во 2-м полугодии удалось получить 2 млн прибыли;
- Плановая норма прибыли — 20%. Хотят поднять до 30% за счёт снижения транзакционных издержек и более чёткой постановки задач;
- На счетах есть финансовая подушка около 4 млн рублей (в районе двухмесячного оборота).
Стоимость проектов:
- Средний бюджет — 700 тысяч рублей;
- Перестали брать проекты меньше 500 тысяч. Разматывать маховик пресейла и концептуального проектирования ради меньшего нецелесообразно;
- Если дизайнеру нечем заняться, лучше обновлять портфолио, а не делать дешёвый проект.
Простые приёмы улучшения дизайна
Адам Ватан и Стив Шёгер предложили 7 простых приёмов, с помощью которых можно улучшить дизайн:
- Использовать для создания иерархии цвет и толщину, а не размер текста;
- Отказаться от серого текста на цветном фоне. Лучше полупрозрачный белый или отдельный гармонирующий с фоном цвет (особенно, когда используются фоновые изображения);
- Добавить вертикальное смещение теней и уменьшить их размытие и растягивание;
- Уменьшить количество рамок и разделительных линий. Вместо них можно добавить блоку тень, раскрасить фон, добавить отступы;
- Использовать векторные иконки в том размере, для которого они рисовались. Не увеличивать их слишком сильно;
- Добавлять акценты с помощью цветной границы блока;
- Не забывать про иерархию, раскрашивая кнопки в семантически подходящие цвета.
(Самая популярная ссылка в этой подборке, если судить по количеству лайков в ВК.)
Тестирование на этапе проектирования
Дмитрий Мелентьев написал о тестировании на этапе проектирования:
- Бумажных прототипов;
- Интерактивных прототипов в мелкой детализации;
- Интерактивных макетов;
- Альфа-версий продуктов;
- Похожих продуктов.
Про интерактивные макеты:
Дизайнер делает красивый интерфейс, в котором вы размечаете области, при взаимодействии с которыми должно что-то происходить. Обычно это просто «on click» или «on move».
Вся эта красота делается интерактивной и тестируется на пользователях:
- Насколько конкретный элемент, который ранее был большой кнопкой, а сейчас стал красивеньким тонким баром, понятен пользователю;
- Акценты и видимость всех важных элементов дизайна.
Есть небольшой нюанс: надо постоянно напоминать, что это прототип. Потому что такой прототип уж слишком похож на реальность.
Уровни дизайнера
Илья Сидоренко написал хорошую по сути статью: успешный дизайнер решает проблемы бизнеса (базовый уровень), а также открыт, умеет презентовать и продвигать свои решения, считывать эмоции других людей (продвинутый уровень).
Но в остальном — какой-то компот с кусочками противоречивых фактов из жизни автора:
- «В моей карьере было не более трех заказчиков и на фрилансе я проработал меньше года»;
- «Я создал резюме в 17 лет, портфолио в 18. Первые 1−2 года в нем были только фейковые работы, но даже они приводили клиентов».
Фейковые работы привели не более 3 клиентов? Менее года или всё-таки первые 1−2 года? Ничего не понимаю.
(Заметка из моего личного телеграм-канала «Френч-пресс».)