Портфолио графического дизайнера: сайт, кейсы, чек-лист

Как создать сайт-портфолио графического дизайнера: сколько работ показать, какие нужны страницы, шаблон кейса и чек-лист перед запуском.

Частые вопросы

Сколько проектов должно быть на сайте-портфолио графического дизайнера?

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

Нужен ли собственный домен для портфолио графического дизайнера?

Это не обязательно, но домен из вашего имени (yourname.com или yourname.design) выглядит солиднее в резюме и подписи email и остаётся с вами, если вы смените платформу. Перед покупкой проверьте у регистратора доступность и стоимость продления: цены отличаются.

Показывать только готовые работы или ещё и процесс?

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

Можно ли включить учебные, личные и концептуальные проекты?

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

Какие форматы файлов и размеры изображений использовать для портфолио?

Экспортируйте изображения для веба: обычно JPEG или WebP для фотореалистичных мокапов и PNG или SVG для плоской графики и логотипов. Уменьшайте их до ширины, в которой они будут отображаться, и сжимайте, чтобы страницы быстро загружались. Отдельно храните PDF-версию портфолио в высоком разрешении для отправки по почте.

Что лучше: сайт-портфолио или PDF-портфолио?

У них разные задачи. Сайтом легко поделиться по ссылке, его находят в поиске, и его можно обновлять в любой момент. PDF нужен, когда в отклике прямо просят вложение. Большинство дизайнеров ведут оба: сайт как основной вариант и PDF, собранный из тех же проектов.

Коротко: сайту-портфолио графического дизайнера нужно 6–10 ваших лучших проектов, каждый из которых оформлен как короткий кейс (задача, ваша роль, процесс, результат), и четыре страницы: «Главная», «Работы», «Обо мне» и «Контакты». Начните с трёх самых сильных проектов, показывайте только тот тип работ, которого хотите больше, и сделайте так, чтобы контакты невозможно было не заметить. Шаблон и чек-лист ниже закрывают всё остальное.

Что на самом деле нужно сайту-портфолио графического дизайнера

У портфолио одна задача: помочь незнакомому человеку за минуту-две решить, стоит ли вам писать. Всё на сайте должно работать на это решение. Обычно сайт смотрит один из трёх людей:

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

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

Сколько проектов показывать

Ориентируйтесь на 6–10. Меньше шести может выглядеть скудно, если только каждый проект не разобран подробно. Больше десяти обычно означает, что часть работ «разбавляет» лучшие.

Простой способ решить, что оставить:

Выпишите все проекты, которыми гордитесь.
Отметьте те, что соответствуют работе, которую вы хотите получать чаще. Остальные уберите, даже если за них заплатили.
Расставьте оставшиеся по качеству. Три лучших поставьте первыми.
Проверьте разнообразие внутри вашей ниши: например, одна система логотипа, одна работа по упаковке, один проект по издательскому дизайну или кампании.
Если два проекта доказывают один и тот же навык, оставьте лучший.

Какие страницы нужны

Четырёх страниц хватит надолго. Остальные добавляйте, только если для них есть настоящее содержание.

Страница	Зачем нужна	Что на ней
Главная	Сориентировать посетителя за секунды	Одна фраза о том, чем вы занимаетесь, 3–6 избранных проектов, заметная ссылка на контакты
Работы (или Проекты)	Полная галерея	Превью с названием проекта и направлением, ведущие на страницу каждого кейса
Страницы кейсов	Показать, как вы думаете	Одна страница на проект по шаблону ниже
Обо мне	Показать, что за вами стоит человек	Короткая биография, фото, навыки или инструменты, услуги или доступность
Контакты	Убрать трения	Email, форма (по желанию), ссылки на профессиональные профили

Дополнительно: страница «Услуги», если вы работаете как фрилансер, страница «Резюме», если ищете работу, и короткая страница «Процесс», если на каждом проекте вы проходите одни и те же шаги.

Шаблон структуры кейса

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

Шаблон

Название проекта и краткое описание в одну строку. Название клиента или проекта, направление и год. Пример: «Harbor Coffee Roasters, упаковка и фирменный стиль, 2025».
Бриф. Два-три предложения о том, что было нужно клиенту и зачем. Если было ограничение (бюджет, сроки, аудитория), назовите его.
Ваша роль. Что делали вы, а что другие, если работала команда. Будьте точны: «Ведущий дизайнер, вместе с копирайтером и типографией» звучит убедительнее, чем «Сделал всё сам».
Процесс. Три-пять изображений или коротких подписей: эскизы, мудборды, первые направления и обоснование выбранного решения.
Финальная работа. Самые крупные и чистые изображения на странице. Покажите дизайн в контексте: на мокапах или на реальных фото напечатанных работ.
Результат. Что изменилось. Указывайте только то, что можете честно подтвердить: клиент запустил проект, он заменил старый фирменный стиль, продукция уже на полках, тираж напечатан в определённом объёме. Если цифр нет, не пишите их. Не выдумывайте метрики.
Ссылка на следующий проект. Пусть посетители продолжают смотреть ваши работы.

Примеры формулировок, которые можно адаптировать

Бриф: «Клиенту, небольшой районной пекарне, нужны были логотип и упаковка, которые выглядят как ручная работа, но недорого воспроизводятся в один цвет».
Роль: «Я отвечал за исследование, дизайн логотипа и систему упаковки. Тексты о продуктах написал клиент».
Подпись к процессу: «Три первых направления. Мы отказались от рукописного логотипа, потому что он плохо читался в малых размерах».
Результат: «Новая упаковка вышла весной и теперь используется во всех линейках продуктов».

Оформите сайт так, чтобы звездой были работы

Оставьте в навигации четыре-пять пунктов. «Главная», «Работы», «Обо мне», «Контакты» вполне достаточно.
Используйте нейтральный фон и много свободного места. Цвет принесут ваши проекты. Пёстрый шаблон с ними конкурирует.
Выберите один-два шрифта. Для дизайнера собственный сайт — образец типографики. Держите её единой и читаемой.
Делайте изображения крупными. Превью должны быть чёткими, а на страницах проектов главные изображения должны занимать всю ширину.
Поставьте имя и специализацию в верх главной страницы. «Майя Чен, дизайнер брендов и упаковки» лучше, чем хитрый слоган, который никто не может расшифровать.
Проверьте сайт на телефоне. Многие откроют вашу ссылку на мобильном. Проверьте галерею, меню и ссылку на контакты.
Сжимайте изображения. Тяжёлые файлы замедляют страницы, а это вредит и посетителям, и видимости в поиске.

Пошагово: от нуля до публикации

Выберите специализацию и читателя. Одна фраза: «Я создаю [что] для [кого]».
Отберите 6–10 проектов по фильтру выше.
Напишите каждый кейс по шаблону, начиная с лучшего проекта.
Экспортируйте изображения для веба в размере, в котором они будут показаны, и дайте файлам понятные имена.
Выберите конструктор и макет, где на первом месте изображения и мало отвлекающих элементов. Если нужна отправная точка, посмотрите страницу конструктор сайтов для графических дизайнеров и шаблон AI-портфолио дизайнера: они показывают, как выглядит готовый макет.
Соберите четыре основные страницы и добавьте кейсы.
Подключите домен из вашего имени.
Вычитайте всё, затем попросите друга или бывшего коллегу найти на сайте ваш email. Если он справляется с трудом, переделайте страницу контактов.
Опубликуйте и поделитесь ссылкой в подписи email, резюме и профессиональных профилях.

Если вы сравниваете инструменты: на бесплатном тарифе We.Inc можно опубликовать до трёх сайтов из готовых шаблонов, а AI-конструктор, который создаёт черновик сайта по запросу, доступен с тарифа Starter за $20 в месяц. Зарегистрироваться можно здесь. Если вы уходите с другой платформы для портфолио, посмотрите список альтернатив Portfoliobox.

Чек-лист перед запуском

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

Содержание

[ ] 6–10 проектов, три самых сильных стоят первыми
[ ] В каждом проекте есть бриф, ваша роль, процесс, финальная работа и результат
[ ] Учебные, личные и концептуальные проекты честно подписаны
[ ] Нет работ клиентов, которые вам нельзя показывать
[ ] На странице «Обо мне» есть фото, короткая биография и то, над чем вы готовы работать
[ ] Email виден на странице «Контакты» и в подвале сайта

Дизайн

[ ] В навигации не больше пяти пунктов
[ ] Один-два шрифта используются последовательно
[ ] Текст читается на своём фоне
[ ] Изображения крупные, чёткие и одного размера в галерее
[ ] У каждого изображения есть описательный alt-текст

Техническая часть

[ ] Сайт корректно выглядит на телефоне, планшете и компьютере
[ ] Изображения сжаты, страницы загружаются быстро
[ ] Все ссылки работают, включая ссылки «следующий проект»
[ ] Заголовки и описания страниц заданы для главной и каждого проекта
[ ] Подключён собственный домен, сайт открывается по HTTPS
[ ] Задано превью для соцсетей, чтобы ссылки красиво выглядели при репосте

После запуска

[ ] Ссылка добавлена в подпись email, резюме и профессиональные профили
[ ] Поставлено напоминание раз в несколько месяцев просматривать портфолио и заменять работы на новые

Частые ошибки

Показывать всё, что вы когда-либо сделали. Умение отбирать — часть навыка, который вы демонстрируете.
Изображения без контекста. Красивый мокап без брифа ничего не говорит о вашем мышлении.
Прятать ссылку на контакты. Если до неё больше одного клика, вы теряете заявки.
Заявлять результаты, которые нечем подтвердить. Описывайте, что произошло, точно. Честный скромный результат убедительнее расплывчатого громкого заявления.
Никогда не обновлять сайт. Заменяйте старые работы более сильными и свежими.

Что дальше

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

Начать бесплатно · Банковская карта не нужна

Umair Ali Sadaqat

Основатель We.Inc

Умайр — основатель We.Inc. Он пишет о создании сайтов с помощью ИИ, агентствах и ведении бизнеса веб-студии.

Готовы создать что-то стоящее?

Присоединяйтесь к 15,000+ компаний, которые с We.Inc запускаются, растут и автоматизируют работу — всё на одной платформе.

Начать бесплатно

Банковская карта не нужна · Связаться с отделом продаж