Хроники web дизайнера (On-line version).

[web-design]

Design Doktor volume 2 (сильно сокращенный вариант рукописи)

Часть 6. Перспективы

Ушли в прошлое и забылись мифы, окутывающие понятие "Интернет". Рассеялся ореол таинственности. И что мы видим. Точно - обычный способ доступа к огромному массиву информации нахаляву. Почему нахаляву? А потому, что вся та бесконечная и безграничная информация, что мы находим в Интернет практически моментально не сопоставима по ценности с теми мизерными затратами на доступ к ней. За Интернет будущее. Население планеты компьютеризируется безостановочно, а это значит число пользователей Интернет (читай - пользователей и хозяев сайтов) постоянно растет. Сайты востребованы. Для дизайнера в области web-а всегда будет работа. Собственник не дурак, он понимает, что его сайт, как и любой другой продукт промышленности, без дизайна выглядит убого. Что отстоем никто не пользуется.

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

И снова внутренний дизайнер заявил о себе, и начались очередные поиски интересной работы. Поиски оказались успешными. Нашел новую область применения своим профессиональным качествам. Очень неожиданную область, если принимать во внимание мое образование промышленного дизайнера. Это дизайн программного обеспечения или виртуальный промышленный дизайн.


Источник: www.rosdesign.com
Михаил Клюев
"Design Doktor volume II. Хроники дизайнера" (сильно сокращенный вариант рукописи).
Нижний Новгород, 15 февраля 2007 г. - 14 марта 2008 г.

@темы: Из жизни дизайнеров

---

Хроники web дизайнера (On-line version).

[web-design]

Design Doktor volume 2 (сильно сокращенный вариант рукописи)

Часть 5. Работа free-lance

По моему глубокому убеждению, период работы вольным художником обязателен для каждого полноценного дизайнера. Скажу больше, не только free-lance, но и организация собственных коммерческих проектов. Такой лично-коммерческий подход к делу отлично промывает мозги. Работая на себя, вы получаете тот недостающий кусочек коммерческого образования, в котором вам отказало наше государственное дизайн образование.

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

Фриланс как отношение к работе.
Фриланс заставляет вас вертеться и думать не как простой исполнитель, чем является дизайнер, работающий в конторе за определенную пайку. Фриланс заставляет не только делать проект, но что важнее - продавать продукт. Также вы можете принять волевое решение прекратить работу с определенным заказчиком, например, если мнения в правильности оформления проекта разошлись, и вы не хотите выпускать продукт, под которым вам будет стыдно подписаться. Эта вынужденная мера превосходно бережет дизайнеру нервы. Для меня важно работая фрилансером, лично контактировать с каждым заказчиком и избегать предложений он разных "любителей легких денег" - посредников, которых множество. Опасно также выполнять личные заказы друзей. Все люди в большинстве одинаковы это относится и к их мировосприятию. Согласитесь, что бывают ситуации, когда вы не можете угодить заказчику (расходитесь во взглядах или не хотите делать откровенное дерьмо) и если в случае с обычным клиентом вы просто мирно навсегда расстанетесь, то в случае с другом-заказчиком вы рискуете потерять дружбу, также мирно расставшись навсегда.

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

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

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

Источник: www.rosdesign.com/
Клюев М. 2008 г. Text: 2007-08 г., "Design Doktor volume II. Хроники дизайнера": 2008 г.

@темы: Из жизни дизайнеров

---

Хроники web дизайнера (On-line version).

[web-design]

Design Doktor volume 2 (сильно сокращенный вариант рукописи)

Часть 4. Интернет компания

Многие сайтостроители ограничиваются созданием одного единственного сайта для себя и это нормально. Мой персональный сайт по счету был вторым. Хобби становилось работой.

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

Совет дизайнеру: Если вам дорога ваша индивидуальность избегайте обезьяньей работы. Долговременное исполнение дизайнером обязанностей, не требующих творческой работы мысли, приводит к деградации, и восстановиться, потом бывает довольно сложно. На мой взгляд, у дизайнера всегда должны быть несколько вариантов получения заказов. Всегда есть вероятность потери существующей работы (например, компания переквалифицируется и вы, как наемный рабочий остаетесь не у дел) и в связи с этим дизайнеру следует иметь надежный тыл. Старайтесь не терять связей с вашими персональными заказчиками. Такие контакты, какими бы мелкими они не были, очень ценны! И еще всегда старайтесь разнообразить фронт своих заказов. Не зацикливайтесь на чем-то одном. Например, делайте и сайты и логотипы и комиксы. Разнообразие в работе - повышает ваш потенциал дизайнера. В противном случае это просто не скучно

А я с увлечением окунулся в новый для меня мир Сети. Это было очень удачное устройство на работу в плане приобретения бесценного опыта web разработчика. Я был в курсе всех Интернет новостей и передовых технологий. Я был в курсе всех Интернет событий, происходящих в моем городе. Я имел возможность халявно обучаться мастерству web дизайнера на базе Интернет компании. Пришло время завести домен на платном хостинге. Теперь мой сайт кроме раздела портфолио обогатился небольшой информационной составляющей в виде отдельных тематических статей о дизайне (в основном моих). Это были статьи как о дизайне в целом, так и о web - специальности, которая понемногу становилась моей основной профессией.

Совет работодателю: Никогда не торопите своего дизайнера, если время терпит. Вам же хуже будет!

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

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

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

На заметку: Успешный внешний вид сайта - это не только красивые картинки. Вы удивитесь, насколько различается у пользователей восприятие оформления одного и того же ресурса. Причем оценки расходятся в диапазоне от "очень хорошо" до "полное г" со всевозможными промежуточными цветными и черно-белыми эпитетами. Сколько людей столько и мнений. А потому в оценке успешности сайта главную роль играет не его визуализация, а его удобство и понятность пользователю. Удобство пользования сайтом называется web-эргономикой или юзабилити. Феномен восприятия сайта пользователем зависит от индивидуальных психологических особенностей конкретного пользователя. Но существует ряд характерных особенностей, распространяющихся на большинство нормальных людей. Любой сайт, оказывающий конкретные услуги должен выглядеть соответственно специфике заявленных услуг и на подсознательном уровне положительно влиять на пользователя (на его отношение к сайту и на его выбор услуг), должен вызывать доверие и выглядеть убедительно.

Эйфория вернулась (чтобы снова уйти на пару лет) и я творил non-stop. Я работал в крупной интернет компании и пользовался преимуществом ее молодости. Идеально для начинающего дизайнера устроиться на работу в молодую компанию, где нет еще сложившихся традиций и иерархического бреда. Где нет разделения на отделы, и руководство состоит из одного персонажа. Заработок был мизерным, но это не смущало. Сейчас на фоне сформировавшихся интернет монополистов и крупных интернет компаний такие молодые компании уже редкость и скорее всего вам придется работать в устоявшемся коллективе со сложной внутренней структурой. В этом случае для дизайнера только один плюс - высокая зарплата.
Я снова забурился в штат. Я снова часть команды. Я уверен в своем мастерстве и готов предложить фирме свои "мозги" в обмен на оговоренную пайку. Бесило одно - отсутствие окон (постоянное искусственное освещение) и отсутствие зоны покрытия для сотового телефона. Домик, где размещался офис, был из старого фонда с толщиной наружной стены более метра. Для бомбоубежища в самый раз. Постоянный полумрак и жалкое освещение рабочего места довершали картину детей подземелья. И не удивительно - фирма расположилась в подвале. Сидя в подвале с чувством глубокой защищенности от всех неблагоприятных воздействий внешней среды и периодически закрывая глаза, уставшие от мерцания экрана год назад морально устаревшего монитора, я общался со всем миром по icq. Так у меня появились друзья из Канады, США, Латвии, Украины и России, разумеется, тоже. Некоторые контакты принесли мне удачу и немного повлияли на образ жизни. Тогда я бессовестно увлекся лошадьми, что продолжается уже 4 года. На судьбу, правда не повлияли, но я и не стремился. Мне было некогда, я работал. После трудовой пятилетки немного устал, остановился и огляделся вокруг. Оценил внутриофисную ситуацию и решил, что пора сваливать. Из всех старожилов компании я ушел последним.

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

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

Проходит время, и компания постепенно встает на ноги. Начинается набор новых сотрудников. Меняется внутрикорпоративная ситуация.

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

Штат увеличился. Появились новые лица и новые должности. Поле деятельности web дизайнера сужается к созданию макетов баннеров. Важно не увязнуть в формирующейся рутине (это еще не болото, но уже цветет) и найти способ продолжать самообразование. Это могут быть собственные интернет проекты и работа с персональными заказчиками.

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

Источник: www.rosdesign.com
Клюев М. 2008 г. Text: 2007-08 г., "Design Doktor volume II. Хроники дизайнера": 2008 г.

@темы: Из жизни дизайнеров

---

Помогите!

[Сестры Света]

Здравствуйте. Помогите плиз. Как создать баннер для своего сайта?
Спасибо заранее!

@темы: Баннеры, Уроки, Web-дизайн, Помощь

---

Хроники web дизайнера (On-line version).

[web-design]

Design Doktor volume 2 (сильно сокращенный вариант рукописи)

Часть 3. Годом раньше или после сборки доработать напильником

Свой первый сайт я написал c нуля. И, не смотря на примитивность работы, не на шутку этим горжусь. Программа "Блокнот" и учебник по html Э. Шафрана. Тщательно копируются рекомендуемые теги, выстраивается замысловатая мозаика непонятных символов. Шаманство! Строчки кода мне мало о чем говорят и это неудобно. О существовании визуальных html редакторов я еще не знаю и при открытии странички в браузере немного офигеваю. Красочная куча хлама из невероятного нагромождения текстов, фотографий и других безвкусных шлакоблоков. Тогда я первый и последний раз пользовался web клипартом. Результат ошеломляющий. Я сделал это! Ну, по крайней мере, оно не взорвалось.

Интернет был доступной сказкой. Все в нем было интересно и непонятно. Правила общения на форумах, особенности регистрации бесплатных почтовых ящиков. На создание ящика на mail.ru ушло больше часа (тогда я первый и последний раз читал пункты пользовательского соглашения). Но о том, что есть бесплатные почтовые ящики, я узнал позже. А сначала у меня был корпоративный почтовый адрес, и приходящие мне письма читались всеми менеджерами компании - было весело. Это было золотое время, когда я освоил замечательную программу Photoshop 4-й модели и рвался применить на практике полученные знания. Я знакомился с особенностями и секретами html. Искал интересные примеры сайтов. Скачивал понравившиеся страницы, печатал их и разбирался с кодом. Теперь для эффективной работы у меня было все: компьютер, доступ в Интернет, учебники, толстая пачка листов с распечатанным на принтере кодом страниц сайтов и большое желание сделать хороший сайт, по крайней мере, функциональный. Помню, что недолго занимался абстрактными упражнениями. Не прошло и месяца, как знакомый, выступая в роли, клиент менеджера, предложил мне сделать реальный коммерческий сайт - продукт за деньги.

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

Совет заказчику: Внимательно проверяйте компанию или дизайнера-исполнителя насколько они компетентны. И вы практически никогда не будете разочарованы.

Я взял задание и приступил к работе над своим первым коммерческим проектом. Скажу вам это не то же самое, что делать сайт для себя, особенно если ваш опыт web разработчика равняется нулю. Началось самое интересное. Я понял, что "Блокнот" это не тот редактор, в котором я смогу сверстать даже простую страничку, а значит нужно срочно искать альтернативу. И грея аванс в кармане, я приступил к поискам удобного инструмента. Правильно, отправился за дисками с подходящим софтом. Мне повезло - нашел что искал. Изучив и применив на практике разные html редакторы, я понимаю, что мой выбор это визуальный html редактор Dreamweaver. Тогда это была панацея, но он радует меня и сейчас.

При таком количестве ошибок сайт работать не может, но он работал! 7 лет не перестаю удивляться, тому, что его приняли. Ошибки в программировании, ошибки в юзабилити (тогда я не знал этого слова), ошибки в композиции контента (этого слова я тоже не знал) и web дизайне. Была непоколебимая уверенность дилетанта, что все делаю правильно. Был основной критерий - "чтобы IE это показывал".

Небольшой штришок: В то время имела место сейчас незаслуженно подзабытая "война браузеров". Бодались бесплатный Internet Explorer (IE) и платный Netscape Navigator (NN). Обе программы были популярны, и соотношение пользователей этих программ варьировалось 50х50. Сделать сайт, одинаково хорошо отображающийся в обоих браузерах, было делом непростым даже для опытного разработчика. Об этой "войне" я тоже не знал. Меня спасло то, что пользовался я Netscape Navigator (друг поставил, когда настраивал мне компьютер), и сайт тестировал в этом браузере. А если сайт хорошо выглядел в NN, то в IE он выглядел еще лучше.

Я долго занимался полиграфией и думал, что разработать интерфейс web сайта так же просто как нарисовать картинку на бумаге. Обманчивое сходство web дизайна и графического дизайна ввело в заблуждение. На самом деле эти области дизайна живут по своим законам и отличаются друг от друга как две галактики. Тогда я даже не задумывался об этом. Моей целью было сделать сайт. Заметьте не "лучший сайт" и даже не "хороший сайт", а "просто сайт" т.е. нечто работоспособное и похожее на сайт. Я проектировал сайт, пользуясь полиграфическими приемами. Я мыслил как полиграфист, как промышленный дизайнер, как дизайнер по наружной рекламе, как художник. Как кто угодно, только не так как это нужно для успешного web проекта.

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

О бизнес модели странички не было и речи, рисовалась композиция по стандартному (кстати, вполне удачному и работоспособному) шаблону, где основные элементы это "top", " left menu", " body" и "bottom". Такое построение элементов странички является общепринятым и многим привычным унифицированным композиционным стандартом для верстки контента.

Об особенностях пиксельных форматов страничек я, разумеется, не имел ни малейшего представления и сделал макет точно в размер экранного разрешения моего монитора, компонуя элементы дизайна сразу в программе верстки. Графику брал из бесплатного клипарта, html не знал в принципе. Шел год 2000. Если и сейчас (начало 2008 г.) в НН нет квалифицированных курсов по обучению web проектированию. Что можно говорить о том времени. Но прекращать работу я не собирался. Неверно выбранная модель странички поначалу задержала мою работу. Я по простоте душевной решил сделать сайт на фреймах. Помучившись и проработав несколько выходных по 10 часов с нулевым результатом, отказался от этой дурацкой идеи.

На заметку дизайнеру: чтобы главная страничка, выполненная в жесткой верстке, просматривалась на экране обычного CRT монитора c разрешением 1024 x768 пикселя целиком и без полос прокрутки нужно габариты web макета делать равными 955 x 600 пикселей. При резиновой верстке, где горизонтальная величина задается значением 100%, сумма длин графических элементов по горизонтали не должна превышать 955 пикселей. Меньше можно, больше - нет. Резиновая верстка, разумеется, предпочтительнее, т.к. при этом используется вся область монитора.

Шапка сайта - картинка с названием компании, буквы объемные. Это убого и в редких случаях объемный шрифт выглядит в web солидно. Если вас посетило непреодолимое желание сделать таким шрифтом заголовок сайта или слоган или еще что-то. Не спешите, успокойтесь, выпейте кофе и подумайте 120 раз. Возможно, обычный шрифт без наворотов и деформаций будет выглядеть правильно, а "красивый" объемный образец шрифта, на разработку которого вы потратили много времени сил и денег, в контексте страницы будет смотреться работой дилетанта. Вряд ли открою большой секрет, если скажу, что шрифты, представленные на сайте в виде графических изображений не индексируются поисковыми системами и соответственно не находятся по поисковым запросам, что не очень хорошо для сайта. Если деваться некуда и пришлось загонять шрифт в графику, проверьте сначала грамматические Ашипки и не забудьте, потом поставить на такой графический элемент альтернативные тексты (alt и title) с ключевым словом или фразой.

На заметку дизайнеру: С недавних пор у пользователей поисковиков типа Яндекс и Google появилась возможность поиска по изображениям, которые ищутся поисковиками по альтернативному тексту и по названиям их файлов.

Незадолго до начала работы над сайтом я прочитал в одном руководстве, что шрифты в текстовых пунктах меню, расположенных друг над другом, нужно "доводить" так, чтобы сравнять их длины - это называлось почему-то нюансировкой. Никогда так не делайте! Редко когда количество слов и буковок в разных пунктах меню одинаковое. А если вы пытаетесь деформировать пропорции шрифта - вы его портите, забывая, что гарнитура шрифта это законченный проект дизайнера-графика и что постороннее вмешательство в чужой дизайн не проканает без ущерба для этого дизайна ну никак. Это касается и применения выравнивания (justify) к тексту, когда в большинстве случаев слова немилосердно разлетаются, слипаются или растягиваются, оставляя между собой жуткие дыры.

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

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

Когда я принес эскиз странички заказчику и попробовал показать его, открыв на компьютере заказчика, меня ждал сюрприз. На месте графики вылезли крестики "файл не найден", а все потому, что программа верстки прописала абсолютные пути к этим файлам. Но то, что сейчас воспринимается как позор с большой буквы "П" тогда меня нисколько не смутило. Я вообще не понял причину проблемы. Пришлось идти домой и разбираться. Следующий визит к заказчику был удачнее, в этот раз я ограничился неправильно прописанной кодировкой. Что такое кодировка я не знал. И пользуясь html редактором, оставил все настройки по умолчанию. Это была кодировка Western (Latin1).

На заметку дизайнеру: Правильное указание кодировки - очень важный момент в верстке. В России распространена кодировка сайтов Windows-1251 или KOI-8. Так исторически сложилось.

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

Совет дизайнеру: Здесь я не пишу о войне браузеров Internet Explorer и Netscape, которую мне пришлось застать. Потому, что сейчас эта тема не особенно актуальна и интересна только археологам. Но, для уверенности, что сайт будет выглядеть как положено у максимального числа пользователей, не ленитесь тестировать сверстанные странички в различных браузерах и операционных системах. Так вы будете знать, насколько уродливо он смотрится, например, у пользователей Linux и возможно внесете в уже готовую верстку изменения, которые если не исправят положение, то в какой-то степени улучшат визуальный образ вашей странички. Имейте в виду, что вашу страничку пользователи смотрят под различными операционными системами, при различных настройках монитора и качестве видеокарт. В разном настроении, умственном развитии и состоянии наркотического опьянения.

Заказчик не обладал художественным вкусом, и при утверждении дизайна мне чертовски повезло. Но от изучения html меня никто не освобождал. О чем мне напомнил "вражеский" программист, пожелав увидеть максимально адаптированный к web макет. Я тогда его успокоил, дав понять, что вершину моего мастерства он уже видит перед собой. И что раньше чем через год ситуация вряд ли изменится к лучшему. Образ мышления программиста для меня и сейчас остается, мистическим и загадочным. И если есть в мире шаманы - это определенно программисты.

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

В процессе сеанса одновременной верстки и проектирования на меня снизошло озарение, и я понял основополагающую (возможно я старомоден, но она остается для меня таковой, и сейчас) идею верстки web страниц. Эта идея заключается в одном слове: "Таблица". Это когда все наполнение странички очень удобно размещать в специально созданной для этого фиксированной таблице. Эврика! Переломный момент. Это решало множество проблем и делало web проектирование более простым, понятным и неизмеримо захватывающим. Сайт я в итоге домучил и отдал, тире сбагрил для дальнейшего использования по назначению. Так вполне благополучно для меня завершился мой первый проект, сделанный на заказ. Почему я говорю благополучно для меня? Как вы уже поняли, особой оригинальностью мой дизайн не отличался, несмотря на похвалу заказчика. Но первый шаг был сделан и процесс пошел. А тот сайт еще несколько лет висел в интернете, и заказчик был доволен в течение всего периода висения сайта. На заработанные деньги я выучился и сдал на права.

Источник: www.rosdesign.com
Клюев М. 2008 г. Text: 2007-08 г., "Design Doktor volume II. Хроники дизайнера": 2008 г

@темы: Из жизни дизайнеров

---

Хроники web дизайнера (On-line version).

[web-design]

Design Doktor volume 2 (сильно сокращенный вариант рукописи)

Часть 2. Офис - дело тонкое
Есть мнение, что эйфория принадлежности к племени офисного планктона посещает всех начинающих практиковать дизайнеров. Я не был исключением. Эйфория радости быть сотрудником фирмы и просто работать по специальности рассосалась довольно быстро. Потом это состояние вернется, но пройдет долгих 7 лет. Старшие товарищи не предупредили, что в условиях офиса творчество гибнет. Я на них не в обиде и в свою очередь предупреждаю тех, кто не в курсе. Офис - дело тонкое.

На свою первую работу я устроился неприлично быстро. Поиск работы и трудоустройство заняли у меня два часа. Я был счастлив. Я приходил в офис раньше всех и испытывал удовольствие от перемещения по пустому и тихому еще коридору, застеленному истоптанным ковром. Я проходил сквозь приглушенный свет мимо жужжащих системных блоков и мигающих светодиодов. Офис дремал и рабочий день впереди. Есть что-то завораживающее в такой предрабочей атмосфере. Такое смутное чувство удовлетворения окружающим миром я переживаю каждый раз проходя рано утром по офису. Но последнее время я чаще работаю дома.
Мне было хорошо. Я испытывал душевное спокойствие, а психика еще не была загажена такими понятиями как "работа ради денег" и "желание переехать жить в Сочи". Кстати желание никуда не делось. Скажу больше, меня приглашали на работу в Сочи, но я продинамил. А вот плохо это или очень плохо время покажет. Но возможно момент переезда еще впереди.

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

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

Все произошло без моего участия - мой сайт определил мою карьеру на ближайшую пятилетку. Дело было так. Я зарегистрировал персональную страничку собственного производства в каталоге, принадлежащем моему будущему работодателю, и получил письмо с предложением о сотрудничестве. Было морозное ноябрьское субботнее утро 2000 года. Ночь я провел в ТЮЗ-е, продираясь сквозь дебри коллекции "Ночь пожирателей рекламы" Ж-М. Бурсико. И вот утро выходного дня. И вот приглашение к сотрудничеству. Сколько потом было таких приглашений, но это приглашение было первым и своевременным. Я его прочитал. Заинтересовался. Это действительно было интересное предложение. И я согласился на собеседование.

Лирическое отступление: Я заметил, что самые важные и интересные предложения о работе (возможность заработать), возвращение долгов (пополнение кошелька) или приглашения к участию в мероприятиях (возможность отдохнуть) приходят ко мне в тот момент, когда я свободен, больше всего в них нуждаюсь или имею возможность их принять. Мистика, однако.

Первое впечатление было потрясающим. Не найдя звонка я постучал в черную металлическую поверхность двери без номера на втором этаже облезлой хрущевки. Дверь открыла симпатичная девушка с огромными серыми глазами и приветливо мне улыбнулась. За худенькими плечами девушки темнел готический провал коридора, торчали из стен провода и живописно свисал откуда-то сверху пыльный сколотый патрон без лампочки. В углах неосвещенного коридора притаились зловещие тени, а где-то в глубине на пределе видимости в уюте желтого торшерного освещения на фоне громадного оторванного куска старых обоев за компьютером сидел мой работодатель. Грандиозно! И я, не раздумывая, направился навстречу новым впечатлениям, боковым зрением отметив полуоткрытый сортир, доверху заваленный пустыми пивными бутылками. Мы говорили о моей будущей перспективной работе, и даже следы пожара на потолке "офиса" не смогли покорежить моего твердого решения стать web дизайнером. Так я начал изучать web профессионально.

Клюев М. 2008 г. Text: 2007-08 г., "Design Doktor volume II. Хроники дизайнера": 2008 г.
Источник:www.rosdesign.com

@темы: Из жизни дизайнеров

---

Хроники web дизайнера (On-line version).

[web-design]

Design Doktor volume 2 (сильно сокращенный вариант рукописи)

Не найдя звонка я постучал в черную металлическую поверхность двери без номера на втором этаже облезлой хрущевки. Дверь открыла симпатичная девушка с огромными серыми глазами и приветливо мне улыбнулась. За худенькими плечами девушки темнел готический провал коридора, торчали из стен провода и живописно свисал откуда-то сверху пыльный сколотый патрон без лампочки. В углах неосвещенного коридора притаились зловещие тени, а где-то в глубине на пределе видимости в уюте желтого торшерного освещения на фоне громадного оторванного куска старых обоев за компьютером сидел мой работодатель. Грандиозно! И я, не раздумывая, направился навстречу новым впечатлениям, боковым зрением отметив полуоткрытый сортир, доверху заваленный пустыми пивными бутылками. Мы говорили о моей будущей перспективной работе, и даже следы пожара на потолке "офиса" не смогли покорежить моего твердого решения стать web дизайнером. Так я начал изучать web профессионально.

Мне 34 и я профессионал. 7 лет практики в web индустрии и 14 лет обучения по специальности в ДХШ, НХУ и ННГАСУ. Прошел путь от дизайнера-исполнителя в рекламном агентстве до art-директора крупнейшей в нижегородской области интернет компании. В настоящий момент я "свободный художник" - дизайнер free-lancer. Занимаюсь дизайном и юзабилити интернет ресурсов, оформлением интерфейсов программного обеспечения, Интернет консалтингом, изучаю психологию восприятия сайта пользователем. Создаю flash-ролики и презентации для web, разрабатываю рекламную полиграфическую продукцию, логотипы и фирменные стили. Занимаюсь организацией работы дизайнерских групп. Владею всеми видами кистей, карандашей и аэрографов. А в свободное время на своем сайте пишу статьи, спецификации, руководства и электронные книги о дизайне. Мое хобби - лошади, верховая езда, конкур, теория и практика дизайна. Мой сайт - www.rosdesign.com.

Часть 1. Рисовать я начал в 5 лет

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

Я прекрасно помню свои детские рисунки: цветные полосы - трава, шарики с ножками - люди. Табуны таких колобков увлеченно неслись навстречу друг другу. Я рисовал русско-турецкую войну, о которой перед сном читал мне дедушка. Колобки были разноцветные и бежали быстро. Они колошматили друг друга саблями, они штурмовали крепость "Измаил". Потом появились корабли с парусами, всадники, лошади, танки, самолеты и фашисты с крестами на пузе. Мои детские рисунки, как и все детские рисунки, строились по одному мне тогда понятной символьной схеме. Уже не пиктограммы, но еще и не совсем сознательные изображения предметов и людей.

Человек, прошедший художественное училище, не мыслит своей дальнейшей жизни без дизайнерского образования. Так я думал тогда. Но, поступая в университет на специальность "Промышленный дизайн", я и в самых страшных своих кошмарах не мог представить, что стану практиковать в экзотической и сложной для понимания простого смертного виртуальной области дизайна. Что буду самостоятельно изучать психологию пользователя и эргономику сайтов. В том далеком 1993 году мало кто в России знал слово web. А ПК - ключевой инструмент, можно сказать ваш Персональный Портал в сказочный и необъятный мир Интернет был труднодоступен и окутан аурой мистики с некоторым налетом мажерства. Помню при слове "Интернет" в голову приходили разные элитно-шаманские ассоциации. Понятие Сайт было обожествлено. Многие знали, он есть, но мало кто его видел и почти никто не понимал, как он работает. Представить себя в роли дизайнера виртуальной среды обитания было невозможно, в силу незнания о существовании этой самой среды. Но потом были и первый браузер, и первый сайт, и первый модем и первые хакеры и первые крекеры.

Подключиться к сети Интернет меня заставили обстоятельства. Тогда я принимал участие в одном московском междоусобном проекте. Мы делали RPG. Потом проект забросили, но остались мои бесхозные работы. Недолго думая я разместил их в Интернет.

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

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

Клюев М. 2008 г. Text: 2007-08 г., "Design Doktor volume II. Хроники дизайнера": 2008 г.
Источник:www.rosdesign.com

@темы: Из жизни дизайнеров

---

Конкурсы

[web-design]

Интересно ли вам будет попрактиковаться/посоревноваться между собой в пробе "пера", то бишь дизайна сайтов?
Призы будут символичны.
Все пожелания и вопросы в комментарии

Вопрос: Интересно ли вам данное предложение?

1. Да		7	(77.78%)
2. Нет		2	(22.22%)
Всего:		9

---

Стильное лого № 6. Designing a young, vibrant and athletic logo.

[web-design]

Designing a young, vibrant and athletic logo


Создаем вот такой прямоугольник при помощи инструмента rectangular shape tool:



Жмем Ctrl+T. Делаем правый клик на объекте и выбираем способ трансформации warp. Выбираем "Inflate" из выпадающего списка на верхней панели настроек. Применяем настройки как на картинке ниже:



Выделяем фигуру при помощи path selection tool. Дублируем её и уменьшаем. Жмем "subtract from shape area" на верхней панели настроек.



Выделяем обе фигуры и поворачиваем.



Опять выделяем и дублируем фигуры. Уменьшаем и выбираем "Exclude overlapping shape areas" на верхней панели настроек.



Дублируем все фигуры снова. Уменьшаем и поворачиваем. Выбираем "exclude overlapping shape areas" на верхней панели настроек.





Жмем Ctrl+T. Делаем правый клик на объекте и выбираем distort. Трансформируйте фигуру так, чтобы что-то вроде этого:



Делаем двойной клик на слое и открываем окно стилей слоя. Применяем следующие настройки:





Пишем название компании и смотрим результат:





Автор/Источник: photoshopforfun.com/jap_art_logo.htm
Перевод: Nadik

@темы: Уроки, Web-дизайн

---

Мастерская дизайна логотипов

[web-design]

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

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

Если вы внимательно просматривали некоторые наиболее известные логотипы, то не могли не заметить некоторые общие аспекты. Но тем не менее, важнейшей вещью для любого логотипа является его непохожесть на другие. Здесь кроется некий парадокс. На самом деле, общее у качественных логотипов то, что у каждого из них есть свой подход к тому, чтобы отличаться от других. Давайте взглянем на логотипы таких компаний, как Coca Cola, Mobil Oil, IBM, Kellogg’s. Все они уникальны и непохожи на другие. Эти логотипы мгновенно распознаваемы по всему миру, и даже если каждый из них разрезать на кусочки, то даже по одному кусочку можно их узнать. А делают логотип таким могущественным время и деньги. До того, как эти логотипы стали популярными, были потрачены миллионы на рекламу и упаковку. Когда разрабатывается новый логотип, у вас, конечно нет преимущества во времени и вы будете рады, если в конечном итоге он принесет большую прибыль и оставит след в нашей эпохе. В одном будьте уверены, что если вы не воспользуетесь основными принципами правильным образом, в независимости от затрат и времени, неудачный логотип не принесет пользы и будет вытеснен довольно быстро. Некоторые логотипы существуют долгие годы практически без изменений. Они выглядят также значимо в наши дни, как и много лет назад, когда были созданы. Например, логотип компании Coca Cola, успешно работавший долгие годы, был подвергнут изменениям, но дизайнеры трудились впустую, так как они не произвели революционного эффекта, хотя этот логотип нельзя назвать современным. Так как же это может быть? Первоначально он был разработан в 1886 году и претерпел много преобразований и изменений в течение своего существования, но, по сути, перед нами начальная версия логотипа, который является самым известным в мире.

Прежде всего, необходимо усвоить 2 урока. Во-первых, откровенно ультрамодные логотипы быстро устаревают и могут стать помехой. Если можно определить срок действия логотипа, то, вероятно с ним что-то не так. Всегда быть актуальным -важнейший принцип. Почти все известные логотипы были популярны как в прошлом, так и в настоящем, они, фактически вечны! Во-вторых, устойчивость логотипа. В отличие от компании Coca Cola, логотип Pepsi Cola значительно менялся на протяжении многих лет. Первоначально, он был похож на логотип Coca Cola, изображенный таким же витиеватым шрифтом. Сейчас, он, вероятно, выглядит более современно, написан жирным шрифтом без засечек, но проигрывает в классическом, вечном аспекте, который помогает компании Coca Cola увековечить свое наследие. Достижение всемирного узнавания любой компании или ее брэнда зависит от количества появлений ее логотипа на публике. Но, если он изменяется через каждые несколько лет, потому что начинает выглядеть старомодно, или просто по прихоти владельцев компании, то аудитории приходится привыкать к нему снова и снова.

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


Если вы создаете логотип для компании или продукта, у которого уже есть устоявшаяся версия, подумайте дважды, прежде чем предложить радикальные изменения. Обратите внимание сначала на возможные изменения, которые сделают его актуальным в настоящее время. Это не значит «модернизировать» логотип. Несколько лет назад было модным именно модернизировать логотипы решительно и бесповоротно. Многие известные компании, для которых создавались логотипы при моем участии, были традиционными английскими брэндами: Bovril, Horlicks, Colman’s Mustard, Rowntrees, Trebor и Frank Cooper’s Marmalades. В каждом случае я убедился в том, что мне приходилось делать два шага назад, прежде, чем двигаться вперед. А все потому, что все предыдущие версии логотипов были модернизированы и потеряли в процессе этого все ранее приобретенные традиционные ценности. Давайте, обратим внимание на логотипы некоторых успешных высокотехнологичных компаний и постараемся чему-то научиться у них. Возьмем Microsoft, IBM, Canon, Sony, Apple. Все они довольно просты, за исключением символа яблока у компании Apple, состоят из названия компании, написанного определенным особенным шрифтом. Особенность является наиболее важным фактором. Они не использовали обычные шрифты, купленные у Adobe или скаченные с бесплатного сайта в интернете. Все эти логотипы были разработаны вручную и не похожи на другие гарнитуры шрифта.

В логотипе компании Microsoft использован жирный курсив без засечек, но буква «о» выделяется из общей картины, что делает его более узнаваемым, запоминающимся и особенным. Через логотип IBM проходят горизонтальные линии, хотя сам он написан с помощью жирного шрифта ’Egyptian’. У Canon отличительной особенностью является буква ’C’. У компании Sony, возможно, наименее отличительный логотип среди данных примеров, но название само по себе уникально.

Мало пользы от того, чтобы скопировать чей-нибудь логотип, если только вы намеренно не хотите быть на кого-то похожим. Логотип должен настолько отличаться, насколько вы способны сделать его таким. Ему следует быть информативным, сообщать что-то о компании или продукте, а не просто указывать на его имя.


Выбор названия компании или продукта является еще одним важным фактором, но я не буду в данный момент уделять этому значительное внимание. Логотип Apple -единственный из представленных, который претерпел недавние изменения: цветные полосы изображаются сейчас в одном цвете. Слово Apple написано обычным шрифтом, производным от Garamond, разработанным еще в шестнадцатом веке!

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

Красочный стиль, как и одежда, то входит, то выходит из моды. Очевидно, что нет смысла разрабатывать логотип для компании по производству компьютеров, используя стиль Art Deco, это может быть не правильно воспринято. С другой стороны, быстро проходящие условности наиболее подходят для обеспечения уникальности, являются креативным решением проблемы повторяемости популярных имиджей. Здесь дизайн становится, по-настоящему, интересен.

Используйте это для выполнения похожих работ. Существуют так называемые «наглядные пособия», своего рода шаблоны, касающиеся всего, что вас интересует. Просмотрите Yellow Pages или диск с клипартами, и вы увидите тысячи звездочек, полосок, колпаков шеф-повара, деревянных ложек, цыплят и т. д. В лого-дизайне использование подобных шаблонов и сервисов может быть вполне продуктивным.

Но, вместо того, чтобы сделать ваш логотип уникальным, они смешивают его с другими подобными образами, выражающими похожую идею. Фактически, использование таких приспособлений, делает имидж компании заурядным и дешевым. Но, добавив шаблону отличительную особенность, использовав его вне контекста, вы можете сделать его запоминаемым. Мало пользы от того, чтобы скопировать чей-нибудь логотип, если только вы намеренно не хотите быть на кого-то похожим. Логотип должен настолько отличаться, насколько вы способны сделать его таким. Ему следует быть информативным, сообщать что-то о компании или продукте, а не просто указывать на его имя. У вас есть возможность добавить отличительные особенности вашему логотипу, в соответствии с выбранным шрифтом и цветом. Большинство корпоративных логотипов должны работать при огромном спектре их применения: на различных канц. товарах, упаковке, т. е. участвовать в продвижении торговой марки. Они должны быть различных размеров и версий в зависимости от применения -цветная версия для почтовой бумаги и ежегодных отчетов, гравировка — для изображения у главного входа в офис компании. Если логотип часто появляется на телеэкране, то стоит придумать анимационную версию, вплоть до простейшего рисунка на надувных шариках, для раздачи на рекламных акциях.

Источник: www.logodesigner.ru
Автор: Joe Gillespie ©
Перевод студии LogoDesigner.

@темы: Статьи

---

День стильных лого для сайтов. Стильное лого №5.

[web-design]

Стильное Лого

Рисуем))

Шаг 1.
Для начала, как всегда, создаём новый файл, заливаем фон белым цветом. Создаём новый слой. С помощью Elliptical marquee tool (М) создаём круг, заливаем выделение чёрным цветом:


Ctrl+D. К слою применяем следующие настройки:







Должно получиться следующее (готовая Web-кнопка):



Шаг 2.
Теперь, с помощью Pen Tool рисуем треугольник:



Далее поправьте узлы так, как показано на рисунке:



Нажмите Ctrl+Enter (загрузится выделение), если необходимо инверсируйте его (Shift+Ctrl+I) . Создайте новый слой, залейте выделение чёрным цветом:



К слою применяем:







Изображение после применения стилей слоя:



Дублируем слой несколько раз, расставляем дубли следующим образом:



Шаг 3.
Теперь с помощью Elliptical marquee tool рисуем маленький кружок, создаём новый слой. Заливаем выделение чёрным цветом:



К слою применяем настройки:





Изображение после применения стилей слоя:



Дублируйте слой и расставляйте кружки:



В заключении введите имя компании:



Источник: 4des.ru
Перевод: Selestial;
Автор: yourphotoshopguide

@темы: Уроки, Web-дизайн

---

Новости: RIW//08

[web-design]

Russian Internet Week - 2008

Неделя Российского Интернета (Russian Internet Week, RIW–2008) – главное осеннее мероприятие интернет-отрасли, объединяющее в себе конференционное, выставочное и развлекательное направления. RIW–2008 пройдет с 22 по 25 октября 2008 года в МВЦ «Крокус-Экспо» рамках Выставки-форума «ИнфоКом–2008» и при поддержке Министерства связи и массовых коммуникаций РФ.

Те кто участвует, регистрация, программа и пр. информация на официальном сайте riw2008.ru/
25 числа в бесплатном зале будет программа: "Веб 3.0 и новые сервисы. Семантический веб".
Ведущий: Артищев Андрей

До встречи на RIW

@темы: Новости

---

ЛОГОТИПЫ. Общее о лого.

[web-design]

Часть1: Шрифты.
Люди привыкли видеть качественные тексты по телевидению, в печатной рекламе и кино. Они могут отличить профессиональный текст. Нельзя, чтобы у ваших потенциальных клиентов складывалось ощущение дешевости вашего товара.


В настоящее время, все компании можно разделить на те, у которых уже есть свой логотип, и те, которые хотят иметь логотип. Раньше только корпорации могли позволить себе лого, а теперь он есть даже у моей собаки. У многих людей на компьютерах есть различные графические программы, поэтому каждый из них способен создать логотип. Проблема в том, что у них нет знаний и навыков в дизайне. Если вы хотите иметь логотип, можно купить программу, например The Logo Creator, которая поможет вам его создать, или действовать самостоятельно. Так как я профессиональный художник, я решил, что могу дать несколько советов, касающихся дизайна логотипов.

Первым шагом к созданию логотипа является выбор подходящего шрифта. Выбирайте шрифт, который выражает, что представляет ваша компания. Большинство существующих шрифтов уже где-нибудь использованы. Если вы серьезно относитесь к делу, то придется заплатить пару долларов, чтобы иметь свой собственный. Это можно сделать на Fonts.com и ITCFonts.com.

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

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

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

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

Часть 2. Цвета.

Цвета—важнейший аспект повседневной жизни. Мы постоянно используем их для общения. Мы все воспринимаем тот или иной цвет как сигнал к ощущениям. Мы относимся к этому как к концептуальному языку, в котором существует очень много значений. Как и в английском, в нем много слов (в этом случае оттенков).


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

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

Обратим внимание на красный.

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

Если добавить в него немного белого цвета, то получится розовый. Он уже не олицетворяет предупреждение и ярость, ассоциируется с маленькими девочками, цветами или Pepto-Bismol. Оттенок красного имеет свое значение, отличное от основного цвета.

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

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

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

2. Неяркие цвета получают просто смешением красок или чернил. Они тусклые и не имеют тонального ряда, в отличие от контрастирующих.

Вы можете спросить, почему знать это так важно. Ваш логотип должен изображаться одинаково, как в веб-версии, так и в печати. Множество контрастирующих цветов невозможно отобразить в печатной версии. Вы должны выбрать цвет, который печатаем. Вы также можете использовать Pantone colors, которые слишком дороги для принтера или использовать палитру CMYK. Pantone провел много времени, работая над своими цветами, и их можно считать самыми лучшими в данной индустрии. Если вы можете позволить себе это, то я советую воспользоваться палитрой Pantone. Для остальных, приемлемо использовать цвета CMYK. Лучшим способом проверки выбранного цвета является сравнение его веб-версии с печатной. Если отличие незначительно, то вы выбрали правильный цвет и в создании логотипа сделано пол-дела. Теперь нужно выбрать вспомогательный цвет. Если нет необходимости использовать его сейчас, то пусть он останется в вашем арсенале. Не выбирайте цвет, который не сочетается с основным. Он нужен для того, чтобы подчеркнуть главный цвет и, конечно, тоже должен хорошо печататься. Вы можете выбрать и третий цвет, который тоже может вам пригодиться.

Теперь вам нужна подходящая форма для вашего логотипа.

Часть 3: Формы.

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


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

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

Прямоугольник тоже используется, но убедитесь, что он будет не слишком вытянут. Помните, дизайн должен четко смотреться и при небольших размерах. Не стоит создавать слишком высокий и растянутый логотип, так как его затруднительно использовать в некоторых аспектах. Если у вашей компании длинное название, то лучше его разбить на части, чтобы оно входило в область логотипа. Вы можете растянуть его по кругу, если представляется невозможным разбить его на части. Например, логотип Golistenlive.net разбит и состоит из трех чередующихся стрел. Текст всегда сопровождает логотип, но он не актуален в графике. Овал в наши дни на пике популярности. Он навевает чувство современности. Ford и Ask.com являются удачными примерами овальных логотипов. Орбиты, кольца, все чаще появляющиеся вокруг предметов, придают ощущение движения логотипа. Примером может послужить логотип компании Expedia, в изображении которого нет текста. Но они используют и вторую версию логотипа, в которой есть название их компании. Какую бы форму вы не выбрали, старайтесь избегать сложных форм, например, в виде черепов или гитар, потому что они требуют при печати больших затрат.

Теперь нужно учесть тиражирование, поэтому вам нужна еще и черно-белая версия вашего логотипа.

Часть 4: Черно-белая версия.

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


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

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

Задний план белый. Цвет, который используют для изображения картинки— черный.

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

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

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

Часть 5: Обзор.

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


Теперь мы должны посмотреть, что будет являться частью логотипа. Если наиболее подходящим вариантом является название вашей компании, то его необходимо вставить в логотип. В другом случае, можно разработать визуальный образ логотипа, который бы заставил человека ассоциировать его именно с вашей компанией. Но это не касается тех, кто имеет абстрактные названия. Добро пожаловать в мир создания визуальных образов, олицетворяющих ваше имя. Это может быть рисунок, конкретный предмет или что-то другое. Просто он должен быть уникален и отличен от других логотипов. Стоит избегать того, чтобы люди ассоциировали вас с другой компанией. Иначе, это может нанести ущерб всему логотипу. Во многих логотипах взята за основу первая буква названия компании, например, McDonalds , Enron, Bridgestone Firestone.com, Verizon.

Вы можете взять какой-нибудь узор или предмет и добавить его к логотипу, как это сделали Amazon.com, Goodyear, Nike.

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

Если вы нашли достаточно редкий шрифт, то можно начинать. Добавьте несколько окружностей или квадратов вокруг и двигайтесь дальше.

Осторожно используйте градиенты в дизайне, потому что это сплошной кошмар для печати и интернета. Если вы все-таки решили использовать один, то не в формате gif. Это приведет к сливанию. Используйте jpeg. Некоторые принтеры напечатают такой логотип в половине тональности. Точки будут по всему логотипу. Воспользуйтесь услугами профессионального дизайнера логотипов в этом случае, или не используйте градиенты вообще.

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


Автор: © James Blakely
Перевод студии LogoDesigner.
Источник: www.logodesigner.ru/

@темы: Интересно, Статьи

---

Иконка или логотип в фотошопе

[web-design]

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

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

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

"Поехали"

1. Создаём новое изображение:



2. Фон зальём белым цветом (спомощью Paint Bucket Tool). Затем выбираем инструмент Ellipse Tool, зажимаем клавишу Shift и рисуем круг любого цвета:



3. Заходим в Blending Options слоя с кругом (правый клик по слою на панеле слоёв, там выбираем пункт Blending Options...) и переходим на вкладку Drop Shadow (отбрасывание тени), там выставляем следующие значения:



4. Переходим на вкладку Inner Glow (внутреннее свечение) и там делаем как показано ниже:



5. А на вкладке Gradient Overlay делаем вот-так:



А это градиент в подробностях (чтобы открыть это окошко, нажмите по цветной полосе справа от надписи Gradient — красными цифрами обозначены шестнадцатеричные коды цветов:



6. Жмём Ok, снова Ok и видим такой результат:



7. Нарисуем ещё один круг, но немного меньшего размера (тем же способом, что и ранее):



8. Заходим в Blending Options слоя с верхним кругом, на вкладку Inner Shadow (внутренняя тень) и там выставим следующие значения:



9. На вкладке Outer Glow (внешнее свечение) такие:



10. А на вкладке Gradient Overlay выставим следующие параметры градиента (красными цифрами указаны шестнадцатеричные коды цветов — устанавливаются в подробных настройках градиента, как было показано ранее):



11. Не закрывая окно Layer Style перейдём в окошко для рисования, зажмём левую клавишу и сместим градиент немного вниз и вправо, как показано ниже:



12. Теперь в окне Layer Style можно нажать Ok. Выберем инструмент Rounded Rectangle Tool, радиус скругления углов поставим равным 15 пикселей (Radius: 15px) и нарисуем фигуру следующего вида:



13. Применим к этой фигуре несколько эффектов. На вкладке Drop Shadow вот такие:



14. На вкладке Outer Glow такие:



15. На вкладке Inner Glow вот аткие:



16. И наконец-то перейдём на вкладку Gradient Overlay и настроим параметры градиента:



Вот так выглядит окошко с подробными настройками градиента:



17. Жмём везде Ok и получаем следующий результат:



18. Получилось что-то похожее на дорожный знак Давайте добавим какой-нибудь текст (цвет текста не важен). Я написал название сайта:



19. применим некоторые эффекты. Сначала Inner Shadow:



20. Затем Outer Glow:



21. А после Gradinet Overlay:



С вот-такими настройками цвета:



22. Жмём везде Ok. На этом этапе мы начнём рисовать блики. Для этого сразу нарисуем ещё один круг, такого же размера как и круг всерху:



23. Сейчас берём инструмент Direct Selection Tool и трансформируем круг следующим образом (если вам не хватит опорных точек, то их можно будет добавить с помощью Add Anchor Point Tool):



24. Применим к полученной фигуре некоторые эффекты. сразу уберём параметр Fill Opacity до нуля:



25. Затем добавим внутреннее свечение (Inner Glow):



26. И добавим градиент (Gradient Overlay):



Так выглядит окно подробной настройки градиента (напоминаю, что в нижних квадратиках выставляется цвет — в данном случае он белый, а в верхних — непрозрачность — значения непрозрачности я написал рядом красными цифрами):



Жмём в окошках Ok и получаем блик следующего вида:



27. Сделаем ещё один блик. Для этого нарисуем ещё один круг и исказим его следующим образом:



28. Добавим к этому блику такие же эффекты, как и к прошлому (для этого на панеле слоёв, на слое с первым бликом, кликните правой клавишей и выберите пункт Copy Layer Style, затем кликните правой клавишей по слою с новым верхним бликом и выберите Paste Layer Style), непрозрачность (Opacity) этого слоя немного уменьшите:



29. Теперь сделаем следующее: кликните правой клавишей по слою с текстом и выберите пункт Resterize Layer; затем выделите слой с текстом и прямоугольником (чтобы выбрать два слоя, зажмите клавишу Ctrl и кликните левой клавишей по обоим слоям, по очереди), зайдите в меню Edit и выберите пункт Free Transform Path (произвольная трансформация), поверните немного выделенные слои:



30. Теперь исказим нашу иконку. Для этого сразу нужно выделить все слои, после этого идём в меню Edit —> Transform Path —> Skew и, передвигая верхние квадратики, искажаем наше изображение, пока не достигнем результата, похожего на мой:



31. Ну и последнее действие: на панеле слоёв выделим слой с самым нижним кругом, перейдём на панель рисования и немного сдвинем круг вниз (с помощью инструмента Move Tool):



Ну вот мы и нарисовали красивую иконку, логотип или что-то похожее на них... Если вы к этому времени хорошо изучили прошлые уроки, то этот урок вы сделаете без затруднений, если плохо — перечитывайте прошлые уроки или задавайте свои вопросы мне лично.

Источник: www.designarts.ru

@темы: Уроки, Web-дизайн

---

НАЗАД К ОСНОВАМ. ТЕОРИЯ ДИЗАЙНА ЛОГОТИПОВ.

[web-design]

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


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

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

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

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

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

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


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

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

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

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

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

Источник: www.logodesigner.ru/

@темы: Интересно, Статьи

---

Чтиво за чаем: забавности

[web-design]

Улыбнутся

Приметы программистов

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

Схватка монстров.

Есть одна фирма, где я подрабатываю "эникейщиком". Все бы ничего, но тамошние ребятки сильно боятся всяческих компьютерных вирусов. Причем, их страх настолько силен, что на некоторых компьютерах установлены все антивирусные программы, какие только смогли раздобыть их владельцы. Мои робкие попытки объяснить, что лучше пользоваться чем-нибудь одним, - особенно это касается разных антивирусных мониторов, - не возымели никакого действия:
- А пусть будут!
- Ребята, но ведь для того, чтобы, к примеру, сохранить собственное здоровье, совсем не обязательно каждое утро съедать горсть аспирина, потом вкалывать себе пяток ампул антибиотиков, намазываться с ног до головы чольмогровым маслом и запивать все это стаканом "касторки".
- Hо, ведь, работает же!

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

И вот накануне, зайдя в эту фирму, я был прямо в коридоре атакован местным главным бухгалтером:
- Сергей Иванович, тут какой-то "касперский" хочет, чтобы ему что-то обновили. Вы не посмотрите?

Ясен пень, посмотрю! Почему же не посмотреть? И пока на соседнем компьютере переустанавливалась привычно рухнувшая "чикага", я, - вместо того, чтобы "откинуться на спинку кресла и расслабиться", как предписано Великим Билли, - быстренько скачал апдейты с сайта Касперского и пошел обновлять антивирусные базы на компьютерах аборигенов.

Очевидно, такое наглое нарушение главной заповеди Hаимудрейшего, не могло остаться для меня безнаказанным. И наслал Великий Билли какое-то помутнение на мой разум. Совсем я забыл, что одним из тех компьютеров будет тот самый - с "зоопарком" из антивирусных программ. Отдыхавший до поры, до времени AVP, почуял обновленную антивирусную базу и радостно начал подавать признаки жизни. Стоявший здесь же, на страже, Norton Antivirus, обнаружил подозрительную активность какой-то неведомой ему апликухи и решил, что не вредно будет ее подлечить. Hо AVP тоже не дремал. Вовремя заметив и отразив атаку, он нанес контрудар.

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

Помню, кто-то где-то говорил, что AVP - полная лажа и мутотень. И что пользоваться нужно Norton Antivirus. Так вот, не верьте ему! Победителем в этой кровавой бойне оказался AVP. Hа его фоне Norton выглядел слабаком и интеллигентом. В какой-то момент этой безжалостной схватки, бедняга NAV вдруг решил проявить вредные для такого случая либерализм и милосердие. "А вот этот файлик можно, наверное, и не удалять..." - не очень решительно заявил он. И это предопределило исход поединка. Инициатива полностью перешла к AVP. Он пинал и крошил своего соперника, не давая ему никаких шансов. Вспискивания NAV'а раздавались все реже и реже. Тем не менее, он продолжал доблестно сражаться, собираясь, очевидно, как можно дороже продать свою жизнь. Пока, наконец, он не выдал мне окошко в пол-экрана, заявив, что компьютеру настал полный трындец. Дескать, тут завелся настолько злобный вирус, крошащий все и вся, что сделать уже ничего нельзя. Hо закончить эту фразу NAV так и не успел.

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

И вот, разбирая то, что оказалось погребенным под обломками, я выяснил, что теперь на компьютере властвует и бесчинствует один только AVP. Все файлы затерроризированы им и построены в шеренгу:
- Шаг в сторону - побег, прыжок на месте - провокация, стреляю без предупреждения.

Остатки воинства NAV, оставшиеся в живых, в страхе попрятались в глубинах реестра. Время от времени, они издают оттуда жалобное повизгивание, но выходить на открытое пространство не решаются. Вот в таком виде, со словами: "А ведь я предупреждал!", - компьютер и был возвращен владельцу.

P.S. Я ничего не придумал. Hу, если только самую малость...

(с) Serge Fedotov

@темы: Интересно

---

Как сделать оригинальный логотип в PhotoShop 3

[web-design]

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



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

1. Сначала создадим текстуру, которую мы будем использовать в этом уроке. Для этого создайте файл с размерами 1x2 px. Возьмите карандаш (Pencil Tool) и закрасьте чёрным цветом верхний квадратик:



2. В главном меню выберите Edit —> Define Pattern:



Вводим название текстуры, жмём Ok и закрываем окно, не сохраняя (оно нам не понадобится).

3. Снова создадим новое изображение размерами с ваш будущий логотип. Затем выбираем инструмент Rounded Rectangle Tool, радиус скругления ставим 15 пикселей (Radius: 15px) и, зажав кнопку Shift, рисуем такой квадрат (Shift мы зажали чтобы получить стороны одинакового размера):



4. Сейчас выберите инструмент Add Anchor Point Tool и со всех четырёх сторон по центру добавьте по одной точке:



5. Выбираем Direct Selection Tool и передвигаем созданные точки к центру фигуры:



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



6. Добавим к слою эффектов (зайдём в Layer Style). Для этого на панели слоёв Layers кликните правой клавишей на слое с фигурой и выберите пункт Blending Options. Там перейдите на вкладку Drop Shadow (отбрасывание тени) и выставьте следующие значения:



7. Добавим внутреннее свечение — вкладка Inner Glow:



8. На вкладке Stroke добавим обводку:



9. Ну и добавим градиент (вкладка Gradient Overlay):



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



Везде жмём Ok и смотрим на результат:



10. Создайте копию этого слоя. Для этого перетащите слой на иконку создания нового слоя, или на панели слоёв кликните по слою правой клавишей, там выберите пункт Duplicate Layer:



11. Очистите настройки слоя, для чего на панели кликните по слою правой клавишей и выберите пункт Clear Layer Style:



12. Зайдите в Layer Style на вкладку Inner Shadow (самозатенение) и выставьте следующие параметры:



13. Затем добавьте внешнее свечение (вкладка Outer Glow):



14. Добавьте градиент (Gradient Overlay):



Со следующими подробными настройками:



15. Добавьте обводку (Stroke):



Обводка в виде градиента со следующими настройками:



Жмём Ok и получаем примерно такой результат:



16. Сделаем копию только что созданного слоя. Сбросьте его настройки (Clear Layer Style), затем непрозрачность Fill поставьте в 0%:



17. Зайдите в Layer Style на вкладку Pattern Overlay и выберите в качестве градиента градиент, который мы с вами создали в первых пунктах урока:



Жмём Ok и получаем штриховку следующего вида:



18. Инструментом Ellipse Tool нарисуйте в углу маленький кружок:



19. Зайдите в Layer Style этого слоя с кружком и добавьте небольшую тень:



20. Добавьте градиент:



Со следующими настройками:



После этого кружок должен стать таким:



21. Сделайте три копии слоя с кружком и разместите их в других углах логотипа:



22. Напишите внутри какой-либо текст, желательно покороче — одну или две буквы, а можно рисунок векторный простенький вставить (или нарисовать):



23. Переходим в Layer Style на вкладку Drop Shadow и там сделаем так:



24. На вкладке Inner Glow вот так:



25. На вкладке Stroke добавьте обводку:



26. Ну и добавьте градиент:



Градент со следующими настройками:



Жмём Ok и наш текст станет металлическим:



27. Зажмите клавишу Ctrl и на панели слоёв Layers кликните по верхнему слою, чтобы создать выделение. Затем выберите заливку (инструмент Paint Bucket Tool), создайте новый слой и залейте выделение белым цветом:



28. Не убирая выделения выберем инструмент Elliptical Marque Tool, затем зажимаем Alt и создаём овальное выделение как я показал ниже:



29. Инвертируйте выделение (Shift + Ctrl + I или в меню: Select —> Inverse) и нажмите клавишу Delete чтобы удалить выделенную часть слоя:



30. К этому слою добавьте маску, для этого на панели слоёв Layers кликните по верхнему слою, а затем по кнопке Add vector mask (кнопка в виде прямоугольника, внутри которого круг):



31. Слой разделился на две части — сам слой и маска. Сейчас выбираем градиентную заливку (Gradient Tool), тип заливки — чёрная, плавно переходящая в белую, и заливаем ею нашу маску слоя снизу вверх:



Вы видите окончательный вариант логотипа — я тут ещё добавил название сайта.

Логотип можно доработать и усложнить, например, с помощью кисточек, или можно в начале форму логотипа сделать не такую, а что-нибудь более оригинальное.

В общем, подключите свою фантазию...


Источник: www.designarts.ru

@темы: Уроки, Web-дизайн

---

Как сделать оригинальный логотип в PhotoShop 2

[web-design]

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

Не буду долго рассказывать, лучше всё покажу...



1. Создаём новое изображение с белым фоном. Затем выбираем инструмент Polygon Tool (многоугольник), число углов ставим равным 6 (Sides: 6) и рисуем такую фигуру (ввиде ячейки соты):



2. Заходим с Layer Style слоя с шестиугольником (для этого на панели слоёв Layers кликните правой клавишей по слою с шестиугольником и в выпавшем меню выберите Blending Options). Там переходите на вкладку Inner Shadow (самозатенение) и выставьте следующие параметры:



3. перейдите на вкладку Gradient Overlay и выставьте следуюие параметры градиента:



А вот так выглядит окошко с подробными настройками градиента (чтобы его открыть, кликните два раза по полосе (по образцу градиента), которая справа от надписи Gradient — красным цветом я написал шестнадцатеричные значения цветов для каждого кубика:



4. Затем перейдите на вкладку Stroke и настройте обводку следующим образом:



Тип обводки — градиент, вот его подробные настройки:



Жмём везде Ok и получаем такой-вот рисунок:



5. Сделайте три копии этого слоя (чтобы сделать копию слоя, на панели слоёв перетащите слой на иконку для создания нового слоя; или там же кликните по слою правой клавишей и в появившемся меню выберите пункт Duplicate Layer) и расположите их следующим образом:



6. Сейчас зайдите снова в Layer Style первого слоя, перейдите там на вкладку Gradient Overlay, затем, не закрывая это окно, перейдите на окошко для рисования и перетащите градиент в верхний угол фигуры. Затем повторите то же самое для остальных двух фигур, только передвигая в другие углы (смотрите рисунок ниже):



7. Теперь создайте новый слой (расположите его выше всех), зажмите клавишу Ctrl и кликните по слою с нижним шестиугольником (чтобы его выделить).

Затем в главном меню сделайте следующее: Select —> Modify —> Contract, в появившемся окошке введите цифру 5 и нажмите Ok, после этого выделение должно сузиться.

Теперь выберите инструмент Paint Bucket Tool (краска, заливка) и белым цветом залейте выделение:



8. Сделайте три копии этого слоя и расположите их следующим образом:



9. Объедините слои с двумя верхними белыми шестиугольниками (кликните по слою с верхним шестиугольником и нажмите Ctrl + E; или в меню: Layer —> Merge Layers).

Теперь выберите инструмент Elliptical Marque Tool и сделайте следующее выделение:



10. Удалите выделение (клавиша Delete):



11. Добавим к слою маску (для этого на панели слоёв кликните по слою, а затем нажмите на кнопку Add layer mask, которая находится снизу — она в виде прямоугольника, внутри которого круг; или в главном меню: Layer —> Layer Mask —> Reveal All) и зальём её градиентом (выберите градиент с плавно переходящим чёрным цветом в белый):



12. Переходим к слою с нижним белым шестиугольником. Выберите инструмент Elliptical Marque Tool и выполните следующее выделение:



13. Теперь нужно выделение повернуть. Для этого в главном меню выбираем: Select —> Transform Selection и поворачиваем выделение:



14. Удаляем выделенную область шестиугольника:



15. Добавляем к слою маску и заливаем её чёрно-белым градиентом (как было сказано выше):



16. Чтобы логотип не казался таким плоским, немного его трансформируем.

Для этого сразу выделите все слои (зажмите клавишу Ctrl и поочерёдно кликните по каждому слою — на панели слоёв Layers), а затем идите в меню: Edit —> Transform —> Distortion и исказите наш логотип следующим образом:



После этого должно получиться так:



17. Осталось добавить какой-нибудь текст и логотип готов:



Вот мы и нарисовали в фотошопе красивый и, в то же время, не сложный логотип...

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

Источник: www.designarts.ru

@темы: Уроки, Web-дизайн

---

Как сделать оригинальный логотип в PhotoShop 1

[web-design]

Урок по фотошопу о создании красивого, стильного, современного логотипа для сайта...

Нарисовать логотип не очень то и сложно, сложнее его придумать.


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

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

А необходимые знания вы почерпнёте на данном сайте...
Как нарисовать стильный логотип в PhotoShop

1. Создаём новое изображение размером с будущий логотип.

Выбираем инструмент Ellipse Tool, зажимаем клавишу Shift и рисуем небольшой кружок (я нарисовал круг с диаметром в 30 пикселей):



2. Создаём много копий слоя с кружком (для создания копии слоя перетяните его на иконку для создания нового слоя, или кликните по нему правой клавишей и там выберите Duplicate Layer) и располагаем их следующим образом:



3. Объедините все слои с кружками в один — для этого сразу выделите все слои (зажимая клавишу Ctrl и кликая на каждом слое на панели слоёв Layers), а за тем в меню выберите Layer — Merge Layers.

Сейчас нужно придумать как будет выглядеть наш логотип, в моём примере он будет в виде стрелки. Представили? Теперь нужно удалить лишние кружки (выделяем лишние кружки с помощью Rectangular Marque Tool и жмём клавишу Delete):



4. Раскрасим наш логотип. Для этого зайдите в Layer Style (чтобы туда зайти, на панели слоёв Layers кликните на слое с логотипом правой клавишей и выберите пункт Blending Options...) на вкладку Gradient Overlay и установите следующие параметры градиента:



Ниже показаны подробные настройки градиента (чтобы их открыть, кликните по полосе с градиентом, справа от надписи Gradient), красным цветом я написал шестнадцатеричные значения цветов:



Жмём везде Ok и получаем раскрашенный логотип:



5. Сейчас сделаем так, чтобы наш логотип казался расположенным в пространстве, для этого нужно его немного трансформировать. Зайдите в меню Edit —> Transform —> Distort и исказите логотип следующим образом:



6. Отлично! Теперь напишите название вашего сайта (если это логотип сайта) и слоган (шрифт, который я использовал в примере, можно скачать в конце урока (называется Macaroni), а лучшие шрифты вы найдёте тут):



7. Немного украсим надписи. Добавим эффект отражения.

Сделайте копию слоя с надписью и отразите её по вертикали (для этого в меню выберите Edit —> Transform —> Flip Vertical) и расположите ниже:



8. Добавите к отражённому слою маску (для этого нажмите на кнопку Add layer mask, расположенную на панели слоёв, снизу) и залейте её чёрно-белым градиентом снизу вверх:



После этих действий вы получите следующее отражение:



9. Таким же образом сделайте отражение слогана:



10. Добавим эффект стекла. Для этого сразу нужно выделить название сайта. Зажмите клавишу Ctrl и кликните левой клавишей по слою с названием сайта (на панели слоёв):



11. Создайте новый слой и залейте выделение белым цветом (с помощью заливки — Paint Bucket Tool):



12. С помощью Rectangular Marque Tool выделите нижнюю часть надписи:



13. И удалите её, нажав клавишу Delete:



14. Добавьте к слою маску и залейте её чёрно белым градиентом, как мы это делали ранее:



15. Таким же образом добавьте эффект стекла к логотипу:



Ну вот и всё — оригинальный логотип готов! Спасибо за внимание!

Источник: www.designarts.ru

@темы: Уроки, Web-дизайн

---

Два дня посвященные только логотипам. Относительно уроков по логотипам.

[web-design]

Пожалуйста, будьте внимательны, уроки по логотипам, которые будут выкладываться, зачастую будут неприемлемы в полиграфии, они для web, чтобы вы использовали их на сайтах, иначе придется оптимизировать лого под полиграфию. Успехов в творчестве!

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