Mayroong maraming mga lugar na may kaugnayan sa disenyo sa industriya ng IT. Ang pinakakaraniwan sa kanila ay mga designer, na nakatago sa likod ng mga acronym na UX at UI. Well, pinamamahalaan pa ng ilang tao na isama ang mga front-end na developer bilang mga designer. Subukan nating alamin kung sino ang mga taga-disenyo sa mundo ng IT, kung ano ang pagkakaiba sa pagitan ng UI at UX, at kung anong kaugnayan ang dapat idisenyo ng mga front-end na inhinyero.
Mga taga-disenyo
Ang pagbuo ng interface ng mga application, website o laro ay medyo kumplikadong proseso at nangangailangan ng aplikasyon ng kaalaman mula sa iba't ibang larangan: engineering, sikolohiya at disenyo. Ang mga taga-disenyo ng user interface (sa English - User Interface o UI) ay tumutuon sa paraan kung paano ipinapakita ang functionality ng site (paghahanap, mga tab, mga menu) at ang mga detalye ng pakikipag-ugnayan sa pagitan ng client at ng interface. Ang layunin ng isang UI designer ay aesthetically katanggap-tanggap na modernong disenyo ng produkto . Ang UX ay nangangahulugang Karanasan ng Gumagamit, na nangangahulugang "karanasan ng gumagamit". Ang isang taga-disenyo ng UX ay mas nakatuon sa kakayahang magamit at pag-unawa sa interface ng potensyal na gumagamit. Ang nasabing espesyalista ay madalas na magsasagawa ng pananaliksik at mga survey na magiging batayan para sa paglikha ng isang konsepto ng disenyo, at pati na rin ang mga konsepto ng pagsubok sa panahon at pagkatapos ng pag-unlad. Karaniwan itong tumutuon sa istraktura, nilalaman, nabigasyon, at kung paano nakikipag-ugnayan ang user sa mga elementong ito.
Gumagawa ito ng mga sitemap, prototype, na siyang pangunahing istruktura kapag lumilikha ng software. Ang layunin ng trabaho ng isang UX designer ay para sa user na mabilis at walang sakit na makuha mula sa site kung ano ang pinuntahan niya rito . Gayunpaman, ngayon ay napakakaraniwan na makita ang dalawang espesyalisasyong ito na nakasulat gamit ang isang slash. Iyon ay, ang mga gawain ng parehong direksyon ay isinasagawa ng isang espesyalista. Ang isang taga-disenyo ng UX/UI ay nagdidisenyo ng pakikipag-ugnayan ng user sa interface, nagpapasya kung ano ang eksaktong kailangan niyang gawin at responsable para sa magiging hitsura ng interface na ito bilang isang resulta.
Ano ang kailangang malaman ng isang taga-disenyo ng UX/UI
Graphic editor . Ang pinakasikat na tool sa merkado ay ang Adobe Photoshop, Adobe Illustrator, pati na rin ang Sketch, Figma. Pumili ng isang editor na maginhawa para sa iyo at subukan munang gumuhit ng mga screenshot ng isang website o application, na ginagawang moderno ang mga ito nang kaunti.
Mga tool sa prototyping (Mockplus, Axure) . Ang isang prototyping tool ay ang link sa pagitan ng isang ideya at pagpapatupad nito. Hindi mahalaga kung anong tool ang iyong ginagamit. Maaari mong subukan ang ilan at magpasya sa isa na nababagay sa iyong estilo at mga kagustuhan.
Sikolohiya ng gumagamit. Nasa yugto na ng disenyo, dapat mong isipin kung magiging maginhawa para sa iyo o sa ibang tao na gamitin ang interface na ito. Ilagay ang iyong sarili sa posisyon ng kliyente, bumuo ng isang malakas na koneksyon sa kanya at maging matulungin sa kanyang mga pangangailangan. Kung tutuusin, magiging matagumpay ang isang produkto kung may pangangailangan para dito.
Kakailanganin mo rin ang kaalaman sa teorya ng kulay . May mga bagay tayong alam mula pagkabata, lalo na iyong mga nag-aral sa art school. Gayunpaman, may mga tiyak na detalye tungkol sa gawain ng mga taga-disenyo. Ang mga pangunahing kaalaman ay maaaring makuha mula sa mga libro o artikulo sa Internet.
Depende sa mga detalye ng trabaho, maaaring kailanganin mo ang pag-unawa sa HTML at CSS o (ilang) mga programming language (makikita ang mga link sa mga mapagkukunan sa ibaba, sa seksyong "Ano ang Dapat Malaman ng isang Front-end Developer").
Front-end na developer
Ang pangunahing gawain ng isang front-end na developer ay ang bumuo ng client na bahagi ng interface. Iyon ay, ang naturang espesyalista ay "nagpapasigla" kung ano ang idinisenyo ng mga taga-disenyo. Siya ang responsable para sa pagpapatakbo at pagpapatakbo ng interface at mas mababa para sa visual na nilalaman. Kadalasan kailangan ng isang front-end na developer na makahanap ng magandang solusyon para sa user interface sa yugto ng pag-develop nito, kaya madalas siyang nakikipagtulungan sa isang UX/UI designer. Ang code na isinulat ng front-end na developer ay tumatakbo sa browser ng user (tulad ng sinasabi nila, "sa client side"). Gayundin, ang isa sa pinakamahalagang gawain ay tiyaking pareho ang hitsura ng site o web application sa lahat ng platform at browser.
Ano ang Dapat Malaman ng isang Front-end Developer
Bilang panuntunan, ang front-end ay nakabatay sa tatlong haligi: ang HTML page markup language, CSS style sheet at ang JavaScript programming language. Bilang karagdagan, dapat na maunawaan ng front-end na developer ang mga prinsipyo ng pagpapatakbo ng HTTP protocol, mga server at browser, at ang mga feature ng pagpapakita ng interface sa iba't ibang device na kasalukuyang nasa merkado. Ang mga tool at pamamaraan para sa paglikha ng mga web interface ay patuloy na nagbabago at nagbabago, kaya dapat palagi itong subaybayan ng developer.
HTML at CSS (layout)
Ito ang layout, ang mismong mga brick kung saan itinayo ang site. Ang HTML markup language ang nagdidikta sa organisasyon, nilalaman, at lahat ng pakikipag-ugnayan ng site sa pagitan nila. Pinapayagan ka nitong italaga ang tuktok ng pahina, ibaba, mga bloke sa gilid na may nilalaman, mga heading, pagpapakita ng mga elemento ng teksto at multimedia. Ginagamit ang mga style sheet ng CSS upang palamutihan ang mga elemento ng HTML. Tinutukoy nila nang eksakto kung paano ipinapakita ang bawat graphic na elemento na matatagpuan sa page. Gamit ang pinakabagong mga bersyon ng HTML5 at CSS3, maaari kang maglagay ng mga bahagi ng video at audio sa isang pahina, lumikha ng mga 2D na larawan at animation, at kahit na magsulat ng mga simpleng laro. Hindi na kailangang subukang tandaan ang lahat ng mga tag at estilo nang sabay-sabay. Makakatulong na matutunan ang mga pangunahing kaalaman at maisagawa kaagad ang mga ito. Ang isang napakahusay na site kung saan maaari mong matutunan ang mga pangunahing kaalaman ng HTML at CSS ay W3School. Ngunit kung mayroon kang hindi bababa sa pangunahing kaalaman sa Ingles.
Gayundin, dapat na maunawaan ng front-end na developer ang cross-browser at cross-platform development, adaptive at tumutugon na layout.
Bootstrap
Ito ay isang balangkas para sa HTML, CSS at JavaScript. Iyon ay, ang ilang mga template mula sa kung saan, tulad ng mula sa isang constructor, maaari kang mag-assemble ng mga site nang mas mabilis kaysa sa wala sila. Ngunit, siyempre, kailangan mong i-customize ito upang umangkop sa iyong mga pangangailangan. Kung marunong ka ng English, inirerekomenda namin ang getbootstrap website at ang parehong w3schools .
JavaScript
Ang Javascript ay ang core ng front-end na pag-unlad. Ito ang una at pinakalaganap na interface programming language. Maaari itong magdagdag ng maraming mga tampok sa site. Sa isang pangunahing antas, pinapayagan ka ng wikang ito na magdagdag ng mga interactive na elemento sa isang pahina. Ito ay ginagamit upang lumikha ng mga mapa na nag-a-update sa real time, mga interactive na online na laro at mga pelikula. Sa aming mga senior JavaRush na kurso, natututo kami ng kaunting JavaScript. Maaari mo ring pag-aralan ito sa parehong W3School o basahin ang tungkol dito sa Russian sa website na javascript.ru .
jQuery
Ang jQuery ay isang library ng Javascript na naglalaman ng mga plugin at extension na maaaring gawing mas madali at mas mabilis ang pag-unlad. Sa halip na magsulat ng code mula sa simula, binibigyang-daan ka ng mga aklatan na magdagdag ng mga handa na bahagi, na maaaring i-customize para sa isang partikular na proyekto. Maaari mong gamitin ang mga function ng mga form sa paghahanap ng awtomatikong pagpuno, muling pagsasaayos at pagbabago ng laki ng grid, at pagtatakda ng mga countdown timer. Hands-on na kurso sa jQuery sa w3school
Mga balangkas ng JavaScript
Mayroong iba't ibang uri ng mga frameworks, ngunit maaari kang pumili ng isa na maginhawa para sa iyong gamitin. Ang pinakasikat ay ang Angular, Backbone, Ember, at React. Kinakatawan nila ang isang handa na istraktura para sa code. Nakakatulong sila sa pagpapabilis ng pag-unlad. At sa kumbinasyon ng mga aklatan, maaari nilang i-minimize ang pagbuo ng isang website o application mula sa simula. Suriin ang 5 pinakasikat na JavaScript frameworks at library ng 2017
Sistema ng kontrol sa bersyon ng Git
Maaaring subaybayan ng mga version control system ang mga pagbabagong ginawa sa code sa paglipas ng panahon. Pinapayagan ka rin nilang bumalik sa isang nakaraang bersyon ng proyekto. Ang Git ay ang pinakamalawak na ginagamit na version control system. Ang pag-alam kung paano magtrabaho sa Git ay isang mahalagang kasanayan para sa bawat developer. Git tutorial sa Russian
Maikling konklusyon
Ang UI ay kumakatawan sa User Interface, na nangangahulugang "user interface". Ibig sabihin, ang UI Designer ang pangunahing responsable para sa kung paano ipinakita ang produkto sa user. Gumagawa siya ng mga button, icon, pumipili ng mga font, at naghahanda ng layout. Ang UX ay nangangahulugang Karanasan ng Gumagamit. Kaya ang isang taga-disenyo ng UX ay nagdidisenyo ng disenyo ng isang website, isang application - o anumang bagay - upang ang user ay kumportable at naiintindihan kung ano, at makuha niya ang kailangan niya mula sa site na may kaunting pagsisikap. Kadalasan, ang parehong uri ng trabaho ay ginagampanan ng isang tao na orkestra: isang UI/UX designer. Binubuhay ng Front-end developer ang gawain ng mga taga-disenyo sa pamamagitan ng pagpapakilala ng mga dinamika dito: ang mga pindutan ay nagsisimulang pinindot, at ang larawan ay nagsisimulang magbago. Dapat alam niya ang mga programming language, napapanahong may mga frameworks, preprocessors at library.
GO TO FULL VERSION