Изучение Photoshop только для веб-дизайна

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

Знаете ли вы какой-либо источник учебных пособий, чтобы помочь мне изучить веб-дизайн в Photoshop?

Что мне делать, чтобы сосредоточиться на веб-дизайне в Photoshop?

Какие части Photoshop необходимы для веб-дизайна, а какие нет?

Ответы (7)

«Я хочу стать веб-дизайнером, поэтому смотрю много обучающих видео по Photoshop»

Вы знаете HTML, CSS и JS? Если нет, начните сначала с него.

Затем Photoshop используется как инструмент для создания графики, которая сочетается с HTML, CSS и JS.

Нет ничего особенного в «дизайне веб-сайта», связанного с конкретными инструментами в PhotoShop. Это просто инструмент для создания и редактирования изображений.

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

Например, если вам нравятся блестящие, слегка 3D-глянцевые кнопки на вашей странице (некоторое время назад они были очень популярны), вам нужно будет использовать тень, несколько градиентов, маскирование и, возможно, небольшое ручное движение с помощью инструмента «Кисть». Для фона вы можете просто использовать сплошной цвет или градиент с текстурированной/узорчатой ​​маской.

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

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

«…в дизайне есть нечто большее, чем просто Photoshop». Слышу, слышу! +1.
В Photoshop серьезно отсутствуют некоторые функции, которые могли бы принести пользу при разработке макета ... наряду с множеством векторных инструментов. Я мог бы переключиться на иллюстратор и использовать фотошоп для другой специализированной графики. Нравятся персонажи, фотореалистичные иконки...

Если вы хотите создавать веб-сайты, вам лучше работать с Fireworks, чем с Photoshop. PS, по сути, является приложением для обработки фотографий, и хотя его инструменты можно использовать для каркасов, они не особенно эффективны в этом. Иными словами, использование PS для веб-дизайна похоже на использование PS в качестве приложения DTP поверх InDesign. Да, это можно сделать, но это не самый лучший способ, и в долгосрочной перспективе вы проиграете.

Преимущества, которые дает Fireworks:

  • гораздо проще работать с истинными векторными фигурами
  • НАМНОГО проще определить размеры в пикселях; отсутствие размытия штрихов при растяжении и т.д.
  • можно определить «главные страницы», чтобы вносить изменения в дизайн ваших макетов на всем сайте без необходимости переделывать каждое отдельное изображение.
  • легче создать библиотеку часто используемых элементов управления пользовательского интерфейса (ценно для разработки веб-приложений)
  • Пользовательский интерфейс ближе к интерфейсу типичного настольного приложения, что означает более плавную кривую обучения.

Единственными реальными преимуществами, которые предлагает Photoshop, является тот факт, что

  • рендеринг шрифта лучше
  • ваши коллеги будут знать приложение (немного) лучше
Да, Fireworks лучше, иначе приходится использовать и Illustrator, и Photoshop и переключаться туда-сюда.

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

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

На заметку «для дизайна есть нечто большее, чем Photoshop»: я нашел это проницательным: http://naldzgraphics.net/tips/what-designers-need-to-know-about-typography/

Он страдает неестественной прозой и случайными грамматическими ошибками. Я могу обобщить это (и улучшить его) в поле для комментариев: используйте хороший вкус во всех вещах, посмотрите и очень четко поймите следующие слова: шрифт против шрифта , с засечками против без засечек, кернинг, трекинг, интервал , интерлиньяж, выравнивание, заподлицо, по ширине. Статья не дает четких или полных определений для большинства из них; объяснения поверхностны и кажутся вторичными.
Также это ответ только по ссылке.

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

Это мышление, что вам просто нужно изучить Photoshop, и тогда вы станете дизайнером, это то же самое, что называть себя строителем, потому что вы знаете, как пользоваться молотком, или механиком, потому что вы можете использовать гаечный ключ. Дизайн как таковой заставляет вещи работать хорошо (и, вероятно, хорошо выглядеть в процессе), он имеет очень мало общего со знанием Photoshop/Illustrator/InDesign/Sketch/что-то еще, но то, как вы используете эти инструменты для реализации своих идей.

На YouTube есть множество плохих руководств и множество хороших. Научитесь делать все это, техники в любом случае будут ценны в будущем. В Creative Block также есть хорошие туториалы. Но, кроме того, изучите теорию цвета, теорию компоновки, типографику (хорошее введение Эрика Шпикермана « Хватит красть овец и узнайте, как работают шрифты» ) и другие более традиционные навыки графического дизайна — гораздо более ценные навыки, в которые стоит вложить свое время, чем просто обучение. Фотошоп.

Кроме того, как кто-то упоминал ранее, изучение HTML/CSS/JS также является несомненным плюсом для работы в веб-дизайне.

Вы можете проверить свой PSD-файл на наличие известных проблем веб-совместимости здесь https://www.oss-usa.com/web-preflight?promo=web-preflight . Это бесплатно.

Привет Ник, добро пожаловать в GDSE и спасибо за ваш ответ. Я не понимаю, как это отвечает на вопросы, не могли бы вы уточнить? Спасибо!
У меня есть опыт веб-разработки, и я встречал много новичков в веб-дизайне. Есть распространенные ошибки, которые может сделать каждый. Например, десятичные пиксели в размерах шрифта. Этот сервис может помочь новичку.
Спасибо. Однако было бы очень полезно, если бы вы захотели поделиться своим опытом и указать на эти ошибки. Таким образом, ваш ответ по-прежнему будет иметь (большую!) ценность на случай, если ссылка сломается позже. Гниль ссылок - это причина, по которой мы не очень заинтересованы (в основном) в ответах только на ссылки, и причина, по которой я проголосовал за ваш ответ. Не расстраивайтесь, пожалуйста, мы знаем, что использование этого сайта может потребовать обучения. Мы рады , что вы есть, продолжайте вносить свой вклад!