Идеи для презентации вашего онлайн-портфолио

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

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

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

Динамические категории

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

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

• Фирменный дизайн
• Дизайн иконок
• Веб-сайты
• Мобильные приложения
• UI/UX вайрфрейминг

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

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

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

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

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

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

Слайд-шоу из фотографий проекта

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

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

Иногда посетители предпочитают галерею миниатюр, чтобы просмотреть все сразу. Но слайд-шоу имеют место быть, если они не слишком большие и не содержат слишком много слайдов (скажем, менее 15).

Bramble поддерживает слайд-шоу изображений на страницах портфолио, и они также полностью адаптивны. Это позволяет быстро просматривать фотографии и имеет два разных метода навигации:

• Стрелки влево/вправо
• Точечная навигация для каждого слайда

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

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

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

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

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

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

Модальные коробки

Это мой предпочтительный метод представления портфолио. Модальное окно появляется «вверху» страницы, а содержимое под ним становится серым.

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

Прекрасным примером этого является тема Vitae на ThemeForest. Он поставляется с модальными лайтбоксами на каждой странице элемента портфолио, где вы можете щелкнуть, чтобы увидеть увеличенное изображение.

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

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

Я рекомендую это в основном для элементов галереи, где у вас есть много фотографий, которые вы хотите представить в одной серии. Темные модальные окна также могут отображать полные элементы портфолио, например, в теме Honshi.

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

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

Полностраничные тематические исследования

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

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

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

Мандала — отличная тема, демонстрирующая, насколько простыми могут быть тематические исследования.

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

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

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

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

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

Возьмите тематические исследования и действительно сделайте их своими собственными. Добавьте достаточно информации, чтобы сделать их ценными для посетителей, без написания полной диссертации.

Подведение итогов

Представление работы из вашего портфолио не всегда просто. Он различается в зависимости от типа работы и количества проектов, которые у вас есть.

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

Если вы еще не создали свой собственный сайт-портфолио, вам следует ознакомиться с нашей статьей о том, как создать сайт-портфолио на WordPress, где мы объясняем, как настроить хостинг и тему для вашего онлайн-портфолио.