Se afișează postările cu eticheta front-end. Afișați toate postările
Se afișează postările cu eticheta front-end. Afișați toate postările

luni, 27 iulie 2020

Ce este un wireframe?


Hello! Cum mai sunteți? Sper că sunteți bine, mai ales cu vremea care este prin vestul țării... n-am cuvinte.

Dacă și tu ești începător în ale programării, ai foarte multe de învățat despre o grămadă de lucruri, unelte (tools), tehnologii, procese și alte asemenea lucruri. În rezumatul de față încerc să explic pe foarte scurt (atâta cât se poate pe foarte scurt) ce înseamnă wireframe, deoarece îmi dau seama că v-am băgat deja în ceață cu termenul.

Ce este un wireframe:
Wireframe-ul despre care vorbesc în documentul de față face referire la procesul de dezvoltare a produselor software, fie că vorbim despre aplicații desktop sau de site-uri web. În primul și în primul rând, acest wireframe (orice o fi fiind acest termen) se folosește în faza de explorare a ciclului de viață a produsului.

Acest wireframe este, în fapt, o modalitate de proiectare a produselor software la nicel structural. Îl puteți asemui cu un schelet bidimensional al unui software, la fel cum se folosesc schițele în domeniul arhitecturii. Ceea ce este important când se creează acest wireframe este faptul că se ia în considerare înfățișarea conținutului și cum afectează acest conținut nevoile și navigarea utilizatorului. Fiind utilizat în procesul de dezvoltare timpurie pentru structura de bază a software-ului (chiar înainte de adăugarea proiectării vizualre și a adăugării majorității conțiutului), stilizarea, culorile și elementele grafice sunt utilizate la minimum.

De asemenea, aduce în prim-plan utilitatea, scalabilitatea (inexistența nevoii de reproiectare pentru menținerea performanței unui produs la suprasarcină) și ușurința de actualizare a produsului software în curs de dezvolare.

Există 3 tipuri de wireframe, în funcție de detalierea acestuia: low-fidelitu wireframe, mid-fidelity wireframe și high-fidelity wireframe.


Avantajele folosirii unui wireframe:
  • Crearea și folosirea unui wireframe furnizează o schemă sau un șablon al produsului ce poate fi discutată cu clientul foarte devreme în procesul de dezvoltare a proiectului.
  • De asemenea, poate exista și un răspuns (feedback) din partea posibililor viitori utilizatori ai produsului.
  • Asigură faptul că funcționalitatea aplicației și conținutul sunt poziționate corect pe baza nevoilor afacerii cât și a clienților.
  • Permite clarificarea vizuală și / sau grafică a elementelor aplicației. Clientul, dacă nu are cunoștințe cât de cât mai aprofundate de IT, poate că nu știe ce e aia „hero image”, „google map intergration”, „product filtering”, „light boxes” etc, dar în momentul în care îi arăți schițele, va înțelege mult mai bine ceea ce dorești să îi transmiți.

luni, 16 martie 2020

Web Design with me (I)


Hello! Cum mai sunteți?

Pentru astăzi mă gândisem să fac un clip un picuț mai tehnic, ca să zic așa. Prima dată când am încercat să creez clipul, nu prea am reușit să-l editez adică nu l-am putut edita deloc deoarece clipul de 48 de minute era atât de imens ca și spațiu pe hard (adică avea undeva la vreo 10GB de video + audio (pe care oricum l-aș fi șters ca să pun muzică de fundal) pentru doar vreo 48 de minute) încât programul meu de editare refuza să-l încarce prin „protestul” de a se bloca la orice tentativă de încărcare. Ceea ce am „reparat” a fost că am recreat să zicem proiectul, doar că nu am mai stat să recaut toate informațiile pe care le căutasem anterior ci am creat codul de parcă îl știam „pe de rost” în marea majoritate.

Foarte pe scurt, ceea ce am făcut a fost:

  • am folosit bootstrap care să mă ajute cu template-ul de bază al paginii;
  • am schimbat culoarea de fundal a paginii din albul acela default într-un galben, folosindu-mă de id-ul atribuit tag-ului body ;
  • am creat un antet al paginii cu câte o poză în stânga și în dreapta cărora le-am schimbat puțin dimensiunea în fișierul .css; am legat „pozele” din fișierul .html cu atributele din .css printr-o clasă care să modifice unele atribute;
  • la final, am creat un meniu cu doar 4 butoane cărora le-am modificat niște atribute precum lățimea, lungimea, distanța de jos față de următorul element și culoarea de fundal a butoanelor prin intermediul unei clase.

Cu toate acestea, clipul are vreo 12 minute la o setare care a făcut ca video-ul să se desfășoare cu viteză crescută cu 33%.

luni, 9 martie 2020

Ce să aleg: IT sau Informatică?


Hello!Cum mai sunteți? Pentru astăzi am revenit pe Youtube cu o mică comparație oarecum superficială între facultățile cu specializare de Informatică și cele cu specializare de IT (Information Technology / aka Tehnologia Informației). Sper să înțelegeți ceva din clip, și cel mai important, să vă distrați cu măsură și bun simț la clip.