Дизайн как есть

Стильная шапка для сайта, веб-дизайн

dizajn — Fri, 06 Mar 2009 22:13:49 GMT

Шаг 1.
Создайте документ размерами 1000x750. Двойной клик на слой, Color Overlay > Ставим темно-коричневый цвет.

Шаг 2.
Включите линейки (View>Rulers). на своем документе и добавьте линии как показано ниже.
Поставьте 2 горизонтальные линии, первая на 30px от верха, вторая на 250px от верха. И две вертикальные, первая на 100px слева направо, вторая на 900px слева направо.

Шаг 3.
Создайте прямоугольник с помощью , пользуйтесь линиями для ориентира. Переименуйте слой в "header".

Шаг 4.
Поставьте черный цвет как основной. Возьмите и создайте форму похожую на форму на скрине, чтобы сделать тень. Сделайте её немного больше чем прямоугольник, смотрим рисунок. Переименуйте слой в "shadow" и поставьте его под слой "header".
После всего этого, сконвертируйте форму в Smart Filters и примените на нее Gaussian Blur. Непрозрачность 60%.

Шаг 5.
Откройте стили слоя "header". Нажмите на вкладку Gradient Overlay. Измените стиль градиента на radial. А для цвета я использовал темно-красные тона.

Шаг 6.
Возьмите и используя более светлый цвет, чем в градиенте, создайте линию. После этого создайте ещё одну линию над ней, только черного цвета. Выделите 2 линии на панели слоев и сгруппируйтесь их. Переименуйте группу в "vDivider".
Идем Layer>Layer Mask>Reveal All. Используя , черно белый, на панели сверху стиль ставим на Radial и применяем маску на группу. Градиент ложим с уклоном от центра группы.

Шаг 7.
Создаем меню с помощью . Цвет белый. Все надписи группируем и называем группу "White Links".
Создайте дубликат этой группы и переместите его под оригинальную группу. Измените цвет дубликата на черный (весь текст должен быть черным) и переместите группу на 1 пиксель в верх и влево. Это придаст красивый 3д эффект тексту.

Шаг 8.
Повторите Шаг 6, только создайте вертикальные разделители для надписей на меню. Используя , сначала нарисуйте темно-красную линию, потом справа от нее, черную. Сгруппируйте их и сделайте дубликат группы столько раз, сколько вам нужно для меню. У меня в меню 4 слова, я сделал 4 дубликата + оригинал. Разместите ваши линии на одинаковом расстоянии друг от друга, смотрим скрин:

Шаг 9.
Выделите все группы с линиями и сгруппируйте их в 1 группу, назовите её "hDividers". После этого примените маску на эту группу, Layer>Layer Mask>Reveal All. И сделайте маску как на скрине:

Шаг 10.
Откройте файл с узором, который дан ниже. Edit>Define Pattern. Назовите его "webPattern". Создайте дубликат слоя "header" и переименуйте его в "pattern". Откройте стили слоя, и уберите галочку с Gradient Overlay, поставьте на Pattern Overlay. Выберите "webPattern" и поставьте режим наложения на Overlay.
После этого примените маску на него с радиальным градиентом.

Шаг 11.
Теперь остается добавить нужный вам логотип.
Пишем текст, я написал PSDTUTS, и сделал PSD жирным шрифтом, а TUTS тонким.
Далее пройдите в стили слоя и измените параметры Drop Shadow, Gradient Overlay, and Stroke. После этого у вас будет прекрасный текстовый эффект.

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

demiart

Lorelei

Уроки Photoshop: 6 быстрых текстовых эффектов

dizajn — Thu, 19 Feb 2009 21:31:38 GMT

Быстрый золотой текст /Quick Gold Text.

Есть много способов сделать "золотой текст". Данный текст использует два стиля слоя, которые применены к одному и тому же слову, только нижний слой немного смещен на несколько пикселов вниз.
Здесь я использовал шрифт Trajan.

Верхний слой создан при помощи bevel, gradient overlay и т.д. (параметры на скрине). Также была добавлена небольша тень, для того, чтобы оттенять данный слой от нижнего.

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

Металлический 3d текст/3d Metallic Text

Этот эффект лишь разновидность. Как вы можете видеть ниже, мы снова использовали два слоя с одинаковым текстом , где на каждом был применен свой набор эффектов.

Здесь я использовал эффект Gloss Contour на примененном стиле bevel&emboss. Всюду мы использовали оттенки желтого для создания теней, в данном случае это был серый цвет.

Эксперименты с текстом:
Также я попробовал применить к тексту искривление. Это можно сделать, щелкнув по текстовому слою, выбрав инструмент Horizontal Type Tool (T), а затем кликнув по иконке, показанной на скрине.В выпадающем диалоговом окне выбрать Warp.

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

Двойной текст/DoubleType

Этот эффект очень прост и основан только на том, что к одной части текста применяются стили , а к другой нет.
Здесь я использовал шрифт Futura.
Я уверен, что вы видели такой эффект на кинопостерах. Я использовал красный цвет, но вы можете использовать любое сочетание цветов.
Чтобы сделать подобный текстовый эффект, мы будем использовать только стили - Outer Stroke и Gradient Overlay:
1. Итак, добавим обводку (Outer Stroke) в 1px Outer Stroke и используем градиент вместо цвета. Я использовал один из готовых металлических градиентов Фотошопа (смотрите настройки для эффекта "thin metal" ниже). Это добавит краям текста блеска.
2. Затем добавляем чёрно-белый градиент (Gradient Overlay), поменяем режим наложения на Overlay и прозрачность уменьшим до 50%. И теперь, когда вы будете менять цвет текста, то он будет корректироваться автоматически .

ГиперЦвет/HyperColor

Этот эффект я нашёл на сайте Chris Garrett Media. Это действительно очень простой эффект. Наберите любой текст (например, шрифтом DIN ), добавьте Gradient Overlay. В Фотошопе есть наборы очень красивых градиентов Color Harmony, которые вы можете добавить и использовать, нажав маленькую стрелочку справа в диалоговом Gradient Editor. Примените один из этих градиентов на тексте белого цвета и уменьшите прозрачность до 59% (фон должен быть тёмным).

Тонкий металл/Thin Metal

Это простейший способ сделать металлический текст. Основан он на том факте, что когда мы видим металл в реальной жизни, он имеет обычно множество бликов и теней, особенно блестящий хромированный металл. Таким образом, используя две копии одного градиента под разными углами, вы можете легко сделать текстовый металлический эффект.
Лучше всего этот эффект подходит для тонких шрифтов, в ином случае текст будет смотреться скучно и плоско (если только мы не добавим ещё стилей, но тогда это не будет на столько супербыстро!)

Итак, во-первых, я решил сделать текст "стоящим на поверхности". Теперь создаём новый слой и рисуем маленькие кружочки под ножкой каждой буквы, затем применяем фильтр Filters > Blur > Gaussian Blur = 2 px. Теперь жмём CTRL+T и сплющиваем кружочки. Уменьшаем прозрачность до 30%.
Для теней от таких букв, как 'a' и 'e', используйте transform tool и растяните кружочки по горизонтали.
В конце я дублировал один из кружочков-теней и растянул вдоль всего слова, так чтобы эта тень проходила под всем текстом.
Поэкспериментируйте и у вас получатся очень реалистичные тени под текстом.

Таким образом, наш текст - это сочетание двух стилей - Gradient Overlay и Stroke = 1px с использованием того же градиента. Градиент, который мы использовали (такой же как в эффекте Double Type ранее), это стандартный металлический градиент в ФШ. Вы можете его добавить, нажав маленькую стрелочку справа в диалоговом Gradient Editor и выбрав Metals.
Весь секрет этого эффекта заключается в том, что углы наложения градиента и обводки должны быть разными. Это создаёт красивые блики на тексте.
Кроме того я уменьшил прозрачность основного градиента до 14% для более плавного перехода, но этот шаг необязателен.

Фантастический пластик/Plastic Fantastic

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

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

Верхний слой изменил стиль слоя Bevel & Emboss. Ниже вы можете видеть настройки, в том числе и для градиентного контура.

demiart

Collis (Перевод: Nadik)

Стикер в стиле Web 2.0 - Урок создания

dizajn — Thu, 19 Feb 2009 21:27:07 GMT

Уроки Photoshop: Стикер в стиле Web 2.0

Ну так вот, смотрим как делаются стикеры

Шаг 1

Для начала, создадим документ psd
File-New
Можете залить фон градиентной заливкой #53676b - #405053
Создаем новый слой
Нажимаем на кнопку U и выбираем ellispe tool
Удерживая кнопку shift рисуем круг в центре
Paths-Fill path-#cdcdcd
Удаляем path

Шаг 2

Давайте сделаем стикер более интересным
Выберите слой со стикером
Потом Layer - Layer Style - gradient overlay #eeeeee - #cdcdcd
Scale 72% Angle -79°
Opacity 100% Style Linear
Создаем новый слой под стикером, выделяем стикерный слой и жмем Ctrl+E

Шаг 3

С Polygonal lasso, выделяем часть слоя (должен выглядеть как полукруг) и вырезаем его (Правая кнопка мыши по выделению - Layer Via Cut)
А сейчас самое интереное
Выбираем Free Transform tool (Ctrl+T) и перетаскиваем его как показано на рисунке
Потом двигаем его 1 px вниз
Здесь надо будет поиграть с настройками чтобы тень была реалистичнее
Layer - Layer Style - Gradient Overlay - заполните градиентом white - black
Opacity 66% Angle -50° scale 25%
Drop Shadow - Opacity 39%
Distance 1px Spread 0% Size 5 px
Выбираем слой со стикером - Layer Style - Drop Shadow
Opacity 24% Distance 6px Spread 0% Size 5px

Вот и все!
Легко, правда?

Урок взят с ресурса www.interface.ru

Autodesk 3ds Max 2010.

dizajn — Thu, 19 Feb 2009 21:22:17 GMT

Autodesk рассказывает и показывает о новых инструментах моделирования в 3ds Max 2010.

Новое в 3ds Max Design.

dizajn — Thu, 19 Feb 2009 21:17:23 GMT

Кен Пиментел, старший менеджер по продукции Autodesk, рассказывает в своем блоге о новой версии 3ds Max Design.
Помимо беглого перечисления нововведений, есть несколько скриншотов и видеонарезок.

Интересный бесплатный плагин для создания математических поверхностей в 3ds Max.

dizajn — Thu, 19 Feb 2009 21:06:27 GMT

Интересный бесплатный плагин для создания математических поверхностей в 3ds Max. Если вы не очень дружите с математикой, но хотите получить нестандартный объект, построенный по математическим функциям, то этот инструмент как раз для вас. Помимо экспериментов с параметрами можно воспользоваться пресетами (их около 60).

Скачать можно здесь.
Документация здесь.

Вышел первый сервис пак к физически-правильному рендереру fryrender

dizajn — Thu, 19 Feb 2009 21:01:56 GMT

Вышел первый сервис пак к физически-правильному рендереру fryrender. В SP1 вошли два дополнительных модуля - fryrender SWAP и fryrender FARM.

fryrender SWAP позволяет в реальном времени изменять материалы в отрендеренных сценах, используя технологию смешения слоев. По этому модулю есть несколько видео демонстраций:
Archiviz (QT, 10 Mb)
Design (QT, 3 Mb)
Productviz (QT, 11 Mb)

fryrender FARM предназначен для сетевого рендера.

Бесплатная загрузка и работа плагинов от Digimation

dizajn — Thu, 19 Feb 2009 20:49:40 GMT

12 известных, но довольно старых плагинов от компании Digimation стали бесплатными. Этот набор назвали Digimation Suite, он работает с 3ds Max 4 - 2008 и его можно скачать здесь.

В Digimation Suite вошли:
Atomizer,
Bones Pro,
Chameleon,
Clay Studio,
DigiPeople,
Fractal Flow,
Glider,
Lightning,
MaxSculpt,
SandBlaster,
Spray Master,
Tree Factory.

Требования к компу:
3ds Max (различные выпуски)
32-битовый только
процессор на 400 МГц (1GHz рекомендуемый)
RAM 512 МБ (1 рекомендуема),
Графическая карта, поддерживающая 1024 x 768
Место на жестком диске 2 МБ

finalShaders 2.0 для 3ds Max 9

dizajn — Mon, 16 Apr 2007 17:55:57 GMT

finalShaders 2.0 для 3ds Max 9

Создатели finalRender – компания Сebas Computer – объявили о выходе finalShaders 2.0 для 3ds Max 9 и finalRender Stage-2 R2.0.
finalShaders состоят из 16 улучшенных, простых в использовании и готовых к рендеру материалов. Все это настраиваемые, гибкие типы материалов, от кожи человека или инопланетянина, до восковой свечи. Одна из основных целей finalShaders – дать возможность пользователям создавать даже самые сложные эффекты материалов с максимальной эффективностью.
Все пользователи, которые приобрели finalShaders в последние 2 месяца, получат апдейт finalShaders 2.0 бесплатно. В обновление включены пять новых возможностей:

• fS-Curvature
• fS-Layer
• fS-fastSkin
• fS-Tension
• fS-Ghost
Сайт программы

Приветствую Вас на моей страничке

dizajn — Mon, 16 Apr 2007 12:19:24 GMT

Открыв данный ресурс с помощью проекта ucoz я надеюсь привлечь внимание талантливых дизайнеров как в 2D так и в 3D. На данном сайте будет выкладываться информация как из области дизайна так и из области цифровой фотографии. В двух словах Всё что можно сделать при помощи фотоаппарата и компьютера используя приложения Photoshop и 3D Max.

Спасибо за внимание!