Slide 1

Slide 1 text

LET YOUR DESIGNER TWEAK AND DEPLOY YOUR IOS APP TO HIS/HERS HEART CONTENT! ROBERT VAN LOGHEM - @SOUNDBITES

Slide 2

Slide 2 text

JUST A DEV, DOING IOS SINCE 2010, 26 YEARS OF EXPERIENCE GOING TO TALK ABOUT ▸ Xcode, Interface Builder, @IBDesignable, @IBInspectable ▸ Paint Code ▸ Git ▸ Fastlane ▸ Continuous Integration, bitrise.io, Travis CI or any CI you like ▸ Crashlytics, iTunesConnect-Testflight, appetize.io ▸ and working with creative people

Slide 3

Slide 3 text

40 MINUTES, FOR 14 THINGS, THIS IS GOING TO BE ONE AMAZING TALK… OR IT’S GONNA SUCK

Slide 4

Slide 4 text

THE BEST APPS ARE CREATED BY EXPERIMENTATION AND CONSTANT TWEAKING

Slide 5

Slide 5 text

MEET MIO, MY DESIGNER I LOVE DESIGN(ERS)

Slide 6

Slide 6 text

CAN YOU ADJUST THE COLOR A BIT? MIO STEP INTO MY OFFICE #1 SURE! ROBERT

Slide 7

Slide 7 text

CAN YOU CHANGE THE CORNER-RADIUS TO 8? STEP INTO MY OFFICE #2 MIO SURE!! ROBERT

Slide 8

Slide 8 text

I’VE GOT SOME NEW ICONS! CAN WE ADD THOSE NOW? STEP INTO MY OFFICE #3 MIO SURE!!!!! ROBERT

Slide 9

Slide 9 text

SORRY TO DISTURB YOU… BUT THE ANIMATION COULD BE A LITTLE BIT FASTER STEP INTO MY OFFICE #4 MIO ARGH! ROBERT

Slide 10

Slide 10 text

I WISH MIO COULD DO IT ALL BY HERSELF AND DIDN’T HAVE TO BOTHER ME… Robert

Slide 11

Slide 11 text

SO WHAT IF…

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

No content

Slide 14

Slide 14 text

No content

Slide 15

Slide 15 text

DEAR VICTIM, WILL YOU BE PART OF MY EXPERIMENT? EVIL-GENIUS TIME

Slide 16

Slide 16 text

XCODE STUFF ON THE DESIGN MACHINE STUFF NOT ON THE DESIGN MACHINE THE WORKFLOW

Slide 17

Slide 17 text

XCODE WHAT TO TWEAK AND CHANGE

Slide 18

Slide 18 text

IMAGES.XCASSETS no-brainer

Slide 19

Slide 19 text

INTERFACE BUILDER @IBDESIGNABLE

Slide 20

Slide 20 text

INTERFACE BUILDER AND @IBDESIGNABLE

Slide 21

Slide 21 text

INTERFACE BUILDER AND @IBDESIGNABLE AND @IBINSPECTABLE

Slide 22

Slide 22 text

INTERFACE BUILDER AND @IBDESIGNABLE AND @IBINSPECTABLE

Slide 23

Slide 23 text

PAINT CODE VECTOR LIKE AWESOMENESS AND STYLES!

Slide 24

Slide 24 text

WHATS THIS RECRUITMENTSTYLEKIT???

Slide 25

Slide 25 text

WHATS THIS RECRUITMENTSTYLEKIT???

Slide 26

Slide 26 text

NOT ONLY COLORS

Slide 27

Slide 27 text

NOT ONLY COLORS

Slide 28

Slide 28 text

RECAP…. DEFAULT VALUES, INSPECTABLE PROPERTIES, VECTOR CORE GRAPHICS

Slide 29

Slide 29 text

SWIFT TYPE SAFETY AND I.B. DON’T ADD UP IMHO…. SO BE PREPARED TO REFACTOR, MOVE, ETC… NOTED… ROBERT

Slide 30

Slide 30 text

STUFF ON THE DESIGN MACHINE OH WE’VE GOT TO MAKE IT A DEV MACHINE….

Slide 31

Slide 31 text

MAKING THE DESIGN MACHINE A DEV MACHINE GET THE SOFTWARE PT 1, XCODE AND A GIT CLIENT

Slide 32

Slide 32 text

MAKING THE DESIGN MACHINE A DEV MACHINE ALLOW ACCESS TO GIT/SCM (GITHUB, BITBUCKET, YOUR OWN) AND LET THEM READ AND UNDERSTAND THE README.MD

Slide 33

Slide 33 text

MAKING THE DESIGN MACHINE A DEV MACHINE PLEASE NOTE THE MORE 3RD PARTY TOOLS YOU ADD THE COMPLEXER THE SETUP… DOWN THE RABBIT HOLE XCODE GIT CARTHAGE COCOA PODS HOME- BREW FASTLANE FABRIC.IO PAINT CODE becomes more hassle do-able

Slide 34

Slide 34 text

HOW SHOULD I WORK WITH THE CODE AND UPDATES AND CHANGES AND….? MIO THE WORKFLOW I’LL HELP. ROBERT

Slide 35

Slide 35 text

DEPENDING ON THEIR PROFICIENCY IN GIT/XCODE…. TO START OFF, CREATE A DESIGN BRANCH, AND YOU KEEP THAT IN SYNC WITH DEVELOP (IF YOU’RE DOING GIT FLOW FOR EXAMPLE, OTHERWISE MASTER) AS EXPERIENCE GROWS, LET THEM CREATE THEIR OWN BRANCHES AND EVEN PULL REQUESTS, BUT DON’T DO THAT FROM THE START!!!

Slide 36

Slide 36 text

SO I SHOULD JUST HIT THE SYNC BUTTON IN GIT? MIO THE WORKFLOW, K.I.S.S. !!! YUP! ROBERT

Slide 37

Slide 37 text

KEEPING UP TO DATE OTHERWISE… DESCRIBE IN THE README.MD WHAT TO DO WHEN STUFF BREAKS DOWN…MERGE…OUT-OF-DATE DEPENDENCIES, ETC… ARGH!

Slide 38

Slide 38 text

A DESIGNER CAN NOW RUN SOMETHING IN THE SIMULATOR but how to get it on multiple devices without the provisioning, upload to xyz hell…

Slide 39

Slide 39 text

STUFF NOT ON THE DESIGN MACHINE LET’S TRY AND MOVE THE BUILD AND RELEASE ELSEWHERE

Slide 40

Slide 40 text

THE FLOW GIT CONTINUOUS INTEGRATION BUILD TOOL DELIVERY PLATFORM DESIGN MACHINE git push to design call CI through webhook runs build tools to build all and deliver it uploads built .ipa IOS DEVICE downloads newest version

Slide 41

Slide 41 text

THE FLOW GIT CONTINUOUS INTEGRATION BUILD TOOL DELIVERY PLATFORM bitbucket, github bitrise.io, Travis CI, your Mac mini under the desk fastlane, or built-in iTunes Connect, Crashlytics, appetize.io

Slide 42

Slide 42 text

TO START OFF….GETTING THIS TO RUN ON YOUR OWN LOCAL DEV MACHINE BUILD TOOL DELIVERY PLATFORM * Fastfile-part written by Javi Lorbada, @javi_lorbada

Slide 43

Slide 43 text

$ FASTLANE BUILDDEBUG

Slide 44

Slide 44 text

TO START OFF….GETTING THIS TO RUN ON YOUR LOCAL DEV MACHINE BUILD TOOL DELIVERY PLATFORM * Fastfile-part written by Javi Lorbada, @javi_lorbada

Slide 45

Slide 45 text

$ FASTLANE BUILDBETA

Slide 46

Slide 46 text

FASTLANE HAS A TON OF TOOLS IT CAN INTEGRATE WITH

Slide 47

Slide 47 text

NEXT UP HOOKING UP FASTLANE TO YOUR CI, REMEMBER WE WANT TO CALL $ FASTLANE BUILDDEBUG CONTINUOUS INTEGRATION BUILD TOOL BITRISE.IO

Slide 48

Slide 48 text

NEXT UP HOOKING UP FASTLANE TO YOUR CI, REMEMBER WE WANT TO CALL $ FASTLANE BUILDDEBUG CONTINUOUS INTEGRATION BUILD TOOL BETA IOS VERSION OR PRODUCTION IOS? YOU GET A VIRTUAL MACHINE RUNNING OS X I ALSO NEED CARTHAGE INSTEAD OF COCOAPODS…

Slide 49

Slide 49 text

NEXT UP HOOKING UP FASTLANE TO YOUR CI, REMEMBER WE WANT TO CALL $ FASTLANE BUILDDEBUG CONTINUOUS INTEGRATION BUILD TOOL CLONE THE REPO INSTALLS SSH KEYS TO ACCESS GIT REPO

Slide 50

Slide 50 text

NEXT UP HOOKING UP FASTLANE TO YOUR CI, REMEMBER WE WANT TO CALL $ FASTLANE BUILDDEBUG CONTINUOUS INTEGRATION BUILD TOOL BUILD IT! AND DISTRIBUTE IT, USING $ FASTLANE BUILDDEBUG INSTALLS YOUR APPS CERTIFICATES AND PROFILES, NEEDED TO SIGN .IPA

Slide 51

Slide 51 text

HOW DO WE GET NOTIFIED THAT A GIT PUSH WAS DONE? ADD DEPLOY KEY, CREATED BY CI SERVER, ALLOWS ACCESS GIT CONTINUOUS INTEGRATION

Slide 52

Slide 52 text

HOW DO WE GET NOTIFIED THAT A GIT PUSH WAS DONE? CREATE WEB HOOK THAT TRIGGERS URL ON C.I. SERVER WHEN SOMETHING CHANGES GIT CONTINUOUS INTEGRATION

Slide 53

Slide 53 text

PUTTING IT ALL TOGETHER GIT CONTINUOUS INTEGRATION BUILD TOOL DELIVERY PLATFORM DESIGN DESIGN

Slide 54

Slide 54 text

STUFF ON THE DESIGN MACHINE STUFF NOT ON THE DESIGN MACHINE XCODE GIT CONTINUOUS INTEGRATION BUILD TOOL DELIVERY PLATFORM DESIGN MACHINE IOS DEVICE(S)

Slide 55

Slide 55 text

LET YOUR DESIGNER TWEAK AND DEPLOY YOUR IOS APP TO HIS/HERS HEART CONTENT! ROBERT VAN LOGHEM - @SOUNDBITES