Hirupkeun UI / UX dina Haiku: Obrolan sareng Zack Brown

Kami calik ngobrol sareng Zack Brown, CEO sareng visioner di tukangeun Haiku Animator.

Kami hoyong ngamimitian tulisan ieu ku sajak:

UX sareng UINot So Fun to AnimateBut, Now There's Haiku- School of Motion

Naha guyonan basa Inggris kelas 3 ieu ngalakukeun nanaon pikeun anjeun?

Aya seueur buzz ngeunaan desain gerak sareng kumaha éta cocog sareng dunya UI/ Desain UX. Di payuneun panalungtikan UI / UX nyaéta Zack Brown, CEO Haiku sareng visioner tukangeun Haiku Animator.

Dunya haus pikeun nambihan animasi ekspresif kana pangalaman pangguna, tapi alur kerja ayeuna pikeun animasi di UI sareng UX ngagaduhan seueur anu dipikahoyong. Ayeuna, kalayan bantosan Haiku Animator anjeun tiasa ngarancang, ngahirupkeun, nyebarkeun, sareng nyelapkeun kana program tunggal anu disaluyukeun.

Ieu sanés ngan ukur ngamimitian sacara acak, Haiku ngalangkungan program Y Combinator legendaris. . Y Combinator kasohor pikeun ngabantosan sababaraha merek anu paling inovatif anu urang kenal ayeuna, sapertos Dropbox sareng Airbnb. Janten, éta aman pikeun nyarios, Haiku sigana nuju nuju kana hiji hal.

Dina podcast kami calik sareng Zack pikeun ngobrol ngeunaan dunya UI/UX Animation. Sapanjang jalan anjeun bakal ngadangu ngeunaan kasang tukang Zack dina dunya periklanan, kumaha anjeunna ngamimitian Haiku, sareng kumaha upami ngajalankeun ngamimitian anu ngembang pesat.

Haiku ogé nawiskeun para pamirsa podcast kami diskon pikeun Animator. diskon ieu bade janten sadia dugiCoklat:

Jeung kaulinan haratis dina web pastina bertentangan jeung kaulinan mayar ngaliwatan toko aplikasi jeung gatekeeper na. Sareng aya seueur alesan téknis ogé. Dasar kode dina titik ieu umurna 15 taun, éta parantos ngalangkungan sagala rupa pamimpin anu béda-béda sareng ngalangkungan akuisisi, sababaraha urang henteu cicing. Teu aya anu terang pisan kana dasar kode.

Zack Brown:

Anu digabungkeun sareng DNA Adobe sareng naon anu kuring sebut sacara efektif malstewardship Flash, badai sampurna ieu anu nyababkeun maotna.

Joey Korenman:

Wah.

Zack Brown:

Hehehehe.

Joey Korenman:

Maksud kuring, hanjakal pisan sareng kuring henteu terang. Aya paralel anéh anu anjeun tiasa tarik tina éta carita sareng hal-hal sanés anu sami, perusahaan-perusahaan kaala teras lalaunan, lalaunan dicekék pati. Baheula aya aplikasi compositing anu bener-bener kuat, anu disebut Shake, éta mangrupikeun prékursor pikeun Nuke, anu ayeuna mangrupikeun alat épék visual standar.

Joey Korenman:

Jeung Apple ngagaleuh Shake teras, éta ngan ukur maot dina tangkal anggur sareng seueur amarah di sabudeureun éta ogé, janten éta sanés hal anu biasa. Leres, janten patarosan salajengna kuring, anu kuring pikir ayeuna urang parantos nari di sabudeureun éta cukup nyaéta perusahaan anjeun, Haiku, ngawangun alat anu disebut Animator sareng urang badé teuleum ka jero, tapi ngan ukur masihan gambaran ka sadayana. , naon Animator? Jeungnaon masalahna coba direngsekeun?

Zack Brown:

Tentu. Janten, saur After Effects mangrupikeun titik rujukan anu saé. After Effects munggaran dileupaskeun 26 sababaraha taun ka pengker di 1993, janten éta sakola kuno sareng éta mangrupikeun alat grafik gerak khusus pikeun pilem sareng TV sareng éta salawasna. Bayangkeun sadetik upami After Effects diwangun ti mimiti, tapi kalayan tujuan pikeun desain gerak pikeun parangkat lunak sareng antarmuka pangguna tinimbang damel film.

Zack Brown:

Sareng aya sababaraha bédana konci antara média éta, sapertos interaktivitas, integrasi sareng basis kode, sapertos kontrol versi. Masalah-masalah éta henteu aya dina dunya pilem sareng TV.

Joey Korenman:

Leres.

Zack Brown:

Jadi, urang geus loba pamaké ngabandingkeun urang jeung analogi Sketsa nyaeta Toko Poto salaku Haiku Animator nyaéta Saatos Balukar. Nyaéta, éta langkung énggal, tujuanana diwangun pikeun animasi UI, langkung bersih sareng langkung gampang dideukeutan ogé, khususna pikeun jalma anu mimiti kana desain gerak.

Joey Korenman:

Sampurna. Leres, kuring pikir éta mangrupikeun katerangan anu sampurna sareng kuring parantos maénkeun éta sareng éta pikaresepeun pisan pikeun dianggo sareng saha waé anu ngagunakeun After Effects bakal langsung terang kumaha jalanna. Aya sisi séjén pikeun Animator anu henteu leres-leres aya dina After Effects sareng kuring hoyong ngobrol ngeunaan éta, tapi kuring hoyong ngadangu ngeunaan kumaha anjeun leres-leres ngawangun aplikasi ieu, sababPanginten anjeun sareng kuring patepung sahenteuna sataun katukang sareng dina waktos éta, aplikasi éta dina béta sareng anjeun parantos nambihan seueur fitur sareng ngembangkeunana.

Joey Korenman:

Sareng kuring sok panasaran kumaha anjeun ngalakukeun hal sapertos kitu, ngawangun perangkat lunak anu rumit. Janten, panginten anjeun ngan ukur tiasa ngobrol ngeunaan kumaha anjeun badé ngembangkeun versi awal aplikasi. Naha anjeun coding? Naha anjeun ngagaduhan tim, kumaha éta damel?

Zack Brown:

Sakali deui, sakabeh carita balik deui ka agénsi éta sarta ngajalin jurang antara desain jeung kode jeung pamahaman masalah éta. Éta awal carita Haiku, sabenerna. Kuring nyangka karir pribadi kuring parantos ngurilingan masalah ieu dina sababaraha tempat anu béda, padamelan anu béda. Sareng sapanjang jalan, kuring tepang sareng pangadeg kuring. Urang digawé babarengan di hiji pausahaan kaliwat sarta manéhna nempo masalah ogé jeung saterusna, urang diatur kaluar, urang diasupkeun dina Juni 2016.

Zack Brown:

Enam bulan kahiji éta rada eksperimen, ngan anjeunna di Philadelphia, Kuring éta di SF, jadi bener ngan video panggero, sora obrolan, Slack, jeung kontrol versi sarta mudik sarta figuring hal kaluar. Sareng langkung ti sataun dugi ka urang ngagaduhan naon waé anu mangpaat pikeun saha waé. Kusabab éta mimiti ngamimitian dina setting laboratorium sains. Siga oh, kumaha upami urang ngalakukeun ieu, kumaha upami urang ngalakukeun éta? Éta mangrupikeun awal, ngan ukur seueur ékspérimén, kakuatan kasar,eksplorasi, lajeng urang mawa kana investasi munggaran urang nuju tungtung 2016.

Zack Brown:

Sareng éta nalika urang mimiti jadi ogé, sigana urang kudu monetize hal ieu, hayu urang ngawangun sababaraha utilitas nyata kana éta, hayu urang milari pasualan anu dipikaresep ku jalma-jalma sareng pamustunganana bakal mayar sareng éta kumaha éta mekar.

Joey Korenman:

Alus sareng salah sahiji hal anu kuring resep pisan nyaéta kanyataan yén anjeun ditampi kana program Y Combinator. Sareng kuring henteu terang upami sadayana anu ngupingkeun bakal sadar naon éta. Sadayana di dunya téknologi terang ngeunaan Y Combinator, tapi dina dunya desain gerak, kuring yakin aya jalma anu henteu terang.

Joey Korenman:

Jadi, anjeun tiasa ngajelaskeun naon Y Combinator teras, naha anjeun milih ngalamar program éta?

Zack Brown:

Jadi, YC, Y Combinator, YC, nyaéta akselerator ngamimitian. Anu aranjeunna lakukeun nyaéta ngawawancara ngamimitian sareng pendiri anu aranjeunna ngajangjikeun teras, anu aranjeunna nampi, aranjeunna nyambung sareng sumber daya sareng dandan, dasarna pikeun ngumpulkeun modal usaha sareng maén kaulinan ngamimitian. Sarta aranjeunna investasi saeutik duit sorangan, tapi anjeun teu nyandak YC pikeun kas, sabab éta jenis mahal. Aranjeunna nyandak chunk badag tina equity.

Zack Brown:

Aya loba akselerator startup anu béda-béda ayeuna, tapi YC mangrupikeun salah sahiji anu asli, upami anjeun hoyong OG.

JoeyKorenman:

Leres.

Zack Brown:

Sareng abdi gaduh daptar di dieu, sababaraha perusahaan portofolio sanésna kalebet Air Bnb, Stripe, Cruise, Dropbox, Coin Base, Instacart , Reddit, Twitch TV sareng daptar terus. Éta sapertos sadayana IPO ieu kajantenan ayeuna. YC henteu ngawadul pisan.

Joey Korenman:

Maranéhanana boga panon alus keur bakat.

Zack Brown:

Maranéhanana. Éta ogé gaduh merek sareng janten, aranjeunna gaduh seueur jalma anu nerapkeun sareng kasohor, tingkat katampina langkung handap tibatan Harvard, sapertos opat kali langkung handap. Janten, ngalangkungan YC masihan anjeun cap kapercayaan anu sami, sapertos oh YC nyarios yén aranjeunna henteu kunanaon, janten écés aranjeunna henteu kunanaon.

Zack Brown:

Éta pantesna sapertos kapercayaan anu kantos. Aya sahenteuna di Lembah Silikon, éta kumaha gawéna, sigana mah.

Joey Korenman:

Leres, éta leres pisan. Sareng kuring ogé hoyong ngadangu ngeunaan pangalaman éta, tapi kuring hoyong ngagali sakedik deui, sabab ieu mangrupikeun hal anu kuring pikirkeun sareng kuring parantos ngobrol sareng pangusaha sanés sareng School of Motion, ayeuna, teu aya investor. Ieu geus sagemblengna bootstrapped, tapi kuring geus mikir ngeunaan eta.

Joey Korenman:

Kuring geus ngobrol jeung investor jeung anjeun nurun nimbang pro jeung kontra eta, jadi kuring nurun panasaran naon tipped timbangan pikeun anjeun sangkan eta patut mere jauh equity pikeun ngumpulkeun modal tinimbang bootstrapping eta.

Zack Brown:

Bagian tina eta harkens deuinu lab sains percobaan poé mimiti dimana urang néangan pikeun invent hal revolusioner sarta dina titik nalika kami katampa ka YC, urang teu boga jalan ka Profitability. Kami henteu acan monetisasi. Kami henteu ngamonetisasi dugi ka sataun saatos kami nampi kana YC, janten teu aya jalan pikeun bootstrapping, sanés sareng lintasan ayeuna.

Joey Korenman:

Leres.

Zack Brown:

Kami parantos ngangkat sakedik réréncangan sareng kulawarga sareng modal pangadeg, janten kami parantos ngangkat sababaraha VC sapertos kitu, kami ngarencanakeun jalur ieu, naha urang hoyong ngan ukur robih jalur urang sareng pokus pikeun kéngingkeun hal-hal anu pikasieuneun anu ngahasilkeun artos atanapi ngumpulkeun sakedik deui sareng milarian anu langkung muluk atanapi ambisius ti mimiti? Anu musik kana ceuli VC.

Zack Brown:

Hehehehe, nalika urang asup ka YC, urang boga kira-kira lima bulan landasan, nu bisa jadi cukup pikeun ngumpulkeun siki babak di Lebak, tapi éta atos dijual nalika anjeun ngagaduhan téknologi adil sains sareng teu acan aya modal. Janten, urang milih YC pikeun éta diantara sababaraha alesan sanés sareng pribadi, kuring bagja pisan sareng pangalaman éta.

Joey Korenman:

Hehehehe, Abdi hoyong ngadangu ngeunaan pangalaman, sabab éta jenis barang legenda. YC mangrupikeun akselerator ngamimitian anu paling kasohor di dunya sareng Paul Graham mangrupikeun jenius sareng Paul Graham, pikeun saha waé anu ngadangukeun anu henteu terang nami éta, salah sahiji pendiriYC diantarana sareng gaduh blog anu luar biasa sareng seueur hikmahna.

Joey Korenman:

Tapi hehehehe, janten naon program éta kanggo perusahaan sapertos anjeun?

Zack Brown:

Abdi kedah nyarios heula yén YC, nalika urang ngaliwat, urang lebet dina ahir taun 2017, lebet dina awal taun 2018, éta béda pisan sareng éta deui. 2005 nalika aranjeunna ngamimitian. Nalika aranjeunna ngamimitian, éta sapertos cohorts legendaris nalika aranjeunna ngamimitian, Twitch TV sareng Reddits sareng Air Bnb sareng ayeuna, éta langkung ageung.

Zack Brown:

YC nganggap dirina ngamimitian ogé, sareng tujuanana nyaéta pikeun skala. Sarta lamun urang ngaliwatan, aya wae antara 100 jeung 200 pausahaan dina bets versus kawas 10 atawa hal dina bets munggaran. Béda pisan, béda pisan pangalaman. Kitu cenah, kuring indit ka universitas badag sarta salah sahiji hal kuring diajar di universitas, jenis cara teuas dina mimitina, éta aya ton sumberdaya sadia, tapi lamun condong deui tinimbang kana eta, lamun lean. balik deui, anjeun teu meunang eta sumberdaya.

Zack Brown:

Jeung batur bakal meunang eta jeung anjeun bakal ngan jenis basisir ngaliwatan. Nanging, upami anjeun ngahontal sareng ngarebut sumber daya ...

Zack Brown:

Tapi, upami anjeun ngahontal sareng ngarebut sumber daya sacara proaktif di universitas ageung sareng di Y Combinator ageung anjeun sami. , mangka anjeun meunang loba kaluar ti eta.Sareng sigana kuring yuswa 30 taun ayeuna. Abdi hoyong ngalakukeun hiji hal sareng kahirupan kuring, sareng kuring untung gaduh pangaweruh éta, sigana mah, éta langkung saé pikeun lean sareng ngarebut sumber-sumber éta. Salaku hasilna, kuring ngarasa kawas urang meunang loba kaluar ti eta, hal kawas jaringan, mentorship, ngan nasehat sakuliah dewan. Kuring glossed leuwih jaringan, tapi éta bagian bener badag tina eta. Di antara perusahaan 200-an éta, kami tiasa ngajalin seueur hubungan sareng jalma-jalma anu kuring tetep dihubungi ayeuna. Sareng jaringan YC ogé, aranjeunna ngajalankeun komunitas internal ieu dimana anjeun tiasa ngahontal ka pendiri YC anu sanés. Éta daptar alamat email sareng nomer telepon. Janten upami kuring hoyong, kuring tiasa pencét pangadeg Dropbox pikeun Airbnb sigana upami kuring ngagaduhan alesan anu saé pikeun ngalakukeunana. Tapi jaringan éta téh sapotong badag tina YC.

Joey Korenman:

Oh, éta bener metot. Sareng aya sababaraha kamiripan. Abdi henteu hoyong ngabandingkeun School of Motion sareng YC, tapi kami gaduh jaringan alumni anu saleresna janten bagian anu paling berharga tina pangalaman nyandak salah sahiji kelas kami. Sareng éta mangrupikeun hal anu teu kaduga dina awalna, kumaha berhargana éta leres-leres tétéla. Jadi nu ngajadikeun loba akal pikiran kuring. Janten hayu urang lebet kana aplikasi anu saleresna, Animator. Sareng sadaya anu ngupingkeun, kami badé ngahubungkeun kana halaman wéb, halaman wéb Haiku, sareng anjeun tiasa ngaunduh. Jigana ayeuna aya percobaan gratis 14 dinten Animator, sareng aya tutorialnadina loka. Seueur inpormasi anu saé.

Joey Korenman:

Janten aya aplikasi animasi sanés anu dikembangkeun, sareng sigana seueur pisan aplikasi anu umumna dikembangkeun, aplikasi wéb sareng ogé. aplikasi asli, pikeun nyobaan sareng ngabantosan desain wéb sareng desain aplikasi janten langkung gampang. Janten naon anu unik ngeunaan Animator?

Zack Brown:

Anu unik ngeunaan Animator nyaéta kanyataan yén éta dimaksudkeun pikeun basis kode. Éta desain gerak anu dikirimkeun ka produksi. Jadi kode mangrupa warga kelas munggaran, duanana di jero aplikasi, kawas file sumber Anjeun, lamun pikir kawas .PSD pikeun Photoshop, kawas éta jenis file sumber. File sumber pikeun Animator nyaéta kode langsung, kode anu tiasa diédit. Janten unggal waktos anjeun mindahkeun hiji hal di panggung atanapi nyetél Tween, éta leres-leres maca sareng nyerat kode sapertos kitu. Sareng éta pisan ngahaja supados gampang pisan pikeun ngahijikeun sareng dasar kode.

Joey Korenman:

Ku kituna hayu atuh naroskeun ieu. Kusabab, jeung kuring teu super canggih ngeunaan ieu, jadi hampura kuring lamun kuring jagal ieu, tapi dina After Effects kami boga Bodymovin, nu nyokot Anjeun After Effects comp, jeung aya loba caveats mun anjeun ngagunakeun eta, tapi sacara umum, Upami anjeun nganggo lapisan bentuk sareng hal-hal sapertos kitu, éta ngaluarkeun file JSON. Ku kituna eta spits kaluar kode. Janten kumaha ieu béda sareng naon anu dilakukeun ku Bodymovin?

Zack Brown:

Hehehehe. Janten kuring émut nalika Lottie kaluar deui dina 2017. Ieuéta nalika urang geus nurun dikonci sarta dimuat dina lintasan design gerak pikeun Haiku, dina waktos Haiku pikeun Mac, ayeuna Haiku Animator. Kuring sok mendakan éta super inspiratif. Kuring boga sababaraha qualms pribadi ngeunaan Saatos Balukar, anjeun bisa bayangkeun, utamana salaku alat pikeun UIs, pikeun software. Bodymovin na Lottie dirancang sabudeureun, diwangun sabudeureun rékayasa sabalikna file sumber Saatos Balukar. Janten gumpalan JSON anu anjeun kaluarkeun tina Bodymovin mangrupikeun bentuk format file After Effects.

Zack Brown:

Sacara pribadi, nalika kuring ngabayangkeun desain gerak pikeun parangkat lunak, sakumaha anu anjeun parantos nyarios, Joey, interaktivitas penting, sapertos kamampuan ngarobih warna atanapi ngabales ketok, atanapi transisi tina kaayaan ieu ka kaayaan éta dina cara anu béda tibatan transisi tina kaayaan éta ka kaayaan anu salajengna. Sanajan éta merlukeun logika. Dina istilah elmu komputer-y, merlukeun turing completeness. Sareng anjeun moal tiasa nampi éta tina After Effects.

Joey Korenman:

Leres.

Zack Brown:

Leres. Janten éta bédana anu paling ageung, nyaéta kuring nyangka hak istimewa sareng beban anu luar biasa pikeun ngawangun alat pangarang ti mimiti, ngagantian After Effects, upami anjeun badé. Éta ngamungkinkeun urang pikeun ngarancang format kode anu dimaksudkeun pikeun kode tinimbang dirobih deui.

Joey Korenman:

Éta katerangan anu saé. Sarta sanggeus dipaké Animator a1 Agustus 2019 ! Ngan klik tautan di handap pikeun ngaku diskon. Ieu dua pilihan anu béda:

  • Pareuman 50% kanggo Rencana Bulanan Tilu Bulan (Simpen $27)
  • Pareuman 25% Taun Kahiji tina rencana Taunan  (Simpen $45)

Ayeuna kapanasaran anjeun geus nincak, hayu urang salamkeun ka Zack...


ZACK BROWN SHOW NOTE

Urang cokot rujukan tina podcast kami sareng tambahkeun tautan ka dieu, ngabantosan anjeun tetep fokus kana pangalaman podcast.

  • Zack Brown
  • Haiku Animator

JALMA/STUDIO

  • Thomas Street
  • Paul Graham

SUMBER

  • Sketsa
  • Y Combinator
  • Inspektur Spacetime
  • Lottie Podcast Episode
  • Unity
  • Issara Willenskomer Podcast Episode
  • Lottie

SEBAGAI

  • Dreamweaver
  • Petasan
  • Goyang

ZACK TRANSKRIP COKLAT

Joey Korenman:

Abdi kedah ngaku. Kuring resep pisan kana naon anu lumangsung dina rohangan UI sareng UX ngeunaan desain gerak. Ieu mangrupikeun daérah anu sigana ngabeledug ku proyék-proyék anu saé, kasempetan padamelan, sareng téknologi énggal anu ngagampangkeun narjamahkeun animasi kana kode. Nanging, dina rékaman ieu taun 2019, éta masih nyeri dina tonggong pikeun nyiptakeun animasi anu gampang dianggo dina cara interaktif dina aplikasi.

Joey Korenman:

Tamu kami ayeuna boga tujuan pikeun ngarobah éta. Zack Brown, sareng enyasaeutik saeutik, éta ngingetkeun kuring loba cara Flash jalan. Jeung éta bener metot. Kuring perhatikeun yén anjeun nganggo terminologi anu sami anu dianggo Flash, Tween sareng panggung sareng hal-hal sapertos kitu. Dina After Effects, aya rupa-rupa kecap anu kami anggo. Tapi anjeun saena dasarna comp a, jeung anjeun boga lapisan, tur anjeun bisa nempatkeun bit kode dina eta lapisan anu ngabalukarkeun aranjeunna meta pikeun hal nu tangtu sarta ngabales perenah, tur anjeun tiasa nyetél hal responsif. Sareng éta saé pisan. Janten naon sababaraha ... meureun anjeun tiasa masihan kami sababaraha conto kumaha anjeun tiasa nganggo alat sapertos Animator pikeun ngalakukeun hal-hal anu sesah dilakukeun ku cara anu sanés.

Zack Brown:

Deui, dumasar kana premis yén tujuan Animator nyaéta pikeun ngajambatan jurang antara desain gerak sareng kode, kakuatan nyata anu anjeun gaduh dina ujung jari anjeun nyaéta kode, sapertos sihir kode. Janten Animator gaduh sababaraha cara anjeun tiasa kode di jero aplikasi. Ieu ogé bédana fundamental versus After Effects. Sareng aya tilu cara anjeun tiasa kode. Kami gaduh konstruksi ieu anu disebut ekspresi, anu mirip pisan sareng ekspresi After Effects kalayan pulas. Éta dasarna fungsi spreadsheet Excel. Ku kituna cara nu sami anjeun tiasa nyandak jumlah sél A3 mun A14 di Excel ngan ku nulis sarua jeung jumlah [inaudible 00:27:15], éta ekspresi saeutik nice, Anjeun bisa ngalakukeun hal nu sarua dina Animator, tapi ngabales, pikeun contona, posisi mouseatawa touch, ketok. Naha éta masuk akal?

Joey Korenman:

Hehehehe, éta asup akal pisan.

Zack Brown:

Oké. Lajeng cara sejen, jadi éta dimaksudkeun pikeun jadi basajan, tapi ogé pohara kuat. Ieu saluran fungsional, programming réaktif. Sareng anjeun tiasa nerapkeun ungkapan éta kana harta naon waé. Janten kuring tiasa ngadamel posisi X tina salah sahiji elemen kuring peta ka beurit X pangguna, sareng kuring tiasa ngadamel peta posisi Y ka beurit Y, sareng kuring tiasa ngadamel skala sapertos fungsi sinus anu nyarios, posisi timeline kuring sareng beurit pangguna Y, lamun éta asup akal. Janten anjeun tiasa ngamimitian nyiptakeun ieu, gampang pisan nyerat, tapi jinis interaksi anu kuat. Sareng pastina, pemberdayaan kréatif sapertos kitu mangrupikeun Flash anu leres-leres unggul, sareng naon anu leungit di dunya, leres?

Joey Korenman:

Hehehehe. Sareng basa naon anu anjeun anggo nalika anjeun coding di jero Animator?

Zack Brown:

JavaScript.

Joey Korenman:

Oh, sampurna. Oké, jadi lamun geus biasa kana After Effects éksprési, kuring yakin bagian tina eta identik. Sareng kuring nganggap yén aya sababaraha hal khusus anu anjeun parantos ngalegaan kana JavaScript pikeun nambihan fitur khusus Animator?

Zack Brown:

Leres pisan.

Joey Korenman:

Kuring nyobian mikirkeun kasus umum pikeun ieu. Janten contona, upami anjeun hoyong paripolah dina halaman wéb anjeun aya karakter, sareng anjeun hoyong murid dina panon nuturkeun anjeun,kawas nuturkeun mouse sabudeureun. Anjeun tiasa moyok éta dina After Effects, teras saurang insinyur kedah terang kumaha ngalakukeun éta. Tapi dina Animator, anjeun tiasa leres-leres ngawangun kabiasaan éta teras nyerahkeun éta?

Zack Brown:

Leres, leres pisan. Mesin rendering anu dianggo di jero Animator mangrupikeun sumber terbuka, mimitina, sareng kadua, éta mesin rendering anu sami anu dianggo nalika anjeun ngajalankeun éta dina wéb, hal anu sami. Jadi mode sawangan sacara harfiah nyaeta mode sawangan. Éta hal anu sami. Sareng éta turun ka file sumber janten kode. Nalika anjeun nyerat éksprési, naon waé anu anjeun tulis bakal dievaluasi dina cara anu sami dina Haiku Animator sapertos anu aya dina situs wéb.

Joey Korenman:

Maksudna, éta salah sahiji Beda pangbadagna antara Animator sareng aplikasi anu sanés sapertos éta sareng After Effects, nyaéta dina After Effects anjeun gaduh kamewahan, anjeun tiasa ngahirupkeun naon waé anu anjeun pikahoyong sareng éta kedah didamel, tapi jalma anu bakal ningali éta henteu. kudu lalajo eta render. Nalika anjeun ngalakukeun éta langsung sapertos anu lumangsung dina wéb atanapi dina aplikasi, éta langsung. Janten kuring panasaran, kumaha anjeun nungkulan éta, ngan sacara umum kuring nebak, sanaos salaku pamekar aplikasi, kumaha anjeun nungkulan kanyataan yén pangguna anjeun panginten hoyong ngahirupkeun hal-hal anu henteu tiasa kajantenan sacara real waktos? Naha éta masalah?

Zack Brown:

Hehehehe. Pasti éta. Naon anu anjeun ciptakeunmun anjeun nyieun hal di Haiku Animator nyaeta software. Leres, naon anu anjeun ciptakeun nyaéta parangkat lunak. Sareng anjeun ngalakukeun éta ngalangkungan kombinasi alat visual, sareng upami anjeun hoyong, kode. Tapi hasil ahir nyaéta software. Ayeuna, nalika anjeun nyiptakeun parangkat lunak, salah sahiji masalah anu anjeun kedah perhatikeun nyaéta kinerja. Sareng upami pamekar nuju sareng nyerat loop anu ngonci disk AIO sapertos komputer beku, éta mangrupikeun hal anu programer kedah terang nalika nguji sareng kedah ngalereskeun supados henteu aya bug perf anu ageung dina parangkat lunakna. Persis sami sareng Haiku Animator. Anjeun tiasa ngahirupkeun 5,000 titik ngan ukur mumbul, sareng anjeun bakal ningali éta ngalambatkeun. Sareng salaku panyipta parangkat lunak, éta tanggung jawab anjeun pikeun mastikeun éta jalanna leres.

Joey Korenman:

Hehehehe. Éta hal anu anjeun teu kedah kantos dipikirkeun. Maksad abdi anjeun kedah mikirkeun éta dina tungtung payun nalika anjeun ngawangun barang-barang di After Effects, naha ieu bakal lami teuing pikeun didamel, tapi saatos didamel, éta parantos réngsé. Éta cara anu béda pisan pikeun mikir. Éta bener-bener pikaresepeun.

Zack Brown:

Ayeuna, saur Lottie, Bodymovin ngagaduhan perhatian anu sami sabab ditafsirkeun dina waktos jalan. Janten upami anjeun gaduh 1.000 titik mantul dina After Effects, éta ogé bakal ngarayap di Bodymovin.

Joey Korenman:

Leres. Hehehehe, éta bener, bener metot. Oké. Janten abdinyoba datang nepi ka conto sejen. Sareng salah sahiji hal anu kuring émut dilakukeun dina Flash nyaéta, anjeun tiasa gaduh kaayaan rollover anu rumit ieu. Siga hayu urang nyarios, janten urang nuju ngalakukeun refresh desain ieu ayeuna di School of Motion, sareng kuring henteu terang iraha épisode ieu bakal kaluar, tapi upami anjeun ngupingkeun éta, éta panginten parantos aya dina situs. , atawa anjeun bakal mimiti ningali eta trickle kaluar. Tapi hayu urang nyebutkeun yén kami redoing cara gambar leutik urang kasampak dina situs urang nu nembongkeun tulisan blog urang jeung tutorials jeung podcast, hal kawas éta.

Joey Korenman:

Jadi hayu urang nyebutkeun yén urang hayang sababaraha kaayaan rollover elaborate, dimana anjeun rollover eta, jeung judul hal tumuwuh saeutik saeutik, lajeng gambar sorangan skala up dina bounds tina gambar leutik, lajeng overlay gradién ieu, opacity eta transforms on. Lajeng mun anjeun mouse leuwih, hal rada ... mun anjeun mouse off, hapunten abdi, hal rada béda kajadian. Cara anu kuring rencanakeun pikeun ngalakukeun ieu nyaéta prototipe dina After Effects, teras pasrahkeun ka pamekar, panginten nganggo sapertos Inspektur Spacetime supados aranjeunna gaduh kurva easing kuring sareng hal-hal sapertos kitu, teras aranjeunna kedah ngalaksanakeun éta. Janten upami kuring mutuskeun ngalakukeun ieu dina Animator, kumaha alur kerjana? Kumaha carana abdi tiasa ngalebetkeun karya seni abdi, sareng aya alat pikeun nyortir ngalakukeun éta sareng ngajantenkeun éta?

ZackCoklat:

Hehehehe, pasti. Ayeuna éta bakal peryogi sababaraha kode pikeun narik naon anu anjeun jelaskeun. Sareng kapercayaan urang kedahna. Pikeun leres-leres kéngingkeun ekspresi anu henteu terbatas anu anjeun pikahoyong, ogé nalika kuring beurit di dieu, ieu kedah kajantenan. Deui, meureun kuring sakola heubeul, meureun kuring ngan curmudgeon, tapi tina sakabeh elmu komputer-y pamahaman kuring jeung naon wae, kuring yakin kode moal leungit.

Joey Korenman:

Abdi satuju sareng anjeun.

Zack Brown:

Sareng cara anjeun tiasa ngalakukeun éta dina Haiku Animator nyaéta anjeun nganggo hiji garis waktos. Ieu pisan kawas Flash. Anjeun nganggo hiji garis waktos, anjeun gaduh daérah anu béda anu gaduh tindakan anu béda. Janten pigura hiji dugi ka 80 tiasa janten beurit anjeun, sareng pigura 81 dugi ka 120 bakal janten beurit anjeun kaluar. Kami nuturkeun modél komponén sareng Haiku Animator, janten naon anu anjeun ciptakeun dibungkus salaku komponén, pangrojong kelas munggaran pikeun React and Angular and View. Mudah-mudahan anjeun nganggo salah sahiji anu anjeun-

Joey Korenman:

Kami nganggo React, nuhun.

Zack Brown:

Oke . Urang ogé ngarojong vanili JavaScript lamun hayang ngan meunang turun ka logam, sakumaha anu kasebut. Janten anjeun bakal nampi komponén React tina Haiku Animator anu masihan anjeun rujukan ka Haiku Animator API dimana anjeun tiasa, ti React land, ucapkeun dina mouse over, dina mouse React over, scrub timeline ti enol dugi ka 80, atanapi buka na maén pigura enol, atawa buka na maén pigura 81. Jadi tehPangembang saleresna mangrupikeun anu narik senar dina ahir dinten, tapi anjeun nyetél panggung, sapertos, nganggo Animator.

Joey Korenman:

Éta saé pisan. Muhun, jadi ieu bisa jadi meunang bener kana weeds dieu, pangdéngé, jadi hapunten, tapi kuring bener panasaran ngeunaan ieu, jeung Abdi hoyong ngartos eta. Janten éta leres pisan pikeun kuring, sareng upami aya anu ngadangukeun parantos nganggo Flash, éta leres-leres anu anjeun laksanakeun. Anjeun bakal nyebutkeun on mouse leuwih, buka pigura 20 sarta maénkeun dugi pigura 40, on mouse cuti atanapi naon éta. Sareng anjeun dasarna ngagaduhan sadaya animasi anjeun dina garis waktos sareng anjeun maén rentang pigura anu béda. Ayeuna, patarosan kuring nyaéta, sareng ku jalan kitu, kuring bakal ngajantenkeun pamekar kuring ngadangukeun ieu, sabab aranjeunna bakal ngartos éta langkung saé tibatan kuring, sareng aranjeunna bakal nampi seueur ide anu saé.

Joey Korenman:

Tapi ayeuna ieu patarosan kuring, Zack. Janten upami kuring ngembangkeun komponén, ieu mangrupikeun gambar leutik sareng kumaha anjeun terang. Sareng kuring nganggap yén pamekaran visual bakal kajantenan dina hal sapertos Sketch. Teras we kukituna mawa éta kana Animator, abdi bakal ngahirupkeun cara Abdi hoyong komponén éta meta jeung mouse over, sarta meureun dina klik hal sejenna kajadian. Tapi teras karya seni saleresna anu dipidangkeun dina gambar leutik éta kedah dinamis, sanés? Ku kituna teu nu masih nyieun masalah ieu kawas, ogé pamekar urang masih kudu teuleum kaÉta kode sareng spaghetti monster éta dipisahkeun supados aranjeunna tiasa nyelapkeun gambar leutik anu leres dina tempat anu leres, atanapi aya ogé cara anu langkung saé pikeun ngalakukeun éta sareng ngagampangkeun prosés éta?

Zack Brown:

Sumuhun. Oké. Janten diajar tina Flash, deui, kuring ngarasa rada sapertos rékaman rusak, tapi salah sahiji hal anu salah Flash nyaéta, éta mangrupikeun kotak hideung, tungtung buntu ieu, dimana sakali anjeun gaduh Flash, sebutkeun halaman wéb anjeun, anjeun 're pernah datang deui kaluar. Éta kotak piksel milik Flash, jeung Allah speed lamun hayang nyobaan ngarobah nanaon di dinya. Anjeun kedah muka Flash IDE sareng ngadamel sababaraha parobihan sareng nambihan sababaraha logika, sareng wrangle sareng API na pikeun ngalirkeun data, sareng sajabana, sareng éta kacau pisan.

Zack Brown:

Dina Haiku Animator, urang gaduh anggapan ngeunaan pananda tempat dimana nalika ngarang, anjeun tiasa nyarios, ieu mangrupikeun sagi opat di jero sagi opat super ieu anu kuring ciptakeun dina Haiku Animator. Sagi opat ieu milik pamekar. Abdi henteu terang naon anu badé lebet ka dieu, tapi kuring tiasa ngahirupkeunana. Éta nu disebut transformasi affine, skala, posisi, muterkeun, skew, sakabéh éta transforms. Anjeun tiasa ngahirupkeun pananda tempat éta teras dina waktos kode, pamekar tiasa ngalebetkeun eusi. Janten dina React, éta bakal katingali sapertos komponén anak, atanapi dina HTML, éta mangrupikeun hal di jero div. Éta solusi kami pikeun eusi dinamis di jero Haiku Animator, sareng naon anu katingali ku pamekar tungtunglangsung React. Henteu aya jungkir balik atanapi anu khusus. Anjeun ngan ukur ngalebetkeun kontén salaku anak tina komponén Haiku React.

Joey Korenman:

Éta saé pisan. Oké. Janten salah sahiji hal anu kuring maca dina jinis dokuméntasi sareng barang-barang, nyaéta ... sabab kami parantos ngalaksanakeun sakedik ieu dina halaman wéb kami. Simkuring gaduh animasi anu leuwih atawa kirang ngan dipanggang di. Tapi lajeng urang boga animasi saeutik tangtu mun anjeun hover leuwih hal anu urang jenis prototyped, sarta hal kawas éta. Sareng masalahna nyaéta upami urang mutuskeun ngarobih éta, éta mangrupikeun masalah anu ageung pikeun uih deui sareng ngalereskeunana. Teu kawas copy paste, ayeuna geus diropéa. Jadi kumaha anjeun nungkulan, sarta kuring henteu weruh lamun Kuring ngagunakeun istilah ieu leres, tapi kontrol versi, mun anjeun boga versi anyar tina mouse leuwih kaayaan gambar leutik urang? Naha aya cara anu langkung saderhana pikeun nerapkeun éta ayeuna anjeun parantos mendakan?

Zack Brown:

Leres, leres. Ieu mangrupikeun salah sahiji inti ... deui, uih deui ka dinten agénsi kuring, sareng ningali kumaha sesah henteu ngan ukur nerapkeun desain pikeun kode, tapi teras-terasan. Éta meureun dimana 80% usaha mangrupa, iterating. Ayeuna anjeun parantos ngalaksanakeun desain ieu salaku kode, ayeuna aya desain énggal anu saleresna ngarobih sarat sakedik, sareng ayeuna naon waé anu didamel dina kode kedah didamel deui. Ayeuna sapotong séjén ieu rusak. Sadaya masalah anu kaluar tinaiteration, éta tempat ngarengsekeun workflow, abdi nebak éta grail suci pikeun ngarengsekeun workflow.

Zack Brown:

Sareng urang nyandak eta kalawan Haiku Animator deui, dumasar kana modél komponén, Anjeun komponén anu versioned. Janten upami anjeun nyiptakeun proyék di Haiku Animator sareng anjeun nyorong tombol nyebarkeun, anjeun nampi versi 0.0.1 komponén éta, sareng anjeun tiasa ngagentos éta kana dasar kode. Kami ngahijikeun sareng NPM pikeun dunya wéb sadunya, pikeun pamekar naon waé di dunya wéb janten akrab sareng éta. Janten anjeun leres-leres masang NPM éta komponén Haiku Animator dina versi 0.0.1, sareng anjeun badé angkat.

Zack Brown:

Ayeuna, animator, desainer gerak, atanapi pamekar, Saha waé anu nganggo Haiku Animator, tiasa uih deui sareng ngadamel parobihan anu salajengna, ngapdet aset tina Sketsa, contona, anu bakal ngaliwat ka Haiku Animator, sareng nyebarkeun deui, sareng ayeuna anjeun gaduh versi 0.0.2. Sareng sadaya anu anjeun laksanakeun tina kode nyaéta ngapdet komponén éta kana versi 0.0.2 sareng anjeun hirup. Éta pisan. Ku kituna éta kumaha urang direngsekeun éta masalah iteration, nyaeta ku ngandelkeun kombinasi kontrol versi sarta manajer pakét. Éta sadayana cukup téknis, sareng cara anu saé pikeun nyimpulkeun éta, urang ngahijikeun sareng alat pangembang cara anu sami sareng urang ngahijikeun sareng alat desain, sapertos Sketch sareng Photoshop, Illustrator.

Joey Korenman:

Janten upami kuring ngartos leres ieu, hartosna éta tiasa dianggo sapertos Flash, éta jalannaÉta nami asli na, nyaéta CEO sareng pangadeg hiji ngamimitian anu disebut Haiku. Saatos ngalangkungan program Y Combinator legendaris, Zack sareng timnya ngaluncurkeun "Animator," aplikasi anu ngagaduhan tujuan sederhana pikeun ngahijikeun desain sareng kode. Barang anu lumayan luhur, tapi kuring yakin yén Haiku leres-leres kana hiji hal.

Joey Korenman:

Tim Haiku parantos nyiptakeun cara pikeun nyebarkeun animasi anu tiasa ngarengsekeun salah sahiji masalah anu paling rumit. desainer gerak nyanghareupan nalika dianggo dina aplikasi. Animator, anu ku kuring dimainkeun sareng dipikacinta, hayu urang ngahirupkeun sareng kode dina hiji antarmuka anu teras tiasa nyebarkeun animasi éta dina cara anu saé sareng fleksibel pikeun pamekar. Dina wawancara ieu, urang lebet kana kumaha animator jalanna sareng naon anu ngajadikeun éta béda sareng langkung éfisién dina rohangan UI tibatan saurna, After Effects.

Joey Korenman:

Urang ogé ngobrolkeun kumaha Zack ngamimitian perusahaan sareng ngawangun aplikasi animasi énggal-énggal ti mimiti. Ieu paguneman anu saé pisan sareng kuring pikir éta bakal masihan anjeun puncak nyolong ngeunaan jinis alat anu bakal dianggo ku desainer gerak dina waktos anu caket pisan.

Joey Korenman:

Zack , éta Heboh mun anjeun dina podcast School of Motion. Hatur nuhun pisan kanggo waktosna sareng kuring henteu sabar pikeun milih uteuk anjeun.

Zack Brown:

Hehehehe, kuring resep ka dieu, Joey. Hatur nuhun tos gaduh abdi.

Joey Korenman:

Hehehehe, teu masalah. Muhun, kahijileuwih gampang pikeun sabenerna nerapkeun sarta ngamutahirkeun sarta ngagunakeun sakuliah sakabéh aplikasi tur hiji sakabéh platform. Janten kuring saleresna bungah pisan pikeun maén deui, sabab ieu leres-leres, sapertos anu kuring nyarios, waktos anu sampurna pikeun urang. Sareng kuring bungah pisan, kuring ngarep-arep seueur anu ngupingkeun ieu go download demo 14 dinten. Upami anjeun ngalakukeun padamelan sapertos kieu, cobian aplikasi ieu, sabab éta bakal saé, saé pisan pikeun ningali naon anu tiasa didamel ku sababaraha desainer gerak anu saé. Sareng abdi bade naroskeun perkawis ieu, margi abdi parantos seueur ngobrol sapertos kieu.

Joey Korenman:

Meh dua dunya ieu mimiti ngahiji. Anjeun gaduh desain gerak sareng anjeun gaduh UX. Sareng aranjeunna nuju silih pindah, sareng ayeuna parantos aya tumpang tindihna dimana alat-alat sapertos kieu mimiti janten giat. Sareng anjeun sigana unik sabab anjeun sumping ka ieu ti simpang. Anjeun prototyping sarta ngalaksanakeun hal ieu pikeun klien. Janten anjeun animator? Kumaha anjeun terang naon alat pikeun nempatkeun kana Animator? Kusabab kuring muka éta kahiji waktos terang nanaon ngeunaan eta, sarta aya pigura konci na aya redaktur grafik, kawas editor kurva animasi, nu sabenerna bener nice ngagunakeun, sarta sistem compositing dumasar lapisan, sarta eta kabeh ngan jenis. dijieun akal pikiran. Janten kumaha anjeun mutuskeun fitur naon anu badé dipasang?

Zack Brown:

Jadi kuring bakal nyarios yén kuring animator kukaayaan.

Joey Korenman:

Abdi resep éta.

Zack Brown:

Tangtu sanés anu saé. Kuring ngagaduhan sababaraha pangalaman nalika kuring ngora, éta kecap F deui, Flash. Sareng ideu pigura konci sareng garis waktos, sakali [inaudible 00:42:03] ku my-

Zack Brown:

Ideu keyframes sareng timeline. Anjeun terang, sakali [inaudible 00:42:04] dina pikiran ngora kuring geus jenis nyangkut jeung kuring kana pikiran sawawa kuring. Jawaban pondokna nyaéta pangguna, pangguna kami mangrupikeun ahli sareng anjeun terang, éta hikmah umum dina dunya nyiptakeun produk pikeun terang naon anu dipikahoyong ku pangguna anjeun sareng anjeun ngawangun éta. Janten, redaktur Curve contona, kami nembé ngaluncurkeun éta. Produkna parantos aya ti saprak 2006 sareng 2019 nalika kami tungtungna ngaluncurkeun redaktur Curve saatos nyuhunkeun, nyuhunkeun, dipénta ku pangguna. Masking mangrupikeun fitur anu ayeuna urang henteu ngadukung anu dijantenkeun ku jalma-jalma. Janten, kuring ngarepkeun éta bakal datang sateuacan lami teuing.

Zack Brown:

Ku kituna urang mendakanana. Para ahli nyarioskeun ka kami sareng kami nyandak ti dinya.

Joey Korenman:

Leres sabab maksud kuring aya seueur hal anu khusus dilakukeun ku pangguna After Effects unggal waktos. Anjeun terang, ngagunakeun hiji lapisan salaku masker pikeun anu sanés, gaduh jalur anu ngagaduhan garis anu ngahirupkeun sapanjang jalan. Ngalakukeun hal-hal sapertos kitu ... Terus terang, bahkan alat-alat dina After Effects pikeun ngalakukeun sababaraha hal éta parantos lami pisan sareng tiasa nganggo sakedikngamutahirkeun, sareng rada rapih ningali aya kasempetan di dieu pikeun ngobrol sareng pangguna sareng terang naon anu bakal ngagampangkeun hirupna.

Joey Korenman:

Jadi naon jinisna. pamaké anjeun manggihan nu sabenerna gawé bareng Animator? Naha éta désainer gerak, atanapi éta désainer UX anu peryogi animasi?

Zack Brown:

Danana. Kitu deui, sapertos Sketch langkung gampang dideukeutan tibatan Photoshop atanapi Illustrator, kami mendakan yén aya sabagéan ageung pangguna anu diajar desain gerak, panginten nganggo paradigma timeline keyframe pikeun kahiji kalina, sareng aranjeunna nuju balapan. kalawan Haiku Animator. Nalika kami parantos ngembangkeun aplikasi, kami ogé parantos ngembangkeun dokuméntasi sapertos pusat pitulung, sagala rupa barang. Janten urang ngagaduhan tutorial. Janten kami ngagaduhan sumber daya anu saé pikeun jalma anu ngamimitian ngalakukeun desain gerak pikeun kahiji kalina.

Zack Brown:

Kami ogé ningali desainer gerak anu berpengalaman anu ngahargaan kana nilai prop pikeun produksi. Atawa prop nilai tina, "Tambahkeun saeutik saeutik kode." Hal anu anjeun teu tiasa laksanakeun dina After Effects. Anjeun terang, dasarna mangrupikeun tempat anu unik di pasar pikeun solusi ieu, sareng sadayana balik deui ka vakum Flash.

Zack Brown:

Janten hehehehe, teras bagian anu sanés pikeun patarosan éta nyaéta perusahaan tina sagala bentuk sareng ukuran ti Fortune 5s dugi ka agénsi sareng freelancer, sareng ogé urang ningali pamekar ngagunakeun éta.ogé. Atanapi sapertos tungtung hareup anu unicorny ... Unicorns pasti bakal ngamangpaatkeun éta kusabab aranjeunna gaduh fitur desain anu lengkep sareng fitur kode anu lengkep, tapi leres-leres sadayana belang anu nganggo éta.

Joey Korenman:

Abdi bade naroskeun ka anjeun sabab seueur pamiarsa sareng murid urang, aranjeunna desainer gerak heula, sareng sababaraha diantarana nembé ngamimitian ngerjakeun After Effects Expressions. Janten kuring ngan ukur panasaran upami anjeun parantos ngartos kumaha kurva diajar pikeun animator pikeun ngamimitian nganggo Animator, Haiku Animator. Abdi badé ngucapkeun Haiku Animator supados langkung gampil.

Zack Brown:

Muhun, nuhun.

Joey Korenman:

Hehehehe, kumaha kurva diajar pikeun animator anu ngagunakeunana. Sabaraha kode anu aranjeunna kedah diajar? Sareng kedah kumaha ekspektasi kurva diajar?

Zack Brown:

Oke, kuring nyarankeun ngamimitian éksprési. Upami anjeun kantos nganggo Excel atanapi Google Sheets, maka anjeun panginten parantos nganggo rumus spreadsheet, sareng anjeun siap pikeun Haiku Animator. Kawas nyieun hiji hal nurutan beurit téh sagampil nyokot jumlah dina Excel, sarta éta pisan satisfying mun anjeun ngalakukeun eta. Kacida, sigana mah, éta kecap anu bieu, tapi éta pohara kuat pikeun ningali éta kajadian.

Zack Brown:

Abdi bakal nyarios upami anjeun mangrupikeun desainer gerak anu badé ngamimitian nganggo kode, ieu alat sampurna pikeunanjeun. Ieu sakitu legana naha urang ngawangun eta. Deui, pikeun sasak éta gap antara desain gerak jeung kode. Janten antara sumber daya anu sayogi sareng pangropéa kode anu diwangun kana aplikasi, éta kedah janten cara anu saé pikeun ngamimitian.

Joey Korenman:

Éta saé. Ku kituna hayu urang ngobrol ngeunaan nurun tina kaayaan umum tina hal ieu nu urang sebut ... Kuring malah teu nyaho naon disebutna. Persimpangan UX sareng desain gerak. Janten anjeun terang, Animator ngarengsekeun sababaraha titik nyeri anu parantos mangtaun-taun. Abdi émut pisan kana épisode podcast ieu, saleresna, urang ngagaduhan Salih sareng Brandon ti Airbnb anu mangrupikeun dua jalma di tim anu ngawangun  Lottie.

Zack Brown:

Hehehehe, kuring resep éta guys.

Joey Korenman:

Hehehehe, aranjeunna hebat pisan. Sareng anjeun terang, aranjeunna leres-leres penting pikeun kuring ngartos naon titik nyeri ieu, sareng panginten Lottie sumping sareng badé ngabéréskeun éta sadayana, tapi unggal waktos kuring ngobrol sareng batur aranjeunna sapertos, "Henteu, aranjeunna ' teu acan direngsekeun." Masih nyeri pisan nyandak desain gerak sareng ngarobih éta janten kode.

Joey Korenman:

Jeung cara animator ngungkulan éta sigana bener-bener pinter, sareng kuring yakin anjeun resep kana hiji hal, tapi naon sababaraha hal sejenna nu kudu kajawab sangkan prosés ieu bener streamlined tur efisien? Anjeun terang, maksud kuring sabab éta ngan ukur dunya coding sareng dunya desain gerak, aranjeunnageulis misah ayeuna. Sareng sapertos Animator, anjeun terang, anjeun masih peryogi pamekar pikeun ngalaksanakeun ieu, leres? Siga, anjeun tiasa ngawangun komponén, tapi éta jalma anu sami bakal tiasa ngalaksanakeun komponén éta? Éta malah hal urang kudu Tujuan di? Janten kuring panasaran naon anu anjeun pikahoyong ngeunaan naon waé hal-hal sanés anu tiasa robih dina sababaraha taun ka hareup pikeun ngajantenkeun prosés ieu langkung saé?

Zack Brown:

Upami urang ngobrol. skala sababaraha taun, Jigana loba jalma meunang bray up on naon anu bakal désainer ngalakukeun dina x taun, atawa naon anu bakal pamekar lakukeun dina x taun. Dumasar ieu, kuring nyangka anggapan anu salah yén éta bakal hartosna sami dina sababaraha taun. Pangembang éta hartosna hal anu sami dinten ayeuna anu dilakukeun dina sababaraha taun, leres?

Zack Brown:

Ieu sababna kuring resep mikiran ... Kuring disebutkeun tadi sababaraha menit ka tukang naon anu anjeun lakukeun ku Haiku Animator nyieun software. Kami henteu paduli upami anjeun pamekar. Kami henteu paduli upami anjeun desainer. Anjeun nyieun software. Éta pisan. Janten kuring nyarios yén dina sababaraha taun, éta henteu masalah naon judul anjeun, tapi urang sadayana bakal ngawangun parangkat lunak babarengan. Sareng kuring resep nunjuk ka mana ieu parantos kajantenan dina industri paralel, dina industri kaulinan.

Zack Brown:

Saha waé anu ngagunakeun Unity 3D, saha waé anu geus kalibet dina ékosistem éta, anjeunkaulinan wangunan. Anjeun nuju ngawangun software. Sareng upami anjeun nganggo Photoshop pikeun nyiptakeun tékstur anjeun, anu bakal dipetakeun kana modél 3D di jero Unity, anjeun leres-leres nyiptakeun parangkat lunak ngalangkungan Photoshop. Anjeun tiasa uih deui sareng ngarobih tékstur éta sareng éta ngalir ka parangkat lunak, teras dikirimkeun ka produksi.

Zack Brown:

Unity parantos ngarengsekeun masalah alur kerja antara para desainer gerak ... Aya timeline sareng sistem animasi keyframe dina Unity, éditor tékstur, riggers, modél 3D, sareng pamekar. Éta sadayana ngawangun hal anu sami dina Unity. Janten éta anu kuring pikir nyaéta masa depan nyiptakeun parangkat lunak sapertos kitu, sareng éta anu urang pikahoyong. Éta tempat kaulinan urang, éta dunya urang nyaéta dunya nyiptakeun software. Henteu janten masalah naon judul anjeun atanapi naon latar tukang anjeun, tapi upami urang leres-leres ngalaksanakeun tugas ku ngahijikeun alur kerja, urang sadayana bakal ngawangun parangkat lunak babarengan.

Joey Korenman:

Éta jenis geulis. Abdi rada seuri, lalaki. Éta leres-leres eloquent.

Joey Korenman:

Oké, kuring ngobrol sareng Issara Willenskomer ngeunaan ieu ti UX in Motion, sareng ayeuna éta masih liar barat dina hal alat anu dianggo ku jalma pikeun ngaéksekusi animasi dina aplikasi. Sareng aya sajuta cara anu béda pikeun ngalakukeunana, sareng modél anu dianggo ku Animator tiasa ngarengsekeun éta, tapi naha aya jinis standarisasi anu kajantenan? Sareng deui, ieu sanés milik kuringkaahlian, tapi tina naon atuh ngarti, Animator ieu najong kaluar kode anu ... éta dasarna kawas komponén réaksi nu, hampura kuring lamun kuring salah, tapi dumasar kana javascript, katuhu? Ieu sababaraha jenis rasa, nya? Janten, éta bakal tiasa dianggo sareng ... sareng upami anjeun ngawangun halaman wéb atanapi aplikasi dumasar kana éta, éta saé, tapi kumaha upami anjeun henteu? Kumaha upami anjeun nganggo ... Abdi ngarepkeun kuring ngagaduhan rolodex basa coding. Kumaha upami anjeun nganggo Ruby atanapi anu sapertos kitu? Naha kedah aya deui standarisasi anu kuring nyangka naon anu kuring pikahoyong? Gemblengna, pikeun masalah ieu dileungitkeun, éta masih masalah?

Zack Brown:

Leres pisan, nuhun. Nalika urang ngobrol ngeunaan alur kerja, standarisasi mangrupikeun tempatna. Éta sababna Unity parantos suksés sabab parantos janten standar. Satengah tina sagala kaulinan, satengah. Sacara harfiah hiji dina dua kaulinan pikeun platform naon anu diwangun dina Unity. Sabagéan gedé sabab geus kahontal jadi standar.

Zack Brown:

Aya sababaraha standar ngagabung. Lottie mangrupikeun conto anu saé dina rohangan desain gerak. Sareng anjeun terang, kuring nyarioskeun sababaraha qualms ngeunaan inti téknis Lottie, nyaéta yén éta jalan anu lungkawing pisan pikeun ngajantenkeun Lottie interaktif. Hese pisan. Ngan kusabab format inti na.

Zack Brown:

Anu tos dilakukeun ku Lottie anu saé nyaéta ngahontal mindshare sarengjanten standar sareng éta mangrupikeun léngkah anu ageung pikeun desain gerak salaku komunitas, salaku dunya. Janten Lottie parantos janten standar. Urang luncat kana karéta nu geulis gancang. Haiku Animator mangrupikeun alat anu pangheulana di pasar, di luar After Effects, pikeun ngadukung ékspor Lottie. Kitu deui, dina misi kami pikeun ngahijikeun alur kerja, kami parantos sadar kana éta, tina standar anu muncul.

Zack Brown:

Tapi maksud kuring, urang tiasa mikirkeun animasi sabab aya hubunganana sareng parangkat lunak dina sababaraha cara anu béda. Salah sahijina nyaéta kotak leutik atom, kawas .gif atawa video atawa animasi Bodymovin alus pikeun spinner loading atawa unsur jero tombol nu mun anjeun klik dina tombol, dimimitian deui, kawas spinner loading. Ieu dimimitian spinning.

Joey Korenman:

Leres.

Zack Brown:

Anjeun terang, anjeun muka aplikasi Airbnb, bumi Lottie. Anjeun muka aplikasi Airbnb, sarta anjeun meunang tarian saeutik nice ieu, [inaudible 00:52:57] logo Airbnb. Saeutik saeutik kawas ... Jadi éta salah sahiji manifestasi gerak dina software. Nu hiji deui skala nu leuwih gede kawas animasi perenah.

Joey Korenman:

Leres.

Zack Brown:

Éta standarisasi teu acan kajantenan. Éta murni liar kulon. Kawas saluareun wild west. Hiji-hijina cara anjeun ngalakukeun animasi sapertos kitu nyaéta kalayan kode, ayeuna, sareng seueur rohangan masalah nyaéta kanyataan yén ngalaksanakeun animasi perenah dina wéb pisan.béda ti ngalakukeun pikeun ios. Éta béda pisan sareng ngalakukeunana pikeun Android. Éta béda pisan sareng ngalakukeun éta pikeun TV pinter Samsung. Janten éta masalah anu ageung, awon, sareng nangtang.

Zack Brown:

Tanpa masihan seueur teuing, tim Haiku nuju damel di rohangan ieu. Tapi kuring pikir éta pantes pikeun ngaidentipikasi bédana antara dua jinis gerak dina parangkat lunak éta.

Joey Korenman:

Leres. Sareng kuring naroskeun ka anjeun sabab ieu saleresna nembe sumping isuk-isuk ieu, sareng kuring nyangka masih seueur kabingungan ngeunaan naon Lottie. Jigana di sisi dev, éta pisan leuwih dipikaharti ti di sisi design gerak. Batur di saluran Slack kami isuk ieu nyarios, "Oh, tingali, Airbnb ngadamel aplikasi animasi." Sareng kuring sapertos henteu, éta sanés naon éta.

Joey Korenman:

Janten tina anu kuring ngartos, Lottie dasarna narjamahkeun naon Bodymovin sareng ogé animator naon. Anjeun terang, kodeu anu dikaluarkeun, éta narjamahkeun kana ios atanapi Android. Basa-basa éta. Janten sapertos anu leres-leres kedah kajantenan pikeun ngajantenkeun universal sareng gampang nyaéta yén kuring kedah aya penerjemah universal, anjeun terang, sareng mangrupikeun hal anu anjeun pikir perusahaan sapertos Haiku kedah dilaksanakeun, atanapi éta Éta peryogi usaha anu langkung universal ti Apple sareng Google sareng Samsung pikeun nyiptakeun cara pikeun aya kana format universal?

Zack Brown:

Ké heula,hal kuring kudu nanya ka anjeun ngeunaan ngaran. Kuring naroskeun ka kru Sakola Motion, saur kuring, "Héy, Zack Brown ti Haiku badé sumping," sareng sadayana anu aranjeunna hoyong terang nyaéta kumaha janten bintang musik nagara, janten anjeun terang pisan? Naha anjeun terang saha Zac Brown Band éta?

Zack Brown:

Hehehehe, éta seueur padamelan bulan salaku musisi anu kasohor nalika ngamimitian ngamimitian, tapi kumaha waé kuring ngaliwat sareng ngajantenkeun éta. kabéh kajadian.

Joey Korenman:

Éta chestnut heubeul.

Zack Brown:

Tapi memang, éta supir treuk derek anu mimiti clued kuring kana Zac Brown sarta anjeunna kawas Abdi peryogi tanda tangan anjeun sarta oh, Zac Brown, abdi peryogi tanda tangan anjeun. Kuring dijieun, Jigana mah 20 dina waktu éta, Kuring geus dijieun 20 taun hirup abdi Zack Brown sarta saterusna, anjeun salawasna kudu klik "Naha anjeun hartosna Zac Brown Band?"

Joey Korenman:

Leres, nuhun. Ku teu sangka anjeunna boga K, jadi Anjeun ngan bisa nyebutkeun Abdi Zack kalawan K. Éta gé jelas hal up. Duh, lucu pisan. Sadayana anu ngadangukeun ieu, kuring yakin aranjeunna henteu acan terang pisan sareng perusahaan anjeun sareng aplikasi anjeun, tapi bakal.

Joey Korenman:

Tapi kuring hoyong ngamimitian ku ngan ukur. diajar saeutik saeutik ngeunaan anjeun. Naon latar tukang anjeun sareng kumaha anjeun tungtungna ngamimitian perusahaan parangkat lunak anu ngawangun aplikasi animasi?

Zack Brown:

Teu kunanaon, janten kuring ngamimitian kahirupan kreatif dina desain cetak sareng jinis fotografi. tinadeui, urang nuju dipake dina hal anu luhur rusiah, shrouded di misteri, ayeuna, tapi urang bakal announcing eta geura-giru. Éta nuju maén dina standarisasi lintas platform.

Joey Korenman:

Leres.

Zack Brown:

Anjeun terang, sacara pribadi salaku startup scrappy dude, Ku teu sangka ieu perlu kaluar tina Google, tapi pastina eta kudu diadopsi ku Google di sawatara titik jadi standar.

Zack Brown:

Salajengna deui, skenario kasuksésan, sakumaha anu kuring tingali, nyaéta 50% pangsa pasar. Éta teu kunanaon. Éta anu dilakukeun ku Unity. Aranjeunna nuju teu hurting. Anjeun moal kantos nyenangkeun sadayana. Utamana dina disiplin téknis ... [inaudible 00:55:47] éta dina produk kacilakaan tina disiplin teknis coders rupa-rupa basa jeung désainer ngagunakeun rupa parabot desain, sarta désainer gerak rupa stripes. Anjeun kalikeun sakabeh kombinasi béda éta, anjeun pernah bade mangga dulur kalawan hiji standar atawa hiji alat, tur éta sakabéhna rupa. Tapi, hal anu tiasa ngagentos sareng ngarengsekeun masalah, sapertos masalah dasar jalma anu cukup, pikeun ngamimitian janten standar dina cara Unity, kuring nyangka éta tiasa waé.

Zack Brown:

Sareng kuring henteu nyangka yén éta kedah kaluar tina salah sahiji perusahaan ageung éta. Anjeun terang, bias, tapi pribadi.

Joey Korenman:

Hehehehe. Geulis pisan. Hehehehe, Abdi bungah pikeun anjeun unveil tur naek panggung dina turtleneck hideung natunjukkeun ka sadayana naon fitur éta.

Joey Korenman:

Janten kuring ngagaduhan sababaraha patarosan deui pikeun anjeun, sareng anjeun cicing di San Fransisco, anjeun dina gelembung téknologi. Anjeun ngalakukeun hal YC sareng sadayana.

Zack Brown:

Pasti.

Joey Korenman:

Sareng kuring ngabayangkeun éta. Anjeun nuju ngahubungi sareng seueur perusahaan téknologi. Kuring yakin anjeun terang jalma anu ageung, naon akronim anu dianggo ku jalma ayeuna? FAANG.

Zack Brown:

FAANG, nuhun.

Joey Korenman:

... sareng dua As, nuhun, nuhun. Anjeun terang, Facebook, Apple ...

Zack Brown:

Amazon.

Joey Korenman:

Saleresna henteu ngantosan, éta Facebook, Apple, hehehehe katuhu Amazon, lajeng Netflix jeung Google.

Zack Brown:

Jigana Microsoft milik di dinya teuing, tapi sabenerna mah Silicon Valley téh [inaudible 00:57:00].

Joey Korenman:

Leres. Ieu kawas kids cool kaasup ... Tapi atoh, jadi anjeun terang, sarta pamaké anjeun duanana désainer gerak jeung désainer UX jeung sagalana di antara. Janten kuring panasaran ngan tina sudut pandang anjeun, kumaha prospek padamelan di basisir kulon pikeun animator anu terang kode sakedik atanapi coder anu terang animasi sakedik? Ti tempat kuring linggih di Florida, sigana éta booming, tapi kuring henteu aya, sareng kuring panasaran naon anu anjeun tingali dina taneuh.

Zack Brown:

Kanggo yakin, Kuring ningali booming ogé. Pamanggih UX salaku differentiator geus bener ...éta dina nyoko mainstream pinuh dina titik ieu nu nyebrang kurva chasm, lamun nyaho hiji. Atoh, éta ... dulur sareng indung sareng akina sadar yén ngabédakeun UX ngajantenkeun bédana pikeun prospek kasuksésan perusahaan. Jeung gerak geus ngadegkeun salaku bagian konci éta.

Zack Brown:

Sareng deui ka Lottie sareng anu sanésna, ngajantenkeun éta tiasa diaksés ... janten gampang pisan pikeun ngahapus animasi anu pikaresepeun kana aplikasi anjeun, éta masalah anu ageung. Janten hehehehe, desainer gerak anu ... Desainer gerak pikeun kode, desainer gerak pikeun dasar kode, desainer gerak pikeun parangkat lunak. Nu pasti, urang ningali nu booming di dieu.

Joey Korenman:

Éta Heboh. Nya, naha urang henteu mungkas ku ieu? Animator parantos mangrupikeun aplikasi anu saé pisan sareng leres-leres kuat, sareng deui kami bakal ngahubungkeun éta. Abdi nyarankeun sadayana maén sareng éta. Naha anjeun ngalakukeun padamelan sapertos ayeuna atanapi henteu, aya kasempetan anu hadé pikeun anjeun ka hareup sabab kuring nyangka Zack leres, sadayana sareng indungna hoyong animasi dina halaman wéb ayeuna sareng dina aplikasina.

Joey Korenman:

Upami anjeun ngabandingkeun Animator sareng After Effects, anu kuring pikir umurna 25 atanapi 26 taun, écés seueur fitur anu henteu acan dipiboga ku Animator, sareng teu aya. Kaméra 3D atanapi naon waé anu sapertos kitu dina waktos ieu.

Zack Brown:

Teu aya kaméra.

Joey Korenman:

Naon visi anjeun pikeun masa depan étaapp sareng terus terang perusahaan ogé?

Zack Brown:

Ambisi urang ampir konyol ... Anjeun terang, urang kedah moto pikeun béntang. Bagian tina éta nyaéta Silicon Valley sareng VC dirojong. Bagian tina éta ngan ukur ambisi buta. Pribadi, sapertos dina tingkat eksistensial, tapi kuring ningali kasempetan pikeun ngahijikeun desain sareng kode. Leres? Sarerea di tim urang ngalakukeun. Pikeun ngahijikeun éta workflows pikeun, contona, ngahontal éta pangsa pasar nu Unity boga.

Zack Brown:

Jadi misi parusahaan urang téh "Pikeun revolutionize software kreasi ku ngahijikeun desain jeung kode". Éta némbak gedé pikeun misi ngamimitian, sareng cara urang angkat ka pasar kalayan produk munggaran urang nyaéta ngeusian kekosongan éta Flash ditinggalkeun tina desain gerak anu dikirimkeun ka produksi. Sareng éta nyertakeun yén kasus pamakean gerak munggaran dina parangkat lunak anu kuring nyarios. Éta jinis animasi atom. Sareng Animator ngamungkinkeun anjeun ngalangkungan éta kalayan hal-hal sapertos pananda tempat sareng kode API.

Zack Brown:

Tapi aya deui masalah, sarta kami ningali tren metot muncul kawas sistem desain anu tujuan nyatakeun nyaéta pikeun systematize desain dina cara nu sarua kode anu. Gagasan sapertos kontrol versi, ideu sapertos komponén, sareng éta leres-leres ngamimitian nyandak mindshare. Utamana dina perusahaan dimana kabutuhan konsistensi hébat parantos nyababkeun jutaan sareng jutaan sareng jutaan dolar dituang kana nyiptakeun sistem desain. Kitu meureunhiji bagian tina teka. Éta mangrupikeun hal anu urang jaga.

Zack Brown:

Sistem desain anu teu dipaliré nyaéta panyebaran anu sami tina desain ka kode. Ayeuna anjeun tiasa nyiptakeun sistem desain dina alat desain anjeun, sareng anjeun gaduh ide abstrak anu éndah ieu, "Di dieu tipografi kuring," sareng, "Di dieu warna kuring." Tapi anjeun masih kudu balik lajeng nerapkeun éta ku leungeun dina kode. Ieu diwariskeun sarua ... spasi nu diwariskeun masalah anu sarua yén handoff desain tradisional tuh. Janten éta masalah anu urang jaga.

Zack Brown:

Leres, naha éta ngajawab patarosan anjeun?

Joey Korenman:

Hehehehe, Jigana ngahijikeun, desain, jeung kode. Ieu tugas anu cukup ambisius, tapi kuring henteu terang. Ngan tina sababaraha interaksi anu kuring kantos sareng anjeun, Zack, kuring nyangka anjeun sareng tim parantos dugi ka éta. Sareng kuring ngarep pisan ningali kamana ieu.

Zack Brown:

Hatur nuhun, Joey. Hatur nuhun pisan kanggo gaduh abdi dinten ieu.

Joey Korenman:

Pariksa Animator di Haiku.ai. Abdi hoyong pisan hatur nuhun ka Zack pikeun sumping sareng nyarios pisan ngeunaan tantangan anu disanghareupan ku animator sareng pamekar nalika ngalaksanakeun animasi dina aplikasi. Animator masih cukup anyar, tapi éta geus mangrupa aplikasi geulis nice ngagunakeun, sarta kuring nyangka yén éta boga shot nyata dina ngarobah cara urang ngahirupkeun hal anu bakal mungkas nepi ka interaktif dina ramatloka atawa aplikasi mobile atawa nanaon sejenna.

Joey Korenman:

Pastikeun anjeun ngalanggan podcast ieu supados anjeun tiasa tetep énggal ngeunaan warta industri sareng alat énggal sapertos Animator. Sareng upami anjeun hoyong langkung seueur pangaweruh, angkat ka SchoolofMotion.com pikeun nyandak akun gratis sareng nampi buletin Motion Mondays kami. Ieu mangrupikeun email pondok anu tiasa anjeun baca dina kopi Dunkin' Donuts biasa anu langkung ageung, sareng éta bakal ngajantenkeun anjeun terang ngeunaan naon waé anu anjeun kedah terang dina desain gerak.

Joey Korenman:

Sareng éta pikeun épisode ieu. Abdi ngarep pisan anjeun ngali éta, sareng katengtreman.

ngagunakeun Illustrator, Photoshop, kawas éta suite pakakas. Kuring geus salawasna geus kana komputer saprak kuring bener ngora jeung bari Ngalanglang média ieu, kuring manggihan alat ieu disebut Flash, nu sapotong éndah software sarta eta janten sasak kuring kana programming.

Zack Brown:

Dina Flash, anjeun henteu ngan ukur tiasa ngagambar nganggo alat-alat pangarang vektor anu unik dugi ka ayeuna, tapi anjeun ogé tiasa ngahias desain anjeun nganggo kode anu leres-leres elegan sareng mandiri. jalan, ku kituna mimiti meunang kuring bener kana programming. Kuring nyieun sagala kaulinan saeutik ieu. Dunya éta tiram kuring salaku éta. Janten, kuring neraskeun diajar élmu komputer teras, damel salaku insinyur perangkat lunak kanggo samentawis di sakumna papan, rendering 3D, sistem distribusi, sakedik AI, AR.

Zack Brown:

Jeung jumlah alus UI, UX lajeng, nuluykeun pikeun ngamimitian hiji agénsi disebut Thomas Street. Kami di sabudeureun pikeun ngeunaan tujuh taun, tumuwuh ka ukuran geulis alus. Kami ngagaduhan klien sapertos Coca-Cola, DirecTV, teras kuring ngajual éta. Kuring ngumbara dua taun kaluar tina 20 urang. Éta sapertos gerakan karir anu dihaja, percanten atanapi henteu. Ngawengku kira-kira 40 nagara, diajar sababaraha basa, nyéépkeun balayar, nyobian ngabeungharan kahirupan kuring sapertos kieu.

Zack Brown:

Terus, kaluar ti éta sareng ngadegkeun Haiku sareng éta. éta 2016. Urang geus sabudeureun pikeun sakeudeung.

Joey Korenman:

Wah, ogé urang sadayana tiasa pakait sareng éta.Ngajual perusahaan sareng iinditan salami dua taun. Éta carita anu saé pisan, lalaki. Abdi hoyong ngagali kana éta sakedik. Janten, anjeun nyarios anjeun ngamimitian lembaga, anjeun damel pikeun merek sapertos Coca-Cola sareng barang-barang sapertos kitu. Jenis gawé naon anu anjeun lakukeun?

Zack Brown:

Éta di sakuliah dewan, umumna fokus kana bridging gap antara desain jeung kode, kawas éta kotak hideung urang. konsultan produk, kuring nebak. Janten, urang badé lebet, urang badé ngumpulkeun sarat sareng pamangku kapentingan anu béda-béda, urang bakal ngadamel desain, kéngingkeun anu disatujuan, ngalaksanakeun desain salaku parangkat lunak sareng yén prosés tungtung-ka-tungtung nyaéta roti sareng mentega urang.

Zack Brown:

Éta ogé mangrupikeun awal pangertian pribadi kuring ngeunaan masalah kéngingkeun tina desain ka kode. Ieu mangrupikeun masalah anu pabalatak sareng masih teu aya solusi anu sampurna pikeun ayeuna.

Joey Korenman:

Leres, éta anu kuring badé naroskeun ka anjeun, sabab ayeuna sareng wawancara ieu mangrupikeun waktos anu saé pikeun urang, sabab School of Motion nuju ngalangkungan prosés ngalakukeun. saeutik saeutik tina rebrand desain jeung urang bakal nerapkeun eta sakuliah sagalana, dina ramatloka urang jeung saterusna, urang rada grappling jeung ieu ogé.

Joey Korenman:

Kami gaduh sadayana ideu ieu sareng kami hoyong halaman wéb kami tiasa dianggo ku cara anu tangtu sareng kami mangrupikeun sakola animasi, janten kami hoyong hal-hal ngahirupkeun. Sareng ayeuna, dina taun 2019, éta masih sesah pisanpikeun ngalakukeun éta, janten nalika anjeun ngajalankeun lembaga ieu, kumaha prosés ieu? Prosés ngarobah desain jeung Kuring asumsina ogé animasi kana kode? Kumaha kaayaan jaman harita?

Zack Brown:

Sarua jeung kaayaan jaman kiwari, dimana anjeun boga désainer ngagunakeun alat digital pikeun nyieun moyok. up naon nu kudu diwangun dina piksel, nu maranéhna lajeng dibikeun ka pamekar nu tugasna ngawangun eta piksel kana piksel sejen, tapi piksel katuhu.

Joey Korenman:

Leres.

Zack Brown:

Leres sareng éta deui inti masalahna. Kami sadayana parantos nganggo alat digital, tapi alur kerja kami disjointed sareng alur kerja leres-leres mangrupikeun masalah. Kumaha urang ngahijikeun alur kerja éta?

Joey Korenman:

Hehehehe sareng aya ogé anu béda pisan ... Kuring nyobian mikiran kecap anu béda ti "paradigma", sabab éta ngan ukur. disada jadi lame, tapi éta kecap Jigana éta luyu. Nalika désainer gerak biasana mikir dina hal carita anu linier. Éta bakal katingali ku cara kieu, sabab kuring ngahirupkeun ku cara kieu sareng bakal maén deui sapertos kitu unggal waktos.

Joey Korenman:

Tapi mun anjeun ngobrolkeun ngeunaan hiji aplikasi, éta bakal ngahirupkeun kana kaayaan anu béda, tapi teras tiasa ngahirupkeun deui. Upami anjeun uih deui sareng warna tombol tiasa robih gumantungdina karesep. Sareng aya sadayana ieu anu ayeuna interaktif sareng gaduh katergantungan sareng hal-hal sapertos kitu.

Joey Korenman:

Jadi, naha éta alesan utamana aya masalah tarjamahan antara pakakas anu kami anggo dina sisi motion-design jeung sisi coding?

Zack Brown:

Leres, nuhun. Sareng teu aya alat sapertos kitu sareng caveat, pasang pin éta, teu aya alat sapertos ayeuna anu ngamungkinkeun anjeun ngalakukeun éta. Baheula aya hiji. Éta persis naon anu Flash ngantep anjeun lakukeun, deui, ku nyampur desain sareng kode, anjeun tiasa angkat ka Frame 20 sareng nyetél bandéra sakedik dina kode sareng ayeuna, anjeun naon waé tombol anjeun beureum tibatan biru. After Effects henteu ngalakukeun éta sareng After Effects leres pisan anu tinggaleun dina dunya alat desain gerak ayeuna.

Zack Brown:

Tapi sabenerna mah aneh, lima, 10 taun ti saprak Flash sacara efektif maot, dunya geus ngarasa vakum ieu, sabab kungsi boga monopoli jeung Nalika monopoli maot, éta ngan ukur tempat anu anéh ieu dimana urang aya. Naha éta sadayana asup akal? Kuring sapinuhna lebet kana desain gerak, abdi dabbled di Flash teuing jeung kuring resep éta ngeunaan éta ogé yén anjeun bisa ngagunakeun skrip aksi sarta nyieun ton interaktivitas bari anjeun ngarancang jeung bener ieu jenis hal hébat ngagunakeun.

Joey Korenman:

Sareng jantenjujur, Kuring pernah pinuh dipikaharti naha eta maot maot ennoble nu eta tuh. Naha anjeun gaduh wawasan naon anu ngabunuh éta? Sareng pikeun sadayana anu ngupingkeun, Flash masih aya. Ayeuna disebut Animate. Adobe nga-rebranding deui sareng seueur dianggo pikeun animasi sél, pikeun animasi tradisional, tapi henteu dianggo sapertos baheula.

Joey Korenman:

Abdi panasaran upami anjeun terang kunaon. nyaéta, Zack.

Zack Brown:

Hehehehe, kuring boga hiji atawa dua pamikiran. Ku kituna, awal tungtung pikeun Flash éta circa 2005 nalika Adobe kaala Macro Media pikeun $3,4 milyar sarta duit éta dasarna kabeh keur Flash. Macro Media ngagaduhan produk sanés dina antrian sapertos Dream Weaver sareng Fireworks, tapi Flash leres-leres, éta mangrupikeun permata makuta. Éta dijalankeun dina unggal alat, éta dina waktosna nyayogikeun satengah tina iklan Internét, éta mangrupikeun platform pikeun nyiptakeun kaulinan.

Zack Brown:

Upami anjeun émut kaulinan flash, flash. kartun, éta tulang tonggong, tulang tonggong infrastruktur pikeun YouTube jeung umumna, video dina web. Gampang pikeun mopohokeun sadayana ieu, tapi Flash mangrupikeun kasuksésan anu ageung, janten Adobe leres-leres mayar jumlah anu ageung pikeun éta, teras mobile sumping. IPhone mangrupikeun unggulan pikeun sélulér, révolusi telepon pinter sareng sélulér anu maéhan Flash sapanjang kalayan bantosan Steve Jobs sareng sadaya modél bisnis toko aplikasi, sabagéan ageung pendapatanna asalna tina kaulinan.

Zack

Gulir ke atas