Confruntare cu instrumentul de design – Adobe XD vs. Sketch (2019)

Publicat: 2022-03-11

Sketch, un instrument de design bine stabilit, s-a bucurat de o creștere fenomenală de la introducerea sa în 2010. În 2016, Adobe a introdus XD ca un concurent formidabil. După aproape trei ani de dezvoltare, Adobe XD oferă o provocare suficientă pentru designeri să ia în considerare o schimbare?

Procesul de proiectare UX este complex și necesită utilizarea unor instrumente, metodologii și cadre specifice. Cercetarea utilizatorilor, analiza, wireframing-ul, machetele, iterația, testarea utilizabilității și prototiparea UI sunt doar câteva dintre artefactele și procesele cu care lucrează designerii în timp ce comunică cu dezvoltatorii, părțile interesate și alți membri ai echipei.

Două instrumente de design recunoscute pe scară largă pe care se bazează designerii UX sunt Adobe XD și Sketch.

Sketch a devenit standardul de facto pentru marea majoritate a designerilor digitali datorită interfeței sale simple, numărului extins de pluginuri, funcționalității complete a setului de instrumente și actualizărilor frecvente.

În timp ce Sketch a devenit instrumentul de alegere pentru designerii UX, Adobe, cunoscut de mult pentru software-ul de design premiat și pentru legăturile strânse cu comunitatea de design, nu a avut o opțiune similară. Aveau Photoshop, Illustrator și Fireworks, dar designerii nu aveau apetit să folosească trei instrumente pentru a îndeplini sarcinile pe care Sketch le putea oferi într-o singură aplicație.

În 2016, Adobe a introdus XD (Experience Design). Un candidat serios la Sketch, mai aveau multe de făcut. La acea vreme, Sketch avea șase ani, avea o bază largă de utilizatori și un întreg ecosistem de plugin-uri, făcându-l un instrument de design puternic. Rivalitatea a escaladat în următorii doi ani, iar Adobe XD a crescut de la un concurent agil la un instrument de design foarte apreciat, care a cucerit mulți designeri profesioniști.

Blogul Toptal Design a publicat un articol despre Sketch vs Adobe XD în 2017, când era încă în versiune beta. Acum, doi ani mai târziu, Adobe XD a cunoscut mai multe revizuiri cu un obiectiv clar: să ofere tot ceea ce are nevoie un designer UX în mod nativ și cu performanțe excelente.

Este timpul ca designerii UX să treacă de la Sketch la Adobe XD?

Adobe XD vs Sketch

Să explorăm cum se compară Adobe XD cu Sketch. Vom compara următoarele caracteristici:

  • Interfața cu utilizatorul
  • Repetați Grila
  • Simboluri și panouri de active
  • Instrumente de design responsive
  • Suplimente și pluginuri
  • Crearea de prototipuri cu Auto-Animate
  • Partajare și comentarii
  • Lucrul cu Dezvoltatorii
  • Controlul versiunilor și colaborarea în timp real

Interfața cu utilizatorul

Designerii care sunt familiarizați cu instrumente precum Photoshop nu ar trebui să aibă probleme în a învăța Adobe XD sau Sketch, deoarece toți au o interfață de utilizare similară.

Interfața utilizator Adobe XD vs Sketch
Adobe XD și Sketch au o interfață de utilizator similară, cu excepția câtorva elemente care diferă între cele două.

O diferență notabilă a UI este absența unei bare de instrumente în Adobe XD. Bara de instrumente, situată în partea de sus a interfeței de utilizare, este o funcție utilă în Sketch, cu comenzi rapide personalizabile către funcții și instrumente utilizate în mod obișnuit, cum ar fi gruparea obiectelor. Adobe oferă o caracteristică similară, redusă, numită caseta de instrumente , situată în partea dreaptă a software-ului.

Sketch vs XD : Sketch are avantaj pentru Bara de instrumente utilă.

Repetați Grila

O caracteristică notabilă a Adobe XD este grila de repetare. Acesta este un instrument la îndemână care permite crearea ușoară de liste reglabile și ecrane bazate pe grile. În timp ce Sketch nu are această caracteristică, poate fi mai mult sau mai puțin replicat cu pluginuri.

Funcția Repetați grilă în Adobe XD
Caracteristica Repeat Grid din Adobe XD permite crearea rapidă de liste și ecrane bazate pe grilă.

Sketch vs XD : Adobe XD are avantajul cu grila de repetare care este nativă pentru software.

Simboluri și panouri de active

Simbolurile au fost o caracteristică timpurie care a avut o contribuție semnificativă la succesul Sketch. Simbolurile sunt pentru schiță, așa cum CSS (Cascading Style Sheets) este pentru designul site-ului web. Acestea permit designerilor să refolosească și să editeze cu ușurință elementele, ceea ce economisește mult timp, ajută la crearea unui sistem de design gata făcut și asigură coerența pe toate ecranele.

Panouri Adobe XD Asset și simboluri schiță
Succesul lui Sketch sa datorat în mare parte caracteristicii simbolurilor. Adobe XD oferă o funcție similară cu panourile de active.

Adobe a început cu simboluri de bază și apoi a introdus panoul de active care combina simboluri, fonturi și culori într-o singură locație. Editarea oricăruia dintre aceste elemente arată actualizările rezultate în timp real. Sketch are aceste caracteristici, dar Adobe XD a oferit o experiență de utilizator mai coerentă și îmbunătățită.

Sketch vs XD : Adobe XD are un avantaj ușor datorită elementelor combinate ale interfeței de utilizare din panoul de active.

Instrumente de design responsive

Adobe XD oferă un set robust de instrumente de design receptiv. O caracteristică remarcabilă, modul automat receptiv , ghicește cum ar trebui să răspundă ecranul la diferitele dimensiuni ale dispozitivului.

Aceasta este o caracteristică incredibil de utilă, care poate fi activată și dezactivată folosind un simplu buton glisor. Dacă modul automat nu atinge comportamentul așteptat, un proiectant poate modifica manual proprietățile de răspuns.

Sketch nu are această caracteristică încorporată, dar are multe plugin-uri precum Anima Toolkit care fac treaba bine.

Sketch vs XD: Asistență pentru proiectare receptivă în Adobe XD
Adobe XD oferă un sistem de design responsiv robust și automatizat de care Sketch îi lipsește fără utilizarea pluginurilor.

Sketch vs XD: Adobe XD are avantajul aici. Ele oferă o modalitate încorporată de a vedea efectele de răspuns asupra elementelor UI.

Suplimente și pluginuri

Ecosistemul de pluginuri din Sketch este, fără îndoială, una dintre cele mai mari caracteristici ale sale. Există sute de plugin-uri care extind funcționalitatea Sketch și permit designerilor să folosească funcții îmbunătățite, rămânând în același timp în ecosistemul Sketch.

Suplimentele sunt echivalentul Adobe XD cu pluginurile. Adobe și-a început ecosistemul de suplimente în 2018, așa că nu este la fel de robust ca Sketch. Acest lucru nu este o preocupare pentru Adobe, deoarece scopul lor este să încerce să reducă nevoia de suplimente și să se concentreze pe realizarea de funcții care sunt încorporate în software.

Sketch vs XD: Sketch are avantajul cu biblioteca lor extinsă de pluginuri.

Crearea de prototipuri cu Auto-Animate

Adobe a actualizat recent XD cu o caracteristică incredibil de utilă pentru designerii UX: animare automată . Funcționează făcând tranziții inteligente și netede între elementele diferitelor ecrane. Rezultatele sunt impresionante, făcând prototipul o experiență încântătoare cu care să angajați potențialii clienți. Sketch nu oferă această funcționalitate, chiar și cu un plugin.

Schiță vs XD: caracteristică de animare automată în Adobe XD
Adobe XD face ca prototiparea să fie ușoară și simplă cu funcția sa de animare automată.

O altă caracteristică excelentă de prototipare introdusă de Adobe este suportul pentru micro-interacțiuni, de exemplu, tragerea unui panou de la marginea ecranului sau apariția unei tastaturi. Adobe XD acceptă, de asemenea, prototiparea interfețelor de utilizare bazate pe voce (cum ar fi Alexa sau Google Home).

Sketch vs XD: Adobe XD are avantajul aici, cu funcții de animare automată care economisesc timp și suport pentru micro-interacțiuni de care Sketch îi lipsește.

Doriți designeri de interfață de utilizare independenți cu normă întreagă din SUA

Distribuire și comentare

Designerii interacționează frecvent cu alți membri ai echipei, dezvoltatori și părți interesate – capacitatea de a partaja design-uri și de a primi feedback este o parte crucială a procesului de proiectare. Ca atare, Adobe XD include funcționalități încorporate pentru machete și prototipuri care urmează să fie partajate online, astfel încât oricine poate adăuga comentarii generale sau poate indica locații specifice dintr-un aspect și poate lăsa feedback.

Aceste caracteristici, combinate cu modul de prototipare dinamică al Adobe XD, pot fi testate și pe telefoanele mobile cu aplicația nativă Adobe XD sau chiar înregistrate pentru demonstrații non-interactive.

Sketch poate folosi partajarea și comentarea folosind instrumente de colaborare precum Zeplin sau integrări cu instrumente terțe, cum ar fi Invision.

Sketch vs XD: Adobe are un ușor avantaj aici, cu partajarea și comentarea online încorporate.

Specificații de proiectare

Pe parcursul unui proiect de design, designerii UX trebuie adesea să împărtășească specificațiile de design cu dezvoltatorii. Adobe a inclus această funcționalitate în XD, în timp ce utilizatorii Sketch vor trebui să folosească integrări precum Zeplin sau InVision.

Design experiență Adobe vs Sketch: Adobe XD oferă specificații de design încorporate
Specificațiile de design încorporate ale Adobe XD oferă un mediu de lucru fluid și consistent între dezvoltatori și designeri.

Sketch vs XD: Adobe are un avantaj față de Sketch, deoarece specificațiile de design sunt încorporate și nu necesită integrare terță parte.

Controlul versiunilor și colaborarea în timp real

Două caracteristici importante pe care se bazează designerii și dezvoltatorii sunt controlul versiunilor și colaborarea în timp real. Echipele mari de proiectare care lucrează împreună la același proiect trebuie să poată vedea când au fost făcute modificări și să acceseze un istoric al acestor modificări.

Adobe a abordat colaborarea cu introducerea documentelor cloud . Acest lucru oferă tuturor celor din echipă, inclusiv dezvoltatorilor, un loc central de lucru. Potrivit Adobe, următorul pas pentru caracteristica documentelor cloud va fi controlul versiunilor.

Sketch oferă controlul versiunilor și colaborarea în timp real cu pluginuri, dar aceste caracteristici nu sunt încorporate în produs.

Sketch vs XD: Sketch îl câștigă pe acesta. Au controlul versiunilor, deși cu pluginuri; acest lucru nu este oferit în prezent în XD.

Rezumatul caracteristicilor: Adobe XD vs. Sketch

Există asemănări, precum și diferențe între versiunea actuală de Adobe XD și Sketch. Iată o comparație a fiecărui produs:

Caracteristici Adobe XD Schiță
Grafică vectorială Da (și include Adobe Illustrator în abonament CC) da
Editarea imaginilor Nu (dar include Adobe Photoshop în abonament CC) Da, editare de bază
Ușoare da Nu
Prototiparea Da, inclusiv auto-animare și prototipare vocală da
Export de active da da
Predare cu inspector online da Nu (dar disponibil cu pluginuri terță parte)
Simboluri și stiluri da da
Repetați grila da Nu (dar disponibil cu pluginuri terță parte)
Caracteristici Adobe XD Schiță
Grilă de aspect da da
Instrumente de design responsive da Nu (dar disponibil cu pluginuri terță parte)
Colaborare în timp real Nu (anunțat ca o funcție viitoare) Nu (disponibil cu pluginuri terță parte)
Versiune Nu (anunțat ca o funcție viitoare) Nu (disponibil cu pluginuri terță parte)
Pluginuri/Suplimente da Da, cu o diversitate superioară
versiunea MacOS da da
Versiunea Windows Da (Windows 10) Nu
Preț și licențiere Planul de pornire este gratuit, cu toate funcțiile și un prototip activ partajat. Versiunea premium costă 9,99 USD/lună cu prototipuri partajate nelimitate. Abonamentul CC cu toate celelalte aplicații Adobe costă 52,99 USD/lună. 99 USD pentru un an de actualizări, dar puteți continua să utilizați după aceea fără actualizări.

Este timpul să schimbați instrumentele de design UX?

Comparând caracteristicile, Sketch și XD sunt aproape. Sketch-ului nu are unele funcții precum animarea automată, designul cu răspuns automat și grila repetată, care sunt toate native pentru XD.

Singurul lucru important de care Adobe XD încă îi lipsește este controlul versiunilor, pe care Sketch îl are datorită pluginurilor. Așteptați-vă ca acest lucru să sosească în XD în curând, deoarece Adobe continuă să dezvolte setul de caracteristici pentru documente cloud.

Este mai ușor să treceți de la Sketch (și Photoshop sau Illustrator) la XD decât invers, deoarece XD poate deschide fișiere Sketch cu o fidelitate excelentă. Ați putea întâmpina unele probleme dacă depindeți de pluginuri doar pentru Sketch, cum ar fi Abstract sau InVision Craft.

În unele scenarii, alegerea este evidentă: pentru utilizatorii de Windows, Sketch nu este disponibil, iar pentru abonații Adobe Creative Cloud, XD este inclus gratuit cu prototipuri partajate nelimitate. Asta nu s-a întâmplat întâmplător.

Dar Sketch ripostează. Compania a închis recent finanțare de 20 de milioane de dolari și promite caracteristici importante precum colaborarea în echipă, transferul nativ și o versiune web a aplicației în 2019.

Dacă controlul versiunilor nu este o problemă critică, atunci nu a fost niciodată un moment mai bun să luați în considerare utilizarea Adobe XD. Angajamentul Adobe față de comunitatea de proiectare a experienței utilizatorului este evident cu funcții precum modul de răspuns automat, grila repetată și prototiparea încorporată. În ciuda începutului lor târziu, Adobe a dovedit că poate oferi o provocare formidabilă pentru Sketch.

• • •

Citiri suplimentare pe Blogul Toptal Design:

  • Adobe XD vs. Sketch - Ce instrument UX este potrivit pentru tine?
  • Atomic Design and Sketch - un ghid pentru îmbunătățirea fluxului de lucru
  • Design with Precision - o revizuire Adobe XD
  • Lucruri pe care este posibil să nu le știi despre tipografie în schiță
  • Familiarizarea cu Sketch Plugin Development