Мазмун
Эмгек жолумду баштаганда веб-дизайнер элем. Мен төрт жыл веб-дизайнда иштедим, чакан бизнес сайттардан баштап, акыры чоң кардарларга өтүп кеттим. Мени графикалык дизайн эмес, чоң бренддердин аттары үчүн иштебегенин билдим. Мени веб-баракчанын визуалдык жасалгалоосуна караганда, баракчалоо схемалары, адамдардын формалар менен болгон мамилеси жана кабыл алынган аткаруу сыяктуу нерселер кызыктырды.
Илимий-фантастикалык кинолорду көргөндө, интерфейстерди карайт элем. Мен видео оюндарды ойногондо, менюлардын кандайча жайгаштырылганын байкайм. Эгер ушул сапаттардын бири сизге тааныш болсо, анда сиз UI дизайнери болушуңуз мүмкүн.
Агенттик жумушумдан чыгып, өзүмдүн жеке компаниямды ачтым. Менин LinkedIn баракчамда, мен жаңы мансаптык максатымды кыскача баяндоого аракет кылдым: мыкты программалык камсыздоону жасоо. Менин фрилансер болуп баштаганыма төрт жыл болду, менин сапарым токтой элек. Ушул күндөрү мен кичинекей UI дизайн компаниясын башкарууга жардам берем Mono. Жакында биз төртүнчү команданын мүчөсүн тосуп алдык.
Бул макалада мен UI дизайнери болуу кандай экендигин, анын ичинде жумуш так эмнени талап кылаарын, мыкты окуу булактарын кайдан табууну жана өз колуңуз менен кантип мыкты иштей тургандыгыңызды сүрөттөп бергим келет.
UI дизайнери эмне кылат?
Колдонуучунун интерфейс дизайнеринин ишин төрт категорияга бөлсө болот деп ойлойм. Сиз кардар менен баарлашасыз, изилдөө жүргүзөсүз, прототип түзөсүз жана иштеп чыгуучулар менен байланышасыз. Келгиле, ушул фазалардын ар бирин кеңири карап чыгалы.
Кардар менен байланышуу
Кардарлардын баарлашуусу кардардын көйгөйүн түшүнүү менен байланыштуу. Максаты - кардарыңыздын бизнеси менен тыгыз байланышта болуу, демек, долбоордун башталышы адатта көп сүйлөшүүнү түзөт. Жаңы иштеп баштаганда кардарыңыздын домени жөнүндө көп нерсени билбегениңиз дурус - мүмкүн болгон дизайндык чечимдерди элестетип жатып, алардын ишин жаңыча карап көрсөңүз болот.
Интерфейстин мыкты дизайнери болуу үчүн, акырында кардарыңыздын бизнеси менен кошо ойлоно билишиңиз керек. Мисалы, кардарыңыз авиацияда болушу мүмкүн. Алар үчүн иштөө, акыры, сизди ошол тармак жөнүндө жакшы билишет. Демек, бул жерде өзүңүздүн бактыңызга кеңеш, өзүңүз билип иштеген тармактарды тандап алыңыз, андыктан өзүңүз кызыктырбаган же кызыктырбаган нерсенин адиси болуп калбаңыз.
Долбоор учурунда байланыш токтобойт. Дизайнер катары сиз ар дайым өз ишиңизди сунуштап турасыз. Биздин компанияда биз алыскы командабыз, андыктан жеке жолугушууларыбыз көп болбойт. Анын ордуна, биз видео конференциялар аркылуу экранды бөлүшүүнү катуу колдонобуз. Skype жана Slack сыяктуу байланыш куралдары күн сайын колдонулат.
Синхрондуу жана асинхрондук байланыш ыкмаларын айкалыштыруу пайдалуу. Эгер сизге көп маалымат керек болсо, чалуу сонун, бирок сиз ошол эле учурда жанында болушуңуз керек. Биз Slackти "виртуалдык суу муздаткычыбыз" деп эсептейбиз жана татаал дизайн долбоорлорун башкаруу үчүн Basecamp колдонобуз. HTML жана CSS колдонуп прототиптерди иштеп чыгууда, GitHub Issues кодун түз талкуулоо үчүн колдонобуз.
Изилдөө
Кардарлар менен баарлашуу менен катар, сиз көп изилдөө жүргүзөсүз. Буга талаа изилдөөлөрү, кардар менен семинарлар, атаандаштыкты талдоо же стратегияны аныктоо кириши мүмкүн - негизинен, көйгөйдү түшүнүүгө жардам бере турган нерселердин бардыгы.
Изилдөө бул сиздин дизайн тандооңузга маалымат берет. Бул сиз бир жолу окуган макала, же Apple жаңы чыгарган жаңы нерсе. Эмне үчүн белгилүү бир дизайн тандоосун жасаганыңызды түшүндүрүүгө убакыт келгенде, сиздин изилдөөлөрүңүз сизди кубаттайт.
Изилдөө абдан кенен болушу мүмкүн. Изилдөө максатында жаңы шаймандарды сынап көрөм же анын колдонуучу интерфейсин изилдөө үчүн жаңы веб колдонмого катталам.
Дизайн жана прототип түзүү
Дизайнер болгондуктан, убактыңыздын көбүн дизайн жана прототиптөө иштерин жасоого жумшайсыз. UI дизайны долбоору эскиздерди тартуудан, деталдуу дизайнга, код жазууга чейин ар кандай жолдор менен алдыга жыла алат.
Сиз колдонгон ыкма көбүнчө долбоордун түрүнө жараша болот. Сиз эмне иштеп жатасыз? Бул вебсайтпы, же андан көрө аны тиркеме деп айтасызбы? Ал жергиликтүү технологияны колдонобу? Бул кайра иштеп чыгуубу же сиз нөлдөн баштап жатасызбы?
Биздин компанияда туруктуу процесс жок, бирок көпчүлүк долбоорлор бирдей тартипте жүрөт: алар эскиздерден жана симфреймдерден башталып, визуалдык жана өз ара аракеттенүү деталдарына өтүп, прототип менен аяктайт.
Дизайнерлер катары биз өзүбүздүн куралдарыбыз жөнүндө ойлонуп, көп убакытты өткөрөбүз. Керемет шаймандар маанилүү болсо дагы, эң башкысы эмес. Adobe Creative Suite жана Sketch сыяктуу колдонмолорду билгичтик менен колдоно алуу - сүрөт тартуу үчүн карандаш же щетканы колдонууга барабар. Сүрөттү дагы деле жасашыңыз керек.
Айткандай эле, шаймандарга ден-соолукка кызыгуу жакшы нерсе. Мага жемиштүү иштөөгө жардам бере турган жаңы шаймандарды сынап көргөндү жакшы көрөм. Менин сүйүктүү векторлорду түзөтүүчү курал - Illustrator, бирок визуалдык дизайн боюнча жумуштарымдын көпчүлүгү ушул күндөрү эскизде жасалып жатат. Команданын башка мүчөлөрү Affinity Designer сыяктуу жаңы шаймандарга өтүштү.
Куралдар - бул жеке тандоо. Биз оңой чогуу иштей алсак, ар ким өзүнүкүн тандап алат. Дизайндар жөнүндө кардарлар менен сүйлөшүүнү жөнөкөй кылуу үчүн, биз InVision менен прототиптерди жасайбыз. Прототипти өркүндөтүү үчүн HTML жана CSS колдонобуз. Сизге керектүү шайман аны менен жасоону каалаган жумуштан көз каранды.
Иштеп чыгуучунун байланышы
UI дизайнеринин ишинин унутулган бөлүгү - бул иштеп чыгуучунун коммуникациясы. Бул күндөрү сиз дизайныңызды devs компаниясына жөнөтүп, алар туура ишке ашат деп үмүттөнө албайсыз. Мыкты дизайнерлер кыйынчылык дизайнды түзүүдө эмес, аны жеткирүүдө билишет - алардын макулдугун бериши керек болгон кызыкдар тараптарга гана эмес, аны ишке ашырышы керек болгон иштеп чыгуучуларга дагы.
Дизайн менен байланышуу ар кандай формада болот: деталдуу техникалык шарттар, активдерди берүү, дизайнды чогуу карап чыгуу. Ар бир мисалда жеткирүүнүн мааниси, негизинен, долбоордун жергиликтүү же веб-тиркеме экендигинен көз каранды.
Салттуу ыкма - бул экрандын дизайнынын жанындагы активдерди жеткирүү. Дизайн жалпысынан кандай болоорун көрүү үчүн, экрандын дизайнын колдонсо болот, ал эми активдер PNG жана SVG сүрөтчөлөрүн колдонууга даяр, ошондуктан иштеп чыгуучулар графикалык редактор менен иштешпейт.
Биздин ишканада биз андан ашык жеткирүүнү жактайбыз. Дизайндарда ырааттуулукту сактоого жардам берүү үчүн компонент стилиндеги колдонмолорду колдонобуз. Веб-долбоор менен алектенип жаткан болсок, ишке ашырууга даярдалган HTML-жана CSSтин толук топтомдорун жеткиребиз. Программалык камсыздоону иштеп чыгуунун ар бир этабында дизайнердик көзгө ээ болуу менин максатыма дүйнөлүк деңгээлдеги программалык камсыздоону түзүүнүн бирден-бир жолу деп эсептейм.
Веб жана жергиликтүү колдонмолор
Платформа үчүн жергиликтүү колдонмону иштеп чыгууда (мисалы, iOS же Android), сиз белгилүү бир көрсөтмөлөрдү сактоого умтуласыз. Интернетте иштеп жатканда, анча көп көрсөтмөлөр жок. Адатта, эмне болот, бул сиздин кардарыңызда бренд үчүн графикалык көрсөтмөлөрдүн топтому бар, ал нерселер кандай болушун аныктайт.
Бирок, бул колдонмолор маркетингдик веб-сайттарга ылайыкташтырылган жана ал жакта колдонуучу интерфейсинин жакшы чечимдерин кабыл ала бербейт. Ариптер түшүнүктүү себептерден эмес, маркетингдик себептерден улам тандалат. Түстөр тайманбас жана таң калыштуу болушу мүмкүн, бул жарнама өнөктүгүндө иштейт, бирок сиз күнүмдүк колдонгон колдонмодо эмес. Бул колдонмолорду чечмелөө керек.
Интернетте колдонуучу интерфейсинин колдонмолору аз. Желе ар кандай стилдеги эриген идиш деп талашсаңыз болот. Эгер сиз веб-сайтка караганда колдонмого окшош бир нерсе жасап жатсаңыз, анда Bootstrap жана ZURB Foundation сыяктуу кеңири колдонулган алкактар жөнүндө билишиңиз керек. Рамка нерселер кандай болушу керектигин аныктай баштайт, анткени сиз дөңгөлөктү кайрадан ойлоп тапкыңыз келбейт. Жана бул, балким, жакшы нерсе.
Биздин компанияда, биз Bootstrap колдонууну жактырабыз. Бул кнопкалар, маалымат таблицалары жана модалдар сыяктуу жалпы интерфейс элементтери үчүн демейки өлчөмдөрдү камсыз кылат.
Веб-дизайнда сиз вебдин техникалык мүмкүнчүлүктөрү менен көбүрөөк чектелесиз. Мурун веб-сайттагы тегерек бурчтар сыяктуу жөнөкөй визуалдык гүлдөөнү ишке ашыруу кыйынга турчу. Бул күндөр артта калды - сиз эми колдонуучунун интерфейстерин көптөгөн көлөкөлөр, өткөөлдөр, анимациялар жана ал тургай 3D менен тарта аласыз.
Дизайнер болгондуктан, процессти жана браузердеги дизайнды көзөмөлгө алуу кыйла реалдуу. Мен көптөгөн колдонуучулар интерфейсинин интерфейсин программалоону жергиликтүү колдонмонун колуна алганын көрө элекмин, бирок веб-колдонмонун HTML жана CSS файлдарын жасап жаткан дизайнер - бул кадимки көрүнүш. Эгер сиз өзүңүздүн дизайныңызды коддой алсаңыз, анда сиз коддошпогон курбуларыңыздан артыкчылыкка ээ болосуз, ал эми мен үчүн бул вебдин иштешин чындап түшүнүүнүн бирден-бир жолу.
Веб чектөөлөр
Жакында сиз үйрөнө турган ар кандай трюктар ар бир браузерде колдоого алынбай тургандыгын жана бул вебди иштеп чыгуунун чындыгы экендигин байкайсыз. Прогрессивдүү өркүндөтүү сыяктуу белгилүү принциптерге кармануу жакшы, анда мүмкүн болушунча өркүндөтүлгөн контент жүктөлөт, бирок анын мазмуну кандайча начарлап кетери жөнүндө ойлонуштурулат.
Жакында, 'кычы кыюу' популярдуу болуп калды. Би-Би-Синин веб командасы тарабынан чемпиондукка алынган бул "жакшы" жана "жаман" браузерлерди айырмалоону жана "начар" браузерлерге чектелген тажрыйбаны камсыз кылууну камтыйт. Бирок, бул чындыгында гана мазмун сайттарга иштейт.
Колдонмо сыяктуу тажрыйбалар жөнүндө сөз болгондо, көптөгөн адамдар өнүгүүнү жеңилдетүү үчүн бир нече алдыңкы браузерлерге гана колдоо көрсөтүшөт. Тилекке каршы, бул бизди 1996-жылдагы кырдаалга алып келет, анда мазмунду көрүү үчүн белгилүү бир браузер керек.
Квалификацияны өркүндөтүү
Ошентип, ылдам өнүгүп жаткан веб-индустриядан канткенде кабардар болуп, жөндөмүңүздү өркүндөтөсүз? Келгиле, көндүмдөрдү өркүндөтүүнүн бир нече ар кандай ыкмаларын карап көрөлү ...
Платформа жөнүндө билим
Дизайнердин арсеналынын негизги бөлүгү платформаны билүү. Сиз ар кандай иштетүү тутумдары жана аны адамдар кандайча колдонуп жаткандыгы жөнүндө билишиңиз керек. Дизайнерлер катары биз Mac компьютерлерин колдонобуз, бирок кийин ал жактагы адамдардын көпчүлүгү өз ишин бүтүрүү үчүн Windows кутучаларын колдонуп жаткандыгын унутуу оңой.
Бир нерсени өзүңүз гана колдонсоңуз, аны чындап түшүнө аласыз деп ойлойм. Мен өзүмдүн Mac компьютеримди иштеп чыгуу үчүн колдонууну жактырам, бирок ар кандай башка платформалардын өнүгүшүн өздөштүрүүгө көп убакыт сарптайм. Менин виртуалдык машиналар катары Mac'ымда Windowsтун бир нече нускасы орнотулган. Интерфейстеги ар кандай өзгөрүүлөрдү текшерүү үчүн Microsoftтун Insider программасын колдонуп, Windows 10дун жаңы курамын сыноо менен алекмин.
Ошондой эле анын иштешин текшерүү үчүн жаңы жабдыктарды дайыма сатып алам. Мен платформаны сынап көрүү үчүн гана Apple Watch сатып алдым. Андан кийин саттым, анткени бул менин жашоомо анчалык деле көп нерсе кошпой жаткандыгын сездим.
Андан ары, веб өзүнүн иш тутуму катары каралышы мүмкүн. Ар бир браузер сатуучусуна жума сайын жаңы функциялар кошулуп, ал дайыма өнүгүп турат. Браузерлердин техникалык аспектилери, айрыкча CSS жана графикалык жөндөмдөр жөнүндө билүү абдан пайдалуу. Сиз SVG жана WebGL деген эмне экендигин жана Веб Анимация API'син кандайча колдоно турганыңызды билишиңиз керек.
Ар бир платформа убакыттын өтүшү менен өнүгүп, колдонуучу интерфейсинин дизайнери катары жаңыланып туруу сиздин милдетиңиз. Кантсе да, сиз ойлоп тапкан нерсе өзүнчө жашабайт, бирок чоңураак программалык экосистеманын бир бөлүгү.
Негиздерине кайтып барыңыз
Бүгүн биз менен күрөшүп жаткан нерсе, 20 жыл мурунку менен күрөшкөндөн айырмаланбайт. Китептерде бир топ жакшы кеңештер бар. Джейсон Фрид менен Мэттью Линдермандын Интернеттеги коргонуу дизайнын колдонуп көрүңүз жана Стив Кругдун мени баштоочулар үчүн ойлонбоңуз.
Эгерде сиз модалдуулук жана афкорддук сыяктуу түшүнүктөр жөнүндө билбесеңиз, анда окуп чыгышыңыз керек. Сиз Фиттстин мыйзамы эмне экендигин түшүндүрө алышыңыз керек. Жакындыктын гештальт мыйзамы? Бул UI дизайнындагы нан жана май.
Оюндардан жана тасмалардан шыктаныңыз
Интерфейстин дизайнери катары мен өз ишимди аткарууга башка илхам булактарына таянам. Мен оюндардан көп илхам таба алам. Айрым оюндар өтө татаал жана UI дизайнерлери интерфейс маселелерин бизнес долбоорлордо иштеген интерфейс дизайнериндей чечиши керек болчу.
Оюндар тренддерди да билдириши мүмкүн. Колин Макрей Раллинин менюсунан табылган минимализм iOS7нин багытын эске салат. Кандайдыр бир учурда, азыр модага айланган UI анимациясынын дизайны оюндарда бир нече жыл мурун пайда болгон. Скеоморфизмден жылаңач, функционалдык интерфейстерге жана "жалпак дизайнга" өтүү оюндарда да байкалган. 2006-жылдагы Oblivion менен 2011-жылдагы Skyrimди салыштырыңыз. Эки оюн бирдей сериядагы RPG оюндары, бирок айырмачылыктар көзгө урунат.
Marvel тасмаларындагы футуристтик интерфейстер Темир Адам сыяктуу эле, мен үчүн илхам болду. Алар так колдонууга боло турган мисалдар эмес, бирок алар мени жалпы эсептөө жөнүндө көбүрөөк ойлонууга түртөт. Биз экрандардын келечегин каалайбызбы же экрандардын жок болуп кетишин каалайбызбы? Бул, балким, дизайнерлерге толгон пабда пайда болгон жакшы суроо.
Сиз дизайнер катары талыкпас эмгек, өжөрлүк, теңтуштарыңыз менен баарлашуу жана укмуштуудай көп окуу аркылуу өсөсүз. Мындан бир жыл мурун мен Нью-Йорк Таймста 80 жаштан ашкан адамдар жөнүндө, алардын кол өнөрчүлүгүн өркүндөтө берген адамдар жөнүндө бир материал окудум. Мен эми гана баштагандай сезилип жатам. Сенчи?
