Лев Орлов – Стартап для создания портфолио для дизайнеров (страница 3)

Для нашей платформы нам нужно и то, и другое. Представь дизайнера Петю. Он хочет быстро показать заказчику свой новый проект. Если интерфейс платформы красивый, современный и минималистичный, Петя сразу проникнется доверием. А если он при этом загружает работу в три клика, а не в десять, он будет счастлив и расскажет о платформе друзьям.

Погружаемся в шкуру пользователя

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

Давай представим Лену, графического дизайнера. Она заходит на сайт. Что она видит в первую секунду? Понятно ли ей, куда нажимать, чтобы зарегистрироваться? А когда она зарегистрируется, что будет дальше? Пустая страница или приветственное сообщение с подсказкой «Загрузите свою первую работу»? Хороший UX подталкивает пользователя, ведет его за руку, но при этом не выглядит навязчивым.

Подумай о своем опыте использования разных приложений. Наверняка были случаи, когда ты заходил в новый сервис и сразу все понимал: «Ага, вот тут мой профиль, тут настройки, а здесь можно создать новый проект». А были случаи, когда ты чувствовал себя полным дураком, тыкая пальцем в экран? Вспомни это чувство раздражения. Наша задача – не вызывать его у наших пользователей. Чем меньше когнитивной нагрузки мы на них возложим, тем лучше. Интерфейс должен быть настолько простым, чтобы дизайнер мог думать только о своих проектах, а не о том, как работать с платформой.

Анатомия идеального рабочего места

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

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

В-третьих, навигация. Где тут поиск по проектам? Как отфильтровать работы по категориям? Все эти элементы должны быть под рукой, но не бросаться в глаза, когда они не нужны. Взять за основу можно принцип «чистого стола»: на виду только самое важное, а все инструменты спрятаны в ящики (выпадающие меню, боковые панели), которые открываются по необходимости. Это создает ощущение простора и порядка.

И наконец, не забывай про микроанимацию. Это те самые маленькие радости, которые делают взаимодействие живым. Кнопка слегка меняет цвет при наведении, картинка красиво выезжает при открытии, лайк приятно «пружинит» при нажатии. Это не просто украшательство, это обратная связь. Система говорит пользователю: «Я тебя слышу, я работаю». Это создает ощущение надежности и качества.

Когда красота мешает, или главные ошибки

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

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

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

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

Функционал для портфолио: загрузка, категории и интерактивность

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

Больше, чем просто альбом с фотографиями

Первое, что приходит в голову, когда мы слышим слово портфолио – это просто набор картинок. Ну, как в старом добром фотоальбоме: открываешь и листаешь. Но наша платформа – это не музей, куда приходят посмотреть и уйти. Это место для заключения сделок. И если мы хотим, чтобы заказчик не просто смотрел, а брал и нанимал дизайнера, нам нужно превратить статичные картинки в инструмент продаж.

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

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

Так вот, наша задача – дать Диме, и тысячам других дизайнеров, инструменты для рассказывания таких историй. Функционал портфолио должен быть гибким. Конечно, основа – это загрузка изображений в высоком качестве. Но не просто кучей, а с возможностью сортировки, группировки, создания обложек. Загрузка должна быть удобной и быстрой. Никто не хочет жать на кнопку и ждать полчаса, пока загрузится один файл. Тут важно продумать систему автоматической оптимизации изображений, чтобы они грузились быстро, но при этом выглядели отлично.

Категории: порядок в творческом хаосе

Следующий важный момент – это категории. Ты когда-нибудь заходил в магазин, где все вещи свалены в одну кучу? Найти что-то нужное там невозможно. То же самое и с портфолио. Если дизайнер разноплановый: он рисует и логотипы, и сайты, и упаковку, и иллюстрации, сваливать все в одну кучу – значит запутать заказчика.

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

Конец ознакомительного фрагмента.

Текст предоставлен ООО «Литрес».

Прочитайте эту книгу целиком, купив полную легальную версию на Литрес.

Безопасно оплатить книгу можно банковской картой Visa, MasterCard, Maestro, со счета мобильного телефона, с платежного терминала, в салоне МТС или Связной, через PayPal, WebMoney, Яндекс.Деньги, QIWI Кошелек, бонусными картами или другим удобным Вам способом.