UX дизайнерын ажлын талаархи долоон асуулт: мэргэжлийг ойлгох. UX болон UI дизайнерууд юу хийдэг вэ, урд талын хөгжүүлэгчид юу хийдэг вэ? Ux дизайн гэж юу вэ


Мэдээллийн технологийн салбарт дизайнтай холбоотой нэлээд олон салбар байдаг. Тэдгээрийн хамгийн түгээмэл нь UX болон UI товчлолуудын ард нуугдсан дизайнерууд юм. За, зарим хүмүүс урд талын хөгжүүлэгчдийг дизайнер болгон багтааж чаддаг. Мэдээллийн технологийн ертөнцөд дизайнерууд хэн бэ, UI болон UX хоёрын ялгаа юу вэ, мөн урд талын инженерүүд ямар холбоотой болохыг олж мэдэхийг хичээцгээе.

Дизайнерууд

Аппликейшн, вэбсайт эсвэл тоглоомын интерфейсийг хөгжүүлэх нь нэлээд төвөгтэй үйл явц бөгөөд инженерчлэл, сэтгэл зүй, дизайн зэрэг янз бүрийн салбарын мэдлэгийг ашиглахыг шаарддаг. Хэрэглэгчийн интерфэйс эсвэл UI дизайнерууд нь сайтын үйл ажиллагааг (хайлт, таб, цэс) хэрхэн харуулах, үйлчлүүлэгч болон интерфэйсийн харилцан үйлчлэлийн дэлгэрэнгүй мэдээлэлд анхаарлаа хандуулдаг. UI дизайнерын зорилго нь гоо зүйн хувьд хүлээн зөвшөөрөгдсөн орчин үеийн бүтээгдэхүүний загвар юм. UX гэдэг нь User Experience гэсэн үг бөгөөд энэ нь "хэрэглэгчийн туршлага" гэсэн утгатай. UX дизайнер нь боломжит хэрэглэгчийн интерфэйсийг ашиглах чадвар, ойлгоход илүү анхаардаг. Ийм мэргэжилтэн нь дизайны үзэл баримтлалыг бий болгох үндэс суурь болох судалгаа, судалгааг ихэвчлэн хийдэг, мөн боловсруулах явцад болон дараа нь үзэл баримтлалыг туршиж үздэг. Энэ нь ихэвчлэн бүтэц, агуулга, навигаци, хэрэглэгч эдгээр элементүүдтэй хэрхэн харьцдаг талаар голчлон анхаардаг.

Энэ нь програм хангамжийг бий болгох үндсэн бүтэц болох сайтын зураглал, прототипийг үйлдвэрлэдэг. UX дизайнерын ажлын зорилго нь хэрэглэгч энд ирсэн зүйлээ сайтаас хурдан бөгөөд өвдөлтгүй авах явдал юм. Гэсэн хэдий ч өнөөдөр энэ хоёр мэргэжлийг ташуу зураасаар бичсэн байхыг харах нь элбэг. Өөрөөр хэлбэл, хоёр чиглэлийн ажлыг нэг мэргэжилтэн гүйцэтгэдэг. UX/UI дизайнер нь хэрэглэгчийн интерфэйстэй харьцах үйл ажиллагааг зохион бүтээж, яг юу хийх ёстойгоо шийдэж, үр дүнд нь энэ интерфейс хэрхэн харагдахыг хариуцна.

UX/UI дизайнер юу мэдэх ёстой

    График засварлагч. Зах зээл дээрх хамгийн алдартай хэрэгслүүд бол Adobe Photoshop, Adobe Illustrator, түүнчлэн Sketch, Figma юм. Танд тохиромжтой засварлагчийг сонгоод эхлээд вэбсайт эсвэл програмын дэлгэцийн агшинг зурж, тэдгээрийг бага зэрэг шинэчилж үзээрэй.

    Прототип хийх хэрэгслүүд (Mockplus, Axure). Прототип хийх хэрэгсэл нь санаа ба түүний хэрэгжилтийн хоорондох холбоос юм. Ямар хэрэгсэл ашиглах нь хамаагүй. Та хэд хэдэн оролдлого хийж, өөрийн хэв маяг, сонголтод тохирсон нэгийг сонгох боломжтой.

    Хэрэглэгчийн сэтгэл зүй.Загварын шатанд аль хэдийн энэ интерфейсийг ашиглах нь танд эсвэл өөр хэн нэгэнд тохиромжтой эсэх талаар бодох хэрэгтэй. Үйлчлүүлэгчийн оронд өөрийгөө тавьж, түүнтэй хүчтэй холбоо тогтоож, түүний хэрэгцээг анхаарч үзээрэй. Эцсийн эцэст, хэрэв бүтээгдэхүүн эрэлттэй байвал амжилтанд хүрнэ.

    Мөн танд мэдлэг хэрэгтэй болно өнгөт онол. Бид бага наснаасаа, ялангуяа урлагийн сургуульд сурч байсан хүмүүсээс зарим зүйлийг мэддэг. Гэсэн хэдий ч дизайнеруудын ажлын талаар тодорхой онцлог шинж чанарууд байдаг. Суурь мэдлэгийг интернет дэх ном, нийтлэлээс олж авч болно.

    талаар санаатай байхыг зөвлөж байна хэвлэх, текст болон харааны бүрэлдэхүүн хэсгүүдийг хослуулах хэрэгсэл.

    Сайтын бүтэц, ашиглах боломж.

    Ажлын онцлогоос хамааран танд HTML ба CSS эсвэл (зарим) програмчлалын хэлний талаархи ойлголт хэрэгтэй байж магадгүй (эх сурвалжуудын холбоосыг доороос "Front-end Developer юу мэдэх ёстой" хэсгээс олж болно).

Урд талын хөгжүүлэгч

Front-end хөгжүүлэгчийн гол ажил бол интерфэйсийн клиент хэсгийг хөгжүүлэх явдал юм. Өөрөөр хэлбэл, ийм мэргэжилтэн дизайнеруудын бүтээсэн зүйлийг "сэргэдэг" юм. Тэрээр интерфэйсийн ажиллагаа, ажиллагааг хариуцдаг бөгөөд харааны контентыг бага хариуцдаг. Урд талын хөгжүүлэгч нь хөгжүүлэлтийн үе шатанд хэрэглэгчийн интерфэйсийн сайн шийдлийг олох шаардлагатай байдаг тул UX/UI дизайнертай ихэвчлэн хамтран ажилладаг. Урд талын хөгжүүлэгчийн бичсэн код нь хэрэглэгчийн хөтөч дээр ажилладаг (тэдний хэлснээр "үйлчлүүлэгч тал дээр"). Мөн хамгийн чухал ажлуудын нэг бол сайт эсвэл вэб програмыг бүх платформ болон хөтөч дээр адилхан байлгах явдал юм.

Front-end хөгжүүлэгч юу мэдэх ёстой вэ

Дүрмээр бол урд тал нь HTML хуудасны тэмдэглэгээний хэл, CSS загварын хуудас, JavaScript програмчлалын хэл гэсэн гурван тулгуур дээр суурилдаг. Нэмж дурдахад, урд талын хөгжүүлэгч нь HTTP протокол, серверүүд болон хөтчүүдийн үйл ажиллагааны зарчим, зах зээл дээр байгаа янз бүрийн төхөөрөмж дээр интерфэйсийг харуулах онцлогуудыг ойлгох ёстой. Вэб интерфэйсийг бий болгох хэрэгсэл, аргууд нь байнга хөгжиж, өөрчлөгдөж байдаг тул хөгжүүлэгч үүнийг байнга хянаж байх ёстой.

HTML ба CSS (зохион байгуулалт)

Энэ бол сайтыг барьж буй тоосгонуудын зохион байгуулалт юм. HTML тэмдэглэгээний хэл нь сайтын зохион байгуулалт, агуулга, тэдгээрийн хоорондын бүх харилцааг тодорхойлдог. Энэ нь хуудасны дээд хэсэг, доод хэсэг, агуулга, гарчиг, текст болон мультимедиа элементүүдийн дэлгэцийн хажуугийн блокуудыг тодорхойлох боломжийг танд олгоно. CSS загварын хуудсыг HTML элементүүдийг чимэглэхэд ашигладаг. Тэд хуудсан дээрх график элемент бүрийг хэрхэн харуулахыг тодорхойлдог. HTML5 болон CSS3-ийн хамгийн сүүлийн үеийн хувилбаруудыг ашигласнаар та хуудсан дээр видео болон аудио бүрэлдэхүүн хэсгүүдийг байрлуулж, 2D зураг, хөдөлгөөнт дүрс үүсгэх, энгийн тоглоом бичих боломжтой. Бүх шошго, хэв маягийг нэг дор санах гэж оролдох шаардлагагүй. Энэ нь үндсэн ойлголтуудыг сурч, тэдгээрийг даруй хэрэгжүүлэхэд тустай байх болно. HTML болон CSS-ийн үндсийг сурах боломжтой маш сайн сайт - W3School. Гэхдээ та англи хэлний наад зах нь анхан шатны мэдлэгтэй бол л болно. Түүнчлэн, урд талын хөгжүүлэгч нь хөтчүүд болон платформ хоорондын хөгжүүлэлт, дасан зохицох, хариу үйлдэл үзүүлэх зохион байгуулалтыг ойлгох ёстой.

Ачаалагч

Энэ нь HTML, CSS болон JavaScript-д зориулсан хүрээ юм. Өөрөөр хэлбэл, бүтээгч шиг сайтуудыг түүнгүйгээр илүү хурдан цуглуулах боломжтой зарим загварууд. Гэхдээ мэдээжийн хэрэг та өөрийн хэрэгцээнд нийцүүлэн тохируулах хэрэгтэй. Хэрэв та англи хэл мэддэг бол getbootstrap вэбсайт болон ижил w3schools-ыг санал болгож байна.

JavaScript

Javascript бол урд талын хөгжүүлэлтийн цөм юм. Энэ бол хамгийн анхны бөгөөд хамгийн өргөн тархсан интерфэйсийн програмчлалын хэл юм. Энэ нь сайтад олон боломжуудыг нэмж болно. Үндсэн түвшинд энэ хэл нь хуудсанд интерактив элементүүдийг нэмэх боломжийг олгодог. Энэ нь бодит цаг хугацаанд шинэчлэгддэг газрын зураг, интерактив онлайн тоглоом, кино бүтээхэд ашиглагддаг. Манай ахлах ангийн JavaRush курст бид бага зэрэг JavaScript сурдаг. Та үүнийг ижил W3School дээр судлах эсвэл javascript.ru вэбсайтаас орос хэл дээр уншиж болно.

jQuery

jQuery бол хөгжүүлэлтийг илүү хялбар, хурдан болгох нэмэлт өргөтгөлүүдийг агуулсан Javascript номын сан юм. Номын сангууд эхнээс нь код бичихийн оронд бэлэн бүрэлдэхүүн хэсгүүдийг нэмэх боломжийг олгодог бөгөөд дараа нь тодорхой төсөлд тохируулан өөрчилж болно. Та хайлтын маягтыг автоматаар бөглөх, сүлжээг дахин зохион байгуулах, хэмжээг өөрчлөх, цаг тоологч тохируулах функцуудыг ашиглаж болно. w3school дээрх jQuery-н практик сургалт

Javascript хүрээ

Янз бүрийн төрлийн хүрээ байдаг, гэхдээ та ашиглахад тохиромжтой нэгийг нь сонгож болно. Хамгийн алдартай нь Angular, Backbone, Ember, React юм. Эдгээр нь кодын бэлэн бүтцийг илэрхийлдэг. Тэд хөгжлийг хурдасгахад тусалдаг. Мөн номын сангуудтай хослуулан тэд вэбсайт эсвэл програмын хөгжлийг эхнээс нь багасгаж чадна. 2017 оны хамгийн алдартай 5 JavaScript хүрээ ба номын сангийн тойм

Git хувилбарын хяналтын систем

Хувилбарын хяналтын систем нь цаг хугацааны явцад кодонд хийсэн өөрчлөлтийг хянах боломжтой. Тэд мөн төслийн өмнөх хувилбар руу буцах боломжийг олгодог. Git бол хамгийн өргөн хэрэглэгддэг хувилбарын хяналтын систем юм. Git-тэй хэрхэн ажиллахаа мэдэх нь хөгжүүлэгч бүрийн хувьд чухал ур чадвар юм.

Товч дүгнэлт

UI гэдэг нь User Interface гэсэн үгийн товчлол бөгөөд энэ нь "хэрэглэгчийн интерфейс" гэсэн утгатай. Тэр бол, UI дизайнерБүтээгдэхүүнийг хэрэглэгчдэд хэрхэн үзүүлэхийг голчлон хариуцна. Тэрээр товчлуур, дүрсийг боловсруулж, фонтыг сонгож, зохион байгуулалтыг бэлтгэдэг. UX гэдэг нь Хэрэглэгчийн туршлага гэсэн үг. Тэгэхээр UX дизайнервэб сайт, программ эсвэл ямар нэгэн зүйлийн дизайныг зохион бүтээдэг бөгөөд ингэснээр хэрэглэгч юу болохыг тухтай, ойлгомжтой болгож, сайтаас шаардлагатай зүйлээ хамгийн бага хүчин чармайлтаар олж авах боломжтой. Ихэнхдээ хоёр төрлийн ажлыг нэг хүний ​​найрал хөгжим гүйцэтгэдэг: UI/UX дизайнер. Front-end хөгжүүлэгч нь дизайнеруудын ажлыг идэвхжүүлж, түүнд динамикийг нэвтрүүлдэг: товчлуурууд дарагдаж, зураг өөрчлөгдөж эхэлдэг. Тэрээр програмчлалын хэлийг мэддэг, фреймворк, препроцессор, номын сангуудтай байх ёстой.

Хэрэглэгчийн интерфэйсийг чадварлаг арга барилаар хөгжүүлэх нь хэрэглэгчтэй харилцах харилцааг оновчтой болгохын тулд аль болох сэтгэл татам, тохь тухтай байхаар бүтэцлэгдсэн байдаг.

Аливаа төсөлд вэб интерфэйс хөгжүүлэгчид хэрэглэгчдэд ээлтэй интерфэйсийг бий болгох даалгавартай тулгардаг. Гэсэн хэдий ч энэ нь эхлээд харахад тийм ч энгийн ажил биш бөгөөд заримдаа дизайны туршлага шаарддаг. Энд тавигдах гол шаардлага бол тав тухтай байдал, практик байдал, зөн совингийн ойлгомжтой байдал юм. Яг энэ үед UX болон UI дизайн зэрэг ойлголтууд гарч ирдэг бөгөөд энэ нь ихэвчлэн андуурдаг. Тэд тус бүрийг тусад нь авч үзээд гол санааг нь тодорхойлъё.

UX дизайн

Хэрэглэгчийн туршлагын дизайнорчуулсан гэсэн үг "харилцааны туршлага"мэдээллийн архитектур, харилцан үйлчлэлийн дизайн, график дизайн, контент зэрэг төрөл бүрийн UX бүрэлдэхүүн хэсгүүдийг агуулдаг.

Ерөнхийдөө UX дизайн нь вэб сайт, гар утасны програм эсвэл бусад программ байхаас үл хамааран хэрэглэгчийн интерфэйстэй харилцах нэгдсэн арга барилыг илэрхийлдэг. Энэ ажлыг хийж байгаа хүн нь UX дизайнер(Сүүлийн үед та UX архитектор, UX инженер эсвэл стратегич гэсэн нэрсийг сонсох нь ихсэж байна, учир нь энэ агуулга дахь "дизайн" гэдэг үг нь бидний энэ үгийн утгыг ойлгоход дассан зүйлээс илүү нийтлэг нэр үг юм) - боловсруулахдаа Интерфэйс нь хэрэглэгчийн орчин, цахим төхөөрөмжийн төрлөөс эхлээд мэдээлэл оруулах, харуулах арга хүртэл бүх нарийн ширийн зүйлийг аль болох харгалзан үзэх ёстой.

Энгийн жишээ:Та хайлтын системийн эхний мөрөнд нөөцөө сурталчлахын тулд маш их хэмжээний хөрөнгө оруулалт хийсэн гэж бодъё, гэхдээ түүний тав тухтай байдал нь хүссэн зүйлээ орхиж байна. Энэ тохиолдолд гайхалтай олон тооны хэрэглэгчид сайтыг орхиж, үр нөлөө нь хамгийн бага байх болно. Тийм ч учраас нөөцийн зочдын үйл ажиллагаанд байнга дүн шинжилгээ хийж, вэбсайтаа сайжруулж, орчин үеийн чиг хандлагыг дагаж мөрдөх шаардлагатай байдаг.

UX дизайны шийддэг гол асуудлууд:

  • Зорилго, зорилтоо тодорхойлох - эцэст нь бид юунд хүрэх ёстой вэ?
  • Зорилгодоо хүрэхийн тулд тохиромжтой UX хэрэгслийг сонгох
  • Зорилтот хэрэглэгчдэд аль болох хялбар, ойлгомжтой бүтээгдэхүүн боловсруулах
  • Эцсийн үр дүнгийн дүн шинжилгээ - бүтээгдэхүүн нь хэрэглэгчийн хүлээлтийг хангаж байгаа эсэх, хэрэглэгчийн сэтгэл ханамжийн түвшин хэр өндөр байна.

Эдгээр үе шатанд бүх нарийн ширийн зүйлийг сайтар бодож үзэх нь таны бүтээгдэхүүний шүтэн бишрэгчдийн армийг бий болгох боломжийг олгоно. Үүний тод жишээ бол энэ замыг дагаж, мянга, сая хүмүүсийн зүрх сэтгэлийг байлдан дагуулсан Apple компани юм.

UI дизайн

Хэрэглэгчийн интерфейс дизайн эсвэл хэрэглэгчийн интерфэйс- энэ нь графикаар зохион бүтээсэн техникийн элементүүдийн тодорхой багцыг (товчлуур, шалгах хайрцаг, сонгогч болон бусад талбар) багтаасан нарийн ойлголт юм. Үүний үүрэг бол хэрэглэгчдэд програм / сайттай харилцах харилцааг зохион байгуулахад туслах явдал юм. Одоогоор зарим нь бий UI дизайны дүрэм:

  1. Интерфейсийн элементүүдийн зохион байгуулалт.Энэ нь тэдгээр нь логик бүтэцтэй, харилцан уялдаатай байх ёстой гэсэн үг юм.
  2. Интерфейсийн элементүүдийг бүлэглэх.Энэ нь логик холбоотой элементүүдийг (цэс, маягт) бүлгүүдэд нэгтгэх явдал юм.
  3. Интерфэйсийн элементүүдийг тэгшлэх. Муу тохируулагдсан интерфэйс нь хэн нэгэнд тохиромжтой гэж төсөөлөхөд бэрх юм!
  4. Интерфейсийн элементүүдийн нэгдсэн хэв маяг.Загвар нь чухал үүрэг гүйцэтгэдэг, учир нь энэ нь хэрэглэгчийн санах ойд хадгалагддаг.
  5. Чөлөөт орон зай байгаа эсэх.Энэ нь нэг зүйл дээр анхаарлаа төвлөрүүлж, мэдээллийн блокуудыг ялгах боломжийг олгодог.

Бүх дүрмийн дагуу боловсруулсан хэрэглэгчийн интерфэйс нь нөөцийн үр ашгийг эрс нэмэгдүүлж, өрсөлдөх давуу талыг өгдөг.

Мэдээллийн архитектур (IA)

Тус тусад нь би хэдэн үг хэлмээр байна Мэдээллийн архитектур (IA). Түүний ажил нь өгөгдлийн зохион байгуулалтад чиглэдэг, өөрөөр хэлбэл техникийн болон системийн дүрмээс илүүтэй хэрэглэгчийн байр сууринаас мэдээлэл хэр зэрэг бүтэцлэгдсэн байдаг. Энэ нь хуудсан дээрх элементүүдийн байршил, хуудасны холболтыг өөрөө тодорхойлдог. IA-ийн чадвар бол цэс, навигаци, тэдгээрийн чадварлаг хэрэгжилт юм.

Дүгнэж хэлэхэд, янз бүрийн эх сурвалжид UX дизайныг өөр өөр зүйл гэж ойлгодог гэдгийг тэмдэглэхийг хүсч байна, гэхдээ ерөнхийдөө эдгээр нь бүгд нийтлэлд дурдсан бүтээгдэхүүн дээр ажиллах гэсэн үг юм. UX таны хувьд юу гэсэн үг вэ?

UX дизайн нь хүний ​​сэтгэл зүйн мэдлэг дээр суурилдаг бөгөөд олон жилийн турш хэрэглэгчдийг судалсны дүнд интерфэйсийг зохион бүтээхдээ мэдэх шаардлагатай сэтгэцийн олон хуулиуд бий болсон.

UX дизайн: Фитсийн хууль

Зорилтот хүрэх хугацаа нь зорилтот хүрэх зай болон түүний хэмжээнээс хамаарна. 1954 онд сэтгэл судлаач Пол Фитс хүний ​​моторын системийг судалж байхдаа байг онох хугацаа нь бай хүрэх зайнаас хамаардаг ба байны хэмжээнээс урвуу хамааралтай болохыг харуулсан. Энэ хуулийн дагуу хурдан хөдөлгөөн, жижиг бай нь илүү их алдаа гаргадаг. Фитсийн хуулийг UI болон UX-д өргөн ашигладаг. Жишээлбэл, энэ хуулийн дагуу интерактив товчлуурыг том болгох хэрэгтэй, учир нь жижиг товчлуурууд дарахад илүү төвөгтэй, удаан байдаг.

Хикийн хууль

Шийдвэр гаргах хугацаа нь сонголтын тоо, нарийн төвөгтэй байдлаас шалтгаалан нэмэгддэг. Өдөөлтийн тоо их байх тусам хэрэглэгч аль нь илүү удаан ажиллахаа сонгох болно. Хэрэглэгчид сонголтоор бөмбөгдөж байгаа бол тэд юу хийхийг хүсэхгүй байгаагаа тайлбарлах, шийдэх цаг гаргах хэрэгтэй болно.

Иаковын хууль

Хэрэглэгчид бусад сайтуудад илүү их цаг зарцуулдаг. Энэ нь хэрэглэгчид таны сайтыг аль хэдийн мэддэг сайтуудтай адилхан ажиллахыг илүүд үздэг гэсэн үг юм. Жейкобын хуулийг эвристик үнэлгээний аргыг зохион бүтээсэн гэх мэт UX-д асар их хувь нэмэр оруулсан Nielsen Norman группын үүсгэн байгуулагч Якоб Нилсен зохиосон.

Жирэмсний тухай хууль

Хүмүүс хоёрдмол утгатай эсвэл ээдрээтэй зургуудыг хамгийн энгийн хэлбэрээр ойлгож, тайлбарлах болно, учир нь энэ тайлбар нь биднээс хамгийн бага танин мэдэхүйн хүчин чармайлт шаарддаг. Энэ хуулийг 1910 онд сэтгэл судлаач Макс Вертхаймер төмөр замын гарамны ойролцоох гэрлийг хараад нээсэн юм. Яг л тайзны эргэн тойрон дахь гэрлийг асааж унтраахтай адил байсан. Ажиглагчийн хувьд энэ нь чийдэнгээс чийдэн рүү шилждэг ижил гэрэл мэт харагддаг ч бодит байдал дээр энэ нь ээлжлэн асдаг, унтардаг гэрлийн чийдэнгийн цуваа юм.

UX дизайн: Ойрын тухай хууль

Бие биедээ ойрхон байгаа объектуудыг бүлэгт хүлээн авдаг. Энэ хууль нь мөн гештальт сэтгэл судлалын гол хуульуудын нэг бөгөөд Вертхаймер нээсэн юм. Хурдан цуврал үйл явдлууд нь хөдөлгөөний хуурмаг байдлыг бий болгодог гэдгийг тэрээр анзаарсан. Жишээлбэл, кино бол тасралтгүй харагдахуйц туршлага гэж ойлгогддог, хурдан хөдөлдөг жааз юм.

Миллерийн хууль

Дунджаар хүн ажлын санах ойдоо 7 ± 2 зүйл хадгалдаг. 1956 онд Жорж Миллер нэн даруй санах ой болон үнэмлэхүй шүүлтийн хүрээ нь ойролцоогоор 7 мэдээлэлээр хязгаарлагддаг гэж мэдэгджээ. Мэдээллийн үндсэн нэгж нь бит буюу ижил магадлалтай хоёр хувилбараас сонгоход шаардагдах өгөгдлийн хэмжээ юм. Өөрөөр хэлбэл, 4 бит мэдээлэл нь 16 хос хувилбарын (дараалсан 4 хоёртын шийдвэр) хоорондох шийдвэр юм. Төөрөгдөл нь буруу дүгнэлт гаргахад хүргэдэг цэг бол сувгийн багтаамж юм.

Паркинсоны хууль

Аливаа ажил нь түүнд зориулагдсан бүх цагийг авдаг. Энэ хуулийн дагуу цаг хугацаа, орон зай, төсвийн хязгаарлалт нь бүтээмж, үр ашгийг нэмэгдүүлэхэд хүргэдэг.

Цуваа зохицуулалтын эффект

Хэрэглэгчид цувралын эхний болон сүүлчийн объектуудыг хамгийн сайн санаж байна. Хэрэглэгчийн илүү сайн туршлагыг бий болгохын тулд цуврал байршуулалтыг удирдах нь Apple, Electronic Arts, Nike зэрэг амжилттай компаниудын олон алдартай загварт хэрэглэгддэг.

UX дизайн: Теслерийн хууль

Теслерийн хууль буюу нарийн төвөгтэй байдлыг хадгалах хууль нь аливаа системийн хувьд тодорхой тоо байдаг бөгөөд үүнийг багасгаж болохгүй. 1980-аад оны дундуур Ларри Теслер хэрэглэгчид программуудтай хэрхэн харьцах нь программ өөрөөс дутахгүй чухал гэдгийг ойлгосон. Тэрээр хэлэхдээ, ихэнх тохиолдолд инженер хүн олон сая хэрэглэгчдийг нарийн төвөгтэй програм ашиглан нэмэлт минут зарцуулахыг албадахаас илүүтэйгээр програмыг хялбарчлахад илүү долоо хоног зарцуулах ёстой. Гэсэн хэдий ч Брюс Тогназзини хүмүүс амьдралаа хялбарчлахыг эсэргүүцдэг гэж үздэг. Тиймээс, хэрэв програм нь энгийн бол хэрэглэгчид илүү төвөгтэй ажлуудыг эрэлхийлж эхэлдэг.

UX дизайн: Von Restorff эффект

Дизайн гэдэг нь нэлээд өргөн бөгөөд тодорхойгүй нэр томъёо юм. Хэн нэгэн "Би загвар зохион бүтээгч" гэж хэлэхэд тэд өдөр бүр юу хийдэг нь шууд ойлгогддоггүй. Энэ үзэл баримтлалын хүрээнд хэд хэдэн өөр өөр үйлдвэрүүд байдаг.

Дизайнтай холбоотой ажлын байрууд нь үйлдвэрлэлийн дизайн (автомашины, тавилга), хэвлэмэл (сэтгүүл болон бусад хэвлэл), вэб дизайн (вэбсайт, гар утасны программ) хүртэл төрөл бүрийн салбарт байдаг. Дэлгэцийн интерфейсийг бий болгоход чиглэсэн өндөр технологийн компаниуд сүүлийн үед шилжин ирснээр дизайны чиглэлээр олон шинэ ажил гарч байна. UX эсвэл UI дизайнерын байр суурь нь мэдлэггүй хүмүүст төдийгүй бусад салбараас ирсэн дизайнеруудад хүртэл ойлгомжгүй байж магадгүй юм.

"Энэ асуултад нэг ч зөв хариулт алга."

Энэ нь мэдээллийн технологийн салбарт яг юу гэсэн үг болохыг олж мэдэхийг хичээцгээе.

UX дизайнер

UX дизайнерууд юуны түрүүнд үүнд санаа зовдог бүтээгдэхүүн хэрэглэгчтэй хэрхэн харьцдаг. Энэ асуултад ганц зөв хариулт алга. UX дизайнерууд хэрэглэгчийн тодорхой асуудлыг шийдвэрлэх янз бүрийн арга барилыг судалдаг. UX дизайнерын гол ажил бол бүтээгдэхүүн нэг алхамаас нөгөө алхам руу логикоор урсдаг эсэхийг шалгах явдал юм. UX дизайнерын олж мэдэх нэг арга бол хэрэглэгчийн туршилтыг биечлэн хийж, тэдний мэдрэмжээс дүгнэлт гаргах явдал юм. Амаар болон амаар бус бүдэрч буй бэрхшээлийг тодорхойлсноор энэ нь тохируулж, давтагддаг бөгөөд ингэснээр хэрэглэгчдэд "илүү сайн" туршлагыг бий болгодог. Жишээ нь шинэ хэрэглэгчдэд зориулсан гайхалтай туршлага бий болгох явдал юм.

“Харилцааны загвар, хэрэглэгчийн даалгаврын урсгал, интерфейсийн онцлогийг тодорхойл. Скрипт, төгсгөл хоорондын харилцан үйлчлэл, харилцан үйлчлэлийн загвар, график хэрэглэгчийн интерфейсийг хөгжүүлэх. Манай Бүтээлч захирал, график дизайнертай хамтран Твиттерийн визуал талыг функциональ шинж чанаруудтай нь нэгтгэх болно. Шаардлагатай бол утас, загвар, техникийн үзүүлэлтүүдийг боловсруулж, засвар үйлчилгээ хийх."

UX дизайнерын боловсруулсан програмын дэлгэцийн жишээ
Эх сурвалж: Dribbble дээр Ньюай Лаугийн бичсэн Kitchenware Pro Kit Wireframe.

Даалгавар:Дэлгэцийн утас, өгүүллийн самбар, сайтын төлөвлөгөө

Багаж хэрэгсэл: Photoshop, Sketch, Illustrator, Fireworks, InVision

Та түүний хэлэхийг сонссон байх: "Бүртгэл дууссаны дараа хэрэглэгч "Баярлалаа" хуудсыг харах ёстой.

UI дизайнер

Бүтээгдэхүүний ерөнхий туршлагад санаа тавьдаг UX дизайнеруудаас ялгаатай нь UI дизайнерууд бүтээгдэхүүн ямар харагдаж байна. Тэд хэрэглэгчийн харилцдаг дэлгэц эсвэл хуудас бүрийг зохион бүтээх, UX дизайнерын зохион бүтээсэн хэрэглэгчийн интерфэйсийн харааны хэсгийг хангах үүрэгтэй. Жишээлбэл, UI дизайнер нь аналитик хяналтын самбар үүсгэх үед илүү чухал мэдээллийг тодруулж эсвэл гулсагч эсвэл хяналтын самбар нь диаграмд ​​нэмэхэд хамгийн хялбар эсэхийг шийдэх боломжтой. UI дизайнер нь ихэвчлэн дизайны иж бүрэн гарын авлагыг бий болгох үүрэгтэй бөгөөд энэ нь бүтээгдэхүүнийг бүхэлд нь хамарсан нэгдмэл дизайны хэлийг баталгаажуулдаг. Харааны элементүүдийн тууштай байдлыг хадгалах, ямар чиглэлд ажиллахаа тодорхойлох. Жишээлбэл, алдаа, анхааруулгыг хэрхэн харуулах нь UI дизайнерын хүрээнд байдаг.

“Airbnb.com-ийн харааны хэлний үзэл баримтлал ба хэрэгжилт. Өргөтгөсөн загварын гарын авлагыг бий болгох."

UI болон UX дизайнеруудын хоорондох хил хязгаар нь нэлээд бүдэг бөгөөд ихэнхдээ компаниуд эдгээр үүргийг хослуулахыг сонгодог.

UI дизайнер нь програмын ерөнхий мэдрэмж, харагдах байдлыг тодорхойлдог.
Эх сурвалж: Metro Style Interface 4, Ionut Zamfir, Dribbble дээр.

Багаж хэрэгсэл: Photoshop, Sketch, Illustrator, Fireworks

"Нэвтрэх" болон "бүртгэх" талбаруудыг баруун дээд буланд шилжүүлэх ёстой."

График дизайнер

"График дизайнерууд бусдын анхаарал хандуулдаггүй жижиг нарийн ширийн зүйлийг сайтар судалж үздэг."

График дизайнер бол график хийдэг хүн бөгөөд хэрэв та дизайнер юу хийдэг вэ гэж асуувал дизайнер бус хүн танд хэлэх байх. График дизайнерууд дэлгэцүүд хоорондоо хэрхэн холбогдож, хэн нэгэн бүтээгдэхүүнтэй хэрхэн харьцаж байгааг огтхон ч тоодоггүй. Үүний оронд тэдний гол анхаарал нь гоёмсог дүрс, удирдлага, харааны элементүүдийг зохион бүтээх, тохирох загварыг бий болгох явдал юм. График дизайнерууд бусдад харагдахгүй жижиг нарийн ширийн зүйлс дээр ажилладаг бөгөөд ихэвчлэн Photoshop дээр 4x, 8x томруулдаг.

“Ширээний компьютер, вэб, гар утас зэрэг олон нягтралтайгаар (дүрс, график, маркетингийн материал) үзэл баримтлалаас эхлээд гүйцэтгэл хүртэлх өндөр чанартай визуал төслүүдийг бүтээ. Брэндийг тусгаж, бүтээгдэхүүнийг үзэсгэлэнтэй болгож, түүгээр амьсгалж буй хөрөнгийг бий болгож, давтах."

UI дизайнерууд зөвхөн өөрсдийн ажлыг хийхээс гадна пикселийн төгс зохион байгуулалтыг бий болгох шаардлагатай болдог. Зарим компаниуд график дизайнерын дүрд тусгайлан зориулсан хүн ажиллуулахгүй байхыг сонгодог.

График дизайнер нь эцсийн үр дүнд хүрэхийн тулд пиксел бүрийг боловсруулж, чиглүүлж, тохируулдаг.
Эх сурвалж: IOS 7 гарын авлага Freebie PSD-ийн Dribbble дээрх Seevi kargwal.

Багаж хэрэгсэл: Photoshop, Sketch

Та түүний хэлэхийг сонссон байх:"Царагийг багасгаж, товчлуурыг зүүн тийш 1 пиксел зөөнө үү!"

Хөдөлгөөний дизайнер

Та iPhone дээрх имэйлийг сэргээхийн тулд дэлгэцийг чирэх үед ямар нарийн хөдөлгөөн байсныг санаж байна уу? Энэ бол хөдөлгөөн зохион бүтээгчийн ажил юм. Хөдөлгөөнгүй объектуудтай ихэвчлэн ажилладаг график дизайнеруудаас ялгаатай нь хөдөлгөөнт дизайнерууд програм дотор хөдөлгөөнт дүрс үүсгэдэг. Тэд харьцдаг Хэрэглэгч түүнд хүрсний дараа интерфейс юу хийдэг. Жишээлбэл, тэд цэс хэрхэн гулсах, шилжилт хийхэд ямар эффект ашиглах, товчлуурыг хэрхэн дарахыг шийддэг. Сайн хийсэн тохиолдолд хөдөлгөөн нь интерфэйсийн салшгүй хэсэг болж, бүтээгдэхүүнийг хэрхэн ашиглах талаар харааны дохио өгдөг.

“График дизайн, хөдөлгөөнт дизайн, дижитал урлагийн мэдлэг, өнгө, хэвлэх мэдрэмж, материал/бүтэцийг ерөнхийд нь мэддэг байх, хөдөлгөөнт дүрсний талаар ажлын мэдлэгтэй байх шаардлагатай. iOS, OS X, Photoshop болон Illustrator программ хангамжийн мэдлэгтэй байхаас гадна Director (эсвэл түүнтэй дүйцэхүйц), Кварц хөгжмийн зохиолч (эсвэл түүнтэй дүйцэхүйц), 3D компьютерийн загварчлал, хөдөлгөөнт график зэргийг мэддэг байх.”


Багаж хэрэгсэл: AfterEffects, Core Composer, Flash, Origami

Та түүний хэлэхийг сонссон байх:"Цэс нь 800 мс дараа зүүн талд гарч ирэх ёстой."

UX судлаач

UX судлаач нь хэрэглэгчийн хэрэгцээний талаар бүгдийг мэддэг.

UX судлаач нь хэрэглэгчийн хэрэгцээний талаар бүгдийг мэддэг. Судлаачийн зорилго бол “Манай хэрэглэгчид хэн бэ?” гэсэн хоёр үндсэн асуултад хариулах явдал юм. болон "Манай хэрэглэгчид юу хүсч байна?" Дүрмээр бол үүнд хэрэглэгчийн судалгаа, зах зээлийн судалгаа, мэдээллийн дүн шинжилгээ орно. Дизайн бол байнгын давталттай үйл явц юм. Судлаачид энэ үйл явцад A/B тест хийж, хэрэглэгчийн хэрэгцээнд аль дизайны сонголт хамгийн сайн нийцэж байгааг олж мэдэх боломжтой. UX судлаачид их хэмжээний өгөгдөлд хандах нь статистикийн ач холбогдолтой дүгнэлт гаргах өргөн боломжийг олгодог томоохон компаниудын гол тулгуур байх хандлагатай байдаг.

“Судалгааны сэдвүүдийг тодорхойлохын тулд хөгжүүлэлтийн багуудтай нягт хамтран ажилла. Хэрэглэгчийн үйлдэл болон хэрэглэгчийн төсөөлөлтэй холбоотой судалгааны загвар. Судалгаа гэх мэт олон төрлийн аргыг ашиглан судалгаа хийх, хэрэглэх”.

Хэрэв та дизайны чиглэлээр хөгжихийг хүсч байгаа бол мэдээжийн хэрэг та ур чадвараа байнга дээшлүүлж, чиг хандлагыг дагаж, орчин үеийн дизайны шаардлага, тусгай нэр томъёог мэддэг байх хэрэгтэй. Ийм нэр томъёоны нэг нь UX/UI дизайн юм.

Ер нь хоёр жилийн өмнө эдгээр нь ямар төрлийн “долоо хоног”, “ui” вэ гэдгийг олж мэдэх шаардлагатай байхад энэ нь юу болохыг, нэг нь нөгөөгөөсөө юугаараа ялгаатай болохыг ойлгохын тулд маш их ухах хэрэгтэй болсон. Энэ талаар маш их зүйл бичсэн бөгөөд тэр үед үргэлж тодорхой байдаггүй. Тиймээс би эдгээр ойлголтуудыг хамтдаа ойлгохыг санал болгож байна.

UX-ээс эхэлцгээе. UX гэдэг нь товчлол юм Хэрэглэгчийн туршлага, энэ нь шууд утгаараа "хэрэглэгчийн туршлага" гэсэн утгатай. Жишээ нь вэб сайтын UX дизайн хэдий чинээ нарийн байх тусам хэрэглэгч шаардлагатай мэдээллийг хайх эсвэл түүнтэй харилцах нь илүү тохиромжтой байдаг. Өөрөөр хэлбэл, UX дизайны даалгавар бол хэрэгсэл, нөөцийн үйл ажиллагаа, тав тухтай байдлын асуудлыг шийдвэрлэх явдал юм.

Дашрамд хэлэхэд энэ үзэл баримтлал нь зөвхөн мэдээллийн технологийн салбарт төдийгүй бусад салбарт ч хамаатай. Бөмбөлөг үзэгний UX загвар нь хэр сайн бичдэг, хэр хэмжээний бичгийн зуурмаг хангалттай байдаг, зөв ​​бичгийн хэв үүсгэхэд тусалдаг уу, тээвэрлэхэд тохиромжтой, хамгаалалтын малгайтай эсвэл автомат... Ер нь гэж хэлж болно. , тухайн бүтээгдэхүүн нь зориулагдаж буй асуудлыг хэр сайн шийдэж, хэрэглэгчдэд хэр ойлгомжтой байх нь чухал.


Хэрэглэгч тав тухтай байх ёстой бөгөөд бүх зүйл тодорхой байх ёстой

UI дизайны хувьд энэ тохиолдолд энэ нь богино байна Хэрэглэгчийн интерфэйс, дахин шууд утгаараа - "хэрэглэгчийн интерфейс". Энэ төрлийн дизайн нь элементүүдийн өнгө, хэлбэр, хэмжээ, зохион байгуулалт, нэр, үсгийн хэмжээг тодорхойлдог. Өөрөөр хэлбэл, UI нь харааны бүрэлдэхүүн хэсэг бөгөөд хэрэв та хүсвэл өргөлтийг байрлуулж, сайт эсвэл бүтээгдэхүүний тодорхой элементүүдийг тодруулах явдал юм. Өөрөөр хэлбэл, аливаа бүтээгдэхүүн, нөөцийг мэдрэхэд таатай, ашиглахад хялбар болгох. Жишээлбэл, текстийн ойлголт нь догол мөрөнд хэрхэн хуваагдсан, үсгийн хэмжээ, төрөл, гарчиг, дүрслэл байгаа эсэх, текстийг тойрсон зай зэргээс хамаарна.

UX болон UI дизайны ялгаа

Эдгээр хоёр ойлголтын ижил төстэй байдлыг үл харгалзан тэдгээр нь бараг бүх төслийн салшгүй хэсэг болохын зэрэгцээ өөр өөр үүргийг гүйцэтгэдэг. Эдгээр төрлийн дизайны ялгааг илүү сайн ойлгохын тулд Yandex хайлтын үр дүнг авч үзье.

Дотоод бүтэц, шатлал, асар олон тооны нэмэлт үйлчилгээ ( Шууд, Хэмжигдэхүүн, Wordstatгэх мэт) нь UX юм. Гэхдээ, жишээлбэл, таны дагаж байсан холбоосууд өөр өнгөөр ​​тодорсон байдаг - энэ бол UI юм. UI нь мөн сайт нь цэвэр цагаан дэвсгэртэй, тав тухтай ойлголт өгөхөд хангалттай хайлтын үр дүнгийн хоорондох догол мөр, фавикон, сайтын баруун дээд буланд хүссэн үедээ шуудангаар хандах боломжтой зэргийг багтаасан болно.

UX дизайнерХэрэглэгч өөрийн хүлээлтийг хангахын тулд системтэй хэрхэн харьцах талаар бодож үздэг. UI дизайнерЭнэ нь хэрхэн харагдах ёстой талаар боддог: дүрс, зураг, фонт, өнгөт найрлага, ерөнхий ойлголтод хялбар. Ихэнхдээ ижил хүн энэ ажилд оролцдог тул UI болон UX-ийг дизайнеруудын сул орон тоонд ихэвчлэн / ашиглан бичдэг.

Үзэл баримтлал нь өөр боловч ижил төстэй байдал нь хэрэглэгчийн тав тухыг хангахад чиглэгддэг.

Хэрэглэх талбарууд

Дээр дурдсанчлан UI болон UX гэсэн нэр томъёо нь зөвхөн мэдээллийн технологийн салбарт хамаарахгүй. Үнэн хэрэгтээ тэд анхны бүтээгдэхүүн бүтээгдсэн даруйд гарч ирсэн. Энэ бол маш удаан хугацааны өмнөх явдал юм. Жишээлбэл, UX дизайны анхны нээлтүүдийн нэг гэж үзэж болно дугуй.

Сүүлийн үед гарч ирж буй нэр томьёо, үсэг бичгийн ижил төстэй байдал, хэрэглэх хүрээ нь ихэвчлэн төөрөгдүүлдэг. Блогынхоо нэг хэсэг болгон хөгжүүлэлттэй холбоотой сэдвүүдэд илүү анхаарал хандуулах болно вэб интерфэйс ба арилжааны дизайн.

UX/UI дизайны асуудлыг ойлгохын тулд сурах бичиг юм уу хэд хэдэн өгүүллийг нэг удаа уншиж, үндсийг нь ойлгож, хэд хэдэн төсөл хэрэгжүүлэх нь хангалтгүй юм. Вэб дизайны салбар бараг өдөр бүр өөрчлөгдөж, хөгжиж байгаа тул шаардлага, юу вэ өчигдөр"трэнд байсан" Өнөөдөр"comme il faut байхаа больсон.

Таны дизайн зөв эсэхийг яаж мэдэх вэ

Хэрэв бид зарах даалгаврын талаар ярьж байгаа бол UX дизайны "зөв" эсэхийг шалгана. A/B тест эсвэл фокус бүлгүүд. Энэ нь интерфэйс нь хэрэглэгчдэд хэр ойлгомжтой, тохиромжтой болохыг харах боломжийг танд олгоно. Жишээлбэл, фокус бүлгийн бүх гишүүдэд вэбсайтаас тодорхой хэсгийг олох эсвэл бүртгүүлэх даалгавар өгдөг. Тэд үүнийг хэр хурдан зохицуулж байгаа нь UX дизайны чанарын талаар маш их зүйлийг хэлдэг.

Энэ тохиолдолд UI дизайны үзэл баримтлал нь илүү субъектив шинж чанартай байдаг, учир нь энэ нь ихэвчлэн хэрэглэгчийн хүсэл эрмэлзэл, амтаас хамаардаг. Бас нэгэнд сайхан санагдсан зүйл нөгөөгийнх нь нүдийг шархлуулдаг. Гэсэн хэдий ч дижитал бүтээгдэхүүний загвар зохион бүтээгч хүн бүр дагаж мөрдөх ёстой ерөнхий зөвлөмжүүд (блокуудыг тодорхой байрлуулах, текстийг дэвсгэртэй нь харьцуулах, товших боломжтой элементүүдийг тодруулах эсвэл тодруулах гэх мэт) байдаг.

Сэтгэгдэл дээр бичээрэйБи үүнийг илчилж чадсан уу, үгүй ​​бол үүн дээр юу нэмж оруулах ёстой вэ гэдгийг доор харуулав.