{"id":599,"date":"2015-03-25T13:33:15","date_gmt":"2015-03-25T12:33:15","guid":{"rendered":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/?page_id=599"},"modified":"2015-03-25T13:33:40","modified_gmt":"2015-03-25T12:33:40","slug":"treballar-amb-ui-kits","status":"publish","type":"page","link":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/prototipatge\/treballar-amb-ui-kits\/","title":{"rendered":"Treballar amb UI kits"},"content":{"rendered":"<p><\/p>\n<h2>Qu\u00e8 \u00e9s un UI kit?<\/h2>\n<p>Un <em>UI kit<\/em> (de l&#8217;angl\u00e8s <em>user interface kit<\/em>) \u00e9s un arxiu que inclou diversos <strong>elements predissenyats<\/strong> (com, per exemple: botons, icones, taules, formularis, controls lliscants o <em>sliders<\/em>, etc.) per a ajudar-nos a desenvolupar les nostres interf\u00edcies d&#8217;usuari. Es poden editar f\u00e0cilment (els elements en un <em>UI kit<\/em> acostumen a estar fets amb capes), de manera que podem personalitzar-los o adaptar-los a les nostres necessitats (canviar la mida, el color, etc.).<\/p>\n<p>El <strong>format habitual<\/strong> dels UI kits \u00e9s PSD, un tipus d&#8217;arxiu que pot editar-se amb el programa Adobe Photoshop. Tamb\u00e9 podem trobar-los en format Illustrator, HTML5 i CSS3.<\/p>\n<h2>Per a qu\u00e8 serveix un UI kit?<\/h2>\n<p>Moltes vegades, l&#8217;\u00fas d&#8217;un <em>UI kit<\/em> ens ajuda a millorar els nostres dissenys o a explorar nous camins, ja que en descarregar-nos un <em>UI kit<\/em> sencer podem descobrir elements o solucions a problemes de disseny en els quals ni tan sols hav\u00edem pensat.<\/p>\n<p>A m\u00e9s, per als que no saben dissenyar, els UI kits s\u00f3n un recurs magn\u00edfic per a fer els prototips m\u00e9s atractius o simplement dotar-los de m\u00e9s realisme.<\/p>\n<p>Per\u00f2, sobretot, un <em>UI kit<\/em> serveix per a <strong>estalviar temps i diners<\/strong>, ja que s\u00f3n un punt de partida magn\u00edfic sobre el qual es pot comen\u00e7ar a treballar amb la nostra interf\u00edcie, sense necessitat de dissenyar des de zero tots els elements i detalls.<\/p>\n<blockquote><p>Quan som en la fase de prototipatge, els UI kits resulten molt \u00fatils per a \u201cvestir\u201d r\u00e0pidament el nostre treball i ajudar els nostres clients a tenir una idea m\u00e9s clara de com ser\u00e0 el producte final.<\/p><\/blockquote>\n<h2>On es poden trobar UI kits?<\/h2>\n<p>Les p\u00e0gines web especialitzades en disseny solen publicar regularment enlla\u00e7os a <em>UI kits<\/em> gratu\u00efts que es poden descarregar. N&#8217;hi ha prou amb una senzilla cerca a Internet (per exemple: <a href=\"https:\/\/www.google.com\/search?q=free+psd+ui+kit\" target=\"_blank\">free psd ui kit<\/a>) per a tenir acc\u00e9s a aquests recursos. <\/p>\n<p>Especialment c\u00e8lebres en la Xarxa s\u00f3n els PSD de <a href=\"http:\/\/www.teehanlax.com\" target=\"_blank\">teehan+lax<\/a> amb la interf\u00edcie gr\u00e0fica d&#8217;iOS 7 (<em>GUI kit<\/em>) per a <a href=\"http:\/\/www.teehanlax.com\/tools\/iphone\/\" target=\"_blank\">iPhone<\/a> i <a href=\"http:\/\/www.teehanlax.com\/tools\/ipad\/\" target=\"_blank\">iPad<\/a>, la qual cosa ens permet crear prototips r\u00e0pidament en aquest sistema operatiu.<\/p>\n<p><strong>Enlla\u00e7os relacionats:<\/strong><br \/>\n&#8211; <a href=\"http:\/\/designmodo.com\/ui-kit-use\/\" target=\"_blank\">What is UI kit and why you should use it<\/a><br \/>\n&#8211; <a href=\"http:\/\/365psd.com\/\" target=\"_blank\">365psd, download a free PSD every day<\/a><br \/>\n&#8211; <a href=\"http:\/\/freebiesbug.com\/\" target=\"_blank\">Freebiesbug, latest PSDs and other resources for designers<\/a><br \/>\n&#8211; <a href=\"https:\/\/dribbble.com\/search?q=psd+ui+kit\" target=\"_blank\"><em>UI kits<\/em> en dribbble<\/a><\/p>","protected":false},"excerpt":{"rendered":"<p>Qu\u00e8 \u00e9s un UI kit? Un UI kit (de l&#8217;angl\u00e8s user interface kit) \u00e9s un arxiu que inclou diversos elements predissenyats (com, per exemple: botons, icones, taules, formularis, controls lliscants o sliders, etc.) per a ajudar-nos a desenvolupar les nostres interf\u00edcies d&#8217;usuari. Es poden editar f\u00e0cilment (els elements en un UI kit acostumen a estar &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/multimedia.uoc.edu\/blogs\/dii\/prototipatge\/treballar-amb-ui-kits\/\" class=\"more-link\">Continua llegint <span class=\"screen-reader-text\">\u00abTreballar amb UI kits\u00bb<\/span><\/a><\/p>\n","protected":false},"author":65,"featured_media":0,"parent":8,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"plantilla-pagina.php","meta":{"footnotes":""},"tags":[],"class_list":["post-599","page","type-page","status-publish","hentry","entry"],"_links":{"self":[{"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/pages\/599","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/users\/65"}],"replies":[{"embeddable":true,"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/comments?post=599"}],"version-history":[{"count":2,"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/pages\/599\/revisions"}],"predecessor-version":[{"id":601,"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/pages\/599\/revisions\/601"}],"up":[{"embeddable":true,"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/pages\/8"}],"wp:attachment":[{"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/media?parent=599"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/multimedia.uoc.edu\/blogs\/dii\/wp-json\/wp\/v2\/tags?post=599"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}