Este timpul ca designerii să treacă de la proiectarea bazată pe imagini la proiectarea bazată pe cod

De ce să treceți de la design bazat pe imagini la design bazat pe cod?

A existat o mare problemă încă de la începutul designului produselor digitale. Designerii sunt separați de procesul de dezvoltare a produsului și sunt obligați să lucreze numai cu software.

Designerii folosesc grafică raster sau instrumente de proiectare vectorială pentru a desena imagini pe măsură ce sunt izolate de restul organizației. Procesul rămâne în cele mai multe cazuri identic, chiar dacă funcționează în software diferit, cum ar fi Photoshop, Gimp, Sketch sau Fireworks. Un set de imagini statice este trimis inginerilor ca intenție redată de designeri.

Este extrem de obositor să arăți diferite stări ale interfeței prin plăci de artă statice. Prin urmare, totul nu este detaliat de către designeri. Și în cele din urmă, întreaga interfață cu utilizatorul este construită de ingineri cu ajutorul unui set de imagini statice incomplete. Adesea, într-o comunicare lungă înainte și înapoi, toate stările interactive sunt de obicei rezolvate.

Experiența nu este reprezentată cu acuratețe cu design-uri statice și, prin urmare, testele sunt de obicei obositoare pentru utilizatori. Datorită acestor procese ineficiente, o organizație duce la produse nereușite și la echipe frustrate.

Datorită evoluției tehnologiei de astăzi, avem o modalitate mai bună de a proiecta lucrurile. Instrumentele de proiectare bazate pe imagini sunt rapid înlocuite de paradigma instrumentelor de proiectare bazate pe cod. Reprezentările statice ale designului desenate din instrumente de proiectare vectorială sau raster sunt înlocuite cu modele redate în care designerii intenționează direct în cod fără să știe de fapt cum să codifice.

Un nou flux de lucru este oferit de noul set de instrumente în care:

• Designerii și inginerii stabilesc o singură sursă de adevăr
• Fără nicio experiență de codare, oferă designerilor puterea deplină a codării
• Duoul de designeri și ingineri sunt conectați printr-un singur proces creativ colaborativ care creează o evoluție spectaculoasă a fluxului de lucru

Design bazat pe imagine la cod cu UXPin

Prima și de bază întrebare aici este ce nu este bun sau ineficient cu designul bazat pe imagini înainte de a face tranziția de la designul bazat pe imagine la designul bazat pe cod. S-ar putea să știți că există două paradigme de instrumente de proiectare, adică instrumente de proiectare bazate pe cod și pe imagini.

Un instrument de proiectare bazat pe imagini este o abordare care a fost folosită de multe decenii și este considerabil veche. Designerii trebuie să construiască grafică vectorială sau raster atunci când desenează ceva care este ideea acestei abordări a instrumentelor.

Cu această abordare, designerii au flexibilitate maximă. De la ilustrații avansate la pictograme simple, totul poate fi desenat eficient în acest fel, inclusiv cel mai frumos nivel de detalii. Deși, atunci când vine vorba de dezvoltarea profesională a produselor digitale, de obicei se rupe. Iată motivul pentru care se întâmplă.

1. Lipsă de interoperabilitate: interfața reală a unui produs, cu excepția fotografiilor, ilustrațiilor și pictogramelor, nu este niciodată construită cu aceste grafice. Designerii lucrează în afara constrângerilor stabilite în cod atunci când lucrează la proiectarea interfeței în instrumentele de proiectare bazate pe imagini. Datorită acestui fapt, ei pot crea lucruri care sunt costisitoare de codat și cele care sunt dificile într-un mod necunoscut.

2. Lipsă de acuratețe: În afară de crearea de modele minunate care sunt detaliate, cele mai inexacte rezultate în timpul procesului de dezvoltare sunt adesea cu instrumente bazate pe imagini. Lucrarea designerului este redată cu un proces complet diferit.

Prin urmare, există o diferență între codul de degrade, text și culoare alese de un designer și cel de un inginer chiar și cu aplicarea acelorași specificații. Din această cauză, echipele sunt afectate de dezechilibre masive.

3. Design static: concentrarea fluxului de lucru pe instrumentul de proiectare bazat pe imagini este pe construirea de tablouri de artă statice pentru toate stările interfeței care sunt eventual legate între ele. Pentru proiectele profesionale, aceasta este o abordare break-in. În fereastra statică, cele mai simple modele devin ca un dropdown care nu este gestionat.

Acest lucru se întâmplă din cauza lipsei capacității de a păstra componentele interactive pentru a fi reutilizate și din cauza cantității considerabil de mari de panouri de artă. Pe lângă toate aceste instrumente, permit doar interacțiunea de bază, fără capacitatea de a seta variabile pentru conținut, stări ale elementelor, logica condiționată și altele.

4. Colaborare slabă în proiectare-inginerie: Procesul de inginerie este complet diferit de acest instrument și nu poate fi fuzionat. Ieșirea ambelor lumi este deconectată de însăși natura sa.

Tehnologiile utilizate de utilizatori sunt produsul final al activității dezvoltatorilor, în timp ce straturi suplimentare de abstractizare, care sunt departe de experiența finală a utilizatorului, sunt introduse prin proiectarea bazată pe imagini.

Designerii și inginerii sunt deconectați și frustrați unul de celălalt din cauza componentelor interactive reutilizabile, a lipsei de interacțiuni reale și a capacității de a importa conexiuni din cod.

Unicitatea în designul bazat pe cod

Este important să știm ce este special în acest design, deoarece punem accent pe tranziția de la proiectarea bazată pe imagine la cea bazată pe cod. Când un utilizator desenează ceva folosind un instrument de proiectare bazat pe cod, acesta creează CSS/HTML/JS relevante și activează browserul. Acest lucru face ca motorul să arate rezultate vizual.

Următoarele sunt beneficiile pentru designeri după tranziția lor de la proiectarea bazată pe imagini la proiectarea bazată pe cod.

1. Fidelitate: Există o potrivire de o sută la sută între intenția unui designer și un rezultat codabil atunci când se folosește un design bazat pe cod. Pentru a reda toate proiectele de design, tehnologia utilizată în proiectarea bazată pe cod este aceeași cu cea a dezvoltării web.

2. Elimină diferența de constrângeri între designeri și dezvoltatori: Lucrurile care sunt dificil de proiectat și care sunt imposibil de recreat în cod pot fi create de designeri în instrumente bazate pe imagini. Aceste exact aceleași constrângeri sunt aplicabile atât pentru designeri, cât și pentru dezvoltatori în instrumente bazate pe cod. Prin urmare, se asigură că atât designerii, cât și dezvoltatorii rămân sincronizați.

3. Înlocuirea panourilor de artă cu componente interactive: în loc de panouri de artă legate, instrumentul de proiectare bazat pe cod folosește cele mai avansate interacțiuni asupra componentelor. Această abordare dă putere designerilor să creeze sisteme de design interactive foarte reutilizabile și, de asemenea, imită dezvoltarea.

4. Interacțiuni realiste și puternice: Odată cu trecerea de la designul bazat pe imagini la designul bazat pe cod, obiectele pot interacționa între ele, se pot deplasa pe ecran și pot crea modele complexe. Nu necesită ca cineva să știe cum să codifice, ceea ce este cel mai important pentru colaborarea cu inginerii și testarea cu utilizatorii.

5. Creează cea mai puternică colaborare vreodată: O abordare complet nouă, revoluționară a colaborării de inginerie și proiectare este realizată prin paradigma bazată pe cod.

Articol înrudit

Diferența dintre Web Designer și Web Developer