Хайку хэл дээрх UI/UX хөдөлгөөнт дүрс: Зак Браунтай хийсэн яриа

Бид Haiku Animator-ын арын алсын хараатай, гүйцэтгэх захирал Зак Браунтай ярилцахаар суулаа.

Бид энэ нийтлэлийг шүлгээр эхлүүлмээр байна:

UX болон UINot So Fun to AnimateBut, Now There's Haiku- School of Motion

Эдгээр 3-р ангийн англи хэлний хошигнол танд ямар нэг зүйл хийж байна уу?

Хөдөлгөөний дизайн болон энэ нь UI ертөнцөд хэрхэн нийцэж байгаа талаар маш их шуугиан дэгдээж байна/ UX дизайн. UI/UX судалгааны тэргүүн эгнээнд Haiku компанийн гүйцэтгэх захирал, Haiku Animator-ийн ард байгаа алсын хараатай Зак Браун байна.

Дэлхий нийтээрээ хэрэглэгчдийнхээ туршлагыг илэрхийлсэн хөдөлгөөнт дүрсийг нэмэхээр цангаж байгаа ч UI болон анимацийн одоогийн ажлын урсгал. UX нь хүсэх зүйл ихтэй. Одоо Haiku Animator-ийн тусламжтайгаар та нэг сайн тохируулсан программ зохиож, хөдөлгөөн хийж, нийтэлж, оруулах боломжтой.

Энэ бол зүгээр нэг санамсаргүй стартап биш, Хайку домогт Y Combinator программыг туулсан. . Y Combinator нь Dropbox, Airbnb зэрэг бидний мэдэх хамгийн шинэлэг брэндүүдийг эхлүүлэхэд тусалдаг гэдгээрээ алдартай. Тиймээс, Хайку ямар нэгэн зүйл хийх гэж байгаа бололтой.

Подкаст дээр бид Зактай UI/UX Animation ертөнцийн талаар ярилцахаар суулаа. Замдаа та Закийн зар сурталчилгааны ертөнцөд хэрхэн ажиллаж байсан, Хайкуг хэрхэн эхлүүлсэн, хурдацтай хөгжиж буй гарааны бизнес эрхлэх нь ямар байдгийг сонсох болно.

Хайку мөн манай подкаст сонсогчдод Animator дээр хөнгөлөлт үзүүлж байна. Эдгээр хөнгөлөлтүүд хүртэл үргэлжлэх болноБраун:

Мөн вэб дээрх үнэгүй тоглоомууд нь програмын дэлгүүр болон түүний хаалгачаар дамжуулан төлбөртэй тоглоомуудтай зөрчилддөг. Мөн техникийн олон шалтгаан бий. Энэ үеийн кодын суурь нь 15 жилийн настай байсан бөгөөд энэ нь янз бүрийн удирдагчдыг туулж, худалдан авалтын явцад зарим хүмүүс тэнд үлдэхгүй байв. Кодын үндсийг үнэхээр хэн ч мэдэхгүй.

Зак Браун:

Энэ нь Adobe-ийн ДНХ болон миний Flash-ийн үр дүнтэй зохисгүй үйлдэлтэй нийлээд яг л энэхүү төгс шуурга түүнийг үхэлд хүргэсэн.

Жой Коренман:

Хөөх.

Зак Браун:

Тиймээ.

Жой Коренман:

Энэ үнэхээр гунигтай, мэдэхгүй байна. Энэ түүхээс болон бусад ижил төстэй зүйлүүдээс олж авч болох хачирхалтай ижил төстэй зүйлүүд байдаг, компаниудыг худалдаж аваад дараа нь аажмаар, аажмаар хахаж үхдэг. Өмнө нь Shake хэмээх үнэхээр хүчирхэг, гайхалтай зохиох програм байсан бөгөөд энэ нь одоо стандарт визуал эффектийн хэрэгсэл болсон Nuke-ийн урьдал байсан юм.

Жой Коренман:

Бас Apple Shake-г худалдаж авсан бөгөөд дараа нь усан үзмийн мод дээр үхсэн бөгөөд үүний эргэн тойронд маш их уур уцаартай байсан тул энэ нь ердийн зүйл биш юм. За, миний дараагийн асуулт бол таны Хайку компани Animator хэмээх багажийг бүтээж байгаа бөгөөд бид бүгдэд тоймтой мэдээлэл өгөхийн тулд үүнийг хийх болно. , Animator гэж юу вэ? ТэгээдТэр ямар асуудал шийдэх гээд байна вэ?

Зак Браун:

Мэдээж. Тиймээс After Effects бол сайн лавлах цэг гэж би бодож байна. After Effects нь 26 жилийн өмнө 1993 онд анх худалдаанд гарсан тул энэ нь хуучин сургууль бөгөөд кино, ТВ-д тусгайлан зориулсан хөдөлгөөнт график хэрэгсэл бөгөөд үргэлж байсаар ирсэн. After Effects нь анхнаасаа бүтээгдсэн ч кино бүтээхийн оронд программ хангамж, хэрэглэгчийн интерфэйсийн хөдөлгөөнт дизайн хийх зорилготой байсан гэж төсөөлөөд үз дээ.

Зак Браун:

Тэдгээр хэвлэл мэдээллийн хэрэгслүүдийн хооронд интерактив байдал, кодын суурьтай нэгтгэх, хувилбарын хяналт гэх мэт үндсэн ялгаанууд бий. Эдгээр санаа зоволт кино, телевизийн ертөнцөд бараг байдаггүй.

Жой Коренман:

Зөв.

Зак Браун:

Тиймээс бид маш олон хэрэглэгчид биднийг Sketch-ийн аналогитай харьцуулсан байдаг. Haiku Animator-ийн хувьд Photo Shop нь After Effects юм. Тодруулбал, энэ нь илүү шинэ, UI хөдөлгөөнт дүрслэлд зориулагдсан, илүү цэвэрхэн бөгөөд илүү ойр, ялангуяа хөдөлгөөнт дизайнд анх удаа орж буй хүмүүст зориулагдсан юм.

Жой Коренман:

Төгс. Тийм ээ, би үүнийг төгс дүрслэл гэж бодож байна, би үүнтэй хамт тоглож үзсэн бөгөөд үүнийг ашиглахад маш хөгжилтэй бөгөөд After Effects ашигладаг хэн бүхэн энэ хэрхэн ажилладагийг шууд ойлгох болно. Animator-д After Effects-д огт байдаггүй өөр тал бий, би энэ талаар ярихыг хүсч байна, гэхдээ би таны энэ програмыг хэрхэн бүтээсэн талаар сонсохыг хүсч байна.Миний бодлоор та бид хоёр жилийн өмнө уулзаж байсан бөгөөд тэр үед програм нь бета хувилбарт байсан бөгөөд та түүнд маш олон боломжуудыг нэмж, хөгжүүлсэн байна.

Жой Коренман:

Таныг ийм нарийн төвөгтэй программ хангамжийг хэрхэн яаж ийм зүйл хийж байгааг би үргэлж сонирхдог. Тиймээс, магадгүй та програмын анхны хувилбарыг хэрхэн яаж хөгжүүлсэн тухайгаа ярьж болно. Та үүнийг кодлосон уу? Та багтай байсан уу, яаж ажилласан бэ?

Зак Браун:

Дахин хэлэхэд бүх түүх тухайн агентлаг руу буцаж, дизайн, код хоёрын хоорондын зайг нөхөж, энэ асуудлыг ойлгох болно. Чухамдаа энэ бол Хайкугийн түүхийн эхлэл юм. Миний хувийн карьер энэ асуудлыг хэд хэдэн өөр газар, өөр өөр ажилд тойрон эргэлдэж байсан гэж би бодож байна. Тэгээд замдаа үүсгэн байгуулагчтайгаа уулзсан. Бид өнгөрсөн нэгэн компанид хамтран ажиллаж байсан бөгөөд тэр ч мөн адил асуудлыг олж харсан тул бид 2016 оны 6-р сард байгуулагдсан.

Зак Браун:

Эхний зургаан сар туршилтын шинж чанартай байсан. зүгээр л тэр Филадельфид байсан, би SF-д байсан, тиймээс үнэхээр зүгээр л видео дуудлага, дуут чат, Slack, хувилбарын удирдлага, нааш цааш, ямар нэг зүйлийг олж мэдэв. Тэгээд хэнд ч хэрэгтэй зүйлтэй болтол жил гаруй хугацаа өнгөрчээ. Учир нь энэ нь шинжлэх ухааны лабораторийн орчинд эхэлсэн юм. Өө, ингэвэл яанаа, ингэвэл яана гэж? Энэ бол эхлэл, маш их туршилт, харгис хүч,хайгуул хийж, дараа нь бид 2016 оны эцэс гэхэд анхны хөрөнгө оруулалтаа хийсэн.

Зак Браун:

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

Жой Коренман:

Гайхалтай бөгөөд миний хамгийн их сонирхож байгаа зүйл бол таныг Y Combinator хөтөлбөрт элсүүлсэн явдал юм. Энэ нь юу болохыг сонсож байгаа хүн бүр мэдэх эсэхийг би мэдэхгүй. Технологийн ертөнцөд хүн бүр Y Combinator-ийн талаар мэддэг ч хөдөлгөөнт дизайны ертөнцөд мэдэхгүй хүмүүс байдаг гэдэгт би итгэлтэй байна.

Жоэй Коренман:

Тэгэхээр та юу болохыг тайлбарлаж өгнө үү. Y Combinator бол яагаад энэ хөтөлбөрт хамрагдахаар сонгосон бэ?

Зак Браун:

Тэгэхээр YC, Y Combinator, YC бол эхлүүлэх хурдасгуур юм. Тэдний хийдэг зүйл бол ирээдүйтэй гэж үзсэн гарааны бизнес эрхлэгчид болон үүсгэн байгуулагчидтай ярилцлага хийж, дараа нь хүлээн зөвшөөрсөн хүмүүс нь венчур хөрөнгө босгох, гарааны тоглоом тоглохын тулд нөөц бололцоо, үс засалттай холбогддог. Тэд өөрсдөө бага зэрэг мөнгө хөрөнгө оруулалт хийдэг, гэхдээ та YC-ийг бэлэн мөнгөөр ​​авахгүй, учир нь тэд маш үнэтэй байдаг. Тэд өөрийн хөрөнгийн томоохон хэсгийг авдаг.

Зак Браун:

Өнөө үед маш олон төрлийн гарааны хурдасгуурууд байгаа ч YC бол анхны хувилбаруудын нэг, хэрэв хүсвэл OG-ийнх.

Жой.Коренман:

Зөв.

Зак Браун:

Надад жагсаалт байгаа, бусад багцын компаниудын дунд Air Bnb, Stripe, Cruise, Dropbox, Coin Base, Instacart багтдаг. , Reddit, Twitch TV болон жагсаалт үргэлжлэх болно. Энэ бүх IPO яг одоо болж байгаа юм шиг байна. YC огт гомдоллоогүй.

Жой Коренман:

Тэд авъяас чадварыг сайн хардаг.

Зак Браун:

Тэд тэгдэг. Тэд бас брэндтэй тул маш олон хүн өргөдөл гаргадаг бөгөөд тэдний хүлээн авах хувь нь Харвардынхаас дөрөв дахин бага байдаг. Тиймээс YC-ээр дамжих нь танд ижил төстэй итгэмжлэлийн тамга өгөх болно, өө YC зүгээр гэж хэлсэн, тиймээс тэд зүгээр байх нь ойлгомжтой.

Зак Браун:

Энэ нь итгэмжлэл шиг үнэ цэнэтэй юм. Наад зах нь Цахиурын хөндийд ийм л байдаг гэж би бодож байна.

Жой Коренман:

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

Жой Коренман:

Би хөрөнгө оруулагчидтай ярилцсан, та үүний сайн болон сул талуудыг тунгаан бодож үзсэн тул би Хөрөнгө босгохын оронд хөрөнгө босгохын тулд өөрийн хөрөнгөө өгөхөд юу нөлөөлсөн нь сонин байна.

Зак Браун:

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

Жой Коренман:

Зөв.

Зак Браун:

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

Зак Браун:

Тийм ээ, биднийг YC-д элсэх үед бид таван сар орчим хөөрөх зурвастай байсан бөгөөд энэ нь хөндийд үрийн тойрог хийхэд хангалттай байж болох ч энэ нь Шинжлэх ухааны үзэсгэлэнгийн технологитой, хараахан хөрөнгөгүй үед хатуу зарах. Тиймээс бид YC-г өөр олон шалтгааны дунд сонгосон бөгөөд би хувьдаа туршлагадаа маш их баяртай байсан.

Жой Коренман:

Тийм ээ, би энэ туршлагын талаар сонсох дуртай, учир нь энэ бол домог шиг зүйл юм. YC бол дэлхийн хамгийн алдартай гарааны хурдасгуур бөгөөд Пол Грэхэм бол суут ухаантан мөн Пол Грахам бол энэ нэрийг мэдэхгүй хэн бүхэнд зориулж, үүсгэн байгуулагчдын нэг юм.YC бусад зүйлсээс гадна маш их мэргэн ухааныг агуулсан гайхалтай блогтой.

Жоэй Коренман:

Гэхдээ тиймээ, энэ програм нь танайх шиг компанид юу хийдэг вэ?

Зак Браун:

Юуны өмнө би хэлэх ёстой, YC, бид 2017 оны сүүлээр орж, 2018 оны эхээр орж ирсэн, эргэн ирснээс тэс өөр байсан. Тэднийг эхэлсэн 2005 он. Тэднийг эхлэх үед Twitch TV, Reddits, Air Bnb зэрэг домогт бүлэглэлүүд ажиллаж эхэлсэнтэй адил байсан бол өнөө үед энэ нь тийм ч том болсон.

Зак Браун:

YC өөрсдийгөө стартап гэж үздэг тул тэдний зорилго бол цар хүрээг нэмэгдүүлэх явдал юм. Биднийг дамжин өнгөрөхөд багцад 100-200 компани байсан бол эхний багцад 10 орчим компани байсан. Маш өөр, тэс өөр туршлага. Энэ нь би том их сургуульд сурсан бөгөөд их сургуульд сурсан нэг зүйл бол эхэндээ маш их нөөц бололцоо байдаг, гэхдээ хэрэв та тэдгээрт биш харин түшиглэвэл, хэрэв та найдах юм бол буцаж, та эдгээр нөөцийг олж авахгүй.

Зак Браун:

Тэгээд өөр хэн нэгэн тэднийг олж авбал чи зүгээр л нэг эрэг дээр гарах болно. Гэсэн хэдий ч, хэрэв та гараа сунгаж, нөөцийг нь булааж авбал ...

Зак Браун:

Гэсэн хэдий ч, хэрэв та том их сургууль болон өөрийн том Y Combinator-д идэвхтэй хандаж, нөөцийг нь хурааж авбал , тэгвэл та үүнээс ихийг авна.Тэгээд би одоо 30 настай гэж бодож байна. Би амьдралдаа ямар нэгэн зүйл хийхийг хүсч байгаа бөгөөд ийм мэдлэгтэй байсан нь надад аз тохиосон бөгөөд энэ нөөцийг ашиглах нь дээр гэж бодож байна. Үүний үр дүнд бид сүлжээ, зөвлөгч, зөвлөгөө гэх мэт олон зүйлийг олж авсан юм шиг санагдаж байна. Би сүлжээний талаар ярьлаа, гэхдээ энэ бол үнэхээр том хэсэг юм. Эдгээр 200 гаруй компаниудын дунд бид маш олон харилцаа холбоо, хүмүүсийг бий болгож чадсан. YC сүлжээ нь мөн энэ дотоод нийгэмлэгийг ажиллуулдаг бөгөөд та YC-ийн бусад үүсгэн байгуулагчтай холбоо барьж болно. Энэ нь имэйл хаяг, утасны дугаарыг жагсаасан болно. Тиймээс, хэрэв би хүсвэл Airbnb-ийн үүсгэн байгуулагч Dropbox-той холбоо барьж магадгүй юм. Гэхдээ тэр сүлжээ бол YC-ийн том хэсэг.

Жой Коренман:

Өө, энэ үнэхээр сонирхолтой юм. Мөн зарим ижил төстэй зүйл бий. Би Motion сургуулийг YC-тэй харьцуулахыг хүсэхгүй байна, гэхдээ бид төгсөгчдийн сүлжээтэй бөгөөд энэ нь бидний аль нэг ангид суралцах туршлагын хамгийн үнэ цэнэтэй хэсэг болсон байж магадгүй юм. Энэ нь эхэндээ гэнэтийн зүйл байсан бөгөөд энэ нь үнэхээр үнэ цэнэтэй зүйл болсон юм. Тиймээс энэ нь надад маш их утга учиртай юм. Ингээд бодит хэрэглүүр болох Animator руу орцгооё. Сонсож буй хүн бүр бид Хайкугийн вэб сайт руу линк оруулах бөгөөд та татаж авах боломжтой. Миний бодлоор одоогоор Animator-ийн 14 хоногийн үнэгүй туршилтын хувилбар байгаа бөгөөд хичээлүүд бэлэн байгаасайт дээр. Маш их сайн мэдээлэл байна.

Жой Коренман:

Тиймээс бусад хөдөлгөөнт дүрсний аппликейшнүүдийг хөгжүүлж байгаа бөгөөд ерөнхийдөө маш олон программууд, вэб программууд болон хөгжүүлэгдэж байгаа бололтой. вэб дизайн болон програмын дизайныг илүү хялбар болгоход туслахын тулд уугуул програмууд. Тэгэхээр Animator-ийн өвөрмөц зүйл юу вэ?

Зак Браун:

Аниматорын өвөрмөц зүйл нь кодын суурьт зориулагдсан байдаг. Энэ нь үйлдвэрлэлд хүргэдэг хөдөлгөөнт загвар юм. Хэрэв та Photoshop-д зориулсан .PSD, ийм төрлийн эх файл шиг бодож байгаа бол код нь таны эх файл шиг програм доторх нэгдүгээр зэрэглэлийн иргэн юм. Animator-ийн эх файл нь шууд код, гараар засварлах код юм. Тиймээс та тайзан дээр ямар нэг зүйлийг хөдөлгөх эсвэл Tween-г тохируулах болгонд энэ нь яг үнэндээ код уншиж, бичиж байна. Энэ нь маш зориудаар хийгдсэн учраас кодын суурьтай нэгтгэхэд маш хялбар болно.

Жой Коренман:

Тиймээс би танаас үүнийг асууя. Учир нь би энэ тал дээр тийм ч боловсронгуй биш тул үүнийг нядлах юм бол уучлаарай, гэхдээ After Effects-д бид Bodymovin-тэй бөгөөд таны After Effects-ийн компактыг авдаг бөгөөд үүнийг ашиглах үед маш олон анхааруулга байдаг, гэхдээ ерөнхийдөө Хэрэв та хэлбэрийн давхаргууд болон үүнтэй төстэй зүйлсийг ашиглаж байгаа бол энэ нь JSON файлыг гадагшлуулна. Тиймээс энэ нь кодыг гадагшлуулдаг. Тэгэхээр энэ Бодимовины хийж байгаа зүйлээс юугаараа ялгаатай вэ?

Зак Браун:

Тийм ээ. Тиймээс би Лотти 2017 онд буцаж ирснийг санаж байна. ЭнэБид аль хэдийн Хайкугийн хөдөлгөөний дизайны траекторийг түгжиж, ачаалж байсан үе байсан, тэр үед Mac-д зориулсан Хайку, одоо Haiku Animator. Би үүнийг үргэлж гайхалтай урам зоригтой гэж боддог. Таны төсөөлж байгаачлан After Effects-ийн талаар, ялангуяа UI-д зориулсан хэрэгсэл, програм хангамжийн талаар зарим нэг хувийн эргэлзээ төрж байна. Bodymovin болон Lottie нь After Effects эх файлыг урвуу инженерчлэлийн дагуу бүтээсэн. Тэгэхээр таны Bodymovin-ээс гаргаж авсан JSON blob нь After Effects файлын форматын хэлбэр юм.

Зак Браун:

Би хувьдаа программ хангамжийн хөдөлгөөнт дизайныг төсөөлж байхдаа та дээр дурдсанчлан, Жоей, интерактив байдал нь өнгө өөрчлөх, товшиход хариу үйлдэл үзүүлэх, эсвэл энэ төлөвөөс дараагийн төлөв рүү шилжихээс өөр замаар шилжих чадвар зэрэг чухал ач холбогдолтой юм. Хэдийгээр энэ нь логик шаарддаг. Компьютерийн шинжлэх ухааны хувьд энэ нь бүрэн бүтэн байдлыг шаарддаг. Та үүнийг After Effects-ээс авах боломжгүй.

Жой Коренман:

Зөв.

Зак Браун:

Зөв. Энэ бол хамгийн том ялгаа нь, хэрэв хүсвэл After Effects-ийг орлуулах зохиогчийн хэрэглүүрийг эхнээс нь бүтээх давуу болон гайхалтай ачааг хоёуланг нь олж авах явдал юм. Энэ нь бидэнд кодыг шинэчлэхийн оронд кодонд зориулагдсан кодын форматыг зохион бүтээх боломжийг олгосон.

Жой Коренман:

Энэ бол үнэхээр сайн тайлбар юм. Мөн Animator-ийг ашигласнаар a2019 оны наймдугаар сарын 1 ! Доорх холбоос дээр дарж хөнгөлөлт эдлээрэй. Энд хоёр өөр сонголт байна:

  • Сарын гурван сарын төлөвлөгөөнд 50% хямдрал (27$ хэмнэнэ)
  • Жилийн төлөвлөгөөний эхний жилээс 25% хямдрал  (45$ хэмнэнэ)

Одоо таны сониуч зан дээд цэгтээ хүрсэн тул Зактай мэндэлцгээе...


ЗАК БРАУН ШОУ-ын ЖИЧ

Бид Манай подкастаас лавлагаа авч, энд холбоос нэмснээр подкастын туршлагад анхаарлаа төвлөрүүлэхэд тусална.

  • Зак Браун
  • Хайку аниматор

PEOPLE/STUDIOS

  • Томас гудамж
  • Пол Грахам

НӨӨЦИЙН

  • Sketch
  • Y Combinator
  • Inspector Spacetime
  • Lottie Podcast Episode
  • Unity
  • Issara Willenskomer Podcast Episode
  • Lottie

ӨӨРӨӨ

  • Dreamweaver
  • салют
  • Сэгсрэх

ЗАК BROWN TRANSCRIPT

Жой Коренман:

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

Жой Коренман:

Манай өнөөдрийн зочин үүнийг өөрчлөхийг зорьж байна. Зак Браун, тийм ээЭнэ нь надад Flash хэрхэн ажилладаг талаар маш их сануулж байна. Мөн энэ нь үнэхээр сонирхолтой юм. Чамайг Flash-ийн ашигладаг Tween, stage гэх мэт нэр томъёог ашиглаж байгааг би анзаарч байна. After Effects-д бидний хэрэглэдэг янз бүрийн үгс байдаг. Гэхдээ та үндсэндээ компакттай, давхаргуудтай бөгөөд тэдгээр давхаргууд дээр тодорхой зүйлд хариу үйлдэл үзүүлэх, зохион байгуулалтад хариу үйлдэл үзүүлэхэд хүргэдэг кодын битүүдийг байрлуулж, хариу үйлдэл үзүүлэх зүйлсийг тохируулах боломжтой. Мөн энэ нь үнэхээр, үнэхээр гайхалтай юм. Тэгвэл эдгээрийн зарим нь юу вэ ... магадгүй та Animator гэх мэт хэрэглүүрийг өөр аргаар хийхэд хэцүү зүйлсийг хэрхэн ашиглаж болох талаар зарим жишээг өгч болно.

Зак Браун:

Дахин хэлэхэд, Animator-ийн зорилго нь хөдөлгөөний дизайн болон код хоёрын хоорондох ялгааг арилгах явдал юм гэсэн үндэслэл дээр үндэслэн таны хурууны үзүүрт байгаа жинхэнэ хүч бол кодын ид шид шиг код юм. Тиймээс Animator нь програм дотор кодлох хэд хэдэн аргатай. Энэ нь After Effects-ийн үндсэн ялгаа юм. Мөн кодлох гурван арга бий. Бидэнд илэрхийлэл гэж нэрлэгддэг эдгээр бүтээцүүд байдаг бөгөөд тэдгээр нь After Effects-ийн мушгиатай илэрхийллүүдтэй маш төстэй юм. Эдгээр нь үндсэндээ Excel хүснэгтийн функцууд юм. Ийм байдлаар та Excel-ийн A3-аас A14 хүртэлх нүднүүдийн нийлбэрийг нийлбэртэй тэнцэх [сонсохгүй 00:27:15] гэж бичээд авах боломжтой, тэр сайхан бяцхан илэрхийлэл, та Animator дээр ижил зүйлийг хийж болох боловч, жишээ нь хулганы байрлалэсвэл хүрэх, товших. Энэ нь утга учиртай юу?

Жой Коренман:

Тийм ээ, энэ нь маш их утга учиртай байна.

Зак Браун:

За. Дараа нь нөгөө арга нь энгийн, гэхдээ бас маш хүчтэй байх зорилготой юм. Энэ нь функциональ, реактив програмчлалыг дамжуулдаг. Мөн та эдгээр илэрхийллийг ямар ч өмчид хэрэглэж болно. Тиймээс би өөрийн нэг элементийн X байрлалыг хэрэглэгчийн Х хулгана, Y байрлалын зургийг хэрэглэгчийн Y хулгана болгож, масштабыг өөрийн цагийн шугамын байрлал, хэрэглэгчийн Y хулгана гэсэн синус функц шиг болгож чадна. Хэрэв энэ нь утга учиртай бол. Тиймээс та бичихэд хялбар, гэхдээ үнэхээр хүчирхэг харилцан үйлчлэлийн төрлүүдийг үүсгэж эхлэх боломжтой. Мэдээжийн хэрэг, ийм бүтээлч чадвар бол Flash-ийн хувьд үнэхээр гайхалтай бөгөөд дэлхийд юу дутагдаж байна вэ?

Жой Коренман:

Тийм ээ. Та Animator дотор код бичихдээ ямар хэл ашиглаж байна вэ?

Зак Браун:

JavaScript.

Жой Коренман:

Өө, төгс. За, хэрэв та After Effects-ийн илэрхийлэлд дассан бол зарим хэсэг нь адилхан байгаа гэдэгт итгэлтэй байна. Аниматорын онцлог шинж чанаруудыг нэмэхийн тулд та JavaScript-д өргөтгөсөн зарим захиалгат зүйл байгаа гэж би бодож байна уу?

Зак Браун:

Яг тийм, тийм ээ.

Жой. Коренман:

Би үүнийг ашиглах нийтлэг жишээг бодохыг хичээж байна. Жишээлбэл, хэрэв та өөрийн вэбсайт дээр ямар нэгэн зан авир гаргахыг хүсч байгаа бол нүдэн дээрх хүүхэн хараа таныг дагаж байгаа бол,хулганыг дагах шиг. Та After Effects дээр үүнийг шоолж болно, тэгээд инженер үүнийг яаж хийхээ олох хэрэгтэй болно. Гэхдээ Animator-д та яг ийм зан төлөвийг бий болгоод дараа нь үүнийг орхиж чадах уу?

Зак Браун:

Тийм ээ. Animator-д хэрэглэгдэж буй рэндэрлэх хөдөлгүүр нь нэгдүгээрт, нээлттэй эх сурвалжтай, хоёрдугаарт, энэ нь вэб дээр ажиллуулахад ашигладаг рэндэрлэх хөдөлгүүртэй яг ижил зүйл юм. Тэгэхээр урьдчилан харах горим нь шууд утгаараа урьдчилан харах горим юм. Энэ нь ижил зүйл юм. Энэ нь код болох эх файлтай холбоотой юм. Таныг илэрхийлэл бичих үед таны бичсэн бүх зүйл Haiku Animator дотор вэб сайт дээр байгаатай яг адилхан үнэлэгдэх болно.

Жоэй Коренман:

Тиймээс энэ нь нэг юм. Animator болон үүнтэй төстэй бусад програмууд болон After Effects-ийн хамгийн том ялгаа нь After Effects-д та тансаг хэрэглээтэй, хүссэн зүйлээ анимаци хийх боломжтой бөгөөд үүнийг үзүүлэх шаардлагатай болно, гэхдээ үүнийг үзэх хүн үүнийг хийхгүй байх явдал юм. үзүүлэхийг нь үзэх хэрэгтэй. Та үүнийг вэб эсвэл апп дээр байгаа байдлаар шууд хийж байгаа бол шууд байна. Тиймээс би сонирхож байна, та үүнийг хэрхэн шийдвэрлэх вэ, ерөнхийдөө програм хөгжүүлэгчийн хувьд ч гэсэн хэрэглэгчид тань бодит цаг хугацаанд тохиолдох боломжгүй зүйлсийг анимейшн хийхийг хүсч байгаатай хэрхэн харьцах вэ? Энэ асуудал мөн үү?

Зак Браун:

Тийм ээ. Энэ нь гарцаагүй. Таны бүтээж буй зүйлХэрэв та Haiku Animator дээр ямар нэгэн зүйл үүсгэх үед програм хангамж юм. Бүтэн цэг, таны үүсгэж байгаа зүйл бол програм хангамж юм. Мөн та үүнийг харааны хэрэгсэл, хэрэв хүсвэл кодыг хослуулан хийж байна. Гэхдээ эцсийн үр дүн нь програм хангамж юм. Одоо, та програм хангамж үүсгэх үед таны анхаарах ёстой нэг асуудал бол гүйцэтгэл юм. Хэрэв хөгжүүлэгч явж, дискний AIO-г түгжихийн тулд компьютер хөлддөг for давталт бичвэл программист үүнийг туршилтын явцад олж мэдэж, програм хангамжид нь том алдаа гарахгүйн тулд засах ёстой. Haiku Animator-тай яг адилхан. Та 5000 цэгийг зүгээр л үсэрч хөдөлгөж болох бөгөөд энэ нь удааширч байгааг харах болно. Програм хангамж бүтээгчийн хувьд энэ нь зөв ажиллаж байгаа эсэхийг шалгах нь таны үүрэг юм.

Жой Коренман:

Тийм ээ. Энэ бол та үнэхээр хэзээ ч бодох шаардлагагүй зүйл юм. After Effects-д ямар нэгэн зүйл бүтээхдээ үүнийг нүүрэн талд нь бодох хэрэгтэй гэж хэлэх гэсэн юм, үүнийг үзүүлэхэд хэтэрхий удаан хугацаа шаардагдах уу, гэхдээ үүнийг үзүүлсний дараа энэ нь бүтдэг. Энэ бол огт өөр сэтгэх арга юм. Энэ үнэхээр сонирхолтой юм.

Зак Браун:

Одоо үүнийг хэлэхэд, Лотти, Бодимовин ч мөн адил санаа зовнилыг өвлөн авсан, учир нь энэ нь ажиллах үед тайлбарлагддаг. Хэрэв танд After Effects-д 1000 цэг үсэрч байвал тэр Bodymovin-д мөн мөлхөх болно.

Жой Коренман:

Зөв. Тийм ээ, энэ үнэхээр, үнэхээр сонирхолтой юм. За. Тэгэхээр биөөр жишээ гаргахыг хичээж байна. Flash-д хийж байсныг санаж байгаа зүйлсийн нэг бол та эдгээр нарийн эргэлдсэн эргэлдэх төлөвтэй байж болно. Бид яг одоо School of Motion дээр дизайны шинэчлэлт хийж байгаа бөгөөд энэ анги хэзээ гарахыг мэдэхгүй байна, гэхдээ та үүнийг сонсож байгаа бол энэ нь аль хэдийн сайт дээр гарсан байж магадгүй юм. , эс бөгөөс та түүний урсаж байгааг харж эхлэх болно. Гэхдээ бид өөрсдийн блог нийтлэл, заавар, подкаст гэх мэт зүйлсийг харуулдаг манай сайтын өнгөц зургийг дахин хийж байсан гэж бодъё.

Жой Коренман:

Тиймээс бид хүсч байна гэж бодъё. Зарим нарийн боловсруулсан өнхрөх төлөв, та үүнийг эргүүлэхэд тухайн зүйлийн гарчиг бага зэрэг томорч, дараа нь зураг өөрөө өнгөц зургийн хязгаар дотор томорч, дараа нь энэ градиент давхарга, түүний тунгалаг байдал өөрчлөгдөнө. Тэгээд дараа нь хулганыг гүйлгэхэд бага зэрэг ... хулганыг унтраахад уучлаарай, арай өөр зүйл тохиолдох болно. Миний үүнийг хийхээр төлөвлөж байсан арга бол After Effects дээр прототип хийж, дараа нь зүгээр л хөгжүүлэгчдэд хүлээлгэж өгөх, магадгүй Inspector Spacetime гэх мэт зүйлийг ашиглахын тулд тэд миний зөөлрүүлэх муруй болон үүнтэй төстэй зүйлийг ашиглах ёстой байсан. үүнийг хэрэгжүүл. Хэрэв би үүнийг Animator дээр хийхээр шийдсэн бол ажлын явц ямар байх вэ? Би уран бүтээлээ хэрхэн оруулж ирэх вэ, үүнийг хийж, бүтээх хэрэгсэл тэнд байна уу?

ЗакБраун:

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

Жой Коренман:

Би чамтай санал нэг байна.

Зак Браун:

Тиймээс та Haiku Animator дээр үүнийг хийж болох арга бол та нэг цагийн хэлхээс ашиглах явдал юм. Энэ нь Flash-тэй маш төстэй юм. Та нэг цагийн хуваарийг ашигладаг, өөр өөр үйлдлүүдтэй өөр өөр бүс нутагтай. Тиймээс 1-ээс 80 хүртэлх фрэйм ​​нь таны хулгана, 81-ээс 120 хүртэлх хүрээ таны хулгана байх болно. Бид Haiku Animator-ийн бүрэлдэхүүн хэсгийн загварыг дагаж мөрддөг тул таны бүтээсэн зүйл бол React, Angular болон View-ийн нэгдүгээр зэрэглэлийн дэмжлэг болох бүрэлдэхүүн хэсэг юм. Та эдгээрийн аль нэгийг ашиглаж байгаа гэж найдаж байна-

Жой Коренман:

Бид React-ийг ашиглаж байна, тийм ээ.

Зак Браун:

За . Хэрэв та зүгээр л металл руу орохыг хүсч байвал бид ванилийн JavaScript-ийг дэмждэг. Тиймээс та Haiku Animator-аас React бүрэлдэхүүнийг авах бөгөөд энэ нь танд Haiku Animator API-ийн лавлагаа өгөх бөгөөд та React land-аас хулгана дээр хулгана дээр, React хулгана дээр он цагийн хэлхээсийг тэгээс 80 хүртэл скраб хийх боломжтой. эсвэл 0 фрейм рүү очиж тоглох, эсвэл 81-д очиж тоглох. Тэгэхээр theХөгжүүлэгч нь үнэндээ өдрийн төгсгөлд утсыг татдаг, гэхдээ та Animator ашиглан тайзыг тавьсан юм шиг байна.

Жоэй Коренман:

Энэ үнэхээр гайхалтай. За, сонсогч минь, энэ үнэхээр хогийн ургамалд орж магадгүй тул уучлалт гуйж байна, гэхдээ би энэ талаар үнэхээр сонирхож байна, би үүнийг үнэхээр ойлгохыг хүсч байна. Энэ нь надад маш их утга учиртай бөгөөд хэрэв сонсож буй хэн нэгэн Flash ашигласан бол та үүнийг хийх байсан. Та хулгана дээр, 20-р фрейм рүү очоод, 40-р хүрээ хүртэл тогло, хулгана дээр ч юм уу ямар ч байсан гэж хэлэх байсан. Мөн та үндсэндээ бүх хөдөлгөөнт дүрсээ цагийн хэлхээс дээр байрлуулсан бөгөөд та өөр өөр хүрээний хүрээг тоглож байна. Одоо миний асуулт бол, дашрамд хэлэхэд, би хөгжүүлэгчиддээ үүнийг сонсохыг хүсч байна, учир нь тэд үүнийг надаас илүү сайн ойлгож, олон сайхан санаа авах болно.

Жой Коренман:

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

Зак Браун:

Тиймээ. За. Тиймээс Flash-ээс суралцаж, би дахиад л эвдэрсэн рекорд шиг санагдаж байна, гэхдээ Flash-ийн буруу зүйл бол нэг төрлийн хар хайрцаг, энэ нь Flash асаалттай болсны дараа вэбсайтаа хэлээрэй. хэзээ ч эргэж ирэхгүй. Тэр пикселийн хайрцаг Flash-д харьяалагддаг бөгөөд хэрэв та тэнд байгаа зүйлийг өөрчлөхийг хүсвэл Бурханы хурдыг өгдөг. Та Flash IDE-г нээж, зарим өөрчлөлтийг хийж, логикийг нэмж, өгөгдөл дамжуулахын тулд API-тай нь маргах хэрэгтэй.

Зак Браун:

Haiku Animator дээр бид зохиогчийнхоо үед миний Haiku Animator дээр үүсгэж байгаа энэ супер тэгш өнцөгт дотор тэгш өнцөгт байгааг хэлж болох орлуулагчийн тухай ойлголттой. Энэ тэгш өнцөгт нь хөгжүүлэгчийнх юм. Би энд юу орохыг мэдэхгүй байна, гэхдээ би үүнийг хөдөлгөж чадна. Тэдгээрийг аффин хувиргалт, масштаб, байрлал, эргүүлэх, хазайлт гэх мэт бүх хувиргалт гэж нэрлэдэг. Та тэр орлуулагчийг хөдөлгөж, дараа нь кодын үед хөгжүүлэгч агуулгыг дамжуулж болно. Тиймээс React-д энэ нь хүүхэд бүрэлдэхүүн хэсэг эсвэл HTML-д div доторх зүйл мэт харагдах болно. Энэ бол Haiku Animator доторх динамик агуулгын хувьд бидний шийдэл бөгөөд эцсийн хөгжүүлэгчийн хувьд ямар харагддаг вэ?шууд React. Ямар ч эргэлзэх юм уу онцгой зүйл байхгүй. Та зүгээр л Haiku React бүрэлдэхүүн хэсгийн контентыг дамжуулдаг.

Жоэй Коренман:

Үнэхээр гайхалтай. За. Би баримт бичиг болон бусад зүйлсийн талаар уншиж байсан зүйлсийн нэг нь ... учир нь бид энэ талаар бага зэрэг вэбсайт дээрээ хийсэн. Бидэнд зүгээр л жигнэсэн анимейшнүүд бий. Харин дараа нь та бидний загварчилсан зүйл болон үүнтэй төстэй зүйлс дээр хулганаа аваачихад тодорхой жижиг анимацууд гарч ирнэ. Асуудал нь хэрэв бид үүнийг өөрчлөхөөр шийдсэн бол буцаж орж, засах нь маш том асуудал юм. Хуулах, буулгах шиг биш, одоо шинэчлэгдсэн. Тэгэхээр та хэрхэн харьцах вэ, би энэ нэр томъёог зөв ашиглаж байгаа эсэхийг мэдэхгүй байна, гэхдээ та манай өнгөц зураг дээр хулганы шинэ хувилбартай үед хувилбарын хяналт? Залуус аа, одоо үүнийг хэрэгжүүлэх илүү хялбар арга байна уу?

Зак Браун:

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

Зак Браун:

Бидний Хайку Аниматорын талаар авч үзэх зүйл бол дахин бүрэлдэхүүн загвар дээр тулгуурласан, таны бүрэлдэхүүн хэсгүүд нь хувилбартай. Хэрэв та Haiku Animator дээр төсөл үүсгээд, нийтлэх товчийг дарвал тухайн бүрэлдэхүүн хэсгийн 0.0.1 хувилбарыг авах ба үүнийг кодын санд оруулах боломжтой. Бид дэлхийн вэб ертөнцийн хувьд NPM-тэй нэгдсэн бөгөөд вэб ертөнцийн аливаа хөгжүүлэгчид үүнийг мэддэг байх болно. Тэгэхээр та зүгээр л NPM Haiku Animator-ийн бүрэлдэхүүн хэсгийг 0.0.1 хувилбар дээр суулгаад л болно.

Зак Браун:

Одоо аниматор, хөдөлгөөн зохион бүтээгч эсвэл хөгжүүлэгч, Haiku Animator-г ашиглаж байгаа хэн бүхэн буцаж очоод дараагийн өөрчлөлтүүдийг хийж, Sketch-ийн хөрөнгийг шинэчилж, жишээ нь Haiku Animator руу шилжүүлж, дахин нийтлэх боломжтой бөгөөд одоо та 0.0.2 хувилбартай боллоо. Кодоос таны хийх ёстой зүйл бол уг бүрэлдэхүүн хэсгийг 0.0.2 хувилбар руу шинэчлэхэд л та шууд ажиллаж байна. Ингээд л болоо. Тиймээс бид хувилбарын удирдлага болон багц менежерүүдийн хослол дээр тулгуурлан давталтын асуудлыг шийдсэн. Энэ нь нэлээд техникийн шинжтэй бөгөөд үүнийг нэгтгэн дүгнэх сайхан арга бол бид Sketch, Photoshop, Illustrator зэрэг дизайны хэрэгслүүдтэй нэгдмэл байдлаар хөгжүүлэлтийн хэрэгслүүдийг нэгтгэдэг.

Жой Коренман:

Тиймээс хэрэв би үүнийг зөв ойлгож байгаа бол энэ нь Flash шиг ажилладаг, энэ нь зүгээр л арга юмЭнэ бол түүний жинхэнэ нэр бөгөөд Хайку хэмээх стартапын үүсгэн байгуулагч, гүйцэтгэх захирал юм. Домогт Y Combinator хөтөлбөрт хамрагдсаны дараа Зак болон түүний баг дизайн, кодыг нэгтгэх даруухан зорилготой "Animator" програмыг эхлүүлсэн. Гайхалтай зүйл, гэхдээ би Хайкуг үнэхээр ямар нэгэн зүйлд нийцсэн гэдэгт би итгэдэг.

Жоэй Коренман:

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

Жоэй Коренман:

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

Жой Коренман:

Зак , таныг School of Motion подкаст дээр байгаа нь үнэхээр гайхалтай. Цаг зав гаргасанд маш их баярлалаа, би таны тархийг сонгохыг тэсэн ядан хүлээж байна.

Зак Браун:

Тийм ээ, энд байгаадаа баяртай байна, Жой. Намайг оруулсанд баярлалаа.

Жой Коренман:

Тийм ээ, ямар ч асуудалгүй ээ. За, эхлээдбүхэл бүтэн програм болон бүх платформ дээр бодитоор хэрэгжүүлэх, шинэчлэх, ашиглахад хялбар. Тиймээс би түүнтэй дахин тоглохдоо үнэхээр их баяртай байна, учир нь энэ бол миний хэлсэнчлэн бидний хувьд хамгийн тохиромжтой цаг юм. Би үнэхээр сэтгэл хөдөлж байна, үүнийг сонсож байгаа олон хүн 14 хоногийн демо-г татаж авна гэж найдаж байна. Хэрэв та ийм төрлийн ажил хийвэл энэ аппликейшнийг туршаад үзээрэй, учир нь үнэхээр сайн хөдөлгөөн зохион бүтээгчид юу бодож олдгийг харах үнэхээр гайхалтай байх болно. Би чамаас энэ талаар асуух гэж байсан, учир нь би энэ мэт олон яриа өрнүүлэх болсон.

Жоэй Коренман:

Бараг л энэ хоёр ертөнц нийлж эхэлж байх шиг байна. Та хөдөлгөөнт дизайнтай, UX-тэй болсон. Мөн тэд хоёулаа бие бие рүүгээ чиглэж байгаа бөгөөд одоо ийм хэрэгслүүд амьдрах боломжтой болж эхэлж байгаа газар хангалттай давхцаж байна. Та уулзвараас энд ирсэн болохоор өвөрмөц юм шиг санагдаж байна. Та үйлчлүүлэгчдэд зориулж эдгээр зүйлсийг загварчилж, хэрэгжүүлж байсан. Тэгэхээр та аниматор мөн үү? Animator-д ямар хэрэгсэл оруулахаа та яаж мэдсэн бэ? Учир нь би энэ талаар юу ч мэдэхгүй анх нээсэн, гол хүрээнүүд, график засварлагч, анимейшн муруй засварлагч гэх мэт график засварлагч, ашиглахад үнэхээр сайхан, давхаргад суурилсан нэгтгэх систем, энэ нь зүгээр л нэг төрлийн. утга учиртай болгосон. Тэгэхээр та ямар функцүүдийг оруулахаа хэрхэн шийдсэн бэ?

Зак Браун:

Тиймээс би өөрийгөө аниматор гэж хэлэх болно.нөхцөл байдал.

Жой Коренман:

Би үүнд дуртай.

Зак Браун:

Мэдээж тийм ч сайн биш. Би бага байхдаа жаахан туршлагатай байсан, тэр F гэдэг үг, Flash. Тэгээд гол фреймүүд болон цагийн хуваарийн санаа, нэг удаа [сонсохгүй 00:42:03] миний-

Зак Браун:

Түлхүүр фрэйм ​​ба цагийн хуваарийн санаа. Нэг удаа [сонсохгүй 00:42:04] миний залуу оюун ухаан насанд хүрсэн хүний ​​оюун ухаанд надтай зууралдсан. Богино хариулт бол хэрэглэгчид, манай хэрэглэгчид бол мэргэжилтнүүд бөгөөд хэрэглэгчид юу хүсч байгааг олж мэдэх, та үүнийг бүтээх нь бүтээгдэхүүн бүтээх ертөнцөд нийтлэг мэргэн ухаан гэдгийг та мэднэ. Жишээлбэл, Curve редакторыг бид саяхан эхлүүлсэн. Хэрэглэгчдийн хүсэлт, хүсэлт, хүсэлтийн дагуу бид Curve засварлагчийг 2006, 2019 оноос хойш ажиллуулж эхэлсэн. Маск хийх нь хүмүүсийн шуугиж байсан бидний одоогоор дэмждэггүй онцлог юм. Тиймээс энэ нь хэтэрхий удсан байх болно гэж би найдаж байна.

Зак Браун:

Бид үүнийг ингэж л олж мэдсэн. Мэргэжилтнүүд бидэнд хэлдэг бөгөөд бид үүнийг тэндээс авдаг.

Жой Коренман:

Яг учир нь After Effects хэрэглэгчдийн байнга хийдэг маш олон зүйл байдаг. Та нэг давхаргыг нөгөө давхаргад маск болгон ашиглаж, зам дагуух хөдөлгөөнт шугамтай замуудтай болохыг та мэднэ. Иймэрхүү зүйлсийг хийх нь ... Үнэнийг хэлэхэд, After Effects-ийн зарим зүйлийг хийх хэрэгслүүд хүртэл маш хуучин бөгөөд бага зэрэг ашиглаж болно.шинэчлэгдэж байгаа бөгөөд энд хэрэглэгчидтэй ярилцаж, тэдний амьдралыг яг юу хөнгөвчлөх талаар олж мэдэх боломж байгааг харахад үнэхээр сайхан байна.

Жой Коренман:

Тэгвэл ямар хэрэглэгчид үнэхээр Animator-тай ажиллаж байгааг олж харж байна уу? Хөдөлгөөний дизайнерууд уу, эсвэл UX дизайнеруудад хөдөлгөөнт дүрс хэрэгтэй юу?

Зак Браун:

Энэ хоёулаа. Дахин хэлэхэд, Sketch нь Photoshop эсвэл Illustrator-аас илүү хялбар байдаг шиг бид хөдөлгөөний дизайнд суралцаж байгаа, магадгүй анх удаа түлхүүр фрэймийн цаг хугацааны парадигмыг ашиглаж байгаа хэрэглэгчдийн бүхэл бүтэн хэсэг байдгийг олж мэдсэн бөгөөд тэд уралдаанд оролцох гэж байна. Haiku Animator-тай. Бид уг программыг хөгжүүлж байхдаа тусламжийн төв гэх мэт бүх төрлийн баримт бичгийг боловсруулсаар ирсэн. Тиймээс бидэнд хичээлүүд байгаа. Тиймээс бид анх удаа хөдөлгөөний дизайн хийж эхэлж буй хүмүүст зориулсан сайн нөөцтэй болсон.

Зак Браун:

Үйлдвэрлэлд хүргэх үнэ цэнийг үнэлдэг туршлагатай хөдөлгөөнт дизайнеруудыг бид бас харж байна. Эсвэл "Бага зэрэг код нэмнэ үү" гэсэн утгын тулгуур. After Effects дээр хийх боломжгүй зүйл. Энэ нь үндсэндээ энэ шийдлийн зах зээл дээрх өвөрмөц цэг бөгөөд энэ бүхэн Flash-ийн вакуум руу буцдаг.

Зак Браун:

Тийм ээ, тэгээд энэ асуултын нөгөө хэсэг нь Fortune 5-аас эхлээд агентлагууд, фрилансерууд хүртэл бүх хэлбэр, хэмжээтэй компаниуд, мөн хөгжүүлэгчид үүнийг ашиглаж байгааг бид харж байна.түүнээс гадна. Эсвэл урд талын нэг төрлийн эвэрт морь шиг ... Unicorn нь дизайны бүх боломжууд болон кодын бүрэн хэмжээний функцуудыг агуулдаг учраас хамгийн их ашиг хүртэх нь дамжиггүй.

Жой Коренман:

Манай олон сонсогчид болон оюутнууд маань эхлээд хөдөлгөөн зохион бүтээгчид, зарим нь After Effects Expressions-д дөнгөж хичээллэж эхэлж байгаа учраас би чамаас асуух гэсэн юм. Тиймээс та аниматорууд Animator, Haiku Animator программыг ашиглаж эхлэхэд суралцах муруй ямар байдгийг ойлгосон эсэхийг би сонирхож байлаа. Би үүнийг хялбар болгохын тулд Haiku Animator гэж хэлж эхлэх гэж байна.

Зак Браун:

Тийм ээ.

Жой Коренман:

Тийм ээ, аниматоруудын сурах муруй нь үүнийг ашигладаг. Тэд сурахад хэр их код хэрэгтэй вэ? Сурах муруй нь ямар байх ёстой вэ?

Зак Браун:

За тэгэхээр би Expressions-ийг эхлүүлэхийг зөвлөж байна. Хэрэв та Excel эсвэл Google Sheets ашиглаж байсан бол хүснэгтийн томьёо ашигласан байх магадлалтай бөгөөд та Haiku Animator-д бэлэн байна. Хулганы дараа ямар нэгэн зүйл хийх нь Excel дээр нийлбэр авахтай адил хялбар бөгөөд үүнийг хийхэд маш их сэтгэл ханамжтай байдаг. Миний бодлоор энэ бол эелдэг үг байх, гэхдээ ийм зүйл тохиолдохыг харахад маш их хүч чадал өгч байна.

Зак Браун:

Хэрвээ та хөдөлгөөнт дизайнер бол кодыг эхлүүлэх гэж байгаа бол би хэлмээр байна. энэ бол төгс хэрэгсэл юмТа. Энэ нь гол төлөв бид үүнийг барьсан шалтгаан юм. Дахин хэлэхэд, хөдөлгөөний дизайн болон код хоорондын зөрүүг арилгахын тулд. Бидэнд байгаа нөөцүүд болон програмд ​​суулгасан код засварлагчийн хооронд энэ нь эхлэхэд маш сайн арга байх ёстой.

Жой Коренман:

Энэ бол гайхалтай. Тиймээс бидний нэрлэж буй энэ зүйлийн ерөнхий төлөв байдлын талаар ярилцъя ... Би үүнийг юу гэж нэрлэдэгийг ч мэдэхгүй байна. UX болон хөдөлгөөний дизайны огтлолцол. Тиймээс, Animator олон жилийн турш тасалдсан зарим өвдөлтийн цэгүүдийг шийдэж байна. Энэ подкастын нэг ангийг би санаж байна. Бидэнд Airbnb-ийн Салих, Брэндон нар  Лоттиг бүтээсэн багийн хоёр залуу байсан.

Зак Браун:

Тийм ээ, би тэдэнд хайртай. залуусаа.

Жой Коренман:

Тийм ээ, тэд гайхалтай. Тэд намайг эдгээр өвдөлтийн цэгүүд гэж юу болохыг ойлгоход үнэхээр чухал үүрэг гүйцэтгэсэн бөгөөд би Лотти гарч ирээд бүгдийг нь шийднэ гэж бодсон ч намайг хэн нэгэнтэй ярих болгонд тэд "Үгүй ээ, тэд" хараахан шийдэгдээгүй байна." Хөдөлгөөний дизайныг авч, үүнийг код болгон хувиргах нь маш их зовлонтой хэвээр байна.

Жой Коренман:

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

Зак Браун:

Хэрэв бид ярилцаж байгаа бол Хэдэн жилийн цар хүрээг авч үзвэл олон хүмүүс дизайнерууд x жилийн дараа юу хийх вэ, эсвэл хөгжүүлэгчид x жилийн дараа юу хийх вэ гэдэгт эргэлздэг гэж би бодож байна. Үүн дээр үндэслэн хэдэн жилийн дараа энэ нь ижил утгатай болно гэсэн ташаа ойлголтыг би бодож байна. Тэр хөгжүүлэгч өнөөдөр хэдэн жилийн дараа хийдэгтэй ижил зүйлийг хэлж байна, тийм үү?

Зак Браун:

Тиймээс л би... Би Haiku Animator программ хангамжийг бүтээхдээ юу хийж байгаа талаар хэдэн минутын өмнө хэлсэн. Таныг хөгжүүлэгч байх нь бидэнд хамаагүй. Таныг дизайнер байх нь бидэнд хамаагүй. Та програм хангамж үүсгэж байна. Ингээд л болоо. Тиймээс миний дүгнэлт бол хэдэн жилийн дараа таны цол ямар байх нь хамаагүй, гэхдээ бид бүгд хамтдаа програм хангамж бүтээх болно. Энэ нь зэрэгцээ салбар, тоглоомын салбарт аль хэдийн тохиолдож байсныг би хэлэх дуртай.

Зак Браун:

Unity 3D-г ашигласан, тэр экосистемд оролцсон хэн бүхэн, табарилгын тоглоомууд. Та програм хангамж бүтээж байна. Хэрэв та Unity доторх 3D загварууд дээр буулгах бүтэцээ бүтээхдээ Photoshop ашиглаж байгаа бол Photoshop-оор дамжуулан программ хангамжийг бүтээж байна гэсэн үг. Та буцаж очоод уг бүтэцийг өөрчлөх боломжтой бөгөөд энэ нь програм хангамж руу шилжиж, үйлдвэрлэл рүү илгээгдэнэ.

Зак Браун:

Unity нь хөдөлгөөнт дизайнеруудын хоорондох ажлын урсгалын асуудлыг шийдэж чадсан ... Unity, текстура засварлагчид, riggers, 3D modelers, and developers-д цагийн хуваарь, түлхүүр фрэймийн хөдөлгөөнт систем байдаг. Тэд бүгд Unity-д ижил зүйлийг бүтээж байна. Энэ бол миний бодлоор програм хангамжийг бий болгох ирээдүй, бидний хийх ёстой зүйл юм. Энэ бол бидний тоглоомын талбай, бидний ертөнц бол програм хангамж бүтээх ертөнц юм. Таны цол хэргэм ямар байх нь хамаагүй, гэхдээ бид ажлын урсгалыг нэгтгэх замаар ажлаа зөв хийвэл бид бүгд хамтдаа программ хангамж бүтээх болно.

Жой Коренман:

Ямар хөөрхөн юм бэ. Би жаахан нулимстай байна, залуу минь. Энэ үнэхээр уран яруу байсан.

Жой Коренман:

За би энэ талаар UX in Motion-ээс Иссара Вилленскомертай ярилцаж байсан бөгөөд одоогоор хүмүүсийн хөдөлгөөнт дүрсийг гүйцэтгэхэд ашигладаг хэрэгслүүдийн хувьд энэ нь зэрлэг хэвээр байна. апп. Үүнийг хийх сая сая өөр арга байдаг бөгөөд Animator-ийн ашиглаж буй загвар үүнийг шийдэж магадгүй, гэхдээ ямар нэгэн стандартчилал болж байна уу? Дахин хэлэхэд энэ минийх биштуршлагатай, гэхдээ миний ойлгож байгаагаар, Animator кодыг гаргаж байгаа нь ... энэ нь үндсэндээ хариу үйлдэл үзүүлэх бүрэлдэхүүн хэсэгтэй адил юм, хэрэв би андуурсан бол намайг уучлаарай, гэхдээ энэ нь JavaScript дээр суурилсан, тийм үү? Энэ нь нэг төрлийн амт, тийм ээ?

Зак Браун:

Тийм ээ, тийм ээ.

Жой Коренман:

За дажгүй. Тэгвэл энэ нь ...-тэй ажиллах болов уу, хэрэв та үүн дээр тулгуурлан вэб сайт эсвэл програм барьж байгаа бол энэ нь маш сайн, гэхдээ үгүй ​​бол яах вэ? Хэрэв та ашиглаж байгаа бол яах вэ ... Би кодчиллын хэлтэй байсан болоосой. Хэрэв та Ruby эсвэл үүнтэй төстэй зүйл ашиглаж байгаа бол яах вэ? Миний бодож байгаа зүйл бол илүү стандартчилал байх шаардлагатай юу? Ерөнхийдөө энэ асуудал арилахын тулд энэ асуудал хэвээр байна уу?

Зак Браун:

Мэдээж, тийм ээ. Бид ажлын урсгалын талаар ярихад стандартчилал хамгийн чухал зүйл юм. Тийм ч учраас Unity амжилтанд хүрсэн нь тэд жишиг болсонтой холбоотой юм. Бүх тоглоомын тал нь, хагас нь. Ямар ч платформд зориулсан хоёр тоглоом тутмын нэг нь Unity дээр бүтээгдсэн байдаг. Гол нь энэ нь стандарт болж чадсантай холбоотой.

Зак Браун:

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

Зак Браун:

Лоттигийн маш сайн хийсэн зүйл бол санаа бодлоо хуваалцах явдал юм.стандарт болсон бөгөөд энэ нь нийгэм, дэлхийн хөдөлгөөний дизайны хувьд том дэвшил болсон юм. Тиймээс Лотти стандарт болсон. Бид тэр галт тэргэнд маш хурдан үсэрсэн. Haiku Animator бол Lottie экспортыг дэмжих After Effects-ээс гадна зах зээл дээрх хамгийн анхны хэрэгсэл юм. Дахин хэлэхэд, ажлын урсгалыг нэгтгэх эрхэм зорилгынхоо хүрээнд бид шинээр гарч ирж буй стандартыг маш сайн мэдэж байсан.

Зак Браун:

Гэхдээ би анимэйшнүүдийг программ хангамжтай хэд хэдэн янзаар холбож ойлгож болно гэж хэлэх гэсэн юм. Тэдгээрийн нэг нь .gif эсвэл видео эсвэл ачаалах эргүүлэхэд тохиромжтой Bodymovin хөдөлгөөнт дүрс эсвэл товчлуурын доторх элемент зэрэг атомын жижиг хайрцаг бөгөөд товчлуур дээр дарахад ачаалах эргүүлэгч шиг дахин эхэлдэг. Энэ нь эргэлдэж эхэлдэг.

Жой Коренман:

Зөв.

Зак Браун:

Та Лоттигийн гэр болох Airbnb програмыг нээдэг. Та Airbnb програмыг нээгээд, [сонсохгүй 00:52:57] Airbnb логотой бяцхан бүжиглэх болно. Энэ нь програм хангамж дахь хөдөлгөөний нэг илрэл юм. Нөгөө нь байрлалын хөдөлгөөнт дүрс шиг том хэмжээтэй.

Жой Коренман:

Зөв.

Зак Браун:

Тэр стандартчилал болоогүй. Энэ бол цэвэр зэрлэг баруун. Яг л зэрлэг баруунаас цааш. Ийм хөдөлгөөнт дүрсийг хийх цорын ганц арга зам бол код ашиглах явдал бөгөөд вэб дээр зохион байгуулалтын хөдөлгөөнт дүрсийг хэрэгжүүлэх нь маш их асуудалтай байдаг.iOS-д зориулж хийхээс өөр. Энэ нь Android-д зориулж хийхээс тэс өөр юм. Энэ нь Samsung ухаалаг ТВ-д зориулж хийхээс тэс өөр юм. Тэгэхээр энэ бол том, муухай, сорилттой асуудал юм.

Зак Браун:

Хэт их зүйл өгөхгүйгээр Хайкугийн баг энэ орон зайд ямар нэгэн зүйл дээр ажиллаж байна. Гэхдээ програм хангамж дахь эдгээр хоёр төрлийн хөдөлгөөний ялгааг олж тогтоох нь зүйтэй гэж би бодож байна.

Жой Коренман:

Зөв. Энэ нь яг өнөө өглөө гарч ирсэн тул Лотти гэж юу болох талаар маш их төөрөгдөл хэвээр байгаа гэж би танаас асууя. Миний бодлоор хөгжүүлэлтийн тал дээр энэ нь хөдөлгөөний дизайны талаас илүү ойлгомжтой болсон. Өнөө өглөө манай Slack сувгийн хэн нэгэн "Өө, хар даа, Airbnb хөдөлгөөнт апп хийж байна" гэж хэлсэн. Тэгээд би тийм биш гэж байсан.

Жой Коренман:

Тиймээс миний ойлгож байгаагаар Лотти үндсэндээ Bodymovin гэж юу вэ, мөн ямар аниматор гэж орчуулдаг. Нулимж гаргадаг код нь үүнийг iOS эсвэл Android руу хөрвүүлдэг гэдгийг та мэднэ. Тэдгээр хэлүүд. Тэгэхээр үүнийг бүх нийтийн, хялбар болгохын тулд яг юу болох ёстой юм шиг санагдаж байна, миний таамаглаж буйгаар нэг төрлийн орчуулагч байх ёстой, та Хайку шиг компани хийх ёстой гэж бодож байгаа зүйл юм уу, эсвэл Энэ нь бүх нийтийн форматтай болох арга замыг бий болгохын тулд Apple, Google, Samsung-аас илүү их хүчин чармайлт шаардах болов уу?

Зак Браун:

Тэгэхээр юуны өмнөБи чамаас нэрний талаар асуух ёстой зүйл. Би манай Motion сургуулийн багийнхнаас асуухад "Хөөе, Хайкугийн Зак Браун ирж байна" гэж хэлэхэд тэд кантри хөгжмийн од байх ямар байдгийг мэдэхийг хүссэн зүйл байсан, тэгвэл та үүнийг их ойлгож байна уу? Зак Браун хамтлаг гэж хэн болохыг та мэдэх үү?

Зак Браун:

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

Жой Коренман:

Тэр хөгшин хүрэн.

Зак Браун:

Гэхдээ үнэндээ чирэх машины жолооч намайг Зак Браун руу анх оруулсан бөгөөд тэр надад таны гарын үсэг хэрэгтэй юм шиг байна, Зак Браун, надад таны гарын үсэг хэрэгтэй байна. Би үүнийг хийсэн, би тэр үед би 20 настай байсан гэж бодож байна, би Зак Браун байхдаа амьдралынхаа 20 жилийг хийсэн бөгөөд дараа нь та үргэлж "Зак Браун хамтлагийг хэлэх гэсэн юм уу?"

Жой Коренман:

Яг тийм. Би түүнийг К-тэй гэж бодохгүй байна, тиймээс чи намайг К-тэй хамт Зак гэж хэлж болно. Энэ нь бүх зүйл тодорхой болно. Өө, энэ үнэхээр инээдтэй юм. Үүнийг сонсож байгаа хүн бүр танай компани болон аппликейшнийг хараахан сайн мэдэхгүй байгаа гэдэгт би итгэлтэй байна, гэхдээ тийм байх болно.

Жоэй Коренман:

Гэхдээ би зүгээр л нэг зүйлээс эхлэхийг хүссэн юм. чиний талаар бага зэрэг илүү ихийг мэдэж аваарай. Та ямар мэргэжилтэй вэ, эцэст нь хэрхэн анимэйшн програм бүтээдэг программ хангамжийн компанийг үүсгэн байгуулсан бэ?

Зак Браун:

Мэдээж сайн, тэгэхээр би бүтээлч амьдралаа хэвлэлийн дизайн, гэрэл зургийн чиглэлээр эхлүүлсэн. -ийнДахин хэлэхэд, бид яг одоо маш нууцлаг, нууцлагдмал зүйл дээр ажиллаж байгаа, гэхдээ бид удахгүй зарлах болно. Энэ нь платформ хоорондын стандартчиллын талаар жүжиглэж байна.

Жой Коренман:

Зөв.

Зак Браун:

Та өөрийн биеэр өөдгүй стартап гэдгийг мэднэ. Найз минь, үүнийг Google-ээс гаргах шаардлагагүй гэж бодож байна, гэхдээ үүнийг стандарт болгохын тулд Google хэзээ нэгэн цагт хэрэглэх ёстой.

Зак Браун:

Дараа нь дахин хэлэхэд амжилтын хувилбар бол миний харж байгаагаар зах зээлийн 50% хувь юм. Зүгээрдээ. Үүнийг Unity хийсэн. Тэд өвдөөгүй. Чи хэзээ ч хүн болгонд таалагдахгүй. Ялангуяа техникийн чиглэлээр ... [сонсохгүй 00:55:47] янз бүрийн хэл дээрх кодлогч, дизайнерууд янз бүрийн дизайны хэрэгслүүдийг ашигладаг, янз бүрийн судалтай хөдөлгөөн зохион бүтээгчид техникийн салбаруудын сүйрэлд орсон. Та эдгээр бүх төрлийн хослолыг үржүүлбэл, нэг стандарт эсвэл нэг хэрэгслээр хүн бүрийг хэзээ ч баярлуулахгүй, энэ нь зүгээр юм. Гэсэн хэдий ч, хангалттай хүмүүсийн суурь асуудал гэх мэт цуурайтаж, асуудлыг шийдэж чадах зүйл бол Эв нэгдлийн жишиг болж эхлэх нь энэ нь бүрэн боломжтой гэж би бодож байна.

Зак Браун:

Тэгээд тэр том компаниудын аль нэгийг нь гаргах шаардлагагүй гэж би бодож байна. Та мэдэж байгаа, өрөөсгөл, гэхдээ хувь хүнийх нь хувьд.

Жой Коренман:

Тийм ээ. Маш дажгүй. Тийм ээ, би чамайг хар яст хүзүүвчтэй тайзан дээр тайзан дээр гарахдаа баяртай байнаЭнэ онцлог нь юу болохыг бүгдэд харуулаарай.

Жой Коренман:

Тиймээс би чамаас өөр хэдэн асуулт байна. Та Сан Францискод амьдардаг тул технологийн хөөс дотор байна. Та YC-ийн ажлыг хийгээд энэ бүгдийг хийсэн.

Зак Браун:

Мэдээж.

Жой Коренман:

Тэгэхээр би үүнийг төсөөлж байна. Та олон технологийн компаниудтай холбоотой байдаг. Та том хүмүүсийг мэддэг гэдэгт би итгэлтэй байна, одоо хүмүүс ямар товчлолыг ашигладаг вэ? ФААН.

Зак Браун:

ФААН, тиймээ.

Жой Коренман:

... хоёр Астай, тиймээ, тийм. Та Facebook, Apple ...

Зак Браун:

Амазон.

Жой Коренман:

Үнэндээ хүлээх хэрэггүй, энэ бол Facebook, Apple, тиймээ Амазон зөв, дараа нь Netflix болон Google.

Зак Браун:

Би Microsoft ч бас тэнд харьяалагддаг гэж бодож байна, гэхдээ үнэндээ Silicon Valley нь [сонсохгүй 00:57:00].

Жой Коренман:

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

Зак Браун:

Мэдээжийн хэрэг, би бас өсөлтийг харж байна. UX-ийг ялгах санаа нь үнэхээр ...Хэрэв та мэдэж байгаа бол ангалын муруйг даван туулах нь энэ үед бүрэн хэрэгжиж байна. Ямар ч байсан, энэ нь ... хүн бүр болон тэдний ээж, өвөө нар UX дээр ялгах нь компанийн амжилтын хэтийн төлөвт ихээхэн өөрчлөлт оруулдгийг мэддэг. Үүний гол хэсэг нь хөдөлгөөнийг бий болгосон.

Зак Браун:

Лотти гэх мэт зүйлс рүү буцаж очоод үүнийг хүртээмжтэй болгож ... өөрийн аппликейшнд гайхалтай хөдөлгөөнт дүрс оруулахыг үнэхээр хялбар болгож байгаа нь маш том асуудал юм. So yeah, motion designers who ... Motion designers for code, motion designers for code bases, motion designers for software. Мэдээжийн хэрэг, бид энэ хурдацтай хөгжиж байгааг харж байна.

Жой Коренман:

Энэ үнэхээр гайхалтай. За, яагаад бид үүгээр дуусгаж болохгүй гэж? Animator бол аль хэдийн маш гайхалтай програм бөгөөд үнэхээр хүчирхэг програм бөгөөд бид үүнтэй дахин холбогдох болно. Би хүн бүр үүнтэй тоглохыг санал болгож байна. Та одоо ийм ажил хийж байгаа эсэхээс үл хамааран ирээдүйд хийх боломж их байна, учир нь би Закийн зөв гэж бодож байна, хүн бүр болон тэдний ээж одоо вэбсайт дээрээ болон апп дээрээ хөдөлгөөнт дүрс хийхийг хүсдэг.

Жой Коренман:

Хэрэв та Animator-ийг After Effects-тэй харьцуулбал 25, 26 настай гэж бодож байгаа бол Animator-д хараахан байхгүй олон боломжууд байгаа нь ойлгомжтой. Энэ үед 3D камер эсвэл үүнтэй төстэй зүйл.

Зак Браун:

Камер байхгүй.

Жой Коренман:

Та ирээдүйн талаар ямар төсөөлөлтэй байна вэ? ньапп болон илэн далангүй хэлэхэд компанийх уу?

Зак Браун:

Бидний бараг тэнэг амбицтай... Бид оддын төлөө зураг авалт хийх ёстой гэдгийг та мэднэ. Үүний нэг хэсэг нь Silicon Valley болон VC-ийн дэмжлэг юм. Үүний нэг хэсэг нь зүгээр л харалган амбиц юм. Хувь хүн бол оршин тогтнох түвшинд байгаа мэт боловч дизайн, кодыг нэгтгэх боломжийг би харж байна. Тийм үү? Манай багийн бүх хүмүүс тэгдэг. Жишээлбэл, Юнитигийн зах зээлд эзлэх хувь хэмжээгээ олж авахын тулд эдгээр ажлын урсгалыг нэгтгэх.

Зак Браун:

Тиймээс манай компанийн зорилго бол "Дизайн болон кодыг нэгтгэх замаар програм хангамж бүтээхэд хувьсгал хийх" юм. Энэ бол эхлэлийн зорилгын том зураг авалт бөгөөд бидний анхны бүтээгдэхүүнээрээ зах зээлд гарах арга зам нь Флэшийн үйлдвэрлэлд хүргэх хөдөлгөөний дизайны үлдэгдэл орон зайг дүүргэх явдал юм. Энэ нь миний дурдсан програм хангамжийн хөдөлгөөнийг ашиглах анхны тохиолдлыг хамарна. Эдгээр атомын хөдөлгөөнт дүрсүүд. Animator нь орлуулагч болон API кодын тусламжтайгаар үүнээс цааш явах боломжийг танд олгоно.

Зак Браун:

Гэхдээ энэ асуудалд илүү олон зүйл байгаа бөгөөд бид дизайны системтэй адил сонирхолтой чиг хандлагууд гарч ирж байгааг харж байна. Хувилбарын удирдлага гэх мэт санаанууд, бүрэлдэхүүн хэсгүүд гэх мэт санаанууд нь үнэхээр сэтгэл санааны хуваалцаж эхэлж байна. Ялангуяа асар их тууштай байдлын хэрэгцээ нь дизайны системийг бий болгоход сая сая, сая доллар зарцуулж байгаа аж ахуйн нэгжид. Тиймээс ийм байж магадгүй юмоньсогоны нэг хэсэг. Энэ бол бидний анхаарал хандуулж байгаа зүйл юм.

Зак Браун:

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

Зак Браун:

Тийм ээ, энэ таны асуултанд хариулж байна уу?

Жой Коренман:

Тийм ээ, би нэгтгэх, дизайн хийх, кодлох гэж бодож байна. Энэ бол нэлээд амбицтай ажил, гэхдээ би мэдэхгүй. Зак, чамтай хийсэн цөөн хэдэн харилцаанаас харахад та болон багийнхан үүнийг хийх боломжтой гэж бодож байна. Энэ хаашаа явахыг би үнэхээр тэсэн ядан хүлээж байна.

Зак Браун:

Баярлалаа, Жои. Өнөөдөр намайг оролцсонд маш их баярлалаа.

Жой Коренман:

Haiku.ai дээрээс Animator-г үзээрэй. Аппликейшн дээр хөдөлгөөнт дүрсийг хэрэгжүүлэхэд аниматорууд болон хөгжүүлэгчдэд тулгардаг бэрхшээлүүдийн талаар маш сайн ярьж, ирсэнд нь би Закд үнэхээр талархаж байна. Animator нь нэлээн шинэхэн хэвээр байгаа ч энэ нь аль хэдийн ашиглахад маш сайхан програм бөгөөд энэ нь вэбсайт эсвэл гар утасны програм эсвэл бусад зүйл дээр интерактив болж дуусах зүйлсийг бидний хөдөлгөөнт дүрслэх арга барилыг өөрчлөх бодит боломж гэж би бодож байна.

Жой Коренман:

Та энэ подкастыг захиалсан эсэхээ шалгаарай, ингэснээр салбарын мэдээ болон Animator зэрэг шинэ хэрэгслүүдийн талаар мэдээлэл авах боломжтой. Хэрэв та илүү ихийг мэдэхийг хүсвэл SchoolofMotion.com руу зочилж, үнэгүй бүртгэл авч, манай Motion Mondays мэдээллийн товхимолыг хүлээн авна уу. Энэ бол энгийн Dunkin' Donuts кофеныхоо талаар унших боломжтой богино имэйл бөгөөд хөдөлгөөнт дизайн хийхэд анхаарах ёстой бүх зүйлийн талаар танд мэдэгдэх болно.

Жой Коренман:

Энэ бол энэ ангид зориулагдсан. Чамайг ухсан, амар амгалан байгаасай гэж үнэхээр найдаж байна.

Illustrator, Photoshop гэх мэт хэрэгслүүдийг ашиглах. Би багаасаа л компьютерт дуртай байсан бөгөөд эдгээр медиаг судалж байхдаа Flash хэмээх энэхүү хэрэгслийг олж нээсэн нь гайхалтай программ хангамж байсан бөгөөд энэ нь миний програмчлалын гүүр болсон юм.

Зак Браун:

Флэш дээр та өнөөдрийг хүртэл эдгээр өвөрмөц вектор зохиогчийн хэрэгслээр зураад зогсохгүй загваруудаа үнэхээр гоёмсог, бие даасан байдлаар кодоор чимэглэх боломжтой. Энэ нь намайг програмчлалд үнэхээр оруулж эхэлсэн. Би энэ бүх жижиг тоглоомуудыг хийсэн. Дэлхий яг л миний хясаа байсан. Тэгээд би компьютерийн шинжлэх ухааны чиглэлээр суралцаж, дараа нь 3D дүрслэл, түгээлтийн систем, бага зэрэг хиймэл оюун ухаан, AR чиглэлээр хэсэг хугацаанд программ хангамжийн инженерээр ажилласан.

Зак Браун:

Бас их хэмжээний UI, UX, дараа нь Thomas Street хэмээх агентлагийг эхлүүлсэн. Бид долоон жил орчим байсан, маш сайн хэмжээтэй болсон. Бидэнд Coca-Cola, DirecTV зэрэг үйлчлүүлэгчид байсан, дараа нь би үүнийг зарсан. Би 20 нас хүрээд хоёр жил аялсан. Энэ нь зориуд карьерын алхам шиг байсан, үүнд итгэх үү, үгүй. 40 орчим орноор аялж, хэдэн хэл сурсан, далайд багагүй хугацаа зарцуулж, амьдралаа баяжуулахыг хичээсэн.

Зак Браун:

Тэгээд тэндээс гарч ирээд Хайкуг үүсгэн байгуулсан. 2016 он байлаа. Бид ойрд багахан хугацаа өнгөрлөө.

Жой Коренман:

Хөөх, бид бүгд үүнтэй холбоотой байх.Компаниа зарж, хоёр жил аялах. Энэ үнэхээр гайхалтай түүх байна, залуу минь. Би үүнийг бага зэрэг ухаж авмаар байна. Тэгэхээр та агентлаг байгууллаа, Coca-Cola гэх мэт брэндүүдэд ажил хийж байна гэсэн. Та ямар ажил хийж байсан бэ?

Зак Браун:

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

Зак Браун:

Энэ нь дизайнаас код руу шилжих асуудлын талаарх миний хувийн ойлголтын эхлэл юм. Энэ бол эмх замбараагүй асуудал бөгөөд өнөөдөр үүнийг шийдвэрлэх төгс шийдэл байхгүй байна.

Жой Коренман:

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

Жой Коренман:

Бидэнд эдгээр бүх санаанууд байгаа бөгөөд бид вэбсайтаа тодорхой байдлаар ажиллахыг хүсч байгаа бөгөөд бид хөдөлгөөнт дүрсний сургууль тул аливаа зүйлийг хөдөлгөөнтэй болгохыг хүсч байна. Одоо ч гэсэн, 2019 онд энэ нь маш хэцүү хэвээр байнаИнгэхийн тулд та энэ агентлагийг удирдаж байх үед энэ үйл явц ямар байсан бэ? Дизайныг хувиргах үйл явц бөгөөд би мөн хөдөлгөөнт дүрсийг код болгон хувиргах гэж байна уу? Тухайн үед муж улсын байдал ямар байсан бэ?

Зак Браун:

Энэ нь өнөөгийн орчин үеийн орчин үеийнхтэй бараг ижил байсан. Танай дизайнерууд дижитал хэрэглүүр ашиглан элэглэл бүтээж байна. Пикселээр юуг бүтээх ёстойг зааж өгдөг бөгөөд дараа нь тэдгээр пикселүүдийг өөр пиксел болгон бүтээх нь харин зөв пикселийг бий болгох нь хөгжүүлэгчдэд шилжүүлдэг.

Жой Коренман:

Зөв.

Зак Браун:

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

Жой Коренман:

Тийм ээ, бас огт өөр зүйл бий ... Би "парадигм" гэхээсээ өөр үг бодохыг хичээсэн. их доголон сонсогдож байна, гэхдээ энэ нь миний бодлоор тохиромжтой үг юм. Хөдөлгөөний дизайнерууд үндсэндээ шугаман түүхийн талаар боддог. Энэ нь ингэж харагдах болно, учир нь би үүнийг ингэж хөдөлгөөнтэй болгож байгаа бөгөөд тэр болгонд ингэж тоглох болно.

Жой Коренман:

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

Жой Коренман:

Тэгэхээр бидний хөдөлгөөний дизайн болон кодчиллын тал дээр ашигладаг хэрэгслүүдийн хооронд орчуулгын асуудал байгаагийн шалтгаан нь үндсэндээ мөн үү?

Зак Браун:

Яг тийм. Тэгээд ийм анхааруулгатай хэрэгсэл байхгүй, түүн дээр зүү тавиарай, өнөөдөр та үүнийг хийгээч гэсэн тийм хэрэгсэл байхгүй байна. Өмнө нь нэг байсан. Яг үүнийг Flash танд олгож байгаа юм. Дахин хэлэхэд, дизайн болон кодыг хольсноор та Frame 20 руу орж, кодонд бага зэрэг дарцаг тавьж болох бөгөөд одоо таны товчлуур цэнхэр биш улаан өнгөтэй байна. After Effects үүнийг хийдэггүй бөгөөд After Effects нь өнөө үед хөдөлгөөнт дизайны багаж хэрэгслийн ертөнцөд үнэхээр үлдэж байна.

Зак Браун:

Гэхдээ Флэш нас барснаас хойш тав, 10 жилийн дараа дэлхий дээрх вакуумыг мэдэрч байгаа нь үнэхээр хачирхалтай. монополь үхэх үед энэ нь бидний ийм хачин жигтэй зүйл болж хувирдаг. Энэ бүхэн утга учиртай юу?

Жой Коренман:

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

Жой Коренман:

Бас байхҮнэнийг хэлэхэд би яагаад ийм сайхан үхлээр үхсэнийг бүрэн ойлгоогүй. Түүнийг юу хөнөөсөн талаар танд ямар нэгэн ойлголт байна уу? Сонсож буй хүн бүрийн хувьд Flash одоо ч байсаар байна. Үүнийг одоо Animate гэж нэрлэдэг. Adobe үүнийг өөрчилсөн бөгөөд үүнийг эсийн хөдөлгөөнт дүрс, уламжлалт хөдөлгөөнт дүрслэлд их ашигладаг байсан ч урьдынх шигээ ашиглагдаагүй байна.

Жой Коренман:

Яагаад гэдгийг мэдэж байгаа бол би сонирхож байна. Энэ бол Зак.

Зак Браун:

Тийм ээ, надад ганц хоёр бодол байна. Тиймээс Flash-ийн төгсгөлийн эхлэл нь 2005 онд Adobe Macro Media-г 3.4 тэрбум доллараар худалдаж авсан бөгөөд энэ мөнгө үндсэндээ Flash-т зориулагдсан байв. Macro Media нь Dream Weaver, Fireworks зэрэг бусад бүтээгдэхүүнүүдтэй байсан ч Flash үнэхээр титэм нь байсан. Энэ нь бүх төхөөрөмж дээр ажилладаг, интернетийн зар сурталчилгааны тал хувь нь байсан, тоглоом бүтээхэд зориулагдсан платформ байсан.

Зак Браун:

Хэрвээ та флаш тоглоомуудыг санаж байгаа бол флэш. хүүхэлдэйн кино, энэ нь YouTube болон ерөнхийдөө вэб дээрх видеоны тулгуур, дэд бүтцийн тулгуур байсан. Энэ бүгдийг мартах нь амархан ч Flash нь маш том амжилт байсан тул Adobe үүний төлөө асар их мөнгө төлж, дараа нь гар утас гарч ирэв. IPhone нь гар утас, ухаалаг утасны хувьсгалын нэг төрөл байсан бөгөөд гар утас нь Стив Жобс болон програмын дэлгүүрийн бүх бизнесийн загварыг устгасан бөгөөд орлогын асар их хэсгийг тоглоомоос бүрдүүлдэг.

Зак

Дээд тал рүү орох