{"id":2495,"date":"2022-04-29T12:03:00","date_gmt":"2022-04-29T10:03:00","guid":{"rendered":"https:\/\/www.migomedia.pl\/?p=2495"},"modified":"2022-11-09T11:02:46","modified_gmt":"2022-11-09T09:02:46","slug":"ux-ui-design","status":"publish","type":"post","link":"https:\/\/migo.media\/pl\/ux-ui-design","title":{"rendered":"UX i UI design &#8211; podobie\u0144stwa i r\u00f3\u017cnice"},"content":{"rendered":"\n<p><strong>Gdy tworzysz lub zamawiasz produkt cyfrowy, taki jak strona internetowa czy aplikacja, chcesz, aby by\u0142 on intuicyjny, atrakcyjny wizualnie i skuteczny. Dzi\u0119ki temu u\u017cytkownicy b\u0119d\u0105 korzysta\u0107 z niego z przyjemno\u015bci\u0105. Jak zadba\u0107 o przejrzysto\u015b\u0107 i estetyczny wygl\u0105d strony lub aplikacji? Z pomoc\u0105 UX i UI designer\u00f3w.<\/strong><\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Czym s\u0105 UX i UI design?<\/strong><\/h3>\n\n\n\n<p>UX i UI to dwa rodzaje projektowania produkt\u00f3w cyfrowych, np. strony internetowej czy aplikacji. Dotycz\u0105 odmiennych aspekt\u00f3w i etap\u00f3w ich tworzenia, ale stanowi\u0105 dla siebie niezb\u0119dne uzupe\u0142nienie.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>UX design<\/strong><\/h4>\n\n\n\n<p>UX to skr\u00f3t od User Experience, czyli dos\u0142ownie <strong>do\u015bwiadczenie u\u017cytkownika<\/strong>. Powinno by\u0107 ono jak najbardziej pozytywne &#8211; znaczenie ma tu np. szybko\u015b\u0107 \u0142adowania strony, jej intuicyjno\u015b\u0107, \u0142atwo\u015b\u0107 znalezienia na niej poszukiwanej informacji.&nbsp;<\/p>\n\n\n\n<p>UX design ma na celu <strong>zaprojektowanie w\u0142a\u015bnie takich &#8211; pozytywnych &#8211; wra\u017ce\u0144 u odbiorcy<\/strong> podczas korzystania ze strony czy aplikacji.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>UI design<\/strong><\/h4>\n\n\n\n<p>UI to User Interface, czyli dos\u0142ownie <strong>interfejs u\u017cytkownika<\/strong>.<\/p>\n\n\n\n<p>To poj\u0119cie zwi\u0105zane jest z wygl\u0105dem projektu. Odnosi si\u0119 do <strong>technicznej, wizualnej<\/strong> strony jego projektowania. Zajmuje si\u0119 np. fontami, kolorystyk\u0105, stylem przycisk\u00f3w, wygl\u0105dem grafiki i tre\u015bci. Mo\u017cesz zauwa\u017cy\u0107, \u017ce jest to zagadnienie, kt\u00f3re zawiera w sobie elementy projektowania graficznego i projektowania front end (odnosz\u0105cego si\u0119 do wygl\u0105du i funkcjonalno\u015bci stron).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>UX vs. UI design &#8211; podobie\u0144stwa<\/strong><\/h3>\n\n\n\n<p>Pierwsze podobie\u0144stwo mi\u0119dzy User Experience i User Interface \u0142atwo dostrze\u017cesz w nazwie. Oba poj\u0119cia stawiaj\u0105 <strong>u\u017cytkownika w centrum<\/strong>.<\/p>\n\n\n\n<p>Produkt, kt\u00f3ry tworzysz lub zamawiasz, ma odpowiada\u0107 na <strong>oczekiwania i potrzeby u\u017cytkownik\u00f3w<\/strong>. Dotyczy to zar\u00f3wno jego funkcjonalno\u015bci, jak i wygl\u0105du.<\/p>\n\n\n\n<p>UX i UI opisuj\u0105 etapy <strong>powstawania produktu cyfrowego <\/strong>i <strong>jego projektowanie<\/strong>. Nie s\u0105 one oderwane od siebie, ale przeplataj\u0105 si\u0119 i uzupe\u0142niaj\u0105. UI designer tworzy produkt tak, aby<strong> nadawa\u0142 si\u0119 do u\u017cytku<\/strong>, a UX designer sprawdza, <strong>jak reaguj\u0105 na niego odbiorcy <\/strong>(np. na podstawie test\u00f3w na u\u017cytkownikach). Nast\u0119pnie UI designer wprowadza poprawki zgodnie z wytycznymi UX designera. Tak dopracowany produkt zn\u00f3w jest testowany, a potem ca\u0142y proces si\u0119 powtarza.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>UX designer i UI designer &#8211; czym r\u00f3\u017cni si\u0119 ich praca?<\/strong><\/h3>\n\n\n\n<p>Pomimo tego, \u017ce UX i UI \u015bci\u015ble si\u0119 ze sob\u0105 wi\u0105\u017c\u0105, odnosz\u0105 si\u0119 do innych etap\u00f3w i obszar\u00f3w tworzenia projektu. Praca UX designera i UI designera r\u00f3\u017cni si\u0119 pod kilkoma wzgl\u0119dami:<\/p>\n\n\n\n<p><strong>spos\u00f3b pracy: <\/strong>UX designer stosuje podej\u015bcie analityczne, krytyczne, psychologiczne, musi wczu\u0107 si\u0119 w do\u015bwiadczenia u\u017cytkownika. UI designer wykorzystuje umiej\u0119tno\u015bci techniczne, cyfrowe;<\/p>\n\n\n\n<p><strong>cechy: <\/strong>UX designerem mo\u017ce zosta\u0107 osoba, kt\u00f3ra cechuje si\u0119 empati\u0105 &#8211; rozumie perspektyw\u0119 drugiej osoby. W pracy UI designera liczy si\u0119 poczucie estetyki;<\/p>\n\n\n\n<p><strong>narz\u0119dzia, kt\u00f3rych u\u017cywaj\u0105:<\/strong> UX designer korzysta g\u0142\u00f3wnie z program\u00f3w analitycznych, a UI designer graficznych;<\/p>\n\n\n\n<p><strong>g\u0142\u00f3wne zadanie:<\/strong> rol\u0105 UX designera jest analiza tego, jak dzia\u0142a produkt z punktu widzenia grupy docelowej (np. \u0142atwo\u015b\u0107 wyszukiwania na stronie konkretnego elementu, intuicyjno\u015b\u0107 menu, szybko\u015b\u0107 \u0142adowania strony, jako\u015b\u0107 jej zawarto\u015bci). UI designer zajmuje si\u0119 prze\u0142o\u017ceniem j\u0119zyka komputerowego na j\u0119zyk przyst\u0119pny dla ludzi i wdra\u017ca rozwi\u0105zania zaproponowane przez projektanta UX;<\/p>\n\n\n\n<p><strong>cel dzia\u0142a\u0144:<\/strong> UX designer chce dopasowa\u0107 produkt do wymaga\u0144 grupy docelowej. Celem UI designera jest zaprojektowanie produktu tak, \u017ceby odpowiada\u0142 nie tylko odbiorcom, ale by\u0142 te\u017c sp\u00f3jny z komunikacj\u0105 marki;<\/p>\n\n\n\n<p><strong>skupiaj\u0105 si\u0119 na innym rodzaju satysfakcji u\u017cytkownik\u00f3w:<\/strong> UX designer w swojej pracy zajmuje si\u0119 analiz\u0105 ich potrzeb, zachowa\u0144 i reakcji podczas korzystania ze stron internetowych czy aplikacji, a projektant UI dba o estetyk\u0119 i optymalizacj\u0119 narz\u0119dzi, kt\u00f3rymi pos\u0142uguje si\u0119 odbiorca.<\/p>\n\n\n\n<p>User Experience i User Interface to dwie strony tego samego medalu, kt\u00f3re si\u0119 uzupe\u0142niaj\u0105. Wsp\u00f3\u0142praca UX designera i UI designera jest niezb\u0119dna do tego, aby produkt cyfrowy cechowa\u0142 si\u0119 wysok\u0105 jako\u015bci\u0105 oraz skuteczno\u015bci\u0105 w realizacji Twoich cel\u00f3w. Dzi\u0119ki prostej w u\u017cyciu i przyjemnej dla oka stronie czy aplikacji u\u017cytkownicy ch\u0119tnie z niej skorzystaj\u0105 i jeszcze ch\u0119tniej do niej wr\u00f3c\u0105.&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Gdy tworzysz lub zamawiasz produkt cyfrowy, taki jak strona internetowa czy aplikacja, chcesz, aby by\u0142 on intuicyjny, atrakcyjny wizualnie i skuteczny. Dzi\u0119ki temu u\u017cytkownicy b\u0119d\u0105 korzysta\u0107 z niego z przyjemno\u015bci\u0105. Jak zadba\u0107 o przejrzysto\u015b\u0107 i estetyczny wygl\u0105d strony lub aplikacji? Z pomoc\u0105 UX i UI designer\u00f3w. Czym s\u0105 UX i UI design? UX i UI\u2026 <a href=\"https:\/\/migo.media\/pl\/ux-ui-design\">Wi\u0119cej &raquo;<\/a><\/p>\n","protected":false},"author":6,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[4],"tags":[],"acf":[],"_links":{"self":[{"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/posts\/2495"}],"collection":[{"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/comments?post=2495"}],"version-history":[{"count":1,"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/posts\/2495\/revisions"}],"predecessor-version":[{"id":2496,"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/posts\/2495\/revisions\/2496"}],"wp:attachment":[{"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/media?parent=2495"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/categories?post=2495"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/migo.media\/pl\/wp-json\/wp\/v2\/tags?post=2495"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}