Портфолио работ по монтажу

Как создать идеальное техническое портфолио

Привет, Хабр! представляю вашему вниманию перевод статьи «How To Build A Great Technical Portfolio» автора Emma Wedekind.

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

Предлагаю вам взглянуть на несколько моих советов по созданию идеального технического портфолио.

Заметьте: эти советы построены на моем личном опыте. Существует множество способов составить отличное портфолио, так что используйте их как рекомендации, а не как жесткие правила.

Что делает хорошее портфолио?

Портфолио объясняет, каким человеком вы являетесь, и какие навыки вы можете предложить. Также портфолио — это идеальный способ продемонстрировать свои навыки разработки!

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

Ваше портфолио должно говорить людям о вас.

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

Добавив несколько личных штрихов, вы даете потенциальным работодателям представление о том, как это работать с вами!

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

Ваше портфолио должно демонстрировать вашу лучшую работу или проект.

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

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

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

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

Вот как я изложила раздел «работа» в моем портфолио. Вы можете посмотреть его полностью здесь.

Ваше портфолио должно иллюстрировать ваши впечатляющие навыки разработки (и дизайна)

Один отличный способ привлечь внимание работодателя — это использовать свое портфолио как сторонний проект. Я использовала Gatsby на React.js, для того чтобы сделать свое портфолио простым, потому что я хотела поэкспериментировать с генератором сайтов и продемонстрировать свои навыки работы с React.

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

Ваше портфолио должно быть актуальным

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

Если у вас новая роль, обновите портфолио. Если вы создали крутое новое приложение, обновите свое портфолио!

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

Ваше портфолио должно содержать ваши контакты

Вы всегда должны предоставлять способ связи в вашем портфолио. Честно говоря, на данный момент, у меня нет моих контактов в портфолио (позор мне!)

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

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

Предоставьте им какой-нибудь способ связи с вами.

Как я придумываю хороший дизайн?

Создание дизайна портфолио может быть одним из самых сложных заданий, особенно если вы back-end разработчик или если у вас практически нет опыта в дизайне проектов.

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

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

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

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

Какие технологии я должен использовать, чтобы создать портфолио?

Существует множество различных технологий, с помощью которых вы можете создать свое портфолио. Давайте познакомимся с несколькими вариантами для back-end и front-end разработчиков.

Back-end разработчики

Если вы back-end разработчик, или вам не очень нравится разрабатывать UI , то можете взять на заметку несколько советов.

Система управления контентом управляет созданием и содержимым цифрового контента.

WordPress – это одна из самых популярных систем управления контентом, и это отличный выбор для разработчиков, которым не очень комфортно разрабатывать собственный UI.

2.Используйте ванильные HTML и CSS

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

Вам даже не нужен JavaScript для создания впечатляющего портфолио!

3. Используйте CSS-фреймворки

Если вам достаточно комфортно с базовыми HTML и CSS, но хотите более последовательный UI, вы можете попробовать CSS-фреймворки.

CSS-фреймворки позволяют работать с элементами стилей быстрее и проще. Важно заметить, что если вы претендуете на вакансию Front-end разработчика, использование CSS-фреймворков может быть не лучшим вариантом, так как работодатели будут искать разработчика, который сможет развивать СSS. Но для back-end разработчика это может стать отличной возможностью.

Я советую обратить внимание на Foundation, Bulma, SemanticUI , или Bootstrap .

4. Используйте конструкторы сайтов

Если вы просто хотите просто разместить контент так быстро, насколько это возможно, то вы также можете использовать конструкторы сайтов, такие как Wix или Squarespace.

Они могут максимально быстро и легко создать сайт. Вы можете даже интегрировать собственный домен.

Однако, если вы претендуете на роль Front-end разработчика, я предостерегаю против использования платформ по созданию сайтов. Ведь это шанс показать свои навыки разработчика! Всё или ничего!

Front-end разработчики

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

1. Используйте ванильный HTML, CSS, и JavaScript

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

2. Используйте JavaScript-фреймворки

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

3.Используйте генераторы статических сайтов.

Генераторы статических сайтов получили известность в компьютерной индустрии с внедрением популярных библиотек и фреймворков (React, Vue, Angular и др.). Я создала свое портфолио с помощью Gatsby: генератор сайтов для React.

Существует множество разных генераторов сайтов, таких как Next.js для приложений на React и VuePress для Vue.js.

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

Рекомендации к коду в вашем портфолио.

• Убедитесь, что ваш код организован вдумчиво и эффективно. Очень легко закинуть весь свой контент на одну страницу (и вы можете это сделать), но разбиение различных разделов/контента на собственные веб-компоненты или HTML-страницы может иметь большое значение.
• Убедитесь, что ваш CSS чистый и организованный. Попробуйте придерживаться более современного CSS для позиционирования элементов (таких как Flexbox или CSS-Grid над floats). Это показывает, что вы остаетесь в курсе спецификаций.
• Используйте семантический HTML. Структурируйте код в иерархию с определенными основными областями. Используйте эти ключевые области (section, nav, header, aside, body и др.) для обозначения важных моментов в вашем портфолио. Старайтесь сократить использование div и span.

Какой контент мне нужно добавить?

Я всегда рекомендую включить следующие пункты в ваше портфолио:

• О себе: Кто вы? Что вы любите делать в свободное время? Какие у вас есть забавные факты?
• Работа/проекты/навыки: С какими технологиями вы работали? Какие проекты разработали?
• Блог (дополнительно): Если вы ведете блог, поделитесь им здесь.
• Контакты: как рекрутёр может связаться с вами?

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

Помните, ваше портфолио — это отражение вас самих. Здесь представлен не единственный, подходящий для всех, вариант составления портфолио. Создайте свое!

Источник

Как сделать портфолио? Примеры и образцы портфолио

Разговаривая с клиентами и фрилансерами, я часто спрашиваю: на что, по-вашему, в первую очередь обращает внимание заказчик? В большинстве случаев люди указывают на портфолио и опыт работы. Это закономерно. Как еще заказчики могут оценить качество и профессионализм удаленного работника? Только по примерам работ.

В нашей статье мы расскажем, как сделать красивое и эффектное портфолио, которое привлечет к вам много клиентов.

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

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

По уровню и качеству работ в портфолио клиенты судят об исполнителе – стоит с ним работать или нет. Поэтому оформлению портфолио нужно уделять пристальное внимание.

Как составить портфолио?

1. Выделите направления, по которым вы желаете создать портфолио. Например, у копирайтера это могут быть: коммерческие предложения, тексты для сайтов, нейминг, слоганы. У фотографа: репортажная съемка, портреты, свадебная съемка и т.д.
2. По каждому направлению отберите ваши лучшие работы и средние по качеству проекты. Оптимально включить в портфолио 10-20 работ по каждому направлению. Это уже создать у клиента нормальное представление о вашем уровне.
3. Подумайте над красивым оформлением портфолио. Например, фрилансер-копирайтер может сформировать один файл в .doc, где будут представлены все отобранные им коммерческие предложения или создать отдельный файлы для каждого текста. Главное, чтобы они были правильно оформлены. Можно создать несколько папок, куда добавить работы по направлениям.

Разместите портфолио в Интернете, на личном сайте, флешке или диске. Идеально, если ваше портфолио будет всегда с вами – никогда не знаешь, где придется общаться с клиентом.

Какие работы добавить в портфолио?

Первый вопрос, который возникает при создании портфолио – какие работы указывать? Если Вы – начинающий фрилансер, то – все. В этом случае на Вас работает количество материалов, качество может быть ниже уровня гуру. Но Вы показываете заказчику – у Вас уже есть выполненные проекты и их много! Главное, чтобы опыт был.

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

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

Куда добавить портфолио в Интернете?

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

25 сайтов, где можно разместить портфолио!

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

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

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

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

• Количество работ в портфолио.
• Число отзывов о фрилансере.

Посещаемость профиля (сколько человек его посмотрели).

Соответственно, чем лучше оформлено Ваше портфолио и чем выше Ваш рейтинг, тем больше заказчиков найдут Вас в каталоге и предложат работу!

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

Оформление портфолио на бирже

Большинство бирж позволяют ввести название работы, короткий комментарий (около 300 символов), фотографию и ссылку на источник. Понятно, если вы – дизайнер, то можете поставить в качестве фотографии скриншот сайта, над которым работали. А что желать журналистам? То же самое. Ставить скриншот страницы со статьей. Если статья большая – сделайте скриншот ее небольшой части, а на полную версию дайте ссылку.

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

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

Например, человеку необходимо написать статью. Он ищет фрилансера и находит в каталоге Ваше портфолио. Но там нет ни одного примера статьи. Что сделает заказчик? Скорее всего, найдет другого исполнителя.

Отдельно хочется отметить количество работ в портфолио. Как уже было сказано ранее, многие биржи телеработы ведут рейтинг фрилансеров. И размер этого рейтинга иногда напрямую зависит от количества работ в портфолио. Например, Free-Lance.ru начисляет дополнительно около пяти баллов за одну работу. Поэтому фрилансеры заинтересованы ставить как можно больше примеров! Мне приходилось видеть портфолио, где количество работ переваливало за сотню, а то и за две сотни! Длина страницы поражала воображение! Но стоит ли так «накручивать» рейтинг? Понятно, лишних 20 работ – и есть 100 баллов. Сотня работ – уже 500 баллов. Но что скажет заказчик, просматривая такое портфолио? Спасибо точно не скажет. Для него огромный список – это море информации, обработать которую невозможно. Скорее всего, он покинет такое портфолио вместе с заказом. Также надо учитывать, что банальное размещение множества проектов — далеко не единственный путь получить высокий рейтинг. На его размер влияют и другие фаткоры: посещаемость портфолио, отзывы заказчиков и другое. И зачастую влияние этих факторов сильнее, нежели количество работ.

Оптимально размещать до 10-15 работ в каждом направлении. Этого достаточно чтобы не захламить страницу, повысить рейтинг на 50-75 баллов и дать заказчику полное представление о Ваших знаниях и способностях. Что делать, если работ недостаточно? Разделять! Например, Вы пишете новости для портала, допустим, Kadrof.ru. Вместо того, чтобы ставить эту работу одним пунктом (новости для Kadrof.ru), Вы разделяете и вводите каждую новость как отдельный проект. Поучается не одна работа, а допустим – десять. И никто не будет против. Все по правилам. И рейтинг вырастет не на 5 пунктов, а сразу на 50.

Как сделать профессиональное портфолио?

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

Пример хорошего портфолио:

Плюсы образца портфолио:

• В каждом направлении – от 2 до 6 проектов
• Выбраны лучшие и свежие работы
• Статьи сделаны со скриншотами
• Грамотное название и описание проектов
• Страница в целом выглядит аккуратно
• Есть аватар (фотография исполнителя)

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

Пример портфолио, требующего доработки:

Минусы данного портфолио:

• Мало свежих работ,
• Мало превью, скриншотов,
• Представлены не все направления работы,
• Немного отзывов.

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

Пример портфолио на корпоративном сайте:

Преимущества данного портфолио:

• Имеются примеры работ (готовые аудиты), которые можно сказать и посмотреть. Это очень важно для консалтинговых сфер (клиентам важно понимать, какой результат они получат),
• Указано общее число проектов, над которым работали специалисты агентства (цифры положительно работают в портфолио),
• Каждая работа имеет превью в виде скриншота сайта,
• Каждый проект имеет краткое описание,
• Указан список проведенных работ и полученный результат,
• Работы сгруппированы по категориям.

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

Остались вопросы?

Если у Вас возникли вопросы, связанные с оформлением портфолио, Вы можете задать их в разделе Вопрос-ответ или в комментариях к статье. Буду рад ответить и помочь!

Источник