Бесплатные сервисы для работы с макетами Photoshop (PSD). Zeplin и Marsy - достойная замена Avocode
Вставка
- Опубліковано 28 тра 2024
- Сегодня познакомимся с двумя бесплатными сервисами для работы с макетами PSD которые могут стать заменой авокоду. Как мы с вами знаем, HTML-верстка выполняется на основе макетов дизайна, которые в свою очередь создаются дизайнерами в специальных редакторах. Таких как фотошоп, скетч, адобе ХД, фигма иллюстратор и прочие. Проблема в том, что нам, мастерам по верстке, работать в этих редакторах не всегда удобно, да и они скорее всего они будут стоить денег. Поэтому, существует ряд сервисов для более комфортной и быстрой работы с макетами на этапе верстки. В случаи с фигмой все просто - она и редактор и сервис да еще и бесплатна, так что заслуживает отдельного выпуска. Но проблема в том что фигма работает только со своим форматом созданным прямо в ней, это файлы .FIG. Остальным популярным форматам, таким как Photoshop PSD фигма показывает фигу. Что же делать если нам нужно верстать из PSD файлов? Но делать это в фотошопе это как спать на потолке да еще и платить за это… Да, существует суперпупер Авакод! Он мега крут и поддерживает все необходимые форматы, даже фигму. Отдельный выпуск об этом сервисе есть по ссылке в описании. Но, он тоже платный и не из дешевых так что подойдет уже работающим специалистам. А на этапе обучения и становления хотелось бы что-то бесплатное.
🔴Канал "IT-ПРИСТРАСТІ": / @itpassions
🔴Канал Ореста Зуба (УКР): / orestzub
👉Сервис Zeplin: zeplin.io/
👉Сервис Marsy: www.markupeasy.ru/
👉Сервис PSDetch: psdetch.com/
👉Сервис Sympli: sympli.io/
👉Сервис MockPlus: www.mockplus.com/
👉Обзор Avocode: • Avocode для верстальщи...
00:00 - В выпуске
00:11 - РЕКЛАМА
00:49 - Сервисы для работы с макетами
02:16 - Zeplin
09:57 - Marsy
15:26 - Сравнение сервисов
16:28 - Заключение
🔴 Карта канала: miro.com/app/board/o9J_lZB3YKI=/
🔴 Получить доступ к плюшкам + поддержать канал: / freelancerlifestyle
🔴 Telegram канал: t.me/freelancer_lifestyle (teleg.run/freelancer_lifestyle)
🔴 Telegram чат по верстке: t.me/flschat (teleg.run/flschat)
🔴 Facebook: / freelancerlifestyle
🔴 Instagram: / freelancer.lifestyle
👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками!
Ссылка на канал: / freelancerlifestyle
🤟 Живи, а работай в свободное время! ©
🤟Пишите еще сервисы которые знаете!
🔴 Карта канала: miro.com/app/board/o9J_lZB3YKI=/
🔴 Получить доступ к плюшкам + поддержать канал: www.patreon.com/freelancerlifestyle
🔴 Telegram канал: t.me/freelancer_lifestyle (teleg.run/freelancer_lifestyle)
🔴 Telegram чат по верстке: t.me/flschat (teleg.run/flschat)
🔴 Facebook: facebook.com/freelancerlifestyle
🔴 Instagram: instagram.com/freelancer.lifestyle
Я юзал PSD
ETCH. Работает без установки. Вроде норм.
А онлайн сервис Photopea
@@hvvngvnbgfhfbjggghj4503 я после него марси попробовал, очень похоже но гораздо удобнее, советую затестить)
@@iamname8758 Спасибо) Попробую
Женя, смотрел многих зарубежных блогеров ... Очень популярна тема CSS battle... Хотелось бы увидеть реализацию различных задач с твоей точки зрения и мышления....спасибо за все , что ты делаешь:)
Как же я рад, что в бесплатном доступе на Ютуб один человек делает такие нужные подсказки в работе. Спасибо огромное! Если бы вы были преподавателем в университете, то были бы любимым!
Спасибо!
Примени знания на практике, не спеши радоватся. Научится не сложно, работу сложно найти, если ты не собераешься быть гребнем в офисе.
Согласен)
@@slava1300 это наверное во всех сферах. Но без знаний точно никуда не попасть. Мои одногруппникам ( те кто реально в этом шарили) все работают и некоторые очень даже не плохо.
Единственный канал, обновления которого я жду, отслеживаю и смотрю от корки до корки. Талантливый учитель, мастер своего дела, интервьюер, красавчик!
котрий вже урок проходжу і не можу повірити, що такий якісний, продуманий матеріал з підказками, завданнями, прикладами просто так доступний безкоштовно, дуже Вам дякую за вашу працю
круто что в мире есть такие альтруисты как ты Жека, благодаря тебе люди могут доступно начать учить и открывать для себя новые хобби и профессии. ты направляешь жизни людей в правильный вектор, спасибо тебе огромное.
Спасибо за видео! У меня с Marsy не заладилось несколько дней назад, а сейчас зашла и мой макет там; видно долго загружался, а я подумала, что ничего не работает. Заниматься одно сплошное удовольствие, да еще и с вашим шаблоном!
Marcy давно пользуюсь.
200р в месяц и вот оно счастье!
Советую!
Отлично!
А с помощью какого плагина (в браузере) добиваешься пиксельперфекта?
@@user-zl2nt7zx8h PerfectPixel так и называется. Розовый квадрат)
Ааа как вовремя, только начала искать бесплатные аналоги и вот выходит видео)) Как по заказу снимаешь. Спасибо тебе!😝😽
Привет, видео супер!
Часто вижу макеты твоих учеников - очень крутые!
Привет! Спасибо, успехов в развитии сервиса!
Отличный сервис! Желаю успехов в развитии.
@@user-qn7zf9js3y Спасибо
Привет, а ты планируешь в будущем сделать прогу для работы в офлайн?)
@@user-ri6vl6sf1o Привет, пока нет. Серверная версия проще для разработки и отлова ошибок и проблем в макетах. Может позже, но пока даже в планах нет.
все ваши виде это лучшее что можно найти на русскоязычном сегменте! Я поддерживаю вас во всём! желаю мира и спокойствия вашей стране и семье
Большое спасибо Вам, Евгений! Как раз задумался над установкой Ph, как-то уже понравилась "Фига", а макет - psd. Думал об альтернативе. И тут подоспел Ваш ролик. Ничего и гуглить не пришлось. Welcome to Marsy! Смотрю Ваш канал почти каждый день, в том числе в "фоновом режиме" (чтобы перестраивать мозги с проблем, с политики). Успехов!
Только закончился бесплатный 14 дней Авакод. Кааак. Это просто идеальный тайминг вовремя!
Ахах)
Kit001@
Kit002@
Kit003@ і тд
І фрішний авокод на весь час😅
@@komolovyuriy4709 Можна детальніше?))) Як саме можна отримати Авокод фор фрі?)
@@crownhetman6545 як тіки закінчується 2 тижні, створити новий мейл і ще на два тижні маєте. І так зациклити))
@@komolovyuriy4709 У вас після реєстрації в авокод не вимагає банківську карту?
Дуже своєчасне відео про сервіси для верстання макетів, тільки почав Ваш курс на youtube. І вже хотів навіть купувати підписку Avocode. А тут такий подарунок.
Дуже дякую. Ваші відео надихають на працю. 😁
Спасибо за то что вы делаете!) Это безумно крутой и полезный контент, к тому же бесплатный! Спасибо от всего сердца)))
Величезне ДЯКУЮ! Якраз шукав безкоштовну заміну Авокод! Дивлюсь всі Ваші відео і вчусь по ним з нуля! Ви- найкращий мотиватор!
Будь ласка!
І я!
Евгений, твой канал бомба!!! Это один из лучших контентов! Огромное спасибо!
Я рад! Пожалуйста!
Начала пользоваться Marsy давно, ещё когда там весь функционал был бесплатным😄 Так что пользовалась Marsy, пользуюсь и буду пользоваться))) Огромная благодарочка создателю этого сервиса 🙏 И тебе, Жень, за информативное видео)
Много пользовался zeplin ом, но ничего не знал о Marcy. Полезности продолжаются, спасибо Жека!
Пожалуйста!
Просто огромное тебе человеческое спасибо за все, что ты делаешь!
Блин, давно не заходил на канал, а тут такое... Искал я замену Авакода нашёл мерси и пошёл вспомнить что учил раньше, и бац... Вот везение... Спасибо за видео
Спасибо тебе, добрый человек за подробный обзор! :) Пользуюсь теперь Marsy!
Огромное спасибо! До этого видео не знал о Marsy, а он решил одну из моих главных проблем - больше не нужно держать жирный фотошоп на моём бедном SSD 32)
Вода: 0%
Полезная инфа: 100%
Спасибо!
100%
Возможно для многих будет ещё интересно, как сделать динамические элементы на странице, которые реагируют при движении мышкой. Примером твой сайт с танцующими бобами. Ставьте лайки, кто хотел бы увидеть)
огромное спасибо! жаль что времени не хватает все смотреть и изучать... постоянно пользуюсь шпаргалками, они рулят!!! все твои видео поднимают боевое дух до мурашек))
сначала посмотрел видео про Avocode, но сразу обломался)) думал что-то другое скачать и тут нахожу это видео, которое спасает меня от нервов и вырванных волос на голове)))
еще и видосик свежий, просто бомба!
блин теперь привычка срабатывает, хочу переместить строки как в редакторе кода)))
Безграничное спасибо за уроки. Это просто восхитительно)
Ждала это видео) Спасибо! Благодаря тебе, мое самообучением стало интереснее и продуктивнее)
Я рад!
Все по факту. Без воды. Просто топовый канал с лучшим контентом👍
Спасибо!
Спасибо, очень вовремя как раз то что нужно. Про подачу материала уже все сказал раньше, как всегда все ясно и понятно!!!
Спасибо Вам большое! Коротко, без воды, четкое мнение.
Пожалуйста!
У кого ФШ на русском, вместо "Artboard from group" на русском будет написано "Монтажная область из группы". И спасибо за видос!
Спасибо, Жека!
Нашёл хороший psd макет, и думал искать, в чём работать с ним. А тут видос! Thanks!
В первый раз столкнулся с PSD макетом и этой проблемой вытаскивания всех шрифтов. Найдя это видео, спустя 1,5 часа танцев с бубном вокруг фотошопа, изрядно посмеялся с шутки про потолок, спасибо)
Вовремя видосик сделал,как раз верстать макет начинаю пробовать ,спасибо огромное !!!
Пожалуйста!
Спасибо за видос! Начал пользоваться "Marsy" хорошая бесплатная замена Avocodу. очень доволен. И спасибо тому кто создал "Marsy".
Спасибо большое за очень годную и полезную информацию , искал разные аналоги ,но не один не подходил так как Марси , спасибо вам за помощь.
Сам пользуюсь сервисом Zeplin, но до этого не знал про способность выгружать изображения прямо из Zeplin (раньше всегда выгружал из Фотошоп, что для меня было не очень удобно). Спасибо тебе! С меня лайкосик! :)
ООООгромнейшее Вам, Евгений, СПАСИБО! Успехов!
Запили видос с полезными расширениями для веб дизайна.Спасибо за кучу полезных гайдов)
Спасибо тебе огромное за твою работу. Ты самый лучший. Удачи тебе и самое главное крепкого здоровья, от чистого сердца)
Добавлю, что над Zeplin работает команда, а над Marsy один человек!
Да
Евгений, большое спасибо за ваш труд!
Спасибо за классную подачу и топовый контент! Еще хотелось бы увидеть на канале (ну или я просто не заметил) видео с детальным разбором того, как и с помощью каких сервисов тестировать свою готовую верстку - валидность, оптимизация, кросбраузерность, адаптивность, скорость загрузки сайта и так далее.
Есть такое, часть, в стримах - Ваши работы...уже давно...
классный канал,очень много полезной и бесплатной информации. Для новичков то,что нужно
Привет, Женя) Ты просто нереально крут!! Спасибо тебе огромное!! Я относительно недавно подписалась на канал и просто в шоке от количества полезностей) Очень жду и надеюсь, что будут видосы про Wordpress))
Пожалуйста!
За почти год подписки на твой канал, Жень, у меня закончились нематерные позитивные эпитеты. Я могу написать, что это видео о***тельно?))
Я рад что полезно!
Спасибо за обзор! После окончания бесплатного периода на авокоде перешел на Zeplin, но вот без твоего видео и не увидел, что там есть функция "пиксель перфект")
Я рад!
Жека, спасибо за полезный материал👍 С твоими видосами, я просто обречён на успех🏆💪 😁
Пожалуйста!
Большое спасибо, потратил много времени что бы найти нормальные сервисы!
Женька, == о це тєма. А то все відкладував, покупку avacode. Молоді веб-розробники порекомендували Figma & Zeplin...
І ти тут, як тут. Зі своїм вголовувкладующим матеріалом...
Камінь з душі злетів. Верстати макет полетів :D
ДЯКУЮ !!!
Евгений Вы Лучший!!! Жирный Вам вечный ЛАЙК!!! смотрю Ваши видосики как ''наркоман'', с мыслями, хоть бы не закончились, хоть бы дальше еще были видосики))
Очень полезная информация, спасибо большое😊
Пожалуйста!
Супер, Женя, спасибо! У меня нет фотошепа и я открывал файлы псд в бесплатной программе Gimp, которая похожа на фотошоп, но к ней надо привыкнуть. Но Zeplin и Marcy дают новые возможности! Круто!
Я рад что полезно!
ну и как Gimp в использовании? неудобная как фотошоп или же удобная как фигма? там есть ограничения по количеству проектов?
@@ivanrussui4126 я сначала работал в фотошопе, потом надоело платить ( не зарабатывал этим ), потому стянул себе Gimp ( Гимп полностью бесплатный ). Там немного другие способы управления инструментами, но принцип работы тот же. И в нем можно открыть файл который был сделан в фотошопе. Конечно, фотошоп лучше чем Гимп, ну а фигма лучше обоих, но в фигме не откроешь псд, не такли ? :)
@@olegsemenukha4107 да так) Но как я понял Gimp еще менее удобен, чем фотошоп, то есть там увидеть расстояние в наведении и т.д.. Значит Марси поудобнее будет
@@olegsemenukha4107 чувак пиратку скачиваешь и все.
Спасибо! Как доходчиво объясняешь👍👍👍
Очень своевременное видео для меня! Спасибо!
Пожалуйста!
Огромное спасибо, Друг!!! А то Фотошоп мой комп еле-еле тянет, а Марси самое оно)) Ты красавчик!
Спасибо, Жека! Мега полезное видео!!!
Пожалуйста!
Спасибо, Жека, как всегда вовремя.
Пожалуйста!
Женя, просто спасибо тебе за то, что ты делаешь
Отличный канал. Учиться никогда не поздно.
Платная подписка на marsy стоит просто копейки, даже для самого большого жмота. 40 грн. Не жалко что б поддержать такого классного разраба.
Спасибо! Как всегда все по делу.
Спасибо за отличное видео! Удачи тебе во всем !!!
Пожалуйста!
Очень классные ты делаешь видео. Спасибо тебе большое. Успехов тебе.
Классное и полезное видео досмотрел до конца и поставил лайк 👍.
Спасибо!
Спасибо вам большое, благодаря вам узнал очень много полезной информации.
Я рад!
Спасибо большое. Крайне полезное видео !!!
Пожалуйста!
Огромное спасибо за Ваши труды
Крутое видео. Столкнулся с такой же проблемой при обучении. Хотел бы добавить что в зеплине не можно работать со шрифтами как в авокоде, что не очень удобно. А в марси это можно но платно, хотя и подписка совсем недорогая)
Спасибо! Да везде есть плюсы и минусы)
Короче, жалуюсь на жизнь: потратила день на борьбу с этими сервисами. А все потому, что отступы, якобы, отличались от тех, что отображались у Жени на записи стрима. Признала поражение в этом деле и села дальше смотреть видосик. А Евгений через какое-то время молвит с монитора: "тут, конечно, 168 пх, а не 125." Ошибся, мол с замером. 168, а не 125! Я что, помню эти числа?) Похоже, травму нанес мне😄 Прекрасный человек! Большое спасибо за работу🤗🤗
Пожалуйста! Рад что полезно))
Женя, спасибо за очередное полезное видео!
Пользовался марси, пока проходил уроки по css, отличный аналог. автор всегда на связи, есть конечно нюансы в использовании, но блин за 100--200 рублей функционал очень схож с авкодом за баснословные бабки для самоучек. Приходилось пробовать кучу разных проектов пока его нашел. А тут все по полочкам опять и годные программы людям. Вот кому то повезет, кто будет учиться через пару лет по готовым проектам Евгения.
Спасибо!
Еще не посмотрел, но лайк поставил!)
Спасибо!
Щиро дякую за згадку, друже. Успіхів 😉
Ееее, ждали с нетерпением)
Круто!
Лайкос за это выражение я просто стеганулся (А делать это из фотошопа"верстать", это все равно что спать на потолке и еще платить за это) жесть, но правда! Зачет!
Я искала замену Avocode, и нашла Марси пару месяцев назад.
Но в бесплатной версии есть проблема с определением font-family: Marsy определил шрифт как Open Sans. А приложение в Chrome as Lato.
Оба немного не то...
Это лучше, чем ничего. В принципе, довольна.
Советую.
Добрый день.
Напишите мне на почту, есть в шапке сайта marsy.
Укажите название макета и скриншот элемента в котором неверно шрифт определён.
Гляну, при необходимости выпущу фикс.
@@markupeasy5562 спасибо за оперативность. Вопрос решён. Как не странно, шрифт совпал с раннее определённым Open Sans.
Спасибо! Буду использовать эти программы
Спасибо большое, отличный выпуск!)
Спасибо!
Использовала Marcy еще до того, как он стал платным. После установления платных услуг отпал показ размера блока, что весьма неудобно. Но как по мне, 100 руб. в месяц - это копейки, почему бы не поддержать разработчика, он большой молодец!
даже не обращал внимания на стоимость месячной подписки, пока не прочитал твой комент. сотка это по нашему) считай всего 0.5 пенного в месяц за неплохой такой просмотрщик
Очень-очень полезно, спасибо!!!
Дуже подобаеться ваша подача і ваші відео. Шкода що раніше не натрапив на ваш канал.
Дякую!
Прежде всего спасибо за каждое видео !
Подскажите, как слои в фотошопе были выбраны сразу , а не прокликивая каждый ?
Начала недавно щупать Zeplin, есть неудобства. Попробую Марси, спасибо за рекомендацию
сПАСИБО вам за великолепный контент!
В Zeplin еще полезные фишки есть, полностью палитра цветов используемых в макете на отдельной вкладке и так же на отдельной вкладке все изображения из макета, можно сразу посмотреть или скачать все изображения не кликая на каждое в макете, плагины для отображения стилей в синтаксисе SASS, SCSS, LESS, возможность добавлять цвет, отступы, шрифт в переменные и скачать отдельным файлом.
Да, верно
Спасибо Учитель! Добра Вам! А будут ли видео с версткой макетов для тренировки?
Крутяяяк, наконец-то дождался этого видео!!! А то я замучился с фотошопом ох как замучился
Я рад!
Жека спасибо большое! информативно!
Женя нужен плэй-лист с обзором на хостинги, регистрацию, домены, платно(для заказчиков) , бесплатно (для тестов и может для знакомых)! Очень буду рад если выпустишь обзоры на эту тему, заранее спасибо!
Видео можно сказать,имба!
Отличное видео. Советую обратить внимание на psdetch. Бесплатный, понимает все форматы, лучше зеплина, в том плане, что не нужно иметь установленных фотошопов с хд.
Спасибо! Уже добавил в описание
видео вышло ровно в мой день рождения ;D
Молодец Женя, спасибо тебе!
Досить корисне відео. Дякую!)
Дякую. Буду вчитися користуватися цими сервісами.
сходу лайк)уже рефлекс выработался)
Спасибо!
@@FreelancerLifeStyle Бро, от души=))Может пока эта твоя работа на ютубе не приносит тех материальных дивидендов, как должна была бы. Но скоро профессионализм твоих учеников и последователей вырастет, пойдут заказы, деньги и все вернется сполна. Я лично планирую от дохода тебе отсыпать, думаю таких, как я, тут полно=)
Жека, сделал полезное видео, респект тебе и уважуха!!!)))
Спасибо!
Здравствуй Женя, начал изучать вёрстку в твоём плейлисте где 100 видео про вёрстку, а потом увидел такую же где 43 видоса, какой лучше будет смотреть новичку? Или с какого начать?
А так же хочу поблагодарить тебя за такие очень понятные гайды)
Женя, подскажите, есть ли бесплатная альтернатива Photoshop? И спасибо за все, что вы делаете!