Figma vs Sketch vs Adobe XD: Quina és la millor eina de disseny?

Per què hauríeu de tenir cura de Figma vs Sketch vs Adobe XD? No hi ha de negar que en els darrers anys hem vist un creixement monumental en la disponibilitat d’eines de disseny d’UI. Quan Sketch va sortir per primera vegada, va canviar completament el curs de l’acció per a tots els dissenyadors. Només dos anys després del seu llançament inicial, Sketch va rebre el premi Apple al disseny.


Però, Sketch no és l’única aplicació d’aquest tipus que els dissenyadors estan prestant molta atenció. Figma, a més d’Adobe XD, han estat a la velocitat, tant a escala de funcions com a quota de mercat global.

En el seu informe anual de disseny, Avocode va trobar que Sketch representava el 56% de tots els dissenys afegits, i Figma i Adobe XD compartien la resta del percentatge..

Sembla que per a Sketch, el coll d’ampolla més gran és el seu enfocament de programari exclusivament Mac. Mentre que Figma i Adobe XD es poden utilitzar en sistemes Windows i fins i tot en Linux.

A més, la majoria de dissenyadors tindran en compte el factor cost. I, sens dubte, hi ha molta rivalitat en aquest departament.

Figma vs Sketch vs Adobe XD

Mirem més de prop per esbrinar com es comparen Figma vs Sketch i Adobe XD entre si, i abordem el número 1 primer:

El preu de Figma vs Sketch vs Adobe XD

Les eines de disseny d’UI gratuïtes poden competir amb alternatives de pagament? Com es mostrarà en aquesta crítica completa, sí, sí. Figma i Adobe han adoptat el plantejament d’un model de negoci freemium i està donant els seus fruits.

  • Esbós us retornarà $ 99 per la compra per primera vegada. Després, podeu utilitzar el seu programa Client existent per renovar-se a 69 dòlars anuals. Aquesta llicència inclou un valor d’un any d’actualitzacions i accés a Sketch Cloud durant un any. Els estudiants i les institucions d’educació poden beneficiar-se d’un descompte generós del 50%.
  • Figma et dóna accés gratuït si ets un dissenyador independent. El pla d’inici permet tres projectes i emmagatzematge il·limitat. Per equips, el pla Professional comença a partir de 12 dòlars mensuals, amb accés il·limitat a tot i funcions addicionals.
  • Adobe XD inclou un pla d’inici gratuït. Com a tal, l’eina es pot utilitzar sense costos associats per a particulars. Els equips de disseny poden obtenir tota l’experiència Adobe XD per 23 dòlars al mes.

El suport de la plataforma de Figma vs Sketch vs Adobe XD

Les tres eines tenen diferències en el suport de la plataforma. La qual cosa també contribueix molt al nombre d’usuaris que té cada eina. Aquí teniu un detall sobre els sistemes operatius específics en què podeu utilitzar cada eina.

  • Esbós. Disponible només per a usuaris de Mac (OS X). Sense excepcions.
  • Figma. Basat en un navegador Aplicacions d’escriptori disponibles per a Mac i Windows sense suport fora de línia. Es pot utilitzar en màquines Linux al navegador!
  • Adobe XD. Suporta sistemes Mac i Windows.

Figma vs Sketch i Adobe XD tenen punts de vista i enfocaments interessants. I hi ha moltes raons diferents per les quals una és superior a l’altra.

Si teniu una configuració potent, podeu executar tècnicament qualsevol d’aquestes eines mitjançant un Màquina virtual medi ambient. Per exemple. Els usuaris de Mac poden instal·lar Windows als seus dispositius Apple mitjançant el Camp d’entrenament aplicació.

Bé. Ara que tenim tots els petits detalls fora del camí, anem a veure amb més detall què fa que cadascuna d’aquestes eines de disseny de la interfície d’usuari sigui tan especial:

Esbós: intuïtiu & ràpid

esbós

Una de les moltes raons per les quals els dissenyadors estimen Sketch no és només la seva clara i robusta interfície d’usuari.

Bohemian Coding, l’empresa matriu, també s’afanya a publicar noves i innovadores actualitzacions de l’eina. Només en l’últim any, hi ha hagut 19 actualitzacions destacables. Aquest tipus de ritme de desenvolupament, sens dubte, ajuda fins i tot a superar els costos associats a Sketch.

Però, tot i així, aquest no és l’únic motiu per estimar Sketch. L’eina és notòriament popular per la seva Funcionalitat del complement. Penseu-hi com Gestor de paquets per a text sublim: podeu trobar paquets que no només milloren el vostre temps de desenvolupament, sinó que us ajudaran a escriure millor codi. Bé, per a Sketch, es tracta de plugins que us ajuden a dissenyar millor i més ràpidament.

Sistema de connectors emergents Sketch vs Figma

Podeu cercar connectors en relació amb la graella o utilitzar plugins com Lazyboard. Amb Lazyboard, és possible embolicar diverses capes de croquis en un sol Artboard, de manera que podreu estalviar temps en la personalització i en altres tasques de lots..

Enrotllats en taulers d’artFont del Gif: GitHub

En un dels llançaments més recents (Esbós 55) – l’empresa va introduir funcions com ara Copiar & Enganxeu el codi SVG, la distribució intel·ligent i els ajustaments a la manera de combinar els elements entre dissenys basats en la graella.

Suposem que teniu aquest codi SVG (un polígon amb tres costats):

Normalment, hauríeu de guardar-ho com a document .svg i carregar-lo a Sketch perquè es mostri. Doncs bé, a la nova versió, simplement podeu copiar i enganxar aquest fragment de codi SVG i es mostrarà automàticament com a nova capa.

Enganxeu pasta de còpia SVG

Espereu trobar moltes més joies orientades a la productivitat a Sketch.

L’elaboració de les especificacions als desenvolupadors

Estem arribant a un punt en el disseny de la interfície d’usuari on els dissenyadors poden exportar tot un disseny amb una especificitat totalment funcional per als desenvolupadors. I, tot i que això no està disponible com a funció nativa per a Sketch, hi ha aplicacions i plugins de tercers per fer-ho possible. És a dir,, Zeplin Va ser creat per fer que els llançaments d’especificació siguin extremadament senzills i fàcils. I amb molta precisió, també.

Mà de Zeplin espec

Però, i si voleu alguna cosa que estigui integrada directament a Sketch? Per a això, consulteu la secció Mesura de croquis connectar. Això us oferirà una funcionalitat completa per crear especificacions per als vostres desenvolupadors en temps real.

Esbós mesurar el comunicat

Podeu veure en aquest exemple que el connector proporciona informació d’elements de gran precisió. Inclou la família de tipus de lletra, la ubicació i el codi CSS adequat que els desenvolupadors poden utilitzar immediatament.

Realment té la sensació que arribem a un punt en què les eines de disseny de la interfície d’usuari podran importar dissenys completament funcionals des del primer moment..

Sketch ofereix una enorme biblioteca de recursos

Una de les raons per les quals Sketch tan atractiu als dissenyadors nous i experimentats és la immensa disponibilitat de recursos de disseny gratuïts.

Dibuixar recursos amb Adobe XD

Al seu torn Documentació Sketch ha mostrat centenars de seccions diferents per facilitar l’aprenentatge d’aquest programari. Però, a més, també hi ha llocs com Recursos d’aplicacions d’esbós, i Esbós Repo, i molts altres. Essencialment, ho són "codi obert" llocs on els dissenyadors poden enviar els seus dissenys finalitzats perquè tothom el descarregui.

Això garanteix que mai haureu de començar un projecte des de zero. A més, és possible que no tingueu informació sobre com aconseguir un resultat específic amb el vostre disseny.

Sketch Repo recursos gratuïts

Per això, podeu consultar els llocs de recursos de Sketch per trobar la solució exacta que desitgeu. Ah, i sí, sense llicència!

Sketch té molt més que el converteix en una de les eines més importants del disseny d’UI en el món. Però, mentre fem una revisió de la comparació, fem una ullada a les funcions que fan que eines com Figma i Adobe XD destaquin també de la multitud.

Figma: basat en navegador & robust!

figma

Figma va pujar als escenaris el 2015 amb un finançament inicial de 14 milions de dòlars.

Amb la seva interfície d’usuari perfecta i una elegant paleta de funcions, l’eina es va convertir ràpidament en un competidor notori a solucions similars en el camp.

Dissenyadors de marques com Twitter, Microsoft, GitHub i Dropbox juren per Figma com l’eina de disseny d’UI definitiva..

Per tant, és perquè Figma ofereix un pla gratuït que ha tingut un èxit tan primerenc en el seu full de ruta? Certament no.

L’eina ofereix diverses solucions integrades en una interfície d’interès:

  • Interfície d’usuari & Disseny UX
  • Prototips
  • Disseny gràfic
  • Wireframing
  • Plantilles

I ho fa tant al navegador com dins del mateix aplicació basada en escriptori. El fet que Figma es crei per al navegador significa que els usuaris de Linux també poden utilitzar Figma en els seus sistemes basats en Unix. Un avantatge massiu!

Tampoc haureu d’invertir gaire temps en el vostre procés de disseny. Figma s’ocupa de tot això Plantilles ofrena Es tracta de fotogrames de gràfics, diagrames de diagrama, diagrames, mapes d’històries i plantilles de lloc web completes, creades prèviament per a vosaltres..

Plantilles lliures de Figma

Aquí teniu una plantilla de lloc web de SaaS preparada, que podeu editar i optimitzar de manera immediata al vostre gust. Aquestes plantilles (capes, grups, etc.) també es poden desar per utilitzar-les més tard per importar-les més fàcilment.

Figma deixa espai per al seu disc dur

El bon fet de Figma és que no cal que guardeu res al vostre ordinador. Tots els fitxers s’emmagatzemen al núvol i són accessibles a qualsevol lloc. Pot ser un client com a Sketch o fins i tot Adobe XD Es va acostumar a 50 GB + carpetes d’arxius de disseny. Això ja no és el cas de Figma.

Comparació de la gestió de fitxers Figma vs Sketch

Com es mostra aquí, els fitxers daten de cinc mesos i encara són accessibles en un instant. Sigui quin sigui el més petit element que necessiteu d’un altre disseny, podeu accedir-lo en segons i utilitzar-lo en el vostre projecte actual.

Col·laboració en temps real

Potser la característica més reconeguda de Figma són les seves eines de col·laboració. La col·laboració amb múltiples persones està en el cor de treballar. Als temps antics de Photoshop, havíeu d’enviar infinites revisions als vostres companys només per accedir a la mateixa pàgina. Amb Figma, la col·laboració és potent i instantània!

Eines de col·laboració Figma

Aquí es mostra com Figma resol les tasques de col·laboració en temps real:

  • Comentant. Utilitzeu la interfície per seleccionar una pestanya de comentaris i envieu immediatament a algú un enllaç al vostre comentari. El marcador es pot deixar precisament a la zona en què comenteu.
  • Edició de diverses persones. Editeu un fitxer juntament amb diverses persones i vegeu les seves accions en temps real. L’edició de diverses persones també es pot desactivar quan treballeu en una funció per vosaltres mateixos.
  • Redacció. Si teniu un redactor separat o un editor de contingut, podeu donar-los accés per escriure la seva còpia al costat del vostre treball en temps real..
  • Diversitat de plataformes. Com que Figma funciona al navegador, els vostres col·laboradors poden participar en un sistema Mac o en una màquina Linux o Windows. És realment habilitat per a la llibertat!

En la seva major part, Figma deixa fora de l’esquena i de la XD d’Adobe massa enrere per ser considerades alternatives fiables per a la col·laboració en temps real..

La interfície d’usuari basada en navegador permet una col·laboració perfecta sense la necessitat de preparar-la individualment. M’esperaria que en un futur proper s’introduïssin funcions similars en altres eines!

Adobe XD: interfície d’usuari perfecta & Disseny UX

Adobe XD

Sovint, Adobe no s’associa a l’etiqueta de preu gratuïta. L’empresa té una notòria reputació per oferir productes de primera classe a preus premium.

Però sembla que fins i tot Adobe s’adona que ha de fer alguna cosa per no perdre’s una quota de mercat massiva de dissenyadors a tot el món. I la seva resposta és que Adobe XD sigui una eina gratuïta de disseny d’UI.

Així mateix, a banda d’afegir noves funcions, Adobe també ha estat ocupat perquè XD sigui el més connectable possible. Després de tot, els complements faciliten més ràpidament els millors resultats.

Complements d'Adobe XDFont de la foto: Adobe

Molts dels complements de Sketch existents ja han estat portats a XD, però com a eina independent: XD també ofereix integracions amb serveis molt coneguts com Trello, Google Sheets, Airtable i molts altres..

Disseny i prototip amb facilitat

L’enfocament d’Adobe amb XD sembla que faciliti la intuïció de les coses. Des de crear un nou projecte fins a gestionar prototips, la majoria de funcions són a només un clic.

Prototip i disseny amb Adobe XD

Un cop escolliu un tipus de projecte (web / telèfon / tauleta), podeu començar immediatament a treballar en el vostre disseny. Els usuaris del vostre equip poden ser pre-carregats o compartits per part del vostre equip de l’equip.

Adobe XD Assets

A més, és fàcil mantenir-se al dia amb les especificacions de disseny existents amb les que estigui treballant l’equip. Passeu menys temps a buscar fitxers i més temps a dissenyar!

Les funcions de col·laboració d’Adobe XD són justes

Quan col·labora, Adobe ofereix dues opcions: treballar junts en un document en núvol o carregar un document des del vostre PC. L’antiga opció facilita la col·laboració. I convidar gent nova també és molt fàcil.

Funcions de col·laboració Adobe XD

A l’extrem superior dret de l’eina, teniu el botó Compartir. Aquí trobareu diverses maneres de compartir els vostres dissenys XD.

Les opcions són:

  • Convida a editar
  • Compartir per revisar
  • Compartir per al desenvolupament
  • Grava vídeo

De manera retrospectiva, es tracta de totes les opcions adaptades a un flux de treball de disseny més suau. XD pot comprendre automàticament les especificacions que utilitzeu de manera que pugueu enviar-la als desenvolupadors. A més, podeu gravar un vídeo per mostrar qualsevol funció específica del que esteu creant. Aquesta última és útil per a equips que treballen principalment en entorns remots.

Accés a la gran xarxa de recursos d’Adobe

Adobe és la marca rere els grans èxits com Photoshop, Illustrator, però també Behance, Spark, Adobe Fonts i Adobe Stock. Aquests són tots els llocs basats en recursos que podeu utilitzar directament amb Adobe XD.

Per tant, diguem si en teniu Fonts Adobe subscripció activa, només podeu sincronitzar tots els tipus de lletra disponibles amb el vostre tauler de control XD. A continuació, us donaria accés a milers de tipus d’interès interessants, únics i definidors del disseny al palmell de la mà.

Adobe XD ofereix Adobe Creative Cloud

El veredicte: Figma vs Sketch vs Adobe XD

Per tant, aquí és on concloguem la nostra revisió Figma vs Sketch vs Adobe XD.

Les tres eines són molt adequades per a les necessitats del dissenyador modern. Jo diria que Sketch té una gran pèrdua aquí perquè només està disponible per als usuaris de Mac. Per tant, permet que eines com Figma i Adobe XD innovin més enllà de les necessitats bàsiques.

Al final del dia, si la vostra eina fa alguna cosa millor que l’altra, sovint és prou que hi hagi un motiu per canviar. L’enfocament basat en el navegador que Figma ha adoptat també és quelcom a veure. Al meu cercle d’amics dissenyadors, sempre és Figma qui elogia més.

I pel que fa a Adobe XD, crec que Adobe està en un lloc bo ara mateix. Tenen molta flexibilitat per millorar la seva eina i afegir noves funcions. Tot i així, les seves integracions de tercers també estan presents, cosa que la converteix en una bona opció per a equips que constantment busquen canviar o ajustar les coses.

Si realment hem de classificar aquests tres, haurà de ser això:

  1. Figma ��
  2. Esbós ��
  3. Adobe XD ��

Com que les tres eines estan disponibles de forma gratuïta o bé com a prova, no hi ha res que us impedeixi trobar la combinació perfecta per a vosaltres. Després d’haver treballat amb cadascú de manera individual, puc relacionar-me amb el fet que els fluxos de treball se senten diferents d’una eina a l’altra.

No oblideu unir-se al nostre curs d’accidents per agilitzar el vostre lloc de WordPress. Amb algunes solucions senzilles, podeu reduir fins i tot un 50-80% del temps de càrrega:

Maquetació, presentació i edició de 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