Как сделать страницу космос

Космические Темы В Веб-Дизайне И Photoshop

Космический дизайн – довольно модная концепция в последние несколько лет и, скорее всего, таковой останется еще какое-то время. Как используют эту тему веб-мастера и как создать самому космос в Photoshop расскажем ниже.

Как сделать страницу космос

Хитрость проектирования «космического дизайна» (будем его так называть в дальнейшем) в том, чтобы избежать общих клише и ловушек. Но общий темный фон и наличие звёздных россыпей могут изменяться от проекта к проекту. Давайте для начала посмотрим на некоторые примеры космического дизайна и соберем советы, когда же такая тема может хорошо сработать для посетителей, конверсии, маркетинга.

Космические идеалы

Космос – довольно модный элемент в дизайне, особенно после того, как Дисней взялись за «новое старое» развитие франшизы Звездных войн, а очередные части Звездного пути продолжают выходить с завидной регулярностью. О космосе много говорят в новостях, особенно после открытия новой планеты (девятой). Кроме этого во многих других проектах, будь это сайт дизайнерской студии или бизнес-компании, в той или иной мере используются отдельные элементы космической тематики.

Как сделать страницу космос

Как сделать страницу космос

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

Звездное небо

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

Как сделать страницу космос

Анимация

Чтобы темные фоны смотрелись более интересными, не лишним бывает добавить немного анимации. Это привлечет посетителей, заинтересует их. Анимацию можно создать на отдельном слое или в виде параллакса с меньшим содержанием тематического цвета. Обычно дизайны создаются с темным фоном, включая темно-синие, фиолетовые, черные цвета. В качестве контраста применяется белый к тексту или кнопкам для привлечения внимания.

Как сделать страницу космос

Как сделать страницу космос

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

Как сделать страницу космос

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

Подсознание

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

Основное изображение проекта Acerbis напоминает стилизацию и предприятия из Стар Трека. Словно из сцены открытия ангара изображение дает нам представление о том, что нас ожидает на сайте. И на других станицах сайта используются похожие изображения.

Как сделать страницу космос

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

Среди косметических глубин

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

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

Как сделать страницу космос

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

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

Как сделать страницу космос

Как сделать страницу космос

Космос в Photoshop

Не всегда при работе с космическим дизайном уместно использование фотографий космического пространства, созвездий и туманностей. Зачастую, веб-дизайнерам достаточно создать условный вид космоса. Разумеется, что для этого можно найти изображения и арты в интернете, а можно минут за 20-30 нарисовать самому.

Как сделать страницу космос

Как сделать страницу космос

Как сделать страницу космос

Возвращаемся ко второму слою (который мы отключали ранее). Включаем и размываем его по Гауссу на 2 пикселя или чтобы замыленность была более ощутимой. Открываем окно коррекции Уровней и, меняя все также два значения (169 и 1,00 у нас), добиваемся того, чтобы фон был черным, а из точек были только самые яркие. Их, разумеется, будет мало (как впрочем, и в реалии). Теперь размываем их еще раз по Гауссу так, чтобы они чуть-чуть были смазанными, не резкими.

Как сделать страницу космос

Как сделать страницу космос

Как сделать страницу космос

Следующее, что нам нужно, это перейти на вкладку Каналы и выделить наши точки на слое-копии. Внизу панели есть соответствующая иконка, кликаем её и создаем еще один новый слой. Проверим, что цвета установлены у нас по умолчанию (черно-белый) и при активном слое 2 нажимаем Ctrl+Delete. Это зальет наше выделение (точки) белым цветом на новом фоне. Но по факту вы этого не заметите из-за маленького размера точек. Снимаем выделение и открываем Стиль слоя (наложения). Добавляем Внешнее свечение, белое, нормальное. А вот размер и размах подбирайте на свой вкус и цвет.

Как сделать страницу космос

Как сделать страницу космос

Как сделать страницу космос

Как сделать страницу космос

Как сделать страницу космос

Как сделать страницу космос

Небо с туманностями, звездами и скоплениями – готово. Слои можно собрать в группу или объединить на новый слой небо (Ctrl+Shift+Alt+E), и переходим к созданию планеты. Впрочем, можно поработать с космическим кораблем, кометой, или вспышками облаков. Тут уже зависит от вашей фантазии.

Как сделать страницу космос

Как сделать страницу космос

Как сделать страницу космос

Как сделать страницу космос

Создаем новый слой, делаем его активным, но зажимая Ctrl, кликаем по слою с планетой. Таким образом, на новом пустом слое у нас появляется выделение. Заливаем его черным цветом и добавляем слой-маску. Снимаем скрепочку и сдвигаем сам слой чуть ниже. Это позволяет нам создать тень от света на обратной стороне планеты.

Как сделать страницу космос

Как сделать страницу космос

И теперь по отдельности для слоя с планетой, тени и маски применяем эффекты наложения Внешнее свечение, Внутреннее свечение и Размытие по Гауссу. Это нужно для того, чтобы четких краев на изображении не было, а было всё плавным, градиентным.

Как сделать страницу космос

Как сделать страницу космос

Как сделать страницу космос

Можно добавить блик, наложить отдельные облака или вспышки и многое иное. По факту, наше изображение космоса готово.

Как сделать страницу космос

Как сделать страницу космос

Заключение

Мы смогли немного задеть ваше любопытство? Космический дизайн – довольно модная концепция в последние несколько лет и, скорее всего, таковой останется еще какое-то время. С точки зрения же веб-дизайна – это твердая и устоявшаяся концепция с акцентом на большое количество пустого пространства, минимализм и контраст цветов. Это отличная возможность для применения синемаграфов, неона, параллакса, каллиграфии, фотографий и видео. Иными словами, космос – одна из тех идей, которая очаровывает всех посетителей и позволяет достаточно сильно привлечь их внимание к самому сайту или даже контенту.

Источник

Лучшие работы для конкурса #642идеикосмос

Как сделать страницу космос

«Если не можешь улететь в космос, сделай так, чтобы он прилетел к тебе». Автор фото — @al.ex_kv.

Как сделать страницу космос

Автор фото — @kenza_lu

Как сделать страницу космос

Автор фото — @iwanbakari

Как сделать страницу космос

Автор фото — @lytvinenkoyliya_art

Как сделать страницу космос

Автор фото — @oikkka

Как сделать страницу космос

Автор фото — @stany_cosmosom

Как сделать страницу космос

Автор фото — @sharokma

Как сделать страницу космос

Автор фото — @very_shabby

Как сделать страницу космос

Как сделать страницу космос

«And when darkness sleeps beside you, And the morning is far away, I wanna hold your hand and guide you…» Parov Stelar ft. Lilja Bloom — Shine. Автор фото — @julia_owlie.

Как сделать страницу космос

Автор фото — @mishkakosolapa

Кликните на картинку, чтобы проголосовать за одного из четырех финалистов:

Как сделать страницу космос

Пошаговый мастер-класс

Если вы не участвовали в конкурсе, но тоже хотите научиться рисовать космос, сохраните себе куда-нибудь эти пошаговые инструкции, что и как делать, чтобы получилось ярко и красиво.

1. Для того чтобы нарисовать Вселенную, достаточно всего 3-4 цветов. По крайней мере, с такого количества можно начать. Важно: лист для акварели должен быть очень плотным, чтобы он не сморщивался от воды и чтобы краска красиво и равномерно растекалась.

Как сделать страницу космос

2. Контур можно обрисовать твердым простым карандашом, чтобы обозначить пространство, которое вы будете мочить водой. Намочите часть выделенного пространства.

Как сделать страницу космос

3. Нанесите на смоченную область краску. Постарайтесь, чтобы контуры были красивыми.

Как сделать страницу космос

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

Как сделать страницу космос

Как сделать страницу космос

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

Как сделать страницу космос

Как сделать страницу космос

6. Некоторые звезды можно прорисовать тщательнее.

Как сделать страницу космос

Если посыпать соль на невысохший рисунок, то структура космоса получится еще интереснее. Соль впитает часть краски, и стряхнув ее после полного высыхания, на месте соли будут красивые белые точки и облака.

В нашем творческом инстаграме @miftvorchestvo мы регулярно будем проводить конкурсы по блокнотам «642 идеи, что нарисовать», «642 идеи, о чем написать» и «642 идеи, о чем еще написать» (новинка!). Подписывайтесь, чтобы быть в курсе всего творчески-интересного и креативно-веселого.

Источник

Как сделать страницу космос

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

Пошаговый мастер-класс

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

Материалы

Акварель:

Кисти из белки:

Шаг первый. Смешиваем краски

Закрепите акварельную бумагу на деревянной доске малярным скотчем. Смешайте оранжевый со светлым красным кадмием. Должен получиться светло-алый оттенок. Далее смешайте глубокий красный с марганцовой фиолетовой и каплей индиго, чтобы получить вишнево-красный оттенок. Потом добавьте делфте синий к индиго для получения темно-синего. И последняя смесь — прусский, перманентный и темный кобальт зеленый, фталоцианин, чтобы получить средне-зеленый.

Если у вас нет всех этих цветов, задачу можно упростить и рисовать просто теми цветами, которые у вас есть. Итог все равно получится интересным.

Как сделать страницу космос

Шаг второй. Наносим цвета на бумагу

Разместите мольберт под небольшим углом и намочите водой всю бумагу чистой водой кистью-шваброй. Ей же в верхнем левом углу нанесите темно-красный и светло-красные цвета. Правый нижний угол закрасьте синим оттенком. Кисть № 8 нанесите зеленый оттенок по диагонали — из левого нижнего угла в верхний правый угол.

Как сделать страницу космос

Шаг третий. Добавляем детали

Работать нужно достаточно быстро, пока бумага еще влажная. Кистью № 4 усильте некоторые участки и заполнить все пробелы любой краской, какой вам захочется.

Как сделать страницу космос

Старайтесь избегать смешивания дополнительных цветов (например, желтого и фиолетового, красного и зеленого, синего и оранжевого) друг с другом, так как это приведет к мутности цвета.

Шаг четвертый. Усиливаем цвета

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

Как сделать страницу космос

Шаг пятый. В игру включается соль

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

Как сделать страницу космос

Шаг шестой. Добавляем чистые цвета

Мы сделали лишь половину работы! Снова намочите всю поверхность водой и закрепите цвета их чистыми аналогами, используйте для этого кисть № 2. Чтобы получить чистый яркий цвет, добавляйте меньше воды в краску и не смешивать краски на палитре, а берите прямо из контейнера.

Как сделать страницу космос

Шаг седьмой. Затемняем края

Пока бумага еще влажная, смешайте лазурь и черную слоновую кость. Кистью № 4 нанесите краску по краям листа, вокруг границ туманности. Только не наносите краску в виде черной рамки, вспомните как выглядят туманности — в виде вытянутого эллипса. На этом этапе нам пригодится ткань, которую можно использовать для поглощения краски, чтобы смягчить края.

Как сделать страницу космос

Шаг восьмой. Добавляем звезды

Дожидаемся полного высыхания и используем кисть № 2 для финальных штрихов. Чтобы добавить звезды в наш космос, положите мольберт на горизонтальную поверхность. Возьмите в не ведущую руку палочку (или другую кисточку) и держите ее параллельно бумаге. Наберите на кисточку в ведущей руке титановые белила и делайте легкие удары кистью о палочку так, чтобы крошечные белые частицы краски попадали на вашу картину. Добавьте «вручную» несколько звезд тонкой кистью № 0.

Как сделать страницу космос

Дайте рисунку высохнуть, снимите малярную ленту. И вот он, ваш космос!

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *