Сайт-портфолио частного веб дизайнера фрилансера. Услуги и цены.
Добро пожаловать! Я — Антон «БИТМАП» Черкасов — частный веб-мастер, дизайнер.
Специализируюсь на Frontend / UI дизайне для WEB, айдентике, полиграфии, фотографии.
Занимаюсь комплексным созданием «легких» и удобных сайтов с адаптированной версткой.
Мои услуги Портфолио
Свежие работыСайт SurgicalTools.ru
Веб-дизайн, разработка сетки и интерфейсов, программирование и наполнение адаптивного сайта-каталога хирургических инструментов….
Создание сайта MedMente.ru
Создание интернет-магазина Fotolavka.ru
Создание сайта KAMTEC.RU
Создание сайта Apriele.ru
Веб-дизайн. Создание разработка и сопровождение веб-сайтов
С 2005 года занимаясь веб-дизайном, и держа руку на пульсе сайтостроения, я предлагаю своим клиентам качественный веб-дизайн, грамотную сборку на быстрой, безопасной и удобной системе управления, валидную верстку с учетом SEO-трендов, дальнейшую поддержку и сопровождение.
Как комплексно, так и в отдельности можно заказать:
- Создание сайта «под ключ»
- Создание сайтов-визиток
- Создание сайтов-каталогов
- CSS-HTML верстку шаблонов
- Интеграцию готового шаблона на систему управления сайтом
Смотреть работы Скачать бриф
Дизайн и верстка рекламной полиграфии
С 1995 года я работаю в полиграфической индустрии. Слежу за трендами в области дизайна полиграфии, технологий печатных процессов, разбираюсь в материалах и оборудовании, законах типографики и верстки, владею всеми необходимыми графическими редакторами и профильными программами. Как комплексно, так и в отдельности у меня можно заказать:
- Создание рекламной полиграфии
- Дизайн и верстка брошюр и каталогов
- Дизайн и верстка листовок и буклетов
- Дизайн сувенирной полиграфии
- Макетирование наружной рекламы
Смотреть работы Скачать бриф
Айдентика.
Разработка логотипов и других элементов фирменного стиляСоздавая более совершенный фирменный стиль или проводя ребрендинг, вы сообщаете своим потребителям о том, что ваша компания растет и укрепляет позиции. А если вы начинаете бизнес «с нуля» то вам просто необходим грамотный и современный логотип и его минимальная адаптация под популярные носители.
Как комплексно, так и по-отдельности произвожу:
- Создание фирменного стиля
- Создание логотипа
- Создание гайдлайна
- Разработку брендбука
- Дизайн сувенирной продукции
Смотреть работы Скачать бриф
Рекламная фотография.
Ретушь и цветокоррекция
Ни одна продающая реклама или web-сайт не обходятся без качественных изображений или фотографий. Качественно отснятая и обработанная продукция напрямую влияет на формирование имиджа предприятия и узнаваемость на фоне конкурентов. Для качественного результата мало иметь профессиональное фото- и осветительное оборудование, не менее важны опыт работы в рекламе, знание законов полиграфии, владение широким спектром программного обеспечения, знания законов оптики и светопостановки.
У меня можно заказать рекламную предметную, макро, каталожную, имиджевую, интерьерную фотосъемку или обработку имеющихся некачественных фотографий.
Смотреть работы Скачать бриф
Хотите сэкономить на создании сайта? Возможность есть!
Узнайте подробности
руководство 2022 – GoIT Global
Чтобы получить свой первый денежный заказ, новичку в веб-дизайне нужно оформить портфолио. А где это сделать в первую очередь? Я, как дизайнер с 5-ти летним стажем, рекомендую разместить кейсы на одной из крупнейших платформ для дизайнеров – Behance.
Зачем оформлять портфолио на Behance?
Сайт Behance создали дизайнеры в 2005 году и использовали как соцсеть для обмена опытом и обсуждения работ друг друга. С 2012 года сервис начал превращаться в полноценную платформу по размещению портфолио дизайнеров-фрилансеров и агентств, чтобы заказчики могли в любое время найти подходящих исполнителей для своих проектов.
Сегодня Behance – это платформа для графических и веб-дизайнеров, фотографов, иллюстраторов и других креативных людей, чья работа и/или хобби связаны с творчеством. Каждый пользователь:
- имеет возможность оформить портфолио и привлекать заказчиков без необходимости создавать отдельный сайт;
- становится частью онлайн-комьюнити пользователей со всего мира;
- может показывать свои работы и вдохновиться творчеством других профессионалов.
Оформляем портфолио и кейсы на Behance: пошаговое руководство?
Если вы находитесь на старте карьеры веб-дизайнера и пока не оформили кейсы и портфолио – первым делом прочитайте статью “Как начать карьеру веб-дизайнера” в Блоге GoIT. В ней моя коллега по цеху – Senior UI/UX Designer Мария Руденко делится пошаговым планом для новичков в веб-дизайне, которые только начинают писать свою историю успеха в IT и хотят научиться делать красочные макеты сайтов, визуалы приложения и веб-сервисы.
Чтобы стать веб-дизайнером и создать 5 профессиональных проектов для своего портфолио – регистрируйтесь на курс Web-Design в GoIT.
Зарегистрироваться на курс Web Design сейчас
1. Выбираем кейсы для портфолио
Первый шаг к оформлению портфолио – правильный выбор кейсов. На этом этапе вам нужно выбрать 3-5 самых лучших кейсов, которые с первого взгляда скажут заказчику:
- Как ваша работа может улучшить его продукт и решить бизнес-задачи.
- Ваши скилы и профессионализм.
Важно! Не делайте портфолио ради портфолио, чтобы показать “хоть что-то”. Выбирайте кейсы по направлениям, в которых вам интересно развиваться. В то же время, если вы специалист широкого спектра и вам действительно интересна работа над сайтами-визитками, и многостраничниками, мобильными приложениями и т.д. – выставляйте все. Заказчики ищут веб-дизайнеров на свой проект с кейсами по смежным тематикам.
2. Подготовьте портфолио, прежде чем оформить его
Чтобы правильно загрузить портфолио – обратите внимание на 8 моментов.
- Если вы собираетесь оформить в портфолио работу, которую делали для клиента – обязательно уведомите его.
- Всегда различайте понятиях “портфолио” и “кейс”. Когда дизайнер говорит про “портфолио”, он имеет в виду только визуал, саму картинку, которая необходима для привлечения внимания заказчика. Термин “кейс” подразумевает краткую информацию о проекте, поставленных задачах, о возникших проблемах и итоговых решениях вместе с картинками вместе с визуалом. Всегда придерживайтесь логики – портфолио должно привлекать внимание заказчика, а кейс расскажет ему о ваших скилах и поможет определиться в будущем сотрудничестве.
- Позаботьтесь о правильных размерах макетов. Чтобы красиво отображать портфолио, загружайте одинаковые по ширине макеты – максимум 1920px. Размер высоты картинок не ограничен.
- Выберите нужный формат. Платформа позволяет разместить портфолио одним из 2х вариантов – “лонг скролл” или отдельными макетами. У варианта расположения “отдельными картинками” есть плюс – вы сможете в будущем “привязать” каждый макет к профилю в Pinterest и продвигать свои работы. Раздельные блоки еще удобны тем, что они меньше весят и проект загружается гораздо быстрее, что экономит ваше время.
- Для одного кейса выбирайте не более 5 (+/-2) картинок. Если их будет 10+ – заказчику вряд ли посмотрит их все, а если мало, то они могут не раскрыть суть проекта.
- Разместите макеты на mockup – файлы в формате .psd, где есть слои, настроен свет, тени и все необходимые элементы.
- Для кейса выбирайте фото полного изображения сайта и отдельных, самых удачных элементов в масштабе. Так вы покажите детали, изобразите шрифты, которые использовали, цветовую палитру и покажите все скилы будущему клиенту.
- Будет большим преимуществом наличие адаптивных версий сайта, над которым вы работали, поэтому если клиент изначально не делал заказ на мобильную версию, вы можете сделать ее для своего портфолио. Не нужно тратить время на весь сайт, достаточно сделать пару макетов, чтобы презентовать их на mockup.
Кейс готов к публикации и следующий шаг: залить его на Behance. Только перед этим убедитесь, что все картинки высокого качества.
3. Создайте профиль на Behance
Вы сможете загружать проекты только после создания профиля на Behance.
Шаг 0. Зайдите на сайт Behance.net и создайте/войдите в учетную запись.
Нажмите на кнопку “Зарегистрироваться” или “Войти” в правом верхнем углу сайта, в зависимости от того, регистрировались ли вы на платформе ранее или нет.
Далее следуйте подсказкам.
Шаг 1. Нажмите “Создать проект”
Шаг 2. Определите тип будущего проекта
Шаг 3. Загрузите визуал проекта
Ответственно отнеситесь к обложке (превью) проекта. Именно она будет первой привлекать или оттакливать внимание пользователей. То, как она будет выглядеть определит, зайдет ли клиент к вам в профиль или нет. Продумайте что будет на ней изображено и учитывайте размер – 404x316px.
Сейчас большой популярности набрала анимация, поэтому создайте небольшой ролик для презентации какой-то части проекта. Это займет больше времени, но результат того стоит, ведь по опросам маркетинговых агентств – 70% компаний уверены, что именно видео повышает узнаваемость бренда.
Шаг 4. Придумайте заголовок проекта и пропишите теги.
Это может быть название проекта, ссылка на сайт.
Важно! Название проекта лучше писать на английском языке, если вам интересны иностранные заказчики и друзья коллеги. Ведь Behance – международная площадка и ваш кейс могут увидеть заказчики со всего мира.
Обязательно продумайте теги, ключевые слова, их можно вписать не более 10. Отметьте классификацию, к которой относится ваш проект (графический дизайн, веб дизайн, дизайн продукта и тд).
Как только проект готов – нажмите кнопку “Публикация” и он будет опубликован для всеобщего обозрения.
В текстовой части опишите все нюансы процессов, цели. Обоснуйте свои решения поставленных задач и как вы помогли клиенту своим дизайном. Под каждым слайдом добавьте краткое описание. Это не обязательно, но поможет рассказать больше о проекте.
Если над проектом работала команда или несколько человек, укажите всех авторов и какую роль они принимали. Прикрепите ссылки на их аккаунты, с их разрешения. В нижней части оформления проекта, поблагодарите зрителя за внимание, оставьте благодарности коллегам, если они есть и клиенту, с его разрешения.
Поздравляю! Ваше портфолио создано и готово привлекать заказчиков!
Бонус-Совет. Регулярно обновляйте информацию о проектах
Выставляйте те работы, над которыми вы работали с удовольствием. Такой проект всегда заметен, любовь к нему заказчик почувствует, вы легко и с энтузиазмом сможете ответить на все вопросы о нем.
Не забывайте следить за трендами, чтобы всегда быть в теме.
Вместо итогов: Чеклист “Как веб-дизайнеру оформить портфолио на Behance”
Распечатайте краткий чеклист и поместите на видном месте на первое время. Сверяйтесь с ним каждый раз, когда размещаете проекты на Behance пока процесс не будет отточен до мелочей
- 1.Создайте личный кабинет на сайте.
- 2. В личном кабинете нажмите “Создать проект”
- 3. Нажмите иконку “Изображение”
- 4. Выберите на компьютере все ваши изображения, которые вы подготовили для кейса проекта.
- 5. Справа на панели меню выберете “Настройки”
- 6. Вы увидите “анкету” проекта. Заполните все поля и пункты в ней.
- 7. А) Если вы не закончили оформление проекта и планируете продолжить через какое-то время – нажмите синюю кнопку “Сохранить как черновик” / Б) Если готовы показать всем проект, он полностью оформлен, внизу нажмите зеленую кнопку “Публикация”.
Заполните все поля и пункты в ней.20 примеров портфолио веб-дизайнеров
ВдохновляйтесьВыделиться внештатным веб-дизайнером непросто. Клиенты заняты больше, чем когда-либо — трудно даже привлечь их внимание, не говоря уже о том, чтобы заставить их обратиться по поводу запуска проекта.
Даже будучи высококвалифицированным профессионалом, вам все равно нужно потратить время на создание сильного портфолио веб-дизайна, чтобы продемонстрировать свой опыт и свои прошлые проекты — онлайн-портфолио, которое позволит вам прорваться сквозь шум и выделиться среди конкурентов.
К сожалению, многим веб-дизайнерам-фрилансерам нелегко дается создание онлайн-представительства и портфолио. Вы бы предпочли делать отличную работу для своих клиентов, чем рассказывать о себе и своих навыках.
Поэтому, чтобы помочь вам начать создавать свой собственный сайт-портфолио и привлечь больше клиентов и клиентов, мы собрали 20 вдохновляющих примеров портфолио веб-дизайна от дизайнеров-фрилансеров и творческих студий со всего мира.
Прежде чем мы перейдем к списку, давайте посмотрим, что входит в звездное портфолио веб-дизайнеров.
Что включить в веб-сайт портфолио веб-дизайна
Чтобы ваше портфолио веб-дизайна выделялось, обязательно включите следующие основные элементы:
- Они привлекают внимание клиентов на с использованием ярких цветов, оригинальных изображений, или интерактивные элементы, чтобы выделиться среди конкурентов.
- Они формируют каждый элемент вокруг идеального клиента. Вместо того, чтобы просто говорить о том, что вы делаете, они объясняют, что вы делаете для ваших клиентов, с упором на преимущества, а не на функции или услуги.
- Вырезали весь ненужный пух. Лучшие портфолио веб-дизайна не усложняют излишне — они упрощают навигацию и всегда направляют посетителей к желаемому результату.
- Они показывают путь проектирования с помощью тематических исследований. Потенциальные клиенты хотят знать, что вы можете
- Они создают доверие, используя социальное доказательство и другие сигналы доверия. Потенциальные клиенты доверяют рекомендациям других, даже тех, кого они не знают. Вы также можете включить другие сигналы доверия, такие как описание вашего процесса и отражение убеждений клиентов в вашем тексте.
- Они придают немного индивидуальности. Клиенты нанимают людей, а не бренды — добавление нескольких личных штрихов в ваше портфолио поможет установить связь с вашими идеальными клиентами.
- Они содержат четкий призыв к действию. Поскольку ваше портфолио предназначено для привлечения новых клиентов, убедитесь, что вы спрашиваете их об их бизнесе. Четкий CTA позволяет клиентам узнать, что им делать дальше, будь то настройка звонка, заполнение контактной формы или что-то еще.
Теперь, когда мы знаем , что должно войти в ваше портфолио веб-дизайнера, давайте взглянем на несколько примеров от других дизайнеров.
20 великолепных примеров портфолио веб-дизайна, которые вдохновят вас
#1: Джон Генри Мюллер
Ссылка на портфолио: https://johnhenrymuller.com/
Джон привносит в свое портфолио массу индивидуальности с помощью ярких цветов, дружелюбных фотографий и понятных копий, которые помогают привлечь тип клиентов, с которыми он любит работать.
Также стоит ознакомиться с его потрясающими (и остроумными) кейсами как отличным примером того, как добавить индивидуальности в собственное портфолио.
#2: Оливье Гийе
Портфолио Ссылка: https://www.olivier-guilleux.com/
Портфолио Оливье сочетает в себе минималистский дизайн с яркими цветами, а также тонкую анимацию на главной странице, чтобы привлечь внимание посетителей. Элементы его портфолио, такие как этот, подробно описывающий его работу в блоге о дизайне AA13, эффективно демонстрируют его дизайнерские навыки, и каждый из них включает четкий призыв к действию, чтобы узнать о его дизайнерских услугах. Это отличный пример использования минимального дизайна для достижения максимального эффекта.
#3: Рамси Тейлор
Ссылка на портфолио: http://rumz.org/
Рамси специализируется на создании интерактивных онлайн-историй, поэтому вполне уместно, что его портфолио включает в себя элементы его мастерства интерактивного дизайна.
При просмотре копии его сайта появляются интерактивные элементы, которые накладываются на страницу — каждый элемент ссылается на окончательную опубликованную работу, демонстрируя как его прошлые работы, так и его таланты в уникальном форм-факторе, который обязательно запомнится клиентам.
# 4: Рафаэль Алейхо
Ссылка на портфолио: https://aleixo.me/
Портфолио не обязательно должно быть слишком сложным, а одностраничное портфолио фронтенд-разработчика Рафаэля прямо указывает на суть: он демонстрирует свое дизайнерское мастерство . Уникальное движение прокрутки слева направо позволяет ему включать несколько проектов на одну страницу, а щелчок по каждому проекту вызывает более подробное тематическое исследование. Темная тема помогает красочным скриншотам появляться, а вертикальное меню упрощает навигацию по сайту.
№ 5: Джаррод Драйсдейл
Ссылка на портфолио: https://studiofellow.com/
Да, сайт-портфолио Джаррода прекрасен, но копия здесь действительно сияет.
Его страница «Услуги» четко объясняет, как его проекты помогают клиентам в достижении их целей, со ссылками на подробные тематические исследования, демонстрирующие ценность его работы. Способность Джаррода связать дизайн с результатами — это то, к чему вы должны стремиться в своем собственном портфолио веб-дизайна.
#6: Рамон Гилаберт
Ссылка на портфолио: https://gilabert.design/
Дизайн портфолио Рамона успокаивающий и красивый, и дизайн особенно хорошо адаптируется к мобильным устройствам, что важно, когда более половины веб-трафика в наши дни приходится на мобильные устройства. Его тематические исследования особенно эффективны, они перечисляют конкретные результаты и объясняют его взгляды на проект.
#7: Alex Coven
Ссылка на портфолио: https://www.alexcoven.com/
Как и сайт Рамона, портфолио Алекса отличается минималистичным дизайном, но что делает его по-настоящему особенным, так это великолепная навигация.
Меню появляется с левой стороны и содержит большую часть контента сайта, что позволяет Алексу использовать большую часть страницы, чтобы продемонстрировать свои лучшие работы. Это уникальный подход, и он работает очень хорошо.
#8: The Wonder Jam
Ссылка на портфолио: https://thewonderjam.com/
Наша первая студия! Дуэт дизайнеров Элли и Адам Леман ставит своих клиентов на первое место в каждой части портфолио веб-дизайна The Wonder Jam. От широкого использования отзывов, дружелюбных фотографий клиентов, четких описаний и прозрачных цен на их услуги, каждый элемент служит одной и той же цели: поставить успех своих клиентов на первое место и в центр.
#9: Стивен Хэнли
Ссылка на портфолио: https://www.steven-hanley.com/
Стивен — цифровой дизайнер со склонностью к смелой типографике, которая занимает центральное место в его портфолио — по адресу по крайней мере, пока вы не нажмете на один из его тематических исследований.
Сногсшибательные цвета, яркие заголовки и интерактивный дизайн объединяются, чтобы продемонстрировать дизайнерские навыки Стивена и привлечь его идеальных клиентов.
#10: Angle2
Ссылка на портфолио: https://angle2.agency/
Еще одно интерактивное портфолио с отличной типографикой. Интерактивный заголовок Angle2 сразу привлекает ваше внимание. Когда вы прокручиваете вниз, угловой дизайн продолжает их тематические исследования и услуги, предоставляя уникальное, но в чем-то сплоченное и привлекательное портфолио агентства.
#11: Branex
Ссылка на портфолио: https://www.branex.com/
Портфолио веб-дизайна Branex выделяется по двум основным причинам: красочный дизайн и подробные тематические исследования. Благодаря ярким градиентам и уникальной палитре сайт, безусловно, выделяется среди обычных бизнес-шаблонов, а их подробные тематические исследования охватывают как дизайн, так и окончательные результаты.
#12: Up Late Studio
Ссылка на портфолио: https://upl8.com/
Одностраничное портфолио Up Late Studio выводит неоновую тему на совершенно новый уровень. Яркие цвета и мигающие вывески делают веб-сайт запоминающимся портфолио, но остальная часть дизайна демонстрирует немного больше ограничений, с отзывами клиентов и слайд-шоу прошлой работы.
#13: Момкай
Ссылка на портфолио: https://www.momkai.com/
Momkai — студия дизайна, построенная на простоте — их портфолио понятное, легкое для понимания и особенно хорошо работает на мобильных устройствах. В каждом тематическом исследовании, подобном этому из их работы с компанией Bugaboo, производящей коляски, демонстрируется их работа в области веб-дизайна и графического дизайна с помощью комбинации анимированных изображений, видео, скриншотов и убедительного текста. Это простой дизайн, который работает с большим эффектом.
#14: Sage McElroy
Ссылка на портфолио: http://sagemcelroy.
com/
Личный сайт Sage относится к редкому типу портфолио, в котором хорошо работают темные темы. Дружественный текст и подробные тематические исследования переходят прямо к портфолио, демонстрирующему работу Сейджа, и есть много возможностей связаться по электронной почте, чтобы узнать о новых проектах. Все необходимое для отличного портфолио, без лишних слов.
#15: Jake Dow-Smith
Ссылка на портфолио: https://dow-smith.com/
Минималистский сайт Джейка Доу-Смита использует уникальный подход к демонстрации своих портфолио. Каждая часть представлена в виде короткого встроенного видео, показывающего посетителям не только то, как выглядят сайты, но и то, как они работают.0026 работа . Сайт также возвращается к началу при прокрутке — забавный штрих, хотя и немного сбивающий с толку посетителей.
#16: Gin Lane
Ссылка на портфолио: https://www.ginlane.com/
Примечание редактора: с момента написания этой статьи Gin Lane закрыла свой агентский бизнес и основала новую компанию.
называется Pattern — этот пост относится к их портфолио на момент публикации.
Великолепная типографика, использование цвета и движения, подробные тематические исследования — Джин Лейн имеет одно из лучших портфолио по веб-дизайну. Сайт также работает на мобильных устройствах так же хорошо, как и на настольных компьютерах, идеально подстраиваясь под дизайн меньшего экрана. И смайлики добавляют причудливую нотку дружественному тексту.
#17: Мэтт Олпински
Ссылка на портфолио: https://mattolpinski.com/
Нам нравится, как Мэтт уравновешивает свои услуги и предложения продуктов на своем сайте, но настоящими моментами здесь является его глубокая тематические исследования, такие как этот для фитнес-сайта FitLegit. Каждое тематическое исследование включает в себя анализ подхода Мэтта к дизайну, охватывающего все: от цветов до типографики и информационной архитектуры. Завершением каждого тематического исследования является отзыв клиента, а также призыв к действию, чтобы рассказать об услугах Мэтта.
Это мастер-класс по составлению отличных тематических исследований веб-дизайна.
#18: Дэвид Хеллманн
Ссылка на портфолио: https://davidhellmann.com/
Причудливый «прыгающий» заголовок и темная тема в портфолио Дэвида сразу привлекают ваше внимание, и внимание к мелким деталям сохраняется. на остальной части сайта. Дэвид также включает фотографии из своей ленты в Instagram, добавляя индивидуальности профессиональному сайту.
#19: ZURB
Ссылка на портфолио: https://zurb.com/
Сайт Зурба обладает яркой индивидуальностью. Космическая тема продолжается через их типографику и копирайтинг, а их тематические исследования (например, из их работы над Men’s Wearhouse) подробно описывают их уникальный подход к тому, чтобы помочь клиентам открыть для себя «Дизайн-инсайты». В качестве бонуса они также спрятали 42 коровы в самых неожиданных местах на своем участке — посмотрите, сможете ли вы найти их всех!
#20: Ники Тесла
Ссылка на портфолио: https://nickytes.
la
Это . . . ну это таблица. В частности, портфолио Ники представляет собой интерактивную таблицу Google, которая общедоступна и привязана к доменному имени. Портфолио электронных таблиц даже включает в себя интерактивный рисунок — посетители могут менять цвет фона по своему желанию, и эти изменения отражаются на сайте в реальном времени. Это значит, что это не совсем самый читаемое портфолио , но оно, безусловно, одно из самых замечательных.
Сделайте свое портфолио о своих клиентах
Ваше портфолио веб-дизайна может быть очень личным сайтом, отражающим ваш подход к дизайну и вашу индивидуальность, но не забывайте, что, в конечном счете, задача вашего портфолио — продавать. Это означает, что нужно сосредоточиться на том, как вы помогаете своим клиентам — как вы решаете их проблемы, как они получают пользу от ваших услуг и насколько они счастливы работать с вами.
Фотография заголовка Джонатана Фарбера на Unsplash
Эффективно добивайтесь лучших результатов.
Когда вы используете The Hub от GoDaddy Pro, у вас внезапно появляется больше времени, чтобы сосредоточиться на самом важном. Забудьте о жонглировании задачами администратора. Восстановите свое время и используйте его, чтобы клиенты чувствовали себя центром вашей вселенной.
Зарегистрируйтесь бесплатно
9 Творческие примеры портфолио веб-дизайнеров, которые вдохновят вас
идеи
28 июня 2022 г.
Слова Джеффа Карделло
Дважды щелкните, чтобы выбрать видео
Ваш браузер не поддерживает это видео выше]Как веб-дизайнер, ваше портфолио является прямым выражением ваших технических способностей и творческих способностей — просто не забудьте проявить свою индивидуальность.
Сайт-портфолио начинается с работы, которую вы хотите представить, но это гораздо больше, чем просто галерея проектов. Предлагая взглянуть на ваш творческий характер, чувствительность UX и навыки веб-дизайна, на очень маленьком пространстве можно многое рассказать.
К счастью, вы не одиноки в этом. Мы собрали несколько примеров портфолио веб-дизайнеров, которые демонстрируют разнообразие подходов, которые другие творческие люди используют для выражения своего таланта, а также инструменты для создания веб-сайтов без кода, которые упрощают создание и публикацию великолепных интерактивных портфолио.
С чего начать с портфолио веб-дизайнера
Портфолио веб-дизайнера, очевидно, должно быть подборкой лучших ваших творческих результатов, но оно также должно предлагать пользовательский опыт, отражающий вашу индивидуальность. Люди не только хотят видеть, на что вы способны, но и хотят знать, кто вы и с кем бы вы хотели работать.
Вы можете сообщить об этом частично через формат, который вы выбрали для отображения своей работы (подробнее об этом ниже). Лучшие портфолио веб-дизайна — это не только визуальные эффекты, демонстрирующие ваш опыт, поэтому подумайте о том, как предоставить более подробную информацию о вашем прошлом, процессе и о том, как вы думаете.
Копирование — это, безусловно, один из вариантов — просто убедитесь, что вы соблюдаете правильный баланс; посетители должны сразу же понять, на что вы способны, без того, чтобы быть похороненным в неподвижных блоках контента.
Примеры форматов портфолио веб-дизайнеров
Примеры портфолио веб-дизайнеров могут варьироваться от простых одностраничных веб-сайтов до полностью захватывающих цифровых миров. Вот несколько направлений, которые, по нашему мнению, работают очень хорошо.
Минималистичные целевые страницы
Нередко можно увидеть сверхминималистичные одностраничные дизайны с большими визуальными эффектами, которые полностью раскрывают таланты дизайнеров. Представление вашей работы в чистом виде обеспечивает кратчайший путь к тому, чтобы люди увидели и оценили то, что вы делаете.
Микросайты
Вы можете найти что-то вроде трех-четырехстраничного микросайта, который лучше подходит для вашего портфолио.
Наличие отдельных разделов, посвященных «обо мне», избранным проектам, а также навыкам/программному обеспечению, может дать посетителям более глубокое представление о том, кто вы как креативщик, и дать вам немного больше передышки при представлении ваших проектов. и писать о них.
Интерактивный опыт
Мы также видим все больше и больше примеров портфолио веб-дизайнеров, которые предлагают интерактивность и иллюзию пространства. Трехмерные макеты привлекают своим чувством чуда. Включение элементов видеоигр, таких как поощрение посетителей звуками и визуальными эффектами после взаимодействия с чем-либо, не только доставляет удовольствие нашим чувствам, но и побуждает нас двигаться вперед и получать новые впечатления.
1. Johan Digital
Johan Digital представляет ряд проектов в этом одностраничном дизайне. Здесь нет длинных объяснений или тематических исследований — они оставляют на ваше усмотрение их избранные работы и делают собственные выводы.
Минималистичный дизайн, подобный этому, вызывает чувство интриги, когда все, что вам представлено, — это визуальные эффекты без какого-либо контекста.
Основа Johan Digital строится на изображениях из их проектов, но они не упускают из виду несколько неброских анимационных эффектов. Созданный с помощью Vev, вы найдете параллаксную прокрутку, а также анимированный текст. Эти моменты движения незаметны, но добавляют достаточно разнообразия, чтобы это минималистское пространство не казалось плоским и неподвижным.
В этом потрясающем портфолио Johan Digital демонстрирует, что все, что вам нужно, — это один свиток, чтобы сообщить о качестве вашей работы.
2. Дэвид Хекхофф
Начало портфолио UX-дизайна Дэвида Хекхоффа похоже на наблюдение за кем-то на работе. В этом анимированном пространстве фигура приветствует нас волной перед тем, как приступить к работе на своем компьютере. Добро пожаловать в это веселое и причудливое портфолио.
В верхней правой части экрана есть возможность включить звук, который обеспечивает саундтрек к лоу-фай электронным битам.
Благодаря звуку и визуальным эффектам мы погружаемся в увлекательное и интерактивное мультяшное измерение.
Одной из областей специализации Дэвида является WebGL, который представляет собой Javascript API для создания интерактивной трехмерной графики, и здесь так много замечательных примеров, как в этом разделе биографии.
Нам нравится видеть примеры портфолио веб-дизайнеров, которые приложили дополнительные усилия для создания уникальных пользовательских интерфейсов. Портфолио Дэвида затянет вас в микрокосм блестящей анимации в тот момент, когда вы приземлитесь, и вдохновит вас на исследование всех чудес, содержащихся в нем.
3. Колин Рейц
Навыки Колина Рейца включают стратегию дизайна, UX/UI и графический дизайн с этим портфолио предлагающим тщательную проверку его работы. Дизайн-система, фрейм веб-приложения и печатный постер — это единственные разработки на данный момент, но каждый из них получает описание с подробным описанием того, что входило в его создание.
Все это яркие примеры, демонстрирующие размах его дизайнерских способностей.
Созданный с помощью Vev, Колин использует преимущества параллакса, скользящего текста, анимированных плавных переходов и каруселей изображений, чтобы оживить этот дизайн действием и движением.
С помощью этого портфолио Колин отлично справляется не только с конечными результатами своих дизайнерских усилий, но и с проблеском процесса. Всегда полезно показать, как вы решаете проблемы и мысли, лежащие в основе дизайна, и это портфолио дает много информации о работе Колина.
4. Рубенс Кантуни
Портфолио Рубенса Кантуни открывается анимацией, которая трансформирует буквы «Чао», как если бы они были векторной графикой. Это прекрасное напоминание о тонкостях дизайна, прямо наверху показывающее, что Рубенс уделяет внимание деталям.
На этом внимание Рубенса к деталям дизайна не заканчивается. Яркая и яркая цветовая палитра, продуманный стиль шрифтов, анимация, напоминающая конфетти, и большие курсоры обеспечивают простое и приятное взаимодействие с пользователем.
Если вы ищете примеры портфолио веб-дизайнеров, которые просты, но интересны, Ruben’s покажет вам, как найти правильный баланс.
5. Aumaan Art
Aumaan Art — иллюстратор, фотограф и создатель контента, который не только демонстрирует в этом портфолио свои таланты, но и свою личность. На этом начальном экране есть эффект наведения, который превращает курсор в розовый рожок мороженого, а показанная фотография переключается на фотографию, показывающую его удивление. Это отличный эффект, который показывает, что Аумаан не воспринимает себя слишком серьезно.
Наряду с использованием Вев для создания сложных анимаций в этом портфолио, в верхней части экрана также находится индикатор выполнения прокрутки Вев. Для более длинных страниц индикаторы выполнения прокрутки важны, чтобы показать посетителям, где они находятся, и Vev упрощает добавление одного с помощью этого предварительно закодированного элемента.
Если вы такой же поклонник иллюстраций, как и мы, вам стоит попробовать Aumaan Art.
5. Aumaan Art
Дважды щелкните, чтобы выбрать видео
Ваш браузер не поддерживает это видео.Аумаан Арт — иллюстратор, фотограф и создатель контента, который не только демонстрирует в этом портфолио свои таланты, но и свою личность. На этом начальном экране есть эффект наведения, который превращает курсор в розовый рожок мороженого, а показанная фотография переключается на фотографию, показывающую его удивление. Это отличный эффект, который показывает, что Аумаан не воспринимает себя слишком серьезно.
Дважды щелкните, чтобы выбрать видео
Ваш браузер не поддерживает это видео Наряду с использованием Вева для создания сложных анимаций в этом портфолио, в верхней части экрана также находится полоса прокрутки Вев. Для более длинных страниц индикаторы выполнения прокрутки важны, чтобы показать посетителям, где они находятся, и Vev упрощает добавление одного с помощью этого предварительно закодированного элемента.
6. Никколо Миранда
Когда вы открываете это портфолио для Никколо Миранды, арт-директора и иллюстратора, вы видите газету, которая вращается и увеличивается. Все это пространство читается как полноцветная газетная страница, с текстом, рассказывающим о его творчестве и наполненным его замечательными иллюстрациями. Хотя газетные макеты не являются чем-то новым, Никколо поднимает этот формат до чего-то более художественного в своем блестящем портфолио.
7. Content Crusher
Аниматор и моушн-дизайнер Джек Джейш объединяет векторные сетки, глючные визуальные эффекты и низкотехнологичную типографику для вдохновленного киберпанком портфолио .
Слишком экстравагантный образ сопряжен с риском, но Джеку удается добиться ошеломляющего эффекта от этой резкой, немного упрощенной эстетики. Это показывает, что он привержен идее и предлагает что-то, что не только творческое, но и предлагает сплоченный пользовательский опыт.
Если вы настроены на экспериментальное портфолио веб-дизайнера, то портфолио Джека — отличный пример того, как найти правильное сочетание необычности и практичности.
8. Йоханнес Мазкур
В портфолио арт-директора Йоханнеса Мазкура видно, что он разбирается в типографике и цвете. Красный, желтый, черный и белый доминируют в этом дизайне, придавая ему ощущение силы и гармонии. Шрифты появляются в нескольких масштабах и весах с хорошим сопоставлением повсюду.
Созданный с помощью Vev, он использует некоторые из наших эффектов, таких как текстовая анимация. Также хорошо используются смещенные слои текста и изображений, добавляющие вычурной эстетики.
9. CECraft
Под управлением виртуального робота-помощника SBOW7 это портфолио для разработчика и дизайнера Шаррафа Эддина (также известного как CECraft) похоже на вход в терминал на борту футуристического космического корабля. Благодаря роботизированному голосу, сопровождающему вас, звукам вспышек и ляпов и даже голографическому изображению самого CECraft, рассказывающего о своей работе, это портфолио перенесет вас в другой мир.