Figma vs Sketch vs Adobe XD: Кой е по-добрият инструмент за дизайн?

Защо трябва да се грижите за Figma срещу Sketch срещу Adobe XD? Не може да се отрече, че през последните години наблюдаваме монументален растеж в наличието на инструменти за проектиране на потребителски интерфейс. Когато Sketch за първи път излезе, той напълно промени хода на действие за всички дизайнери. Само две години след първоначалното му издаване, Скицата беше отличена с наградата за дизайн на Apple.


Но, Sketch не е единственото по рода си приложение, на което дизайнерите обръщат голямо внимание. Figma, както и Adobe XD, бързо наваксват, както в мащаба на функциите, така и в глобалния пазарен дял.

В техните годишен доклад за проекта, Avocode установи, че Sketch представлява 56% от всички добавени дизайни, като Figma и Adobe XD споделят останалата част от процента.

Изглежда, че за Sketch най-голямото място е софтуерният подход, който е само за Mac. Като има предвид, че Figma и Adobe XD могат да се използват в Windows и дори Linux системи.

Освен това повечето дизайнери ще вземат предвид фактора на разходите. И в този отдел определено има много съперничество.

Figma срещу Sketch срещу Adobe XD

Нека разгледаме по-отблизо, за да разберем как Figma срещу Sketch срещу Adobe XD се сравняват помежду си, и нека първо да се справим с проблема №1:

Цените на Figma срещу Sketch срещу Adobe XD

Могат ли безплатните инструменти за дизайн на потребителския интерфейс да се конкурират с платените алтернативи? Както ще бъде показано в този цялостен преглед, да – те могат. Фигма и Adobe са възприели подхода на модела на безплатен бизнес и той се отплаща голямо време.

  • Скица ще ви върне 99 долара за първата покупка. След това можете да използвате тяхната програма за съществуващи клиенти, за да подновите 69 долара годишно. Такъв лиценз включва актуализация на стойност една година и достъп до Sketch Cloud за една година. Студентите и образователните институции могат да се възползват от щедра 50% отстъпка.
  • Figma ви предоставя безплатно, ако сте независим дизайнер. Планът Starter позволява три проекта и неограничено съхранение. За екипите Професионалният план започва от $ 12 на месец, с неограничен достъп до всичко и допълнителни функции.
  • Adobe XD идва с безплатен стартов план. Като такъв, инструментът може да се използва без свързани разходи за физически лица. Дизайнерските екипи могат да получат пълния опит на Adobe XD за $ 23 на месец.

Поддръжката на платформата на Figma срещу Sketch срещу Adobe XD

И трите инструмента имат своите различия в поддръжката на платформата. Което също допринася значително за броя потребители, които всеки инструмент има. Ето кратка задача за конкретните операционни системи, в които можете да използвате всеки инструмент.

  • Скица. Предлага се само за потребители на Mac (OS X). Без изключение.
  • Figma. Браузър-базирани! Приложения за настолни компютри, достъпни за Mac и Windows без поддръжка офлайн. Може да се използва на Linux машини в браузъра!
  • Adobe XD. Поддържа Mac и Windows системи.

Figma срещу Sketch срещу Adobe XD имат интересни ценови точки и подходи. И има много различни причини, поради които едната превъзхожда другата.

Ако имате мощна настройка, можете технически да стартирате някой от тези инструменти чрез a Виртуална машина околен свят. Например Потребителите на Mac могат да инсталират Windows на своите Apple устройства, използвайки Boot Camp ап.

Добре. Сега, когато имаме всички дребни детайли от пътя, нека разгледаме по-подробно какво прави всеки от тези инструменти за дизайн на потребителския интерфейс толкова специален:

Скица: интуитивен & бърз

скица

Една от многото причини, поради които дизайнерите обичат Sketch, не е само неговият ясен и здрав потребителски интерфейс.

Bohemian Coding, компанията майка, също бърза да изкара нови и иновативни актуализации за инструмента. Само през последната година имаше 19 забележителни актуализации. Този вид темпове на развитие със сигурност помага да се изравнят свързаните с тях разходи за Sketch.

Но, все пак, това не е единствената причина да обичате Sketch. Инструментът е известен с популярността си Функционалност на приставката. Мислете за това като Мениджър на пакети за Sublime Text – можете да намерите пакети, които не само подобряват времето ви за разработка, но и ви помагат да напишете по-добър код. Е, за Sketch, плъгини ви помагат да проектирате по-добре и по-бързо.

Скица срещу Figma появяваща се система на плъгини

Можете да търсите приставки във връзка с мрежата или да използвате приставки като Lazyboard. С Lazyboard е възможно да обвиете няколко слоя Sketch в рамките на един Artboard, така че можете да спестите време при персонализиране и други партидни задачи.

Wrap-в-artboardsGif Източник: GitHub

В едно от по-новите издания (Скица 55) – компанията въведе функции като Copy & Поставете SVG код, интелигентна дистрибуция и корекции в начина, по който елементите щракат между схемите, базирани на мрежата.

Нека да кажем, че имате този SVG код (многоъгълник с три страни):

Обикновено трябва да го запишете като .svg документ и след това да го заредите вътре в Sketch, за да може да се визуализира. Е, в новата версия можете просто да копирате и поставите този фрагмент на SVG код и той автоматично ще се изобрази като нов слой.

Скица SVG копие паста

Очаквайте да намерите още много такива скъпоценни камъни, ориентирани към производителността, в целия Sketch.

Раздаване на спецификации на разработчиците

Стигаме до момент в UI дизайна, при който дизайнерите могат да експортират цял ​​дизайн с напълно функционална спецификация за разработчиците. И макар това да не е достъпно като естествена функция за Sketch, има приложения и приставки на трети страни, които да направят това възможно. а именно, Zeplin е създаден, за да направи спекулациите изключително прости и лесни. И с голяма точност също.

Специализирано предаване на Zeplin

Но какво ще стане, ако искате нещо, което е интегрирано директно в Sketch? За целта погледнете в Скица мярка плъгин. Това ще ви даде пълна функционалност за създаване на спецификации за вашите разработчици в реално време.

Скица Измерване на спекулацията

Можете да видите в този пример, че плъгинът предоставя високо точна информация за елементите. Включително семейство шрифтове, позициониране и подходящ CSS код, който разработчиците могат да използват веднага.

Наистина има чувство, че стигаме до момент, в който инструментите за дизайн на потребителския интерфейс ще могат да импортират напълно функционални дизайни от първото.

Sketch доставя огромна библиотека с ресурси

Една от причините, поради които Sketch е толкова привлекателна за новите и опитни дизайнери, е огромната наличност на безплатни дизайнерски ресурси.

Sketch vs Adobe XD ресурси

На своето документация страница, Sketch изброи стотици различни секции за улесняване на усвояването на този софтуер. Но на всичкото отгоре има и сайтове като Ресурси за скициране на приложения, и Скица Репо, и много други. По същество това са "отворен код" сайтове, където дизайнерите могат да представят своите финализирани дизайни за всеки, който да изтеглите.

Това гарантира, че никога не е необходимо да стартирате проект от нулата. Освен това може да ви липсва информация как да постигнете конкретен резултат с вашия дизайн.

Безплатни ресурси на Sketch Repo

За това можете да се обърнете към сайтове за ресурси на Sketch, за да намерите точното решение, което желаете. О, и да, лиценз безплатно!

Има толкова много повече за Sketch, че я прави един от водещите инструменти за дизайн на потребителски интерфейс в света. Но докато правим сравнителен преглед, нека разгледаме функциите, които правят инструменти като Figma и Adobe XD също да се открояват от тълпата.

Figma: базирана на браузъра & здрав!

figma

Фигма излезе на сцената през 2015 година с първоначално финансиране от 14 милиона долара.

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

Дизайнери от марки като Twitter, Microsoft, GitHub и Dropbox се кълнат от Figma като най-добрият инструмент за дизайн на потребителския интерфейс.

Така ли, защото Figma предлага безплатен план, че е намерил такъв успех толкова рано в своята пътна карта? Със сигурност не.

Инструментът предоставя няколко решения, интегрирани в един потребителски интерфейс:

  • UI & UX дизайн
  • прототипи
  • Графичен дизайн
  • Wireframing
  • Templates

И това прави както в браузъра, така и в неговия настолно базирано приложение. Фактът, че Figma е създадена за браузъра, означава, че потребителите на Linux могат да използват Figma и в своите базирани на Unix системи. Масов плюс!

Не е нужно да инвестирате много време и в процеса на проектиране. Фигма се грижи за това чрез своите Templates предлагане. Това са телени рамки, блок-схеми, диаграми, сюжетни карти и пълни шаблони на уебсайтове, предварително направени само за вас.

Безплатни шаблони на фигма

Тук имате готов шаблон на уебсайта на SaaS, който можете веднага да редактирате и оптимизирате по ваш вкус. Такива шаблони (слоеве, групи и т.н.) също могат да бъдат запазени за по-късна употреба за по-лесно импортиране.

Figma прави място за свободно място на вашия твърд диск

Хубавото на Figma е, че не е нужно да записвате нищо на компютъра си. Всички файлове се съхраняват в облака и са достъпни навсякъде. Като потребител на Sketch или дори на Adobe XD може да имате свикна с 50GB + папки с дизайнерски файлове. Това вече не е така при Фигма.

Figma vs Sketch сравнение на файловото управление

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

Сътрудничество в реално време

Може би най-известната характеристика на Figma са инструментите за сътрудничество. В основата на работата с множество хора е сътрудничеството. В старите дни на Photoshop трябваше да изпращате безкрайни ревизии на колегите си, само за да влезете в същата страница. С Figma сътрудничеството е едновременно мощно и мигновено!

Фигма инструменти за сътрудничество

Ето как Figma решава задачи за сътрудничество в реално време:

  • Коментирайки. Използвайте интерфейса, за да изберете раздела за коментар и незабавно изпратете на някого линк към вашия коментар. Маркерът може да бъде оставен точно върху зоната, която коментирате.
  • Редактиране на много хора. Редактирайте файл заедно с множество хора и вижте действията им в реално време. Редактирането на много хора също може да бъде деактивирано, когато работите върху функция сами.
  • Копирайт. Ако имате отделен копирайтър или редактор на съдържание, можете да им дадете достъп да напишат копието си заедно с работата си в реално време.
  • Разнообразие на платформите. Тъй като Figma работи в браузъра, вашите колеги могат да се присъединят към това дали използват Mac система или Linux или Windows машина. Това наистина дава възможност за свобода!

В по-голямата си част Figma оставя и Sketch, и XD на Adobe твърде далеч назад, за да се считат за надеждни алтернативи за сътрудничество в реално време.

Потребителският интерфейс, базиран на браузъра, дава възможност за безпроблемна колаборация, без да е необходимо да се подготвяте за него поотделно. Очаквам подобни функции да бъдат въведени в други инструменти в близко бъдеще!

Adobe XD: безупречен потребителски интерфейс & UX дизайн

Adobe XD

Adobe не се свързва често с безплатната цена. Компанията има прословута репутация, че предлага продукти от световна класа на премиум цени.

Но изглежда, че дори Adobe осъзнава, че трябва да направи нещо, за да не загуби от огромния пазарен дял на дизайнерите по целия свят. И техният отговор е превръщането на Adobe XD в безплатен инструмент за проектиране на потребителски интерфейс.

По същия начин, освен добавяне на нови функции, Adobe също продължава да се занимава за да направи XD възможно най-подвижен. В крайна сметка приставките улесняват постигането на най-добри резултати по-бързо.

Adobe XD приставкиИзточник на снимката: кирпич

Много от съществуващите приставки за Sketch вече са пренесени в XD, но като независим инструмент – XD предлага и интеграции с добре познати услуги като Trello, Google Sheets, Airtable и много други.

Дизайн и прототип с лекота

Фокусът на Adobe с XD изглежда прави нещата лесни и интуитивни. От създаването на нов проект до управлението на прототипи, повечето функции са само на едно кликване.

Прототип и дизайн с Adobe XD

След като изберете тип проект (уеб / телефон / таблет), можете веднага да започнете да работите върху вашия дизайн. Активите за вашия проект могат да бъдат предварително заредени или споделени от други потребители на XD във вашия екип.

Adobe XD активи

Това също прави лесно да сте в крак с всички съществуващи дизайнерски спецификации, с които работи вашият екип. Прекарвайте по-малко време за намиране на файлове и повече време за проектиране!

Функциите за сътрудничество на Adobe XD са справедливи

Когато си сътрудничите, Adobe предлага два варианта: да работите заедно върху облачен документ или да качите документ от вашия компютър. Предишният вариант ускорява сътрудничеството. А поканяването на нови хора също е изключително лесно.

Функции за съвместна работа на Adobe XD

В горния десен ъгъл на вашия инструмент имате бутона Споделяне. Тук ще намерите няколко начина за споделяне на вашите XD дизайни.

Вариантите са:

  • Поканете за редактиране
  • Сподели за преглед
  • Сподели за развитие
  • Запис на видео

И така, в ретроспекция, това са всички опции, съобразени с по-плавния работен процес на проектиране. XD може автоматично да разбере спецификациите, които използвате, така че да можете да ги изпратите на разработчици. Освен това можете да запишете видеоклип, който да показва всички специфични характеристики на нещата, които изграждате. Последното е удобно за екипи, които работят предимно в отдалечени среди.

Достъп до огромната ресурсна мрежа на Adobe

Adobe е марката зад огромни хитове като Photoshop, Illustrator, но също така и Behance, Spark, Adobe Fonts и Adobe Stock. Това са всички базирани на ресурси сайтове, които можете да използвате директно с Adobe XD.

Така че, нека кажем, ако имате Adobe Fonts абонамент активен, можете просто да синхронизирате всички налични шрифтове с XD таблото си за управление. Това ще ви даде достъп до хиляди интересни, уникални и дефиниращи дизайнерски шрифтове на дланта.

Adobe XD предлага Adobe Creative Cloud

Присъдата: Figma срещу Sketch срещу Adobe XD

И така, тук приключваме нашето ревю на Figma vs Sketch vs Adobe XD.

И трите инструмента са изключително подходящи за нуждите на съвременния дизайнер. Бих казал, че Sketch е с голяма загуба тук, тъй като е достъпен само за потребители на Mac. И като такъв, той дава възможност на инструменти като Figma и Adobe XD да се иноватират извън основните потребности.

В края на деня, ако вашият инструмент направи нещо по-добро от другия, често е достатъчно причина да превключите. Подходът, базиран на браузъра, който Figma възприема, също е нещо, което трябва да се наблюдава. В моя кръг от дизайнерски приятели, винаги Figma получава най-висока оценка.

А що се отнася до Adobe XD – мисля, че в момента Adobe е на добро място. Те имат голяма гъвкавост, за да подобрят своя инструмент и да добавят нови функции. Независимо от това, техните интеграции на трети страни също са забелязани, което го прави добър избор за екипи, които постоянно искат да променят или коригират нещата.

Ако наистина трябва да класираме тези три, ще трябва да бъде това:

  1. Figma ��
  2. Скица ��
  3. Adobe XD ��

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

Не забравяйте да се присъедините към нашия крах курс за ускоряване на вашия сайт WordPress. С някои прости поправки можете да намалите времето за зареждане дори с 50-80%:

Оформление, презентация и редакция от Karol K.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map