Нужно было создать сайт для разработчика, который будет местом для показа созданных им проектов (портфолио), рассказывать о нём и давать возможность связаться с ним потенциальному работодателю или заказчику. В тёмной и светлой теме.
Смыслы и решения. По порядку.
Последовательная подача информации. Постепенно вводим в курс дела о чём здесь, чьи услуги (главный экран), далее информация о себе, компетенциях - чтобы HR (специалист по кадрам)/заказчик мог представить кто перед ним, с какими навыками специалист, целями, взглядами. Мог составить какой-то портрет личности. Чуть далее блок с портфолио - возможность показать с какими проектами имел дело. И далее - блок с контактами.
Сделан акцент на блок с портфолио. Оформлен на всю ширину контейнера; сделана анимация у всего блока, а также при наведении на отдельный проект в десктопной версии подсвечивается изображение этого проекта.
Смысл и основная идея выражены через образ пазлов, проносятся через весь сайт и раскрыты в 4-ом блоке, кредо - Каждая строчка кода, как деталь пазла, должна быть на своём месте, чтобы получился ожидаемый результат. Символизируют логичность и системность, что отражает суть работы разработчика.
Динамичная композиция 4-го блока, подводит без задержек)) к просмотру портфолио.
Завлекающий главный экран за счет анимации появления и внутри блока, красок - привлекает и удерживает внимание.
Блок с 10 фактами как элемент игры и приглашение к взаимодействию. А это повышает шансы запомниться и выделиться среди других соискателей. Также этот блок - возможность рассказать о себе, не самую важную информацию в отличие от 2-го блока “Обо мне”, но интересную, которая запомнится и будет выделять среди конкурентов.
Цветовые решения.
Фоновый глубокий тёмно-синий цвет в тёмной теме создает ощущение глубины и технологичности. Идеально подходит для современного сайта разработчика.
Яркие абстракции в пазлах разбавляют сайт, придают живости и делают его в меру ярким в тёмной теме.
Основой светлой темы служат оттенки спокойного синего и голубого, которые создают свежий и легкий визуальный образ.
Такая палитра передает чувство спокойствия и прозрачности, подчеркивая доступность и открытость. Вызывает доверие и говорит о серьёзности и стабильности.
Акцентные ярко-синие кнопки обеспечивают контраст и интуитивную навигацию, привлекая внимание к ключевым элементам интерфейса.
Выбор темы обеспечивает гибкость и универсальность сайта, способствует комфортному восприятию.
Типографика.
Использовала современный шрифт с чистыми, геометричными линиями и мягкими закруглениями. Его сбалансированный и аккуратный вид делает текст легко читаемым, а технический оттенок шрифта отлично перекликается с тематикой веб-разработки.
Геометричность и минимализм подчеркивают профессионализм и точность, что важно для разработчика.
Современный стиль шрифта ассоциируется с технологичностью и инновациями.
Мягкие закругления символизируют доступность и дружелюбие, создавая комфортное восприятие.
Также на главном экране в приветствии используется рукописный шрифт. Такой же как в логотипе. Создаёт ощущение живого общения.
Детали.
Округлые формы используются на всём сайте (в кнопках, пазлах, типографике) и создают располагающую, дружелюбную атмосферу. Символизируют гибкость и открытость.
Для создания аутентичной и профессиональной атмосферы использовала ключевые атрибуты, отсылающие к миру разработки:
- фрагменты кода - в качестве фона и декоративных элементов;
- квадратные скобки (используемые при написании кода) - в меню, заголовках и на кнопке "наверх".
Эти детали поддерживают визуальный стиль, подчеркивают тематику сайта, создают и погружают в атмосферу веб-разработчика.
Пожаловаться
