Как создавать отмеченные наградами веб-сайты, не написав ни единой строчки кода

Привет, меня зовут Артем, я дизайнер. В начале своей карьеры я погрузился в графический дизайн, постепенно тяготея к веб-дизайну, пока несколько лет назад я не понял, что мне больше всего нравится создавать продукты (продуктовый дизайн). Тем не менее, я не забросил веб-дизайн, и он остается моим любимым хобби. Сегодня я главный дизайнер крипто-стартапа, судья The FWA и обладатель 27 веб-наград. В этой статье я хочу поделиться своим опытом создания проектов без кода и получением различных наград за дизайн.

В 2017 году мы с моим лучшим другом основали дизайн-студию, целью которой было создание имиджевых веб-сайтов для компаний, которые осознают необходимость творческих решений. Первым нашим клиентом было медиаагентство из Санкт-Петербурга Chameleon Media. Как наши друзья, они не ставили никаких ограничений, и у нас была полная свобода действий. Другой наш партнер и главный разработчик позаботился о WebGL, и мы предоставили продукт, который по-прежнему конкурентоспособен сегодня и соответствует тенденциям лучших работ FWA. Именно тогда сайт принес нам наши первые награды от CSS Design Awards, Awwwards и т.д. Но это был проект с полным кодом.

На сегодняшний день я занимаюсь функциональным дизайном, изучаю взаимодействие человека с блокчейном и концентрируюсь на теории дизайна (вы можете прочитать мою статью о проблемах в дизайне на рынке криптовалют), поэтому в качестве отдушины мне хотелось создавать креативные, яркие и фестивальные истории. Но мне нужен был опытный разработчик с обширными знаниями языков программирования и 3D. Именно тогда, просматривая Awwwards, я наткнулся на сайты собранные в конструкторе ReadyMag без кода и/или с небольшими дополнениями кода.

Что выделяло ReadyMag среди других продуктов (Webflow, Squarespace, Tilda и др.), так это его сверхпростой и функциональный дизайн. Чувствуется Apple-ский подход к дизайну продуктов, который поначалу кажется странным, но по мере того, как к нему привыкаешь, понимаешь, что это правильный путь. Я влюбился в RM; он раскрыл мой потенциал, потому что теперь мне не нужен был разработчик, чтобы воплотить мои идеи в жизнь

Мне нравится рассказывать истории с раннего возраста. В 14 лет я серьезно увлекался режиссурой, потому что верил (и верю), что изобразительное искусство, и особенно кинематограф, - самые изящные способы рассказывать истории, изобретенные человечеством. Между прочим, я считаю, что Кристофер Нолан отлично использует всю механику кино и рассказывает поистине замечательные истории лучше, чем кто-либо другой. По мере того, как я рос, я все больше открывал в себе политические амбиции, тягу к справедливости. Кроме того, с появлением Интернета появились новые способы повествования. Именно сочетание этих факторов побудило меня написать этот пост.

Я выделил несколько основных тем, о которых я собираюсь рассказать при создании веб-лонг-ридов на ReadyMag. Один из них - дань уважения моей Родине, Армении. Я родился там, но вскоре после этого моя семья переехала в Россию, и моему знакомству с моей родной страной суждено было случиться спустя годы. Я действительно влюбился в Армению, ее тысячелетнюю историю, великие открытия и драматические шрамы. В какой-то момент, навещая своих родных в Ереване, я обнаружил, что в истории такой маленькой страны было множество великих событий и личностей, которые изменили мир в самом прямом смысле слова: всемирно известные художники Айвазовский, Саят Нова, Македонская Династия, ученые, которые изобрели МРТ, банкомат, цветное телевидение, сделали доллар США зеленым и многое другое. Это поразило меня, и я хотел рассказать об этом.

Посмотреть: https://100.greatarmenia.org

Этот некоммерческий культурный проект изначально я просто разместил на Behance. Но работа собрала огромное количество просмотров, наград от Behance и вообще наделала много шума. Через некоторое время я подумал: «Почему бы мне не разработать этот сайт?» И все стало на свои места.

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

На сайте используется довольно нестандартная навигация: горизонтальная прокрутка заменена вертикальной - и наоборот. Как и в музее, посетители идут не только вперед или в сторону. Я хотел совместить на сайте эти две модальности, чтобы люди не уставали от ритма.

Эта работа принесла мне много наград, включая CSS Design Awards, Awwwards, достижения от Behance и т.д. Она получила огромный отклик от многих людей, и я понял, что нахожусь на правильном пути, чтобы взяться за следующий проект.

Примерно в начале апреля, незадолго до 106-й годовщины самого трагичного этапа в истории армянского народа и одного из самых ужасных эпизодов в мировой истории - Геноцида армян, учиненного Османской империей (ныне Турция), я начал думать о освещении этой невероятно сложной темы. На самом деле, я размышлял, стоит ли мне вообще заниматься этой темой, поскольку задача заключалась в том, чтобы осветить острую и сложную историю.

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

Геноцид армян - это массовое убийство детей, женщин и пожилых армян, веками живших на территории Османской империи (позднее оккупированной кочевыми тюркскими народами) со времен Древнего Рима и Византии, устроенное тремя правителями, которые позже понесли наказание. Геноцид происходил поэтапно с 1878 по 1939 год, пик которого приходится на 1915–1919 гг., и унес жизни более 2 миллионов человек. Этот факт, задокументированный во всем мире, подписанный президентом Рузвельтом, признанный всем миром, до сих пор отрицается Турцией.

Посмотреть: https://genocide.greatarmenia.org/

Навигация по сайту аналогичная предыдущему проекту: комбинация горизонтального скролла с вертикальным, а большой текст с изображениями создает ощущение пристуствия и завлекающего повествования.

Принимая ограничения и возможности ReadyMag можно создавать поистине интересные анимационные решения, например с текстовыми словами, их движениями и энтропией.

Результат принес мне первый в карьере The FWA, все категории наград от Awwwards, CSS Design Awards и публикации/интервью в профильных журналах и др.

Кроме того, я веду канал в тг: t.me/designindex, где пишу о дизайне, вебе и продуктах. Я также веду там серию подкастов с моими друзьями, которые являются экспертами в отрасли. В первом выпуске мы говорили с Оксаной Скрипкой, креативным директором из Нью-Йорка, о переезде, работе в американском агенстве и многом другом. Также, я буду рад видеть вас в моем instagram.

Отдельная благодарность моему другу, автору лучшей платформы о Биткоине — Tony B, за перевод и редактуру.

Если хотите поддержать, поставьте лайк, для вас мелочь, а мне приятно ❤