Разработка сайта-портфолио на Tilda для UX/UI дизайнера
Задача
Задача проекта - разработать современное, визуально выразительное и функциональное портфолио веб-дизайнера на платформе Tilda. Сайт должен не только демонстрировать выполненные проекты, но и отражать профессиональный рост, сильные стороны и подход к работе. Важно было создать удобную и эстетичную презентацию навыков, которая поможет потенциальным работодателям и клиентам быстро оценить компетенции дизайнера и сформировать представление о взаимодействии с ним.
Решение
В работе над сайтом-портфолио я следовал тому же алгоритму, по которому работаю над каждым проектом:
1. Сначала я подготовил работы для портфолио.
2. Затем подобрал большое количество референсов, которые помогают мыслить в дизайне нестандартно. Я пробовал объединять и перерабатывать различные креативные решения и подходы.
3. После этого приступил к разработке прототипов и дизайну страниц. Для каждой страницы я старался создавать несколько вариантов, чтобы выбрать наиболее удачное решение.
4. После завершения дизайна всех страниц для десктопной версии я приступил к разработке адаптивной версии. Я старался сделать её так, чтобы сайт одинаково хорошо выглядел и на экране монитора, и на экране мобильного устройства.
Работать над сайтом-портфолио было сложнее, чем над другими проектами, потому что для себя хочется сделать всё самое лучшее. На этом этапе возникают трудности: начинаешь перебирать множество вариантов, и выбрать один из них бывает непросто, поскольку многие решения кажутся удачными.
Больше всего мне понравилось работать над главной страницей. Давайте я подробнее расскажу о ней.
Сетка сайта простая и лаконичная: она содержит четыре направляющие - по левому и правому краям, а также две силовые линии. В дизайне достаточно свободного пространства, благодаря чему информация воспринимается легко. На главном экране представлены меню для удобной навигации, крупная фотография и галерея выполненных работ.
Далее расположен описательный текст, выстроенный по силовой линии и поддерживающий общую композицию сайта.
Следом представлен блок портфолио в виде карточек, выполненных в единой стилистике. Это придаёт дизайну целостность и гармоничность.
Затем идёт блок услуг с названием и кратким описанием каждой из них. Пользователь может понять, что входит в услугу, и оставить на неё заявку.
После этого представлен блок с наградами. В нём нет ничего лишнего: указаны номинация, год и организация, проводившая конкурс.
Далее расположен блок с отзывами о моей работе. По стилистике он перекликается с блоком услуг, что поддерживает целостность дизайна сайта.
В завершении пользователь попадает в форму обратной связи, где может оставить заявку или перейти в социальные сети, чтобы написать мне или позвонить. Также он может перейти на профильные площадки и ознакомиться с другими моими работами.
Я выполнил проект в чёрно-белой цветовой гамме с добавлением акцентного жёлтого цвета для заголовков и кнопок. Также я проработал шрифтовые пары и в итоге создал нужное настроение проекта, которое отражает моё видение: я умею создавать минималистичные проекты и в то же время готов экспериментировать в своей работе.
Страница отзывов:
На странице отзывы расположены в виде мозаики, чтобы информацию было интересно воспринимать, а сама страница выглядела более выразительно.
Карточка проекта:
Первое, что мы видим на странице, — название проекта, набранное крупным шрифтом, описание и фотографию, занимающую всю ширину контейнера.
На этой странице силовая линия проходит по центру, и весь контент выстроен относительно неё. Благодаря этому взгляд не рассеивается, а информация воспринимается последовательно и целостно.
В конце страницы расположен блок с другими проектами. Если пользователь заинтересуется, он сможет перейти к ним и ознакомиться с дополнительными работами.
Результат
В результате получился современный и функциональный сайт-портфолио с выразительной визуальной концепцией и продуманной структурой. Проект помогает эффективно презентовать мои работы, навыки и подход к дизайну, а потенциальным работодателям и клиентам - быстро ознакомиться с моим опытом, оценить уровень компетенций и связаться со мной.
Сайт используется как основной инструмент для демонстрации проектов, поиска новых заказов и профессионального развития.
Презентация проекта
