Фотограф Анна Черкесова

Дизайн сайтов
105 просмотров
29.10.2020
1920×11629910 КБ
Case_Cherkesova-min.jpg

История о моем первом fullstack-проекте /// веб-сайт под ключ 🥰 Знакомство с миром веб-дизайна и разработки сайтов не на шутку увлекло меня. Начиная выполнять заказы по дизайну сайтов мне захотелось развиваться дальше и воплощать свои работы в код и запускать полноценные сайты. Тем более, что на рынке сейчас больше ценятся дизайнеры, которые умеют кодить. Для тренировки и проверки своих навыков решил воплотить проект для виртуального заказчика - фотографа. Составил техническое задание, собрал примеры и начал творить дизайн в Figma. С дизайном проблем было меньше всего, так как мы с моим “заказчиком” 😄 без особых прений утвердили концепт: сайт должен был быть в темных цветах, акцент должен быть сделан на удобной презентации работ фотографа, типографика должна быть простой, но легко-читаемой. На сайте обязательно должны быть секции портфолио и тарифов на услуги фотосессий, а также форма обратной связи. Набросав мудборд и прототип, я перешел непосредственно к отрисовке дизайна для компьютерной, планшетной и мобильной версии. После того, как дизайн был готов, его нужно было сверстать. Для этого можно было использовать простые решения, например, Тильду. Но я решил пойти сложным путем, тем более проект тренировочный. Итак, что же я использовал для написания кода сайта. 💥 Редактор кода Microsoft Visual Studio Code с кучей полезных плагинов 💪 HTML с препроцессором Pug для разметки сайта 💣️ CSS c препроцессором SCSS для стилизации сайта 😎 Нативный JavaScript ES6 для интерактива на сайте 👏 Сборщик проекта Webpack 😻 Git и Github для работы с версиями проекта 💯 Систему управления контентом Wordpress C написанием HTML/CSS особых сложностей не было. Это простые языки, которые при желании и мотивации может освоить каждый. Больше всего времени ушло на написание JS-слайдера фотографий из портфолио. В этом случае можно было воспользоваться готовыми решениями, но я решил написать свой вариант. Немного усилий и запросов в Google и все работает!!! Финальным этапом была установка сайта на CMS Wordpress, а потом запуск на хостинге. В итоге заказчик получил быстрый сайт с полностью редактируемой информацией и возможностью добавлять новые работы в портфолио.
CSSFigmaGitHTMLJavaScriptSCSSTildaWordPress