Шутки в сторону!
Создание портфолио — сложная (и пугающая) задача. Нужно учесть и реализовать так много деталей, что может показаться, словно вы никогда не сумеете закончить его или сделать все достаточно хорошо. Эта статья была написана с единственной целью — помочь вам создать сайт-портфолио, которым вы могли бы гордиться. Давайте приступим:
Совет 1: Не пытайтесь казаться лучше, чем вы есть на самом деле
Людям нравится аутентичность — и в то же время они очень хорошо распознают ложь. Как только пользователь улавливает ее, это разрушает доверие к кому-то/чему-то.
Когда я создавала свое портфолио, я изучила множество примеров, наполненных UX-жаргоном. Это убивало атмосферу.
Наша цель, как дизайнеров, — делать человеческий опыт лучше, но для этого нужно быть человеком.
Ваше портфолио — отражение того, кто вы есть как дизайнер, коммуникатор и личность. Будьте откровенны и поделитесь частью того, что делает вас уникальным, будь то ваш путь, навыки или индивидуальность.
Покажите будущему работодателю или клиенту, кто вы. Это поможет вам не только выделиться, но и открыть для себя новые возможности.
Совет 2: Уделите особое внимание визуалу
Пользователи просматривают страницы, а не читают их. В первую очередь они обращают внимание на визуал (изображения, видео и т.д.). Поэтому используйте высококачественные изображения, которые сочетаются с вашей цветовой палитрой, и чередуйте их с фрагментами текста таким образом, чтобы контент было легко и удобно воспринимать.
Если вам нужно показать прототипы и вайрфреймы, размещайте их в изометрических мокапах. Позаботьтесь о том, чтобы каждый из них получился визуально привлекательным.
Я бы даже посоветовала приобрести набор мокапов. Существует много бесплатных опций, но если вы можете позволить себе премиум-ресурсы, это позволит вам выделиться из толпы.
Визуальные материалы в моем портфолио
Продуманный визуал демонстрирует ваши профессиональные навыки, а также показывает, насколько вы внимательны к деталям.
Совет: Чтобы изображения высокого качества загружались без задержек, уменьшайте их размер с помощью бесплатного приложения ImageOptim.
Совет 3. Рассказывайте истории
Люди любят истории. Они лучше запоминаются и вызывают положительные эмоции — опыт взаимодействия становится лучше, если добавить в него историю.
Причина в том, что пользователи любят развлечения, а истории делают все увлекательнее. Им не хочется читать научные статьи, наполненные UX-терминологией. Они хотят видеть индивидуальность и глубину.
Чтобы реализовать эту стратегию в своем портфолио, я попыталась добавить в каждый кейс сюжет. Все они начинаются с описания проблемы. Далее действие нарастает в разделах, посвященных исследованиям, генерации идей, разработке дизайна. Кульминацией является раздел с описанием решения и конечного продукта. И, наконец, в заключительной части я оглядываюсь на пройденный путь — это и есть развязка.
Найдите свой подход, но не забывайте, что мы, дизайнеры, по своей природе являемся рассказчиками.
Совет 4. Заявите о себе с помощью CTA
Как и в случае с любым другим продуктом, у вас есть всего несколько секунд, чтобы произвести впечатление. Призыв к действию (CTA) в вашем портфолио должен заинтересовать пользователя и побудить его прокрутить страницу дальше.
Есть множество способов сделать это, но ключевым фактором является визуальная составляющая. Вы можете использовать текст, анимацию и другие детали, чтобы эффектно презентовать свой сайт.
Призыв к действию в моем портфолио
Я решила добавить в портфолио свое фото, чтобы представиться и помочь посетителям сориентироваться. Это сразу же придало сайту индивидуальность. Кроме того, я использовала анимацию, чтобы выделить определенные элементы и привлечь внимание к ключевым аспектам.
Я изучила множество портфолио и была в ужасе, когда повсюду читала стандартную фразу "Я создаю опыт для людей". Будьте уникальны. Почему вам нравится дизайн? Каков ваш путь? Не нужно просто вставлять везде модные словечки. Это никого не заинтересует.
Совет 5: Добавьте анимацию
Повторю это еще раз: люди не читают. Они просматривают. Дайте им то, что они хотят. Интересный визуал и анимация — отличный способ выделиться среди конкурентов. Даже самые простые анимационные эффекты могут сделать опыт взаимодействия пользователей с интерфейсом уникальным.
Пример анимации в моем портфолио
Но, как и в любом другом деле, все хорошо в меру. Играйте с различными эффектами, меняйте настройки, чтобы создать что-то интересное, но не переборщить.
Вы можете провести пользовательское тестирование, чтобы получить полезную обратную связь и найти оптимальный вариант. Иногда дизайнеру трудно объективно оценить эти мелкие детали, поэтому важно опираться на отзывы людей.
Совет 6: Выбирайте уникальные кейсы
Каждый дизайнер хочет иметь продуманный сайт-портфолио с красивым визуалом и своевременной анимацией, но важно уделить особое внимание его центральному элементу: кейсам.
Основное предназначение портфолио — продемонстрировать, как вы мыслите и рассуждаете, в частности, в процессе работы над дизайном. Для этого и нужны кейсы. Обычно на сайте размещается 3-4 кейса, но в любом случае вы сами решаете, сколько примеров хотите показать.
Постарайтесь найти реальные проекты, даже если вы выполняли работу на безвозмездной основе. Наличие реальных результатов даст вам огромное преимущество при поиске работы.
После того, как вы подготовили свои кейсы, ваша задача — сделать их интересными. Постарайтесь вызвать у людей эмоции и рассказать о каждом проекте захватывающую историю. Используйте визуальные эффекты, анимацию и сторителлинг, чтобы оживить тот или иной кейс.
Совет 7. Добавьте свои профессиональные фото
Страница "Обо мне" в моем портфолио
Ваши фотографии помогут вдохнуть в портфолио жизнь. Я с самого начала знала, что хочу разместить хотя бы одно свое изображение на странице "О себе", но у меня не было профессиональных фото, которые соответствовали бы цветовой гамме сайта.
Поэтому я пригласила подругу и превратила свою гостиную в фотостудию. Я выбрала подходящий наряд, после чего мы сделали несколько фотографий. Это было не так сложно. Снимки позволили мне показать себя и сделать сайт более человечным, сохранив стиль и цветовую гамму.
.svg)
