Уроки Веб и приложения Юрий Лукша 16 апреля 2010

Профессиональный шаблон в стиле Web 2.0

Сложность урока: Сложный

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

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

Вот что у Вас должно получиться в конце

Детали урока:
Программа: Adobe Photoshop
Версия: CS4
Трудность: Средняя
Предполагаемое Время выполнения: приблизительно два часа

Материалы для урока:

Архив

Шаг 1. Для того, чтобы у нас всё было ровно и правильно, мы будем использовать Сетчатую систему 960s (http://960.gs/),
Когда Вы загрузите файлы, откройте "960_grid_24_col.psd".
Мы начнем с того, что создадим слой с фоном из заднего плана, щелчок правой клавишей мыши по фону>Из заднего плана...,
назовите этот слой "bg".

Шаг 2. Так как мы будем использовать направляющие, мы должны активировать функцию отображения Линейки (Ctrl+R) или Просмотр>Линейки.

Шаг 3. Установим границу для области заголовка, нарисуем горизонтальную направляющую: Просмотр>Новая направляющая, Положение: 100.

Шаг 4. Создадим заголовок. Создайте прямоугольное выделение размером 1020х100px. Нажмите Shift+Backspace, для заливки цветом данного выделения (можете выбрать любой цвет).

Примените для этого слоя Стиль слоя>Наложение градиента со следующими настройками:

Назовите этот слой “header_bg”.

Шаг 5. Напишите название Вебсайта, используя следующие настройки:
Гарнитура шрифта: Rockwell
Размер шрифта: 30px
Начертание: Regular
Метод сглаживания: Плавное
Цвет: Цвет не имеет значения, так как будем применять Наложение градиента

Примените к слою с текстом Стиль слоя>Наложение градиента со следующими параметрами:

Выровняем наш заголовок относительно фона: выберете слой с заголовком и слой "header_bg" и нажмите "Выравнивание центров по вертикали".

Шаг 6. Напишите заголовки навигационного меню со следующими настройками:
Гарнитура шрифта: Arial
Размер шрифта: 20px
Начертание: Regular
Метод сглаживания: Плавное
Цвет: #ffffff

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

Примените Стиль слоя>Наложение градиента и Стиль слоя>Обводка

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

Шаг 7. Пришло время создать область для размещения контента. Установите горизонтальную направляющую, на расстоянии 430px от предыдущей.

Создайте выделение размером 1020х430px. и заполните его любым цветом

Примените к этому слою Стиль слоя>Наложение градиента

Теперь давайте создадим эффект глянца! создайте выделение размером 1020х120px, заполните его любым цветом.

Стиль слоя>Наложение градиента

Уменьшим прозрачность этого слоя до 40%.

Шаг 8. Давайте добавим несколько деталей! С помощью Инструмента Прямоугольная область (М) создайте выделение в 1px, разместите его как показано ниже:

Выберите цвет переднего плана #acd86e, нажмите на Shift+Backspace, чтобы заполнить выделение.

У Вас получились замечательные детали.

Мы cоздали второстепенные элементы. Удостоверьтесь, чтобы у них были названия, и объедините их в группу

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

Напишите некоторые приветственные слова используя следующие настройки:
Гарнитура шрифта: Rockwell
Размер шрифта: 40px
Начертание: Regular
Метод сглаживания: Резкое
Цвет: #f4f4f4

Я лично написал: “Вот наша совершенно новая работа. Ой Добро пожаловать!”, но мы должны выделить слово "Welcome!"
Применим Стиль слоя>Наложение градиента со следующими настройками

Теперь расположите две горизонтальных направляющих как показано ниже

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

Шаг 10. Начнём с создания выделения 250х150px (заполните любым цветом), это будет нашей рамкой для изображения

Назовите этот слой "pic_holder" и выровняйте его как показано на изображении выше
Примените Стиль слоя>Обводка

Давайте вставим изображение в наш проект, Файл>Поместить... и выберите изображение. Назовите слой "pic", поместите его выше слоя “pic_holder”. Правый щелчок на слое "pic" Создать Обтравочную Маску.

Шаг 11. Создадим отражение для изображения в рамке, дублируем два слоя "pic" и “pic_holder”.

Дублируем два выбранных слоя, Редактирование>Свободное Транформирование, и ставим "-" перед значением высоты.

Выбрав два продублированных слоя, выполните щелчок правой клавишей по слою и выбираем Преобразовать в смарт-объект; назовите этот слой "shadow". Разместите этот слой ниже всех, как показано ниже.

Выберите слой "shadow" и добавьте слой-маску .

Выберите линейный Градиент (G) от чёрного к белому, проведите с нижнего края до верхнего.

У Вас должно получиться нечто подобное!

Шаг 12. Мы должны добавить описание к нашему изображению. Создайте выделение размером 240х25px, и заполните это выделение: #1a1919. Это будет являться фоном описания.

Напишите некоторое описание с этими параметрами настройки характера:
Гарнитура шрифта: Arial
Размер шрифта: 15px
Начертание: Regular
Метод сглаживания: Нет
Цвет: #82aa48

Удостоверьтесь, что слои расположены так же, как на изображении ниже

Шаг 13. Вставьте ещё одно изображение и примените к нему тот же стиль, что и к предыдущему изображению (Скопировать стиль слоя>Вклеить стиль слоя) и выровняйте его по правой стороне.

Центральное изображение сделаем немного крупнее, так что сделайте выделение размером 340х200px, выровняйте его как показано ниже, и залейте его любым цветом.

Применим к нему Стиль слоя>Обводка, применив следующие настройки:

Вот что должно получиться!

Удостоверьтесь, что Ваши слои сгруппированы. Я лично создал три отдельные группы (Для первого, второго и третьего изображения соответственно). Вот что получилось у меня.

Шаг 14. Давайте создадим кнопку «пролистывания»! Начнём с того, что создадим эллипс размером 50х50px, используя Инструмент Овальная область (M), и заполните его любым цветом.

Добавим Стиль слоя, как показано ниже.

Используя Инструмент Произвольная фигура (U), создайте стрелку, применив к слою следующие настройки:

Должно получиться что-то подобное:

Не забудьте про выравнивание по направляющим.

Сделайте копию кнопки и перенесите её на правую сторону.

Шаг 15. Давайте возьмёмся за основную область. Для начала создадим выделение размером 1020х815px

Выберите в палитре цветов #e8e8e8 и нажмите Shift+Backspace.

Используя Инструмент Область (горизонтальная строка), создайте выделение в 1рх, разместите его как показано на изображении и залейте его белым цветом (#ffffff).

У Вас должна получиться прекрасная окантовка!

Шаг 16. Мы должны установить верхние границы в нашей области для контента. Поэтому установим горизонтальную направляющую с положением 50px.
Загрузите набор иконок:  Basic Set – Pixel Mixer и после загрузки разместите, как показано на изображении.

Расположите новую горизонтальную направляющую на расстоянии 20px. Создайте заголовок для изображения, используя следующие настройки:
Гарнитура шрифта: Rockwell
Размер шрифта: 29px
Начертание: Regular
Метод сглаживания: Нет
Цвет: #81aa48

Создайте ещё две направляющие.

Напишите текст с параметрами:
Гарнитура шрифта: Arial
Размер шрифта: 15px
Начертание: Regular
Метод сглаживания: Нет
Цвет: #2f3235

Создайте ещё 3 горизонтальных направляющих.

Шаг 17. Пришло время создать кнопку “read more”. С помощью Инструмента Прямоугольник со скругленными углами (U) создайте прямоугольник размером 100х30px и радиусом закругления в 5px. Заполните его любым цветом.

Применим к слою Стиль слоя.

С помощью Инструмента Эллипс (U) создайте фигуру размером 15х15px и заполните её цветом:  #4d4d4d. Для вертикального выравнивая воспользуемся функцией Выравнивание центров по вертикали, для этого выберите слой с прямоугольником и кругом.

Наберите знак “+”, закрасьте его белым цветом (#ffffff) и разместите его как показано ниже.

Напишите “read more” со следующими параметрами настройки:
Гарнитура шрифта: Tahoma
Размер шрифта: 12px
Начертание: Regular
Метод сглаживания: Нет
Цвет: #ffffff

Примените к тексту Стиль слоя>Тень.

Шаг 18. Чтобы создать вертикальную линию раздела, будем использовать Инструмент Линия (U). Создадим две вертикальных линии рядом друг с другом, заполним
их цветами соответственно: #ffffff - #b3b3b3.

Выровняйте линии как показано ниже.

Не забывайте про структуру организации своих слоёв.

Шаг 19. Сделайте три копии того, что мы создали в предыдущих двух шагах. Вот что должно получиться!

Шаг 20. Давайте создадим разделитель. Расположите новую горизонтальную направляющую на расстоянии 50px от края созданной кнопки "read more".

Инструмент Овальная область (М)

Выберите цвет переднего плана черный (#000000), нажмите Shift+Backspace. Назовите этот слой “separator_bg”.

Сделаем это изображение размытым. Фильтр>Размытие>Размытие по Гауссу с радиусом 3px.

Выбрав слой “separator_bg” сделайте прямоугольное выделение, как показано ниже и удалите лишнее.

Добавим слой-маску к слою с разделителем. Инструмент Градиент (G) - чёрный-белый-чёрный

Протяните линейным градиентом от правого до левого конца разделителя.

Уменьшите прозрачность слоя до 50%.

С помощью Инструмента Линия (U), создайте две горизонтальные линии, разместите их рядом друг с другом, выше разделителя (“separator_bg”).
Заполните их цветами #b3b3b3 - #ffffff соответственно и добавьте такую же маску слоя как и к слою с разделителем.

Шаг 21. Начнём работать с нижней частью, расположим горизонтальную направляющую на расстоянии 50px от нашего разделителя.

Добавьте заголовок с этими параметрами:
Гарнитура шрифта: Rockwell
Размер шрифта: 30px
Начертание: Regular
Метод сглаживания: Плавное
Цвет: #81aa48

Расположите две направляющие так, как показано на изображении ниже:

Напишите текст с этими параметрами:
Гарнитура шрифта: Arial
Размер шрифта: 14px
Начертание: Regular
Метод сглаживания: Нет
Цвет: #505150

Расположите ещё одну направляющую на расстоянии 160рх

Шаг 22. Напишите другой заголовок и текст к нему, используя те же самые параметры, которые мы использовали в предыдущем шаге.

Напечатайте кавычку, используя следующие параметры шрифта:
Гарнитура шрифта: Arial
Размер шрифта: 200px
Начертание: Regular
Метод сглаживания: Плавное
Цвет: #505150

Уменьшите прозрачность слоя до 50%

Напишите слова мудрых или своё высказывание, используя следующие настройки:
Гарнитура шрифта: Arial
Размер шрифта: 14px
Начертание: Курсив
Метод сглаживания: Плавное
Цвет: #81aa48

Шаг 23. Создадим вертикальную полосу-разделитель: создайте две вертикальных линии друг рядом с другом, и закрасьте их следующими цветами: #ffffff - #b3b3b3.

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

Шаг 24. Напишите еще одно название так же как и слева (например я написал “Our Team”).

Используя Инструмент Прямоугольник (U) создайте прямоугольник 90х90px, и заполняют его любым цветом. Назовите этот слой “photo1_holder”. Это будет рамка для фотографии участника команды. Примените Стиль слоя>Обводка. Используйте следующие настройки стиля.

Поместите фотографию участника и назовите слой «photo1». Удостоверьтесь, что слой “photo1" находиться выше слоя “photo1_holder”. Щелчок правой клавишей на слое “photo1" - Создать обтравочную маску. Вы должны что-то подобное!

Шаг 25. Напишите текст об участнике, используя следующие параметры:
Гарнитура шрифта: Arial
Размер шрифта: 14px
Начертание: Regular
Метод сглаживания: Плавное
Цвет: #7ba344

Мы создадим иконку социальной группы самостоятельно! давайте начнем, напишем  символ “t” со следующими параметрами шрифта:
Гарнитура шрифта: Pico-черный
Размер шрифта: 30px
Начертание: Regular
Метод сглаживания: Плавное
Цвет: #2fcfff

Примените Стиль слоя>Обводка

Напечатайте "in":
Гарнитура шрифта: Myriad Pro
Размер шрифта: 30px
Начертание: Жирный
Метод сглаживания: Плавное
Цвет: #0081ac

Напечатайте “f”:
Гарнитура шрифта: Klavika
Размер шрифта: 30px
Начертание: Жирный
Метод сглаживания: Плавное
Цвет: #395796

Шаг 26. Создайте копию фотографии участника. Выберите слой с фотографией. Слой>Новый Корректирующий Слой>Черно-белый.
Удостоверьтесь, чтобы стояла метка “Использовать Предыдущий Слой для создания обтравочной маски".

Напечатайте такой же текст, (иконка социальной группы), используя те же самые параметры для текста, но изменив цвет: #505150.

Таким образом, фото и текст будут выглядеть чёрно-белым! Сделайте ещё две копии чёрно-белого изображения и серого текста, разместите их так же, как показано ниже:

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

Вот что вышло у меня!

Шаг 27. Прежде, чем мы приступим к работе с областью основного контента, мы установим ещё несколько границ. Создадим ещё пару горизонтальных направляющих. Смотрите на изображение.

Сделайте выделение размером 940х70px, произведите его выравнивание, как показано ниже.

Залейте выделение любым цветом и примените Стиль слоя>Наложение градиента, параметры наложения градиента представлены ниже.

Создайте прямоугольник размером 70х45px. Расположите его и примените Стиль слоя так, как показано на изображении. Назовите этот слой “tw_bg”

Скройте слой “tw_bg”, чтобы он не мешал Вам работать. Создайте ещё один прямоугольник 10х43px. Далее пройдите Редактирование>Трансформирование>Наклон. Выставьте следующие параметры:
X: 40px
Y: 1253px
V:-39

Назовите этот слой "effect" и сделайте слой “tw_bg” видимым.

Скопируйте стиль слоя "tw_bg" и примените его к слою "effect"

Напишите “t” со следующими параметрами шрифта:
Гарнитура шрифта: Pico-Black
Размер шрифта: 35px
Начертание: Regular
Метод сглаживания: Плавное
Цвет: не будет иметь значения, мы собираемся применять Стиль слоя>Наложение градиента

Параметры наложение градиента

Шаг 28. Повторите шаг 20, чтобы создать разделитель или скопируйте его. Поместите его как показано ниже:

Мы должны сделать так, чтобы наш прямоугольник был неправильной формы. Чтобы сделать это, выбираем слой “tw_bg” и добавляем маску. Выделите ту часть прямоугольника которую нужно удалить, выберите цвет переднего плана черному (#000000),
нажмите Shift+Backspace, чтобы заполнить выделение.

Шаг 29. Напишите какой-нибудь текст, который является поясняющим с этими параметрами шрифта:
Гарнитура шрифта: Arial
Размер шрифта: 15px
Начертание: Regular
Метод сглаживания: Плавное
Цвет: #222222

Чтобы текст располагался ровно по отношению к слою с зелённым фоном, нажмите Выравнивание центров по вертикали

Шаг 30. Повторите шаг 27, чтобы создать что-то подобное тому, что изображено ниже. Также создайте прямоугольник, заполните его цветом #334814 и уменьшите прозрачность слоя до 40 %.

К прямоугольнику побольше примените Стиль слоя с нижеприведёнными параметрами:

Теперь заполните наклонённый прямоугольник более темным цветом: #2a6788.

Напишите “t”:
Гарнитура шрифта: Pico-Black
Размер шрифта: 35px
Начертание: Regular
Метод сглаживания: Плавное
Цвет: #2fcfff

Примените Стиль слоя>Обводка:

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

Сделайте копию слоя прямоугольника с буквой "t" и измените цвет перекрытия градиентом на #0080ab, а вот этим цветом #00526d залейте наклонённый прямоугольник.

Напишите слово "in" с этими параметрами:
Гарнитура шрифта: Myriad Pro
Размер шрифта: 35px
Начертание: Жирный
Метод сглаживания: Плавное
Цвет: белый (#ffffff)

Создайте третью копию слоя прямоугольника, измените Наложение градиента (для большого прямоугольника): #395796, и #263e6f для наклонённого.

Напишите “f” с таким параметрами шрифта:
Гарнитура шрифта: Klavika
Размер шрифта: 35px
Начертание: Жирный
Метод сглаживания: Плавное
Цвет: белый (#ffffff)

Сделаем последнюю копию. Цвет для градиента большого прямоугольника #e8e8e8, для наклонённого: #cdcdcd.

Напишите слову "fr" с этими параметрами:
Гарнитура шрифта: Frutiger Black
Размер шрифта: 35px
Начертание: Жирный
Метод сглаживания: Плавное
Цвет: f: #0079d2 - r: #ff3093

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

Шаг 32. Создайте выделение размером 1020х460px и заполните его любым цветом (пока).

Примените к этому слою Стиль слоя>Наложение градиента, используя следующие настройки:

У вас должно получиться что-то похожее на это:

С помощью Инструмента Область (горизонтальная строка) создайте выделение высотой в 1рх и залейте его белым цветом (#ffffff).

Шаг 33. Создайте две направляющих, как на изображении ниже:

Напишите заголовок с этими параметрами шрифта:
Гарнитура шрифта: Rockwell
Размер шрифта: 30px
Начертание: Regular
Метод сглаживания: Чёткое
Цвет: #7ea547

Напишите подзаголовок с этими параметрами шрифта:
Гарнитура шрифта: Arial
Размер шрифта: 15px
Начертание: Regular
Метод сглаживания: Нет
Цвет: #d3d3d3

Используя Инструмент Линия (U) создайте две горизонтальных линии рядом друг с другом, и залейте их этими цветами соответственно: #151515 - #2f2f2f.

Расположите их как показано ниже!

Шаг 34. Создайте две направляющих, как на изображении ниже:

С помощью Инструмента Прямоугольник со скругленными углами (U), создайте два прямоугольника 210х25px, радиус скругления углов - 5рх, залейте цветом - #141313,
Стиль слоя>Внутренняя тень:

Напишите любой текст в этих двух прямоугольниках:
Гарнитура шрифта: Arial
Размер шрифта: 15px
Начертание: Regular
Метод сглаживания: Нет
Цвет: #7ea547

Создайте другой прямоугольник так же как выше, но на сей раз, его высота будет: 110pх. Также напишите текст в нём с теми же самыми параметрами шрифта. Сделайте копию кнопки, которую мы создали в шаге 17. Выровняйте его как показано на изображении.

Шаг 35. Напишите ещё один заголовок, разместите его правее.

Примените фантазию и напишите какой-нибудь текст под заголовком.

Сделайте две копии слоёв с текстом.

Шаг 36. Повторите предыдущие шаги, заполните всю правую сторону контентом.

Теперь Ваша нижняя часть должна выглядеть следующим образом:

Шаг 37. И вот, мы почти закончили. Создадим ещё одну направляющую на расстоянии 50рх от края кнопки.

Создайте две горизонтальные линии и закрасьте их соответственно: #181818 - #2f2f2f.

Напишите текст подтверждающий авторское право:
Гарнитура шрифта: Arial
Размер шрифта: 15px
Начертание: Regular
Метод сглаживания: Нет
Цвет: белый (#ffffff) - #82aa48

Используя те же свойства шрифта, напишите текст навигации:

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

Заключение.
Вот и всё! Мы создали профессионально выглядящий шаблон в стиле web 2.0. Вы можете видеть, что приёмы, используемые здесь, просты, но они приводят к хорошим результатам.

Автор: Mahmoud

Источник: design.tutsplus.com

Комментарии 160

Спасибо за интересный и подробный урок :hugging-face:

Спасибо. Расписано всё детально, но времени много заняло...

очень детальный урок. спасибо

Спасибо за урок, по нему решила немного пофантазировать

Благодарю за урок! Все подробно и понятно :)

Огромная благодарность за перевод подробного детального урока. Юрий, спасибо :)

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

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

Сложный, но классный урок, спасибо

спасибо! полезный урок.

Как создать тень? Сказано поместить слой "shadow" ниже но ничего не меняется

где искать набор иконок: Basic Set – Pixel Mixer??

Ребята, убил я на этот урок 5 часов с перерывами, но оно того стоило, научился разным приемам, поработал с направляющими. В общем урок понравился. Спасибо за перевод!

При сжатии теряется качество.Урок высшего уровня.Огромное спасибо.За пару дней справилась.Наконец разобралась с разметкой и направляющими,прежде было тяжело понять,что к чему.Спасибо вам за перевод!Хочется больше уроков по вэб-дизайну!

Хороший урок!

Спасибо за урок!

Тяжелый урок! неужели я его доделал)

Спасибо за урок! Очень много полезного. Страничка очень понравилась иначе бы и не доделала до конца

Мне очень понравился урок.
Но ^^' вставлю свои пять копеек :)
Шаг 10 подраздел : "Давайте вставим изображение в наш проект, Файл>Поместить... и выберите изображение. Назовите слой "pic", поместите его выше слоя “pic_holder”. Правый щелчок на слое "pic" Создать Обтравочную Маску."
+ Удобнее прикреплять картинку Alt+click (картинка должна быть выделена и выше слоя, к которому прикрепляешь).
+ И ещё копировать стиль слоя зажав Alt удобнее.

Дааа, это очень классный урок! 4 вечера и все получилось! Много полезных мелочей, автору большое спасибо!

спасибо. Много чему есть поучиться.

Тяжелый урок, но открывает много техник, спасибо!

Спасибо! Очень хорошая практика к применению.

Отличный урок! Спасибо!

Дошла до шага 15 (Шаг 15. Давайте возьмёмся за основную область. Для начала создадим выделение размером 1020х815px) и работа остановилась!
Оказалось у меня не хватает места, у меня получился документ размером 1020на1020. Т.к. в шаге№1 написано загрузить и открыть файл 960_grid_24_col.psd, а этот файл имеет размеры как раз 1020 на 1020. Здесь же я и рисровала макет и в итоге документ мал.
Не совсемпонятен Шаг №1( "Мы начнем с того, что создадим слой с фоном из заднего плана, щелчок правой клавишей мыши по фону>Из заднего плана...,
назовите этот слой "bg".)
Какой слой из заднего плана? Тем более у меня нет такого меню "Из заднего плана"...Непонятно!

Администратор
Вопросы по уроку задавайте на форуме. Внизу урока есть ссылка "Задать вопрос на форуме"

Еще 30
Добавить комментарий / работу

Новые работы пользователей

По заданным фильтрам работы не найдены

Попробуйте изменить критерий поиска или сбросить фильтры


Смотреть все работы

Предыдущая Следующая
Добавлена {{work.date}}
Не удалось загрузить работу. Возможно она была удалена.
GIF {{work.bite}} Мб Загрузить
Редактировать Удалить
18+
Работа имеет содержимое для 18+ лет
{{work.views}} {{work.comments}}
Жалоба

Комментарии {{work.childs.length || 0}}

Видео к работе
Популярные работы автора:
Работа получила награды:
Курсы автора:
Онлайн-курс

Жалоба

Опишите суть жалобы, при необходимости добавьте ссылки на скриншоты

Спасибо! Ваше обращение ушло на рассмотрение.

Название работы

Описание работы (необязательно)

Комментарий

Ваша миниатюра:

Название:
{{name}}
Описание:

Исходник:

{{source.name}} {{source.name}}

Тэги:
#{{tag.label}}

Есть ли у вас исходник к работе?

Исходник — это файл из исходных изображений, которые использовались для создания вашей работы. Исходник позовляет лучше понять вашу работу. Он не обязателен, но работы с исходниками получают больше лайков и имеют право на участие в еженедельных конкурсах.
jpg-файл, максимальный размер 1920x1080px

Пример исходника

Выберете тэги работы:

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

Не более десяти тэгов на одну работу

Комментарии к работе будут отключены, на их месте будет выведена реклама.

После добавления работы:


Запланировать публикацию

Отменить планирование
Запланировать

Используя данный сайт, вы даёте согласие на использование файлов cookie, данных об IP-адрес, помогающих нам сделать его удобнее для вас. Подробнее