Advertisement
  1. Web Design
  2. UX/UI
  3. UI Design

Руководство для веб-дизайнера по сравнению Photoshop и фейерверков

Scroll to top
Read Time: 15 min
This post is part of a series called Fireworks Pro Series.
Fireworks Pro Series: Where Does Fireworks Fit Into Your Workflow?

() translation by (you can also view the original English article)

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

Мы разместили опрос читателей на эту тему, поэтому не забудьте сделать свой собственный голос на этом посту!

Давайте начнем с перечисления pro и con каждой программы. Для большинства дизайнеров Fireworks является менее известным, поэтому мы начнем с него:


Преимущества использования фейерверков

Фейерверк - графическое приложение, как и Photoshop ... но «целевой пользователь» программы сильно отличается. Основная причина, по которой люди выбирают Fireworks, состоит в том, что она создана специально для веб-дизайнеров. Он легкий, быстро перемещается (даже на старых компьютерах), и его легче освоить, чем Photoshop, если вы новичок в любой программе. Поскольку он создан для веб-дизайнеров, он со временем со временем станет более подходящим для этой отрасли. начинаете, вас не будет беспокоить какой-либо сложный пользовательский интерфейс или крутая кривая обучения, которую вы можете найти в Photoshop.

Вот некоторые конкретные причины, по которым вы можете выбрать Fireworks:

Основные страницы (и несколько страниц / состояний)

Fireworks Master PagesFireworks Master PagesFireworks Master Pages

устанавливать согласованные элементы сайта, которые вы хотите отображать на каждой «странице». Функция «Несколько страниц» позволяет создавать столько дочерних страниц внутри одного и того же шаблона. Это супер мощный, потому что он очень похож на реальный сайт. Фактически обработка страниц и состояний в файле Fireworks предназначена для имитации поведения живой веб-страницы. Некоторые элементы фиксированы (например, навигация, брендинг, фон и т. д.), А некоторые элементы меняются с одной страницы на другую (столбцы контента, фотографии, заголовки и т. д.). Конечно, вы можете это сделать и в Photoshop, используя группы слоев или несколько файлов PSD, но организация и интерфейс, окружающие эти функции в Fireworks, более естественны. Из-за этого обработка универсальных изменений в Fireworks.

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

Внутреннее связывание

Fireworks Web Layers LinkingFireworks Web Layers LinkingFireworks Web Layers Linking

Внутренняя связь - это то, что это звучит. В Fireworks у вас есть возможность указать «горячие точки» на вашем сайте, которые ссылаются на различные страницы (упомянутые выше). Вы можете даже ссылаться на внешние URL-адреса, если хотите. Первоначальная идея заключалась в том, чтобы позволить дизайнерам фактически создать сайт в Fireworks, а затем «экспортировать» его как код. Жюри все еще не знает, полезен ли экспортированный код, но эта функция является фантастической, если вы просто хотите экспортировать файл в формате PDF для того, чтобы клиент или арт-директор быстро переключались. Это упрощает создание быстрых прототипов в Fireworks без необходимости писать строку кода.

Интеллектуальное управление стилями

Fireworks StylesFireworks StylesFireworks Styles

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

Лучшие векторные инструменты

Fireworks ShapesFireworks ShapesFireworks Shapes

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

Библиотеки

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

Лучшая группировка 

Photoshop позволяет группировать элементы в группы слоев, но это делается вручную и может стать утомительным с течением времени. Группировка в Fireworks выполняется более естественно: вы просто выбираете несколько элементов, а затем нажимаете «Группа». Это обычно означает, что ваши файлы будут организованы немного лучше, и в целом это экономит время по сравнению с методом ручной группировки Photoshop.

Лучшие градиенты

Fireworks GradientsFireworks GradientsFireworks Gradients

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

Лучшая оптимизация изображения

В Photoshop есть некоторые базовые инструменты «Сохранить для Интернета», но Fireworks расширяет их таким образом, чтобы удовлетворить потребности веб-дизайнеров. Сравнение бок о бок показывает меньшие размеры файлов при сохранении с фейерверков, что имеет решающее значение для сайтов с тяжелыми изображениями; PNG-8 (с прозрачностью) также полностью поддерживается, Photoshop еще не поддерживает!

Узнать быстрее

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

Более высокая производительность

Что вы получаете, когда удаляете все дополнительные функции, которые предлагает Photoshop? Меньшие размеры файлов, которые быстрее перемещают LOT. Файлы фейерверков (формат .PNG) могут содержать гораздо большую сложность, чем файлы .PSD, но на большинстве компьютеров они работают лучше, а это означает, что меньше времени ждать, пока ваш процессор откажется от графики и больше времени на проектирование.

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

Агентства просят об этом

«В недавнем обследовании вакансий« Обществе цифровых агентств »(SODA) почти 20% агентств ищут навыки FW. За год до этого числа было настолько мало, чтобы быть незначительным». - Том Грин (из нашего опроса)


Недостатки использования фейерверков

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

Преимущества использования Photoshop

Этот список будет меньше, потому что мы уже перешли по основным точкам сравнения, но вот еще несколько аргументов в пользу использования Photoshop вместо Fireworks.

Это флагман

Adobe Photoshop FlagshipAdobe Photoshop FlagshipAdobe Photoshop Flagship

Посмотрим правде в глаза, Fireworks страдает от синдрома «рыжий шаг ребенка». Только в последних версиях (CS4 и CS5) Fireworks получила значимые обновления функций. Хотя это хорошо предсказывает будущее, логика будет утверждать, что Adobe гораздо меньше подвергает Фейерверк больше внимания, чем Photoshop, потому что Photoshop продает больше раз каждый год за большие деньги. Photoshop также является более старой программой; что означает, что он выигрывает от более длительной истории обратной связи с пользователем. Фейерверк по-прежнему растет не по дням, а по каждой новой версии, но потому, что Photoshop является флагманским продуктом Adobe в пакете CS, ожидайте, что он получит большую часть основных обновлений в будущем.

Стабильность

Исторически пользователи Fireworks сообщают о больших сбоях и проблемах с файлами, чем пользователи Photoshop (хотя CS5 приносила гораздо большую стабильность). У Photoshop есть своя доля проблем, но стоит подумать, что вы с большей вероятностью столкнетесь с головными болями при работе с Fireworks.

Это промышленный стандарт

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

Это то, с чем вы знакомы 

Возможно, самый сильный аргумент в пользу использования Photoshop заключается в том, что вы уже узнали об этом, и это удобная часть вашего рабочего процесса. Как мы видели в нашей дискуссии на опросе читателей, подавляющее большинство людей, которые начали с Photoshop, остались с Photoshop. Зачем? Потому что это работает! И, как говорится в старой поговорке, «если она не сломалась, не исправляй ее». Изучение новой программы требует времени и денег - и если у вас нет какой-либо насущной причины для начала использования Fireworks, на самом деле нет никакой причины сделать этот переключатель прямо сейчас.

Есть богатство учебников и ресурсов

Давайте посмотрим правде в глаза, в то время как для Fireworks, учебных пособий и ресурсов Photoshop больше учебников, а количество ресурсов, основанных на Fireworks, не превышает 10-к-1. Что это значит для тебя? Ваша вероятность найти удивительные образовательные предметы (например, на PSDTuts!) Намного больше шансов найти тот же контент для Fireworks. Для многих это достаточно, чтобы сбалансировать тот факт, что Photoshop сложнее изучить.

Это универсальный магазин

Дизайнеру, который использует Fireworks, как правило, все равно придется использовать Photoshop для создания любой расширенной графики ... но большинство пользователей Photoshop не беспокоятся о том, чтобы когда-либо открывать Fireworks. Зачем? Потому что им это не нужно. Все основные функции находятся прямо в Photoshop. В то время как Fireworks может иметь несколько улучшенных функций, пользователи Photoshop не пропускают их, потому что они даже не знали, что они существуют;)


Недостатки использования Photoshop

  • Большие размеры файлов = более низкая производительность.
  • Не существует собственных «веб-инструментов», которые не могут сохранять изображения для Интернета.
  • Это дороже - $ 699 для Photoshop / $ 299 для Fireworks. Имейте в виду, что это не просто разовая покупка - обновления также дороже!

Ввод этого в контекст

Adobe Photoshop versus FireworksAdobe Photoshop versus FireworksAdobe Photoshop versus Fireworks

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

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

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

Увеличенная картинка

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

Когда вы спрашиваете веб-дизайнеров, какое программное обеспечение часто использует общие ответы, это Photoshop, Fireworks и Dreamweaver. Нет ни одной программы, более популярной, чем другая, поскольку есть разные причины, по которым дизайнеры узнают, какое программное обеспечение над другим. Много говорится о том, как Adobe Photoshop и Macromedia Fireworks одинаковы для веб-дизайнеров, но этот широкий обзор не дает ни программного обеспечения, которого он заслуживает.

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

Существуют и другие варианты программного обеспечения для веб-дизайна (такие как Pixelmator для Mac, ULead, Xara, Stone и другие), но эти два являются основными игроками и наиболее обсуждаемыми.


Более глубокий взгляд на Photoshop

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

У Photoshop также есть репутация. Это самое популярное и уважаемое программное обеспечение для графического дизайна. Он стал рыночным стандартом, и многие клиенты ожидают от дизайнеров его использовать. Может потребоваться некоторое объяснение, если вы хотите представить файл Fireworks .png вместо документа Photoshop .psd.

Когда дело доходит до управления цветом, вы не можете получить лучшую программу, чем Photoshop. Adobe имеет профессиональные цвета вплоть до науки.

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

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

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


Более глубокий взгляд на фейерверк

Macromedia Fireworks был разработан специально для веб-дизайнеров. Пользовательский интерфейс прост в использовании и навигации. Хотя обучение Adobe Photoshop может быть долгим и разочаровывающим процессом, сбор фейерверков занимает совсем мало времени. Программное обеспечение более интуитивно понятное, чем Photoshop, и более гибкое в использовании.

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

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

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

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

Fireworks имеет свою долю сбоев и ошибок, как и любая другая программа, но Adobe заявила, что планирует решить эти проблемы с будущими обновлениями теперь, когда она перешла на Macromedia.


Почему бы не использовать оба?

Я надеялся, что вы спросите! В идеальном мире было бы целесообразно использовать каркас сайта в Fireworks, перейти к Photoshop для расширенной детализации, а затем использовать Fireworks для компоновки сайта и экспорта его для Интернета ... на практике, хотя это не совсем работает , Многие люди предпочитают делать это для определенных элементов (например, сохранение фоновых изображений из Fireworks для уменьшения размера файла), но слишком часто файлы .PSD не будут отлично открываться в Fireworks. Группы слоев смешиваются, стили стилей стираются, и возникает разочарование. каждом конкретном случае (esp для использования улучшений PNG8 и сохранения для Интернета), но не ожидайте, что система с двумя программами станет надежной частью вашего собственного рабочего процесса, пока Adobe не сможет решить эти проблемы между программами.

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


Нижняя линия

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

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

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

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

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

В индустрии веб-дизайна вы найдете дизайнеров, которые клянутся Photoshop и другим, которые клянутся Фейерверком. Слушайте их за и против, но в конечном итоге решение зависит от вас. Нет никаких убедительных доказательств того, что одна программа лучше, чем другая, просто работает по-разному для разных пользователей и талантов.


Об авторе (и)

Брэндон Джонс (редактор сайта для Webdesigntuts +) написал введение и «сравнительные точки» этой статьи. Грег Бейтс внес свой вклад, написав дополнительную справочную информацию по каждой программе, а также предоставив отраслевые исследования.

Грег Бейтс является Sophmore в CSULB и в настоящее время специализируется на информационных системах, но также проводит занятия на стороне для веб-и графического дизайна. Он является автором онлайн-журнала StyleCeo, который посвящен моде. Он также строит веб-сайты с нуля для разных онлайн-компаний и корпораций. В свободное время он любит заниматься спортом, быть со своей девушкой или просто заниматься внештатной работой. Если вам нравится его работа, и вы хотите, чтобы он работал фрилансером для вас, вы можете связаться с ним по адресу http://twitter.com/TheAllureIs_.

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


Продолжить обсуждение

У нас уже было почти 100 замечаний на пост читательского опроса, но если у вас есть комментарии, предложения или вопросы, отправьте их здесь! Большая часть этой статьи заключается в том, что она может объединить других веб-дизайнеров, чтобы поделиться своим опытом и рабочими процессами ... так как вы используете эти программы?

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Web Design tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.