Показаны сообщения с ярлыком верстка. Показать все сообщения
Показаны сообщения с ярлыком верстка. Показать все сообщения

четверг, 1 ноября 2012 г.

Когда буквы — искусство. Эффектные примеры креативной типографики.

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

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



mos def lyric portrait




A Tribute to Yulia Brodskaya



Fact Magazine (cover typography)


Bad Typography is Everywhere


Soft type


Heist


Ink and Water Don’t Mix


typography whore


Love your body


BLACKOUT POSTER


Brown Fox


PINK PARTY FLYER


Things beginning with T


The world on a plate


Legotype


cim_organic


Colorcubic Experimental Prints


Posing for Typography


Typographic World Map


50 Motion Graphics Essentials


Type tips


ed


Belio Experiments


Estrella Levante Posters


MSCE 16/05/09 :: D.A.R.Y.L.


untitled


Bad Vibes


Love,love,love / Pattern


YEAH logo pattern


positive/negative


Empire


KDU


Smashing Pumpkins Poster

 


http://pawelldesign.creativshik.ecommtools.com/?sid=12345









среда, 18 мая 2011 г.

Web-дизайн 2011: основные тренды и направления


Дизайн сайта не может быть выбран исходя из модных веяний, но эти новые тренды говорят нам о новых технических возможностях веб-дизайна, поэтому игнорировать эту информацию нельзя. Особенно дизайнерам, которые делают дизайн и вёрстку на заказ.
Web-дизайн 2011: основные тренды и направления
1. Торжество CSS3 и HTML5
В течение последних нескольких лет можно было наблюдать медленное, но верное внедрение CSS3 и HTML5 в работу многих сайтов. Теперь наконец-то можно с уверенностью сказать, что CSS3 и HTML5 — выбор современного прогрессивного дизайнера! Всё больше людей выбирают именно эти инструменты для создания современного, с технической точки зрения, дизайна. Постепенно flash-сайты уходят в небытие. И хотя ещё рано говорить о полном крахе flash, ведь HTML5 пока не в силах заменить отдельные элементы flash-дизайна. Однако всё к тому идёт.
2. Дизайн, адаптированный под мобильные устройства
На волне всеобщей популяризации яблочных гаджетов, телефонов и КПК, дизайн сайтов стали адаптировать под мобильные устройства. Всё больше пользователей выходят в Интернет через свои телефоны и коммуникаторы. Это значит, что информация должна помещаться на небольшом экране портативного мобильного устройства. Такие сайты отличает минималистичная и облегчённая графика, удобный шрифт, который легко можно масштабировать и т.д. Многие крупные порталы даже создают специальные версии своих сайтов, предназначенные для загрузки на сенсорных мобильных устройствах. Дизайн, адаптированный под touch screen экраны — ещё одна тенденция нового web-дизайна.
Web-дизайн адаптация под мобильные устройства
3. Чистый цвет
Можно наблюдать в новом 2011 году такую тенденцию, как чистые цвета в дизайне. Часто это бывают  сайты, фоном которых выступает тот или иной цвет, графика минимальна, удобно расположены блоки с информацией и выбран хороший шрифт. В некоторых случаях фоном выступает красивое сочетание двух-трёх цветов, в гамме которых выполнен весь сайт. Такой подход к созданию дизайна выглядит очень свежо и оригинально. Главное тут — угадать с цветом или выбрать гармоничную палитру из 2-3 цветов, играя с оттенками.
Веб-дизайн - чистый цвет
Веб-дизайн - чистый цвет
4. Дизайн в духе газет и журналов
Эта тенденция в моде уже несколько лет. Многие выбирают такой стиль для своих сайтов. Отличительная особенность такого дизайна — крупные кричащие заголовки, грамотное размещение информации на странице, привлекательные иллюстрации. При просмотре такого сайта создаётся впечатление, что вы листаете модный журнал или читаете газету со свежими новостями.
Web-дизайн в духе газет и журналов
Web-дизайн в духе газет и журналов
Web-дизайн в духе газет и журналов
Web-дизайн в духе газет и журналов
5. Использование эффекта paralax
Это так называемые глубинные, объёмные или трёхмерные эффекты. Например, если дизайн сайта выполнен в виде комнаты, то у пользователя создаётся ощущение присутствия в этой комнате, иллюзия объёмности предметов на картинке. Так же, как и в кино-индустрии, 3D-эффект популярен в веб-дизайне. Интересен и эффект paralax-прокрутки, когда создаётся ощущение едва уловимого движения бэкграунда сайта при прокрутке страницы. Все эти манипуляции достигаются путём умелого использования CSS или библиотек Jquery.
Web-дизайн 2011 - использование эффекта paralax
Web-дизайн 2011 - использование эффекта paralax прокрутки
6. Использование QR-кодов
Многим владельцам web-money кошельков, использующих e-num способ авторизации, знакома технология использования QR-кодов. Достаточно лишь сфотографировать такой код камерой своего мобильного телефона, как вам тут же покажется число-ответ, необходимое для авторизации. Зачем же использовать эту технологию в веб-дизайне? На фоне всеобщей адаптации интернета под мобильные устройства наблюдается и внедрение QR-кодов в web-дизайн. Его используют для отображения аватарок в комментариях, для перенаправления пользователя на мобильную версию сайта и т.д.
Web-дизайн 2011 - использование QR-кода
7. Дизайн, рассчитанный под миниатюру
Компания Google ввела в свой поиск новую дополнительную возможность, помогающую пользователю сориентироваться в выдаче. Это возможность просмотра миниатюра сайта, на который может быть совершён переход. Миниатюра загружается при клике по изображению лупы справа от заголовка сайта в выдаче. Соответственно, если дизайн очень тяжёлый или полностью основан на flash-анимации, то при загрузке миниатюры возникнут проблемы.

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

среда, 22 декабря 2010 г.

Памятка дизайнеру. Как быстро сделать сумму красок CMYK меньше 300%

Вы сверстали буклет или каталог, отправили в типографию и расслабились... РАНО!!!
Типография не принимает файл в работу т.к. у вас сумма красок CMYK больше 300%!!!
Как это произошло? просто не каждый дизайнер в процессе работы, особенно когда горят сроки думает о таких вещах как препресс.
Обычно такое происходит при переводе фотографий с темными местами из RGB в CMYK, в результате чего черный цвет может стать, например, таким С 83 + M 95 + Y 87 + K85, итого = 350.


Обычно типографии требуют чтобы сумма красок CMYK была не более 300%, но бывают и такие требования:
260 - 290 - для полос внутри буклета/каталога и т.п.
300 - 320 - для обложек.

Лучше всего запросить эти данные у типографии.


Самый быстрый способ поменять профиль файла на профиль с выставленным TIL (total ink limit) = 300%, например, U.S. web coated (SWOP) v2


Заходим в Color Settings
В строке CMYK выбираем профиль "custom CMYK"
в строке Total Inc Limit ставим сумму красок 300
Сохраняем данный профиль CMYK


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























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

как уменьшить сумму смик в фото

водим в Photoshop курсором по изображению и смотрим в палитре "Info" проценты составного цвета. 
Чтобы в палитре "Info" выводилась сразу сумма цветов, а не составные цвета, нажимаем на выпадающий список в палитре "Info", выбираем "Palette Options" - "Mode" - Total Ink.
Если все равно не попадаем, уменьшаем % еще.


Творческих успехов.


по материалам demiart.ru

Бесплатный курс. Дизайнер-Фрилансер. Сценарии успеха