PSD web ui какой смысл всех этих элементов?

[ekkl]

Появилось желание немного разобраться в PSD Шаблонах.

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

Также удалось обнаружить, что есть просто некоторые компоненты: Кнопки, списки и т.д.

Возьмем, к примеру вот этот http://www.freepik.com/free-psd/amazing-clean-web-ui-elements-kit-psd_596993.htm

Допустим, вырежу я кнопку? и что дальше? ведь она будет иметь фиксированные размеры X*Y пикселей. Как я смогу написать более длинный текст?

Дальше: сам прогресс-бар? А с ним-то как? ведь картинка то статическая, ползунок на ней на одном месте, а смысл прогресса, чтобы ползунок бегал.

То же самое с текстовыми полями. Ну вырежу я его, укажу background в стилях, но опять же размер поля придется фиксировать под размеры картинки.

Может я чего-то не знаю? Но я не понимаю зачем все эти элементы. Может кто-то сможет объяснить мне?

[antonKar]

Допустим, вырежу я кнопку? и что дальше? ведь она будет иметь фиксированные размеры X*Y пикселей. Как я смогу написать более длинный текст?

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

Дальше: сам прогресс-бар? А с ним-то как? ведь картинка то статическая, ползунок на ней на одном месте, а смысл прогресса, чтобы ползунок бегал.

Делаем гифку и 0 проблем.

То же самое с текстовыми полями. Ну вырежу я его, укажу background в стилях, но опять же размер поля придется фиксировать под размеры картинки.

Текстовые поля можно сделать на чистом CSS (я PSD не скачивал, может там дезигнер чепухи намолотил, но с виду можно сделать на CSS) , никаких картинок не надо вообще.

Но я не понимаю зачем все эти элементы. Может кто-то сможет объяснить мне?

Для дизайнеров, которым лень заморачиваться; для верстальщиков, которым надо по-быстрому сделать формочку на сайте.

Edited October 20, 2013 by antonKar

[ekkl]

Вот и я о том же, 90% делается на чистом css.

Единственное, что я вижу, так это, например, в случае кнопки, вырезать картинку толщиной в пару пикселей и указать как фон (если градиент какой-то красивый, да и его можно на чистом css)

К слову, юзаю zurb foundation там много уже сделано, при чем на чистом css, если нужно, то через SASS просто редактируются цвета и всего делов-то.

Как я понял, не стоит на это тратить время?

[hypnocolor]

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

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