00:00:20.400
so welcome to this presentation I hope you had a great lunch uh I hope I won't
00:00:25.680
bore you to desk now so please be awake uh so first I wanted to say hi in all
00:00:33.000
the languages of Singapore uh I think I missed a four language or how many
00:00:38.079
languages are in Singapore four four so I pretty missed one right you missed Malay I missed Malay I'm sorry
00:00:45.559
uh so uh niow is in Chinese right and I English so uh my name is Laurent I'm the
00:00:53.120
I'm the founder of a the company that makes Ruby motion uh I'm I'm also the author of R
00:00:59.039
motion I was the original H I know I actually work with uh smarter people than me that help me finish
00:01:06.240
it uh I'm a longtime Ruby uh programmer I discovered Ruby uh when I was a
00:01:11.600
student at University uh in 2001 um because I needed I needed a better PE I
00:01:17.680
discovered that I couldn't maintain a PE code I wrote last week um but I never
00:01:23.240
actually use Ruby on Race uh that's pretty one of uh that's pretty unique I
00:01:28.600
guess in this community I never did any web programming so uh and before doing remotion I worked for Apple for close to
00:01:35.200
seven years on a lot of things from iif Life Application to os10 also maintain
00:01:40.360
the r distribution of os10 from uh from leer to mountain
00:01:45.759
lion and I'm on Twitter where I only post I try to make PS as good as tender
00:01:51.280
love but they are not as good anyway so I'm from Belgium um it
00:01:59.399
rins all the time in Belgium close 300 uh days a year uh when I don't do Ruby
00:02:05.600
motion I try to maintain the Ruby uh User Group uh in my hometown uh it's
00:02:11.480
called Ruby Boule Boule is French for huge meatballs which are the main dish of the city uh so if if you ever if you
00:02:19.280
guys ever come to Belgium Belgium is a very small country so uh and you want to try this speciality over our hometown
00:02:25.519
please let me know and I will set something up uh I'm also the founder of Orval do
00:02:31.640
Club an association of people who strongly believe that Orval is the best beer of the
00:02:37.160
world I I actually created this club last week so it's relatively new so this is a picture of the beer
00:02:44.519
it's it's it is the best beer of the war believe me and uh I made a website
00:02:51.480
um I'm not I'm really not a web programmer as you can see and so I wrote it in pure HTML
00:02:58.480
because I was told that these days you have to go native right so it's pure HTML and we have like six members now so
00:03:05.400
if there are really if there are overall lovers in that room uh if you want to join the club uh it's free but you need
00:03:11.200
to show a proof of face uh so we have you need to be initiated by a member
00:03:17.239
anyway the agenda for today uh I will talk a little bit about the state of native mobile development I will
00:03:23.080
describe a little bit what ruby motion is for those who don't know and I will show a couple Ruby motion gems uh that
00:03:30.120
are very interesting and finally we'll do some future stuff that's a secret hopefully if I have time so the state of
00:03:37.200
mobile development um right now as you know there are two major mobile platforms which is IOS and
00:03:44.720
Android uh this is what they look like at the latest versions um Isa do
00:03:50.519
something and Android 5.2 I think uh so how many is users are here can you raise
00:03:55.840
your hand that's not that much actually and and Android there are more Android users I
00:04:02.959
think so the guys who use Android can you raise your hand if you enjoy the
00:04:08.799
experience yeah so see good right okay so uh I'm
00:04:16.479
not a business person but I I took this number off from the internet uh the smart for Market basically the share in
00:04:23.120
unit shipments and uh Android was winning the last three years but this
00:04:28.680
year it's actually reducing the market share is reducing slightly and iOS is getting more market share this year but
00:04:34.880
clearly Andro has more units than iOS um and it really depends on the country
00:04:40.960
but if you if you do a mobile app these days you can't just do iOS only anymore you have to do Android
00:04:46.880
now so it's no longer possible to do to go is only and you need to go
00:04:51.919
crossplatform and um the best way also is to go native
00:04:57.759
to to write native apps for each platform uh there are many um tool chain
00:05:03.440
around that that will promise you that you can write one code base and it works on all the platforms and they're very
00:05:09.360
nice in theory but in practice you will run into a lot of problems you will have performance issue you will not be able
00:05:15.560
to C the entire set of apis of each platform uh you have um user experience
00:05:21.080
problems um and eventually you have to write native code uh there was this uh blog post that
00:05:28.680
was um published I think two weeks ago that really resume well the situation of
00:05:34.240
um of web Technologies to do mobile development these days and the guy is a web developer so it actually um try to
00:05:41.600
um synthetize all the all the problems of what that are happening right now so I recommend to to read it it's called
00:05:48.280
Web versus native let's consider defeat so it's very pessimist title but it's very
00:05:53.880
interesting and Native apps provide the best user experience at the end because you're really right and the application
00:05:59.960
for the entire features of the platform and it turns out that consumers they also want the best user experience so if
00:06:06.759
you do consumer app uh you PR have to go native and as my personal hero say um no
00:06:13.639
pay no gain right so uh doing native development is much harder than writing an application
00:06:21.160
Java sorry writing an application once in JavaScript and running everywhere but at the end you you have something very
00:06:27.639
nice so let's talk a little bit about the architecture of of the mobile platforms um if you look at iOS iOS is
00:06:35.039
mainly split in four layers you have coros core Services media and Coco
00:06:41.160
touch uh coros is mostly the lowlevel layer of iOS so it has the ker it has
00:06:46.560
the BSD Unix layer and also the user Lear libraries so you normally never use
00:06:51.599
this when you write an app for iOS unless you do lowlevel programming but core Services include uh the foundation
00:06:58.440
uh libraries that power the entire set of apis like you will find the foundation framework there Foundation
00:07:04.160
defines the built-in classes like you have the NS object class which is the base class of everything else you will
00:07:10.039
find an string NS array so all the built-in types you will also find networking apis uh core data which is um
00:07:18.680
uh persistance Library I I assume it's like active record but for iOS but since I don't
00:07:25.599
know race I'm not sure um you also have call location if you work for a Secret Agency you probably want to use that um
00:07:33.360
to track your users uh the media layer has all everything Graphics uh audio and
00:07:39.879
video and in the graphics side you obviously have u u is the biggest framework it has all the controls
00:07:45.240
classes like for instance a button is going to be defined there and finally you have the Coco touch layer which has
00:07:51.879
uh additional Frameworks that you can use on top of your app for instance if you want to access the address book you
00:07:57.039
have an API for that if you want to access the game board the game center API or something if you want to have map
00:08:03.840
C app you have map kit anyway you will proba have to use the three last layers
00:08:09.599
and there are all the apis are either in pure C or in Objective C so these are the two languages that up use and it's
00:08:16.440
mostly Objective C it's prob 90% or 95% Objective C so you have to you have to
00:08:22.240
use at least a language that lets you call into Objective C if you want to use all these apis and you have to use ex code ex code
00:08:29.520
is the ID uh default ID of uh apple and if you want to do OBC you're pretty much
00:08:35.519
stuck to ex code you can use other ID but uh if you want to do it the apple way you need to use that so it's a it's
00:08:42.399
a new program you need to learn how to use it uh when it comes to Android
00:08:47.440
Android also has four layers more or less you have Linux the core libraries the GDK and the application
00:08:54.120
Frameworks and Linux is mostly drivers and stuff you never need to write an app
00:08:59.760
uh cor libraries are C based libraries uh for instance opengl sqlite uh webkit
00:09:05.959
all the libraries that that are actually used uh to implement Android so you you will prably never use them all as well
00:09:12.600
they are pretty Java apis buil on top of that so the GDK is the base of Android
00:09:18.640
is the the implementation of the Java language so you will find them there uh
00:09:23.720
the string class uh the arrays all the integers classes and finally you have
00:09:29.040
the the blue layer the application framework is the stuff that Google wrote for Android so you will have all the all
00:09:34.600
the widgets and everything that lets you write an Android app so you have to use the last two layers if you want to write
00:09:41.480
an application for Android and it's all Java Java is the only language and so
00:09:47.360
you need to call into Java apis and you need to use another IDE
00:09:52.800
obviously um so Google used to have Eclipse they used to force people to use
00:09:58.800
eclipse which was and people were suffering because eclipse is a very bad um program
00:10:05.560
so they switch to something else Android Studio Android Studio is based on jet brains intelligy so it's much much
00:10:11.079
better uh but it's still an IDE so it's um so you need to be able you need to
00:10:17.399
learn how to use it eventually if you do Native development for the two platforms you need to use uh either Objective C or
00:10:25.480
Swift in the iOS part uh or Java in the Android part you need to use excode on
00:10:30.640
the is part or Android Studio in the Android part and you need to call the is
00:10:35.720
SDK API in the is part and the Android SDK API in in the Android part so can
00:10:41.519
you see the problem here you you're actually jungling between uh two different set of languages two different set of ID and two different set of
00:10:49.800
apis so if you if you need to to write an application AC close platform app uh
00:10:55.320
it's going it's going to be a problem so can we make this simpler and obviously yes with Ruby motion right
00:11:04.519
yeah so Ruby motion is basically a tool chain to write native mobile apps in Ruby and I underline native here because
00:11:11.839
it's really native it's important really native it's crossplatform so it does IOS and Android
00:11:19.639
uh and also OS 10 you can write OS 10 apps in Ruby motion but people don't really care much but you can write by St
00:11:26.000
apps it's designed for Ruby programmers so it's redesigned for re programmer so
00:11:32.399
um uh I will I will explain a little bit later how re motion is um is being used
00:11:37.920
to create projects but basically if you're Ru programmer if you use the Ruby ecosystem you should be at home and the
00:11:43.959
main goal is to provide a consistent experience for crossplatform Native development so let's go back to the
00:11:50.560
table here uh with r motion we basically replace uh the two languages by Ruby and so you can get you can use Ruby
00:11:58.120
on both platforms you don't don't have to use Objective C Swip and Java and we replace all the Ides by the editor you
00:12:05.079
already use it can be anything and the terminal which is something you PR already know as a Ruby programmer so as
00:12:12.760
you can see you still need to learn the is SDK apis and the Android SDK apis so
00:12:18.399
Ruby motion will not make you a mobile developer right away if you know Ruby you still need to learn something uh so
00:12:25.240
there is a learning curve but it's still easier than having to mix languages and
00:12:30.320
even to even to mix Ides and since you use the same language on both platform you can no share common code on on
00:12:40.120
projects so uh a few slides about remotion as a company it's actually a company so it's commercial and
00:12:48.000
proprietary uh it's not free and open source um so because we want to support
00:12:53.600
it for the long term so the best way we found is to actually ask money for it uh
00:12:59.519
if you want to find this picture you can Google for angry Richard storman uh which I
00:13:05.560
did yeah Richard some is not happy uh it's 100% bootstrap so we never
00:13:12.880
took funding uh we are only funded by your customers it's profitable since day one
00:13:19.680
um yeah funded by your customers so the customers are actually our investors they invest in the product directly uh
00:13:26.680
we have thousands of them actually tens of thousands now um uh if you go on remo.com you will find a list of
00:13:33.480
customers and success stories but my favorite is a dark room uh does anyone
00:13:38.519
know here dark dark room can you raise your hand if you play the game some of you so everyone else should actually buy
00:13:44.880
the game um it was grated by a guy called Amir Amir Raj uh who's actually a
00:13:50.519
c developer he actually learned Ruby for R motion because he didn't want to use CP to write games and it's an adventure
00:13:58.040
game it's a text based it's on iOS it's extremely popular last year it was the number one top top paid app in the US
00:14:05.120
App Store above everything else so it's very very popular and it's 12 it's
00:14:11.600
12,000 lines of Ruby there is probably a few thousand lines for the for the engine everything else is a DSL that
00:14:18.240
Amir created for the game so and Amir Amir said in an interview that he use Ruby motion because Ruby is nice to
00:14:25.720
write domain specific language an abstraction so it really want wanted to to create a whole story as
00:14:32.680
code and if you want to know more you can Google for a press confence there's a nice article on the New Yorker so if
00:14:38.920
you want to support indie game developers uh it's great um the timeline of Ruby motion we
00:14:44.800
launch in 2012 with iOS support in 2013 we did OS 10 support uh last year we did
00:14:51.880
Android and this year we do other things uh notably one thing that I I would like
00:14:57.320
to show you at the end of the presentation but I'm afraid that R motion is no longer
00:15:02.360
hype it's no longer a hype um technology and the best metric is um the
00:15:09.120
number of acur news front page articles which is which is down to zero
00:15:14.480
for this year um and our revenue is relatively growing so I just wanted to
00:15:19.639
show you that we are not like falling apart but we we no longer get on the front page of acur news so it means that
00:15:27.160
we are we are basically born right so remotion is no boring product but boring
00:15:32.880
means stable right
00:15:38.880
anyway yeah actually I watch sometimes people post something on acur news it goes to the front page and get gets
00:15:45.040
skill immediately like people really hate it there so anyway so let's talk a
00:15:50.800
little bit about R motion internally and uh a very important principle are the unified Ruby runtime approach that we
00:15:57.839
decide to go with r motion so basically we provide custom implementations of the r language for
00:16:03.800
each platform we support so we we have an implementation for iOS and implementation for Android so it's a lot
00:16:09.560
of work because we have basically to rewrite uh Ruby run time every time but
00:16:14.800
at the end it has a lot of benefits for iOS we decided to rewrite Ruby on top of
00:16:20.600
the same run time that powers the objectivity language so this runtime is called The Objective C runtime it's a a
00:16:26.240
small C library that Objective C programs use at run time to create classes methods and S objects and we
00:16:33.680
decided to rewrite the r object model on top of the same run time and this runtime obviously poers all the apis of
00:16:41.680
iOS for Android we decided to do something very similar we rewrote the Ruby object model and or the Ruby uh run
00:16:49.319
time on top of gni which is a a c uh API that's exposed by the Java v
00:16:56.240
machine and so we are at the same level as Java um and since all the apis are
00:17:03.000
written in Java in Android um we basically see the top of the same layer so it's another implementation of Ruby
00:17:09.880
so the approach um is very important because since we implement the riby object model on top of the Native
00:17:16.160
platform run time every time it means that all the classes in Ruby remotion for iOS are actually Objective C classes
00:17:23.280
all the methods are Objective C methods all the objects are Objective C objects and this Versa uh all the class defined
00:17:29.480
by Apple in Objective C are automatically available in Ruby as if they were Ruby classes and actually
00:17:34.679
there is no distinction between a ruby class and Objective C Class they're all the same and the same thing goes for
00:17:40.000
Android everything is Java from classes methods and objects so we we are doing
00:17:45.600
this because we don't need to we don't have to ship a separate runtime that talks to the Java or the OB run time uh
00:17:52.720
we there won't be any conversion of objects they won't be exchange of messages they won't be there basically
00:17:57.760
won't be anything there won't be any Bridge so the Rubik code that you write
00:18:03.360
is going to access the exact same run time as the Java or the objectivec uh code that is so it's it's extremely
00:18:11.080
performant at the same time we also reimplemented the will be builing Types on top of the the native counterparts uh
00:18:19.120
the be builing types include uh the string class or the array class or the hash
00:18:24.159
class uh the idea be behind it is that if we if we don't have own
00:18:29.400
implementation if we have to use the the implementation of the platform uh if you call a native API that expect a string
00:18:36.320
for instance and you can pass any string it won't have to be converted to a native string if all strings are native
00:18:43.440
that you will not need to convert objects so for iOS for instance string
00:18:48.919
is actually based on NS mutable string which is a mutable version of NS string defined by Apple in the foundation
00:18:54.880
Frameworks so all strings are actually unable strings in R motion
00:19:00.000
the same thing goes for array Ash fix and for Android we do something extremely similar um a string in Android
00:19:08.480
is actually a class that implements the Java L our sequence protocol because we can't use Java Lang string directly
00:19:13.679
because it's first it's immutable and so again it cannot be subclassed uh but we do something very
00:19:19.640
similar and then for instance an array is always a Java util ARR which is the closest thing as an array in Java so all
00:19:27.240
the all the building basic types in R motion for Android are actually going to be GDK
00:19:32.799
objects so by doing this uh we get to call the entire set of apis for each platform and all the types are also
00:19:39.240
native so for instance this is a hello world for iOS so it's it's a little bit verbos but
00:19:46.760
this is how iOS is working uh you you start by creating an application delegate which will be the delegate of
00:19:52.679
the NS application object and then you need to overwrite the application did finish launching with option method but
00:19:59.559
here we extended the Ruby syntax a little bit uh so that you can Define small talk selectors from Ruby and from
00:20:06.480
there this is the entry point of your app and then you can create a UI label assign it to something uh you can create
00:20:12.799
a view controller put the label in the view controller and then create a window put the view controller in the window
00:20:18.919
and then show the window so this is extremely verbos but this is er World in Objective C and the thing is this is a
00:20:25.320
one by line mapping with Objective C if you write the same thing in Objective C or Swift is going to be the exact same
00:20:30.960
code more or less so you already get to call all the apis of the platform there
00:20:36.159
is no abstractions there is no magic here um UI screen is a class defined in
00:20:41.720
Objective C UI window all the all the method that you see there are actually Objective C methods but you get to call
00:20:48.240
them from from Ruby and if you type R you will get this in the simulator L word the exact same app you would get if
00:20:55.240
you write it in Objective C and run R run uh click on run Enix
00:21:00.640
code for Android this is L World in Android it's much uh simpler in my
00:21:05.720
opinion uh to create an app in Android you need to have an activity uh you need
00:21:11.159
to subass at least an activity which is the main one and then you can uh overload the on create method there you
00:21:18.760
must call Super as you must call Super as the first uh expression and then we can create a text view assign it to a
00:21:25.559
text and then set the content view of our activity to our text view again this
00:21:31.039
is all if you do it if you had to do it in Java it would be the exact same thing more or less but here we do it in Ruby
00:21:37.279
and there is no magic there there are no abstractions uh it's these are direct API direct classes defined in
00:21:44.120
Java if you type R you get this in the uh emulator exactly as if it was written in
00:21:51.840
Java so with this approach uh you can call the entire set of apis at no performance cost because we don't brid
00:21:59.200
an existing run time we actually use the same run time to implement the object model and the building times also don't
00:22:06.200
have to be exchange so all the strings are in strings or Java L strings and also with this approach we
00:22:12.520
can support the new versions of is and Android automatically so when Apple releases a new version of iOS or Google
00:22:18.679
releas a version of Android we support it right away uh we don't have to uh create wrappers because it's all dynamic
00:22:26.159
as an example last week uh Google releases Android M as a preview and we
00:22:31.520
support it in less than 8 hours uh we had to generate files for the compiler and then make a release for customers
00:22:37.880
but it's we don't we support all the new versions right away another example static compilation
00:22:45.720
it's different from other rubies um Ru motion apps are uh not interpreted and
00:22:51.880
in fact there is no interpreter in R motion apps so if you try to call uh the Evol method with a string it will raise
00:22:57.960
an exception so everything is uh statically compiled into machine code and we target different
00:23:04.679
architectures mostly target arm for devices and Intel for emulators or simulators and we Target 32bit and
00:23:11.960
64-bit variants and the compilation process is not very hard uh but it's very very
00:23:17.960
different from other rubies we start with a ruby file and we use the lvm uh uh compiler framework to generate uh
00:23:25.679
intermediate representation and we apply optimization pass and finally we generate assembly and then we create a
00:23:31.480
binary uh a selfcontained binary so uh R motion apps are actually
00:23:39.240
native binaries and for iOS you will find a native executable and for Android you will find a gni share library inside
00:23:46.440
the application package and the original Ruby source code is not present in the application
00:23:52.279
so you you won't find RB uh files in the application they are all compiled
00:23:59.360
so the command line interface is everything is driven by the common line uh we use R files r as the build system
00:24:06.760
and Rec file as the entire project configuration file so if you need to modify something it it has to be in the
00:24:13.039
rec file so you don't need to go into an ncode project or an Android Studio project and it has a bunch of tasks that
00:24:19.000
you can do that so is the terminal and then your favorite editor and there are plugins
00:24:25.440
for most editors uh obviously you should be using v um but you can use other
00:24:30.840
editors if you want
00:24:36.320
uh uh actually one of them is rby mind R mind supports Android natively so it has
00:24:42.159
autoc completion of apis integration with the debing so it's pretty nice uh
00:24:47.399
creating a new project from the command line is Easy Motion create you specify your template and boom your project is
00:24:53.480
created you can go there if you look at the rec file with VI of course um
00:24:59.320
uh you will see that it's only three lines uh the default rake five just sets the name of the application everything
00:25:05.120
else is generated for you dynamically so if you want to set the deployment Target for instance you would do app.
00:25:11.000
deployment Target equal something so that's pretty nice it's all
00:25:16.360
the configuration is all ruby uh so as I was saying everything is in direct file and uh if you want to run the
00:25:22.960
application locally you can use the rake the default rake task on both platform uh for iOS you can can use R simulator
00:25:29.320
which is the default one and as soon as you type R simulator it will build the app and then run it in the simulator and
00:25:35.919
then you will have an IRB prompt interactive R shell there you can type
00:25:41.039
expressions and they will be executed on the simulator and for Android is the exact same thing type rake and then you
00:25:46.840
can type Expressions there uh to run apps on the device you can just type rake device and it will
00:25:53.080
push the application on your device iOS or Android and it will run it and for Android we attach
00:25:58.919
the the dynamic U the interactive will be prompt as
00:26:04.039
well so it's all R commments right there's no no magic there and once
00:26:09.159
you're ready to make uh money uh you can type Rak archive distribution for iOS it
00:26:14.440
will generate an IPA file for you and you can send this IPA file to Apple for
00:26:20.039
to upload it to the App Store uh for Android you type break release and you will get an APK file uh you obviously
00:26:26.880
need to do some configuration before you need to generate a provision profile a Cod sign certificate for iOS for Android
00:26:32.919
you need to to create um a keychain uh from Google you can request it it's
00:26:38.679
free but eventually once you do that you you just generate packages and these packages are the same packages that you
00:26:45.039
would generate from from Objective C Swift or Java so let's go back to the to our
00:26:51.760
table here so we have Ruby has the same language and your editor and the terminal as the main environment but but
00:26:58.399
you you still need to learn the issd K apis and the ad SDK apis right so there is definitely a learning
00:27:05.360
curve but it makes Ruby motion developers uh through native uh mobile
00:27:10.640
developers so if you do mobile development with Ruby motion you're actually using the same apis of an
00:27:16.399
Objective C programmer or a Java programmer but there is a definitely a learning curve uh it's very hard it
00:27:23.440
takes time to master both apis so can we make this uh even simpler
00:27:29.600
and the answer is yes of course uh now that we support both platforms there are crossplatform gems available basically a
00:27:37.720
piece of Rubik code that works on both platform that you can use and these are just one API that works on both platform
00:27:44.399
so this really makes things easier uh so for iOS there is a project called red
00:27:50.000
potion and for Android there is a project called Blue potion uh so people say that it's the
00:27:58.919
rails of Ruby motion uh but since I don't know RS I I have no idea if it's
00:28:05.159
true so these are Ruby motion potions um so it's basically an environment package
00:28:10.640
for Ruby motion development so it's uh these are project templates and then a set of portable gems that works on iOS
00:28:17.720
and Adroid so for iOS it's red potion for Adroid is blue potion uh these are written and maintained by the community
00:28:24.159
so I I have no idea what they are doing um but but it's used in production
00:28:29.279
actually there are there are many many apps using this in production so I I assume it's stable right um this is how
00:28:36.480
you create a project with a red potion so they have their own common line potion create I I don't know why I don't
00:28:42.960
I don't know why actually I should ask them and then you can just go to the directory you can do potion create
00:28:48.159
screen which will probably create a screen file then you can just bundle and rake and need to run the application
00:28:54.000
right uh here is a piece of code that they actually sent me uh today this morning so that I can include in the
00:29:00.039
presentation um can you guys read the code right so it's these are two files
00:29:06.279
the first file uh defines a new screen PM screen that has an action bar a title
00:29:13.159
and a stylesheet and then on the unload unload is a call back will Define a button that that is uh using the clickme
00:29:21.519
button uh style and then on the button we provide the endler that will open another screen right and on the right
00:29:28.320
side of the screen you have the definition for a style sheet which basically provides the user uh the look
00:29:35.159
and feel of our button The Click M button is defined there as you can see so they decided to go with a like in
00:29:41.720
HTML and CSS I guess to have like presentation separate from content so you basically Define
00:29:48.519
stylesheet objects and Screen objects so this is a piece of code and then it
00:29:54.399
generates uh applications for both is and Android and they are exactly the the same um so you have two buttons click me
00:30:00.840
you have the title bar so this R reduce um this makes uh remotion cross platform
00:30:07.120
work much much easier so obviously uh this is just an example right if you make apps the the the interfaces will be
00:30:14.120
very different from iOS to Android for iOS you really want to follow what Apple does with its own apps which are which
00:30:21.440
right now are uh animations and transparency and for Android you want to follow the uh the design Lang language
00:30:28.640
from Google and it's relatively stable these days but still it's it's kind of nice to be able to actually share the
00:30:34.559
same R uh the same DSL on both platforms and they have another very cool feature
00:30:40.320
which is uh live reloading um if you start changing your screen files uh it
00:30:47.000
will reload the application in the simulator so here I think is uh it's
00:30:53.279
basically changing stuff in the file as you can see on the right there is the is simulator and
00:30:58.480
the application is automatically
00:31:07.120
reloading so they actually wrote a piece of code that watches all the airb files of the project then they do a diff and
00:31:13.360
then they just inject it into the Ripple so the the code will be re-evaluated and
00:31:19.080
and then I guess they have some dark magic to uh tell iOS to reload the classes and the controllers but
00:31:36.320
anyway this is called reloading for so there is more information on red.org if you want to use that and now let's uh
00:31:44.639
let's talk about future stuff I think I have some time and the future stuff are video games
00:31:50.279
uh um I really want remotion to uh be used to write crossplatform mobile games
00:31:55.639
in Ruby so this is the next thing I want to do and I will do a demo I will write this
00:32:01.559
program I will write this program in front of you so it's going to be it's going to be
00:32:10.519
interesting so I we try to do it as fast as
00:32:22.240
possible okay uh okay
00:32:28.639
so this is my terminal this is my simulator
00:32:35.960
here and so I have um so for that uh we are using a new product that I've been
00:32:41.600
working on that will ship inside rub motion this year it's called motion game I will talk about it later
00:32:47.559
but basically we have this uh game SC
00:32:52.799
file edit it that's relatively empty and I'm going to write a Flappy Bird in
00:32:58.080
front of you in 100 lines of code so very small right so I'm actually
00:33:04.080
going to load it in my What's Happening Here uh edit
00:33:14.200
anyway okay uh I'm going to cheat because I'm not going to type the code I'm going to use a program that wrote uh
00:33:21.320
to copy paste stuff because I I know if I type it's
00:33:27.519
going to take long and I'm going to introduce typos so first let's initialize some backgrounds
00:33:33.240
boom so we create an array right you get it right I forgot to
00:33:38.919
mention so this is a game scene so we sub class and M scene and the update method here will be called for every
00:33:45.440
frame so by default it's 60 times a second so then let's add my
00:33:52.519
Skyline so oops that's a method so actually let me Define this here okay so
00:34:00.480
I Define a had Skyline method that basically create two Sprites Skyline PNG
00:34:05.880
I I created twice and I store the the Sprite in my
00:34:11.200
background array why do I create two Skyline Sprites I will tell I will tell you that right after there is a there is
00:34:17.200
a reason for that um important reason um now let let's define my
00:34:26.079
ground method there here so this is the same thing right I generate two Sprites
00:34:31.760
ground. PNG again you might ask why is he creating two Sprites ah it should create
00:34:37.440
only one I will tell you that later now in my update method I
00:34:43.520
can copy paste this code and this is why it's important so
00:34:48.919
if you ever play a Flappy Bird you can see that the skyline of the ground are actually moving there is an illusion
00:34:54.040
that you are actually flying over a city right so here I have I have I create two two separate spit
00:35:00.400
Sprites for each background object and I I move them like this and one the first one is uh Iden I put it there you see so
00:35:10.079
this is the best way I could find I know nothing about video game programming so but I think it's pretty smart I was very
00:35:15.680
happy with the result um so I have this and now I can oh here
00:35:21.119
I'm going to to add skyine and
00:35:29.079
ground okay now if I type break
00:35:39.839
oh no
00:35:54.480
internet I have my Skyline that's moving and my ground that's moving right so
00:36:00.200
that's the very basic of the game now I can just quit here what the hell is that St
00:36:08.920
okay um so let's do something else uh let's add the bird yeah now we're going
00:36:14.000
to add our bird
00:36:20.119
object so I have my bird here and it's a Sprite that we position
00:36:26.440
uh relatively at the center of the screen and then we have this animate method that we start an animation the Sprite so we can you can pass as many
00:36:33.440
files as you want but here we we have basically three images for sprite for bird and we tell the the game engine to
00:36:40.640
uh each zero that 5 Second to switch to the other Sprite so there there's going to be an animation here and we tell game
00:36:48.319
engine to animate forever so now if I call AD bird ad bird
00:36:53.560
here I Ty break oops again
00:37:07.240
simulator as you can see each time it's compiling Ruby file into machine code
00:37:13.280
so now I have my bird here oops actually let me uh turn off Wi-Fi
00:37:20.880
so the bird is there and it's animating right and from the Ripple here I can actually access my bird my bird is there
00:37:28.440
it's a Sprite um and you can you can have you can do actions like
00:37:34.599
uh let's ask for the position of the bird it's 100 to something so I can I
00:37:40.359
can say move
00:37:45.520
to move to this position in two seconds it's going to take two seconds
00:37:50.960
to move to this position right uh move back here
00:37:59.520
over there as fast as possible okay and you can also make it blink
00:38:04.720
so there is a blink method that say blink three times in 0. 5
00:38:11.160
seconds so that's useful if you if the if your object is colliding something like in all video games Retro Game you
00:38:18.359
blinking the the Sprite so my bird is there so let's let's let's do some uh physics um
00:38:26.319
so we have to do some science here uh physics categories first so um so the
00:38:31.400
game engine has a physics engine of course and first we need to Define
00:38:37.359
categories so I'm going to Define uh two categories these are actually bit set
00:38:43.079
there is a bird and a word category so here we assume that the bird is is its own physic engine physics type and
00:38:49.800
everything else is the word so as soon as the bird contacts with the World the game is over so we do a we start with
00:38:57.440
with something very simple so I can we need to initialize gravity in our scene so right there I can copy paste
00:39:04.920
this and basically set the gravity to zero and something I don't know the units there but it's minus means it's
00:39:11.800
going down if you if you do a positive fix the bird is going up so I put my
00:39:18.079
gravity there and then I will I will attach physics properties to the
00:39:25.599
ground so right there I can and copy paste this so I will basically say that
00:39:32.079
uh the gr no as a physics box and um the its category is the word but it
00:39:39.520
has to contact the
00:39:44.800
bird and here I will do the same thing for my
00:39:55.040
bird so the category of the bird the category of the bird is the bird and the
00:40:00.119
contact is the word not not not that I did that I can actually start the game
00:40:06.880
again ah should make it the default
00:40:20.800
task you can see the bir automatically Force right so the bird is attracted to the ground
00:40:26.319
um my bird is there so if I change the gravity to zero
00:40:32.560
something positive the bird will fall right then I I can put it back to
00:40:39.760
something and it should fall down where's happening where's my oh
00:40:44.960
there we go right so that's basically
00:40:51.440
physics and as you can as you can see the bird the bird actually goes on the floor and then doesn't go uh further
00:40:57.760
down it's because the the the floor has actually its own physics
00:41:03.119
category so my bird is there no we're almost done right so be patient
00:41:09.440
um right there we will
00:41:14.800
uh we Define untouch under uh blog so when when the game engine receives a
00:41:20.960
touch event is going to call my block and here I will play uh some audio file
00:41:26.160
and then I will apply a velocity on my bird I'll apply a velocity of 0 200 0 is
00:41:32.160
X 200 is y so basically the bird will move 200 units uh in y y position
00:41:39.680
here so if I Ty break is simulator again I put some sound
00:41:56.240
here oh you can see as I'm I'm actually typing on my on my touchpad here boom so
00:42:04.359
if I type the bird is going up right no let's let's finish the game
00:42:09.560
quickly because I'm running out of time so uh in my update method here I want to
00:42:18.480
uh rotate the bird uh based on this position so if the bird is actually going up I want to rotate the bird this
00:42:25.160
way and if it's falling down I want to the bird this way
00:42:30.200
um we're going to initialize uh no we are going to make the pipes
00:42:35.839
appear oops so let's go there and let's initialize some variables here
00:42:43.640
and then here I'm going to create
00:42:50.000
my ad pipe method so this method creates uh pipes so flappy bird is a game where
00:42:55.960
you have a bird and you have pipes appearing and for each pipe you basically have two uh Sprites you have
00:43:01.599
the The Hub and the bottom part of the pipe and obviously since you want to game fun you want to use some random uh
00:43:09.160
you want some randomization here so we basically generat our pipes and randomly so that the the bird has to actually go
00:43:17.119
inside and the pipe is simple here we have again a category here so the pipe
00:43:22.839
is the the physics category W and it can contact the bird and the the difference is that as soon as we add a pipe we
00:43:28.960
actually say the pipe move by something very left so that as soon as you add the pipe the pipe is going to move on the on
00:43:35.400
the on the left bottom of the screen so it will be up to the Bur to actually figure out a way to not hit the pipe
00:43:41.119
right so I do that and now I need to make the pipe appear so in my update
00:43:47.040
method I can that here I can make a pipe appear
00:43:54.599
here every two seconds so how do I know EX ly uh if we pass two seconds the
00:44:00.040
argument of our update method is the Delta the number of seconds is the previous frame so I can just add this
00:44:05.280
into in variable and if it's over two I know that we actually spend two seconds so I can just call the ad pipe appear
00:44:11.960
and then reset the timer and finally here I
00:44:19.599
can I can detect collisions so there is an Handler here on contact
00:44:25.480
begin and uh if there is a if the physics engine detects a collision we'll play it will
00:44:31.880
yield this block and then we play an audio file and we print some message on
00:44:36.960
the terminal so obviously here as a real game you want to show a game over screen
00:44:42.280
but so if I type R simulator
00:44:57.480
and my game is here so and the pipe are appearing so this is working and if I
00:45:03.119
hit the pipe you see game over right
00:45:12.559
and okay now I lost right so my bird is
00:45:18.160
there I can put it back actually but I need to be very very quickly so
00:45:28.839
where's my where's my bird oh
00:45:35.960
no
00:45:44.040
anyway yeah video game programming is hard right so this is a Flappy Bird in
00:45:49.880
rubby motion game and it's uh 113 lines and with actually comment so if you
00:45:56.400
remove the comment because comments are useless it gets to 100
00:46:01.839
lines so let's go back to the slides
00:46:09.240
uh
00:46:16.839
uh okay so motion game you write mobile games in Ruby with Ruby motion and this
00:46:22.480
one is 100 cross platform so I didn't show it but the same code base runs on Android
00:46:27.559
so IOS and Android very nice so it's fully feature has a bunch of stuff that I have no idea about like the scene
00:46:34.000
graph to this bries actions event sensors physics particles networking
00:46:39.280
apis so it's it's pretty nice and it's based on well tested open source
00:46:44.599
component because we are extremely lazy we are using other people's work for that and it's going to be release later
00:46:51.520
this year so the idea is is to actually allow Ruby programmers to write very
00:46:57.480
nice mobile games but to to write them in Ruby so conclusion remotion lets you
00:47:02.839
write mobile apps and games very soon uh through native apps actually U real
00:47:08.640
native apps so remember there is a learning curve but uh no pay no gain right you can use all the platform apis
00:47:15.760
at no performance expense it's statically compiled into machine code so there is no interpreter you share common
00:47:22.640
code uh because it's the same language there are close platform gems red potion
00:47:28.280
and blue potion uh it's only one language Ruby and one interface your favorite editor and the terminal and
00:47:36.559
just one more thing we do an annual conference every year this year it's going to be in Paris first and second of
00:47:42.000
July conference. motion.com this is a picture of Paris nice uh the conference
00:47:48.880
will actually be in this building uh not in the to but it's nice and again
00:48:05.079
thank you so much that was so cool we've had a lot of demonstrations today so far I hope you've enjoyed that as much as I
00:48:10.359
do we have time for maybe one or two quick questions if you have any for
00:48:21.040
laen hello hi uh what is your experience in debugging Ruby motion code
00:48:28.680
yeah so um so the remotion compiler actually generates uh dwarf metadata and
00:48:34.319
attaches it to the binary so you can actually connect any any debugger like GDB or ldb in a Ru motion program and
00:48:41.720
you can set Bro points uh see back traces these kind of things it's all working automatically you can also
00:48:47.640
connect any profiler like instruments and you will see the backr of allocations uh we gen we really support
00:48:54.440
this metadata dwarf so it's a big deal uh when it comes to real debagging if
00:48:59.520
you want a point and click uh experience uh Ruby mine is really the best Ruby mine integrates with um lb so that you
00:49:07.440
can point and click lines in your project and it will break right away so if you're not confortable with the with
00:49:13.720
GDB or ldb you can use re mine uh but otherwise that's that's more as the debing story here so we support uh C
00:49:22.319
Level deers and also abstractions
00:49:27.640
thank you uh do we have any other
00:49:33.400
questions if not uh maybe you can find lawence afterwards during one of the breaks thank you so much let's give him
00:49:39.319
another round and invite our next speaker
