Curs Adobe XD

Cursul Adobe XD a fost conceput pentru a învăța lucrul în Adobe XD Tool, dar și să ne familiarizăm cu legătura dintre instrumentele grafice precum Adobe Photoshop, Adobe Illustrator și codul HTML/CSS pe de altă parte, studiind principiul UX/UI. În primul modul ne familiarizăm cu conceptele pe care le folosim în cadrul acestui program, dar și mai târziu în timpul creării și proiectării, fie a site-urilor, a aplicațiilor pentru dispozitive mobile sau altceva. În cadrul acestui modul, vom asimila și mediul de bază al programului Adobe XD, care seamănă foarte mult cu Adobe Tools, dar are și diferențe foarte importante. 

În al doilea și în al treilea modul, vom lucra în programul Adobe XD și vom învăța cum de la o idee de bază a site-ului să ajungem la designul final pe care ulterior îl putem transforma într-o unitate funcțională folosind limbajul HTML, CSS, JS și altele. În prezent se poate auzi deseori că designul nu prezintă doar aspectul, ci și cum funcționează. Asta este corect pentru aplicații web și altele, unde un design bun și funcțional are un rol foarte important. Nu este important doar „să fie ceva frumos” sau „să ne placă nouă sau clientului”, ci să îndeplinească nevoile pieței și să „funcționeze” pur și simplu. De design depinde și dacă utilizatorul va începe sau va continua să folosească produsul nostru. Tocmai la acest plan ajută Adobe XD și se deosebește de aplicații grafice clasice. Desigur, Adobe XD nu reprezintă o concurență pentru Photoshop, Illustrator etc., ci aceste instrumente se completează în mod ideal.

Descrierea și obiectivele cursului Adobe XD

Cursul vă învață să folosiți instrumentul Adobe XD ca să aveți posibilitatea de a crea un design complet al unui site sau a unei aplicații care s-ar dezvolta în continuare folosind limbajele HTML, CSS și altele. După finalizarea cursului, participantul va ști să proiecteze un site sau o altă aplicație web ținând cont de caracteristicile necesare și posibilități pe care un web modern le condiționează.

Accentul nu este doar pe design și estetica vizualului, ci este și obiectivul cursantului de a se pregăti pentru gândirea critică în cadrul funcționalității aplicației și a designului. Dacă participantul învață instrumentele grafice, dar și limbajele HTML/CSS, va folosi Adobe XD la un nivel superior, cu ajutorul cunoștințelor oferite de acest curs.

Competențe 

Modulul 1 – Familiarizarea cu Adobe XD

• Înțelegerea designului web din prezent și a conceptului UI/UX 
• Înțelegerea rolului aplicației Adobe XD
• Înțelegerea mediului de lucru a aplicației Adobe XD
• Posibilitatea de utilizare a instrumentelor principale pentru desen și text în cadrul aplicației Adobe XD

Modulul 2 – Lucrul la proiecte

• Înțelegerea conceptului de prototipuri pentru web
• Arta de a crea proiecte web complexe în aplicația Adobe XD
• Cunoașterea posibilității aplicației Adobe XD în contextul designului pentru Web și/sau dispozitive Android/Apple

Modulul 3 – Completarea proiectelor 

• Posibilitatea de testare a proiectelor de design
• Înțelegerea procesului de design
• Posibilitatea de a colabora cu alții în cadrul procesului de design 
• Posibilitatea de pregătire a designului pentru lucru în continuare 

Software necesar și condiții tehnice

Adobe XD (versiunea 22. sau mai nouă) 

Cunoștințe necesare dintr-un domeniu sau curs 

Nu este cazul. 

Este de preferat și util cunoașterea lucrului în programele Adobe Photoshop și Illustrator, precum și a limbajelor HTML/CSS.

Perioada de revizuire a cursului

La nevoie, dar nu mai mult de 2 ani.

Adobe XD

Profesorul nostru, Silviu Ojog, vă prezintă pe scurt importanța cursului Adobe XD.

Cursul Adobe XD vă va răspunde la următoarele întrebări:

1. Adobe XD poate înlocui Adobe Photoshop și Illustrator?

Nu, deloc. Adobe Photoshop și Illustrator sunt instrumente foarte utile. Chiar și între ele se pune din greșeală problema diferenței, deși fiecare are un rol clar definit. De asemenea, Adobe XD are propriul rol definit clar și cu precizie și nu de a înlocui Photoshop-ul în editarea imaginilor sau de a înlocui programul Illustrator în editarea ilustrațiilor vectoriale, de exemplu.

Rolul lui Adobe XD este funcționalitatea aplicației sau a site-ului pe care le proiectăm. În general, noi folosim elementele pregătite anterior prin Photoshop, Illustrator etc., pentru a crea ideea de interacțiune, funcționare a designului în Adobe XD. Cu alte cuvinte, cu ajutorul aplicațiilor menționate creăm „imagini statice”, în timp ce Adobe XD le transformă cu ajutorul nostru într-un design „viu” pe care îl poate încerca clientul, înainte de a lucra concret la cod și la crearea produsului final.

2. De ce aș folosi Adobe XD și nu un alt instrument grafic simplu?

Deși această întrebare este una frecventă, defapt reprezintă o neînțelegere a rolului primar al programului Adobe XD. El nu este încă un program grafic și concurență pentru Photoshop. Adobe XD se bazează pe aceste instrumente și rolul său primar este funcționarea produsului nostru final, designul și testarea într-un pachet. Noi desenăm și creăm elemente grafice în XD sau le introducem finite în Photoshop, Illustrator etc. Oricum am lucra, Adobe XD oferă posibilitatea de a conecta toate aceste elemente de design și de a „încerca” aplicația sau site-ul nostru înainte de a le face.

3. Trebuie să învățăm un alt instrument Adobe înainte de XD?

Nu este necesar, dar este foarte util. Dacă nu am mai lucrat cu vreun instrument grafic, precum Adobe Photoshop sau Illustrator, putem învăța instrumentele și posibilitățile oferite de Adobe XD și va fi mai mult decât suficient pentru a lucra cu acesta. Totuși, adevărată putere Adobe XD vine atunci când integrăm munca în programele menționate cu XD.

Atunci putem crea o imagine mai amplă și mai completă pentru a concepe, defini și publica proiectul nostru. De la idee, apoi elaborare, până la prezentarea la client și continuarea lucrului la produsul final. După finalizarea proiectului de design și funcționalitate, ordinea logică este elaborarea unui produs concret folosind limbajele HTML, CSS, JS etc. Acestea nu sunt necesare pentru a lucra în XD, dar dacă le cunoaștem și pe acestea, vor fi mai clare detaliile pe care le creăm.

4. Nu am auzit niciodată de Adobe XD. Când a apărut?

Adobe XD este un software care a apărut în urmă cu câțiva ani, dar numai de curând a ajuns la o maturitate, condițional vorbind, și la o valoare utilizabilă în proiecte reale. Putem spune că este abia la începutul dezvoltării, dar asta nu înseamnă că îi lipsesc opțiunile, dimpotrivă.

Adobe XD oferă un concept nou de lucru la design pentru web care nu a existat până în urmă cu cinci ani sau mai mult. Se impune ca un instrument foarte important în dezvoltare pentru web-ul modern. Compania Adobe a investit mult în dezvoltarea sa și probabil va continua să facă acest lucru și în viitor. Momentan, Adobe XD este gratuit într-o anumită măsură.

5. Adobe XD reprezintă o concurență pentru programul Sketch?

Da, Adobe a creat XD ca răspuns la popularitatea aplicației Sketch. Desigur, există și alte instrumente care se folosesc. Mulți apar ca jucători noi pe piață, dar mulți și dispar încet. Sketch își păstrează locul fruntaș printre programele de acest fel, dar Adobe XD este foarte aproape, ținând cont că acesta este un program nou care abia de curând a ajuns la o maturitate și la o versiune stabilă.

Pe de altă parte, XD are un suport foarte puternic sub formă de integrare cu alte instrumente din familia Adobe. Este foarte simplu de transmis elemente și materiale din Photoshop, Illustrator etc. După mulți, Sketch are în continuare o mare problemă și anume inexistența versiunii pentru MS Windows, se găsește numai pentru Apple Mac OS X.

6. Adobe XD susține detalii responsive ale web-ului?

Adobe XD a fost gândit, apoi creat, ca instrument care va ușura lucrul în design și conceperea unui web modern. Ținând cont de asta, pur și simplu nu putem separa ideile responsive de web-ul modern. Adobe XD ne permite numai să desenăm sau să proiectăm produsul nostru și să testăm funcționalitățile înainte să începem tastarea codului HTML, CSS sau altul pentru produsul nostru. Astfel testarea vine la începutul lucrului, nu când este totul gata și când eventualele modificări sunt mai rele și, desigur, mai scumpe. Deci, responsive este partea integrală a programului Adobe XD, dar și mult mai mult decât asta.

7. Pot să sar peste design și să creez imediat codul HTML/CSS?

Desigur. Se poate. A doua întrebare este dacă corespunde tuturor acest proces. Sau, cu alte cuvinte, dacă mie îmi este mai ușor și mai rapid. În esență, când simplificăm, în adobe XD și instrumente similare creăm designul și detalii aferente pe care ulterior le transformăm în produsul funcțional folosind HTML, CSS, JS și alte limbaje.

De această parte, un design concret nu este obligatoriu, dar aceeași întrebare se poate pune și la alte profesii. De exemplu, putem construi o casă astfel încât să le spunem meșterilor unde și ce să facă fără niciun plan. Dar probabil că nimeni nu face așa (din fericire!), ci mai întâi arhitecții definesc și desenează fiecare detaliu care va fi pus ulterior în execuție. Munca nu este la fel, dar principiul da. Cu cât designul este mai detaliat la început, cu atât sunt mai puține probleme mai târziu și situații neprevăzute.

Planul și programa cursului:

1. Familiarizarea cu Adobe XD

• Introducere
• Mediul de lucru și instrumentele 
• Desenul și textul 
• Imagini și forme vectoriale

2. Lucrul la proiecte

• Prototipuri 
• Plugin-ul posibilității și a integrării 
• Lucrul cu chiturile UI

3. Completarea proiectelor 

• Interacțiune 
• Testare 
• Publicare și colaborare