Upgrade to Pro — share decks privately, control downloads, hide ads and more …

App Architectures: Remixed (early EE edition)

App Architectures: Remixed (early EE edition)

Many apps support multiple “themes”, but some need the ability to be remixed with specialised flows and feature sets, while reusing as much as possible.

When layouts, flows and business logic live in View Controllers, it’s difficult to do this well. But a combination of Coordinators and Clean architecture make remixed apps not just possible, but straightforward and easy to test too.

Dan Cutting guides us through the techniques they're applying at Schibsted to achieve highly flexible, well tested mobile software using the 'Remix' approach.

94fc7b58c03a0650fe1e8d78140bd451?s=128

Dan Cutting

November 29, 2017
Tweet

Transcript

  1. ed App Architectures @dcutting cutting.io Dan Cutting Schibsted

  2. Who? • Biggest Internet company
 you’ve never heard of •

    Media & marketplaces • 260 million users • I’m an iOS developer and technical lead for one of our teams
  3. –Uncle Bob “The goal of software architecture is to minimize

    the human resources required to build and maintain the required system” Clean Architecture
  4. REP CCP CRP

  5. Break it down REP CCP CRP Remix it Build it

    up
  6. So “architecture” is… • contextual • different teams, constraints, goals

    • a journey • it will change over time
  7. MVC

  8. MVC MVVM VIPER

  9. MVC MVVM VIPER

  10. Our app

  11. Our app context tests

  12. Marketplaces

  13. None
  14. 2015 2016 2017 Now Developers 0 3 6 9 12

    Timeline
  15. Break it down, build it up, remix it

  16. A tale of 2 teams

  17. • Buyer Team wants to make browsing ads fun A

    tale of 2 teams
  18. • Buyer Team wants to make browsing ads fun •

    Seller Team wants to make managing ads easy A tale of 2 teams
  19. • Buyer Team wants to make browsing ads fun •

    Seller Team wants to make managing ads easy • Mostly separate goals A tale of 2 teams
  20. • Buyer Team wants to make browsing ads fun •

    Seller Team wants to make managing ads easy • Mostly separate goals • Mostly separate parts of the code A tale of 2 teams
  21. • Buyer Team wants to make browsing ads fun •

    Seller Team wants to make managing ads easy • Mostly separate goals • Mostly separate parts of the code • …mostly A tale of 2 teams
  22. Ad List VC Ad Detail VC Happy Buyer Team

  23. Ad Detail VC Ad Edit VC Ad List VC Glorious

    Seller Team Edit Gateway
  24. Ad Detail VC Ad Edit VC Ad List VC Browse

    Flow Flow coordinators Edit Gateway
  25. Buyer Ad Detail VC Ad Edit VC Ad List VC

    Browse Flow Seller Ad Detail VC Common
 Ad Detail
  26. Ad List VC Browse Flow Intrepid Shop Team Shop Flow

    App
  27. Ad List VC Browse Flow Shop Flow App Shop Badge

    Intrepid Shop Team
  28. Ad List VC Browse Flow Intrepid Shop Team Shop Flow

    App Ad List
 Decorator Shop Badge
 Decorator
  29. Marketplace B App List Browse
 Flow Card Browse Flow Ad

    Detail VC Ad List VC Ad Cards VC Custom UX Marketplace A App
  30. App List Browse
 Flow Card Browse Flow Ad Detail VC

    Ad List VC Ad Cards VC A/B Browse
 Flow A/B testing
  31. None
  32. What have we learnt?

  33. What have we learnt? • Too much negotiation? Break it

    down!
  34. What have we learnt? • Too much negotiation? Break it

    down! • Too much overhead? Build it up!
  35. What have we learnt? • Too much negotiation? Break it

    down! • Too much overhead? Build it up! • Reuse gives you wings
  36. What have we learnt? • Too much negotiation? Break it

    down! • Too much overhead? Build it up! • Reuse gives you wings • But it implies dependencies
  37. What have we learnt? • Too much negotiation? Break it

    down! • Too much overhead? Build it up! • Reuse gives you wings • But it implies dependencies • Optimise out-of-band
  38. Test (1, 2)

  39. –Paul Stringer Use it!

  40. Loading Sirius
 Canopus
 Arcturus Could not
 load star < Sirius

    < Brightest star
 in the sky
  41. Loading Sirius
 Canopus
 Arcturus Could not
 load star < Sirius

    < Brightest star
 in the sky Demo
  42. App User Web

  43. UI layout UI flow Network gateway User Web Important code

    More important code
  44. UI layout UI flow Spies Network gateway Stubs Important code

    More important code
  45. UI layout UI flow Spies Network gateway Stubs Important code

    More important code Acceptance tests & fixtures
  46. View View Data Views

  47. View View Controller View Data Views

  48. View View Controller View Data View Spy Views

  49. Navigator Navigation

  50. Navigator UINavigation Controller Navigation

  51. Navigator UINavigation Controller Navigator Fake Navigation

  52. App Browse Flow Gateway List VC Detail VC UI flow

    Spies Stubs Important code
  53. Fixture Browse Flow Gateway List Spy Detail Spy UI flow

    Spies Stubs Important code
  54. Fixture Browse Flow Gateway Stub List Spy Detail Spy UI

    flow Spies Stubs Important code
  55. Fixture Browse Flow Gateway Stub List Spy Detail Spy UINavigation

    Controller UI flow Spies Stubs Important code
  56. UINavigation Controller Fixture Browse Flow Gateway Stub List Spy Detail

    Spy Navigator Fake UI flow Spies Stubs Important code
  57. Xcode

  58. Coda • Should every app be written like this? •

    Probably not: architecture should support your goals • But maybe every app should follow similar principles
  59. Break it down, build it up, remix it

  60. Test

  61. ed App Architectures https://github.com/dcutting/Remix @dcutting cutting.io Dan Cutting Schibsted