Прототипирование.
Всем привет! Меня зовут Наталья и я — Product / UX / UI Designer в веб студии и на аутсорсе.
Сегодня я хотела бы поговорить на тему прототипирования в веб-дизайне.
Итак, все мы уже понимаем, что прототипировать нужно. Но как правильно это делать?
В нашей компании прототипами занимается маркетолог. Но, когда я беру заказы на аутсорсе, я создаю прототипы сама. Это всегда упрощает процесс согласования. Есть множество программ и сервисов для прототипирования. У каждого свой выбор. Я делаю прототипы в Фигме. Потому что так удобнее переходить на следующий этап — дизайн.
У меня есть несколько правил для моего идеального прототипа:
- Я стараюсь делать максимально просто и прозрачно.
Я не загромождаю прототип лишними деталями. Всегда смотрю от чего можно избавится, что можно упростить. Никогда не делаю сложных блоков, в которых располагается много различных по смыслу функций. Такие блоки необходимо разделять. Это приведет нас к функциональному и понятному дизайну. - Я не использую элементы дизайна.
Весь дизайн держим и продумываем пока в голове. Не нужно стараться произвести визуальное впечатление на клиента прототипом. Нет необходимости прорисовывать кнопки, иконки или подбирать шрифты на этом этапе. Это может отвлекать заказчика от сути и основной функции прототипа. Это не то что нам нужно обсудить сейчас. И мы можем упустить важные моменты и перейти на обсуждение дизайна. - Я не добавляю фотографии в прототип.
На этапе прототипирования мы не можем качественно подобрать фотографии, которые в дальнейшем будут хорошо вписываться в дизайн. Но если клиенту понравятся фотографии или рисунки в прототипе и он согласует их, то в дальнейшем мы можем столкнуться с проблемами. Например, данные фотографии не будут вписываться в общий стиль сайта. Или, наоборот, заказчик не будет впечатлен фотографиями (не та тематика, не нравится стиль, плохое качество фотографий …), впечатление испорчено, и прототип может быть не согласован. - Я не использую цвет.
Прототип — это далеко не окончательный дизайн сайта. И использование цвета так же может сработать против нас. Первое, видя цветные блоки и элементы, клиент будет акцентировать внимание на них, а не самой структуре. И вместо обсуждения функционала, мы можем начать обсуждать цветовые решения и колористику дальнейшего макета. Но, мы это делаем на других этапах. Второе, может получится и так, что клиенту не понравятся цветовые сочетания в прототипе. И он может не согласовать прототип. Хотя это же цветовое решение могло бы быть удачным уже в дизайне.
Мое мнение — никаких цветов на этапе прототипирования. Черный, белый, серый. Дизайн пока только у нас в голове. - Максимальная работа с текстом.
А вот с текстом я стараюсь поработать максимально. Продумать заголовки, текстовые блоки, максимальное количество строк в текстовых блоках. Но, так же не забываем, что в дальнейшем тексты могут меняться и мы должны это учитывать. Продумать, что будет, если текста будет больше или меньше. Сайт должен быть живым. Это позволит нам более грамотно выполнить дизайн. - Кликабельность прототипа.
В Фигме есть возможность сделать переходы на страницы сайта кликабельными. Вот это очень нравится заказчикам. И всегда производит нужное впечатление. Клиент начинает понимать, как все будет работать. Это улучшит наш ux, т.к. и мы можем увидеть какие-то недоработки и устранить их на этом этапе. - Четкая структура и функциональность
Что бы в дальнейшем сайт или приложение получились именно такими, нам необходимо вытянуть из клиента максимум информации, а это бывает не просто. Нам нужно знать, какие шаги будет совершать пользователь на сайте, и как мы можем это улучшить. Для улучшения ux у нас не всегда есть бюджет и время для долгосрочных исследований. И приходится пользоваться простыми способами. Чаще всего, я представляю себя на месте пользователя или разговариваю с возможными пользователями и стараюсь понять их логику.
Когда я согласовываю прототип, для меня очень важно проговаривать все ключевые моменты с заказчиком. Не достаточно просто скинуть макет прототипа на почту и ждать ответа. Необходимо, дать понять, что это просто скелет сайта. А дизайн будет вкусной начинкой.
После согласования прототипа мы начинаем обсуждать дизайн и наполнение сайта.
Всем удачи! Надеюсь мои мысли пригодятся и помогут вам)) 😘😘
