Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Open Sourcing the Secret Sauce

498 views

Published on

Presented at FITC Toronto 2016
See details at www.fitc.ca

Hear and walk away with the best open source libraries and tools Jam3 has produced out of its collection of over 100 repositories. ​Learn how an​​ award​-winning agency has gone from being closed source to sharing its “secret sauce” with the community while still staying sane and profiting.​

Objective

Exploring some of Jam3’s open source gems

Target Audience

Web developers, digital agencies, creative coders.

Five Things Audience Members Will Learn

Why you should Open Source
Jam3’s Open Source tools and libraries
How to Open Source your company
How to manage over 100 Open Source repositories
How to create more reusable and modular code

Published in: Internet
  • Be the first to comment

Open Sourcing the Secret Sauce

  1. 1. All original concepts, designs and copy the exclusive property of Jam3 Open Sourcing THE SECRET SAUCE WHERE 325 Adelaide Street W. Toronto, ON, Canada M5V 1P8 Greetings, CONTACT Telephone: (416) 531-5263 ONLINE Web: jam3.com Email: info@jam3.com All original concepts, designs and copy the exclusive property of Jam3
  2. 2. MATT Lead Developer HELLO MIKKO Director of Creative Technology
  3. 3. INTRODUCTION All original concepts, designs and copy the exclusive property of Jam3
  4. 4. All original concepts, designs and copy the exclusive property of Jam3 JAM3 IN A NUTSHELL Highly experiential work Sites, Installations, AR + VR A lot of awards A LOT OF OPEN SOURCE All original concepts, designs and copy the exclusive property of Jam3
  5. 5. OPEN SOURCE AT JAM3 All original concepts, designs and copy the exclusive property of Jam3
  6. 6. 280 public repos 263 owned 17 forks - Three JS, PIXI, Mapbox etc. 7021 stars across all repos 345 forks across all repos
  7. 7. We got SERIOUS in June 2014 ∼2 public repos before that npm + modules + LOTS of small modules + Bolts vs Engines
  8. 8. INGREDIENTS TO THE SECRET SAUCE All original concepts, designs and copy the exclusive property of Jam3
  9. 9. AE-TO-JSON https://github.com/jam3/ae-to-json All original concepts, designs and copy the exclusive property of Jam3
  10. 10. History of building tools for projects.
  11. 11. INTERACTIVE DOC WATERLIFE
  12. 12. INTERACTIVE DOC BEAR 71
  13. 13. INTERACTIVE PORTFOLIO JAM3 WEBSITE
  14. 14. HTML5 DATA VISUALIZATION BJÖRK
  15. 15. ANIMATED EXPEDITION GAME HEART OF THE ARCTIC
  16. 16. INTERACTIVE DIGITAL EXPERIENCE ORANGE FUTURESELF
  17. 17. THE FUTURE OF CAR CUSTOMIZERS MUSTANG CUSTOMIZER
  18. 18. Using another app to expedite building tools is the best way to go. Designers are familiar with it.
  19. 19. After Effects is the Holy Grail. Heart Of The Arctic – Tendril created many of the animations.
  20. 20. AE Exporter npm i ae-to-json-cli -g
  21. 21. Just JSON + No renderer + Unit tests to check when Adobe changes things (make video/gif animations of unit tests
  22. 22. After I put it up.
  23. 23. MATH-AS-CODE https://github.com/Jam3/math-as-code All original concepts, designs and copy the exclusive property of Jam3
  24. 24. Explains math notation using JavaScript code samples
  25. 25. REACTION All original concepts, designs and copy the exclusive property of Jam3
  26. 26. GitHub: 2300+ stars Twitter: 490+ retweets
  27. 27. Lots of Open Source contributions
  28. 28. Chinese Translation (via Open Source contributors)
  29. 29. MATRIX BUILDER https://github.com/Jam3/MatrixBuilder All original concepts, designs and copy the exclusive property of Jam3
  30. 30. Writing tech specs is really hard. There are million browsers and browser versions.
  31. 31. How many of you use CanIUse.com?
  32. 32. Two modes (simple and advanced) Designed to be used by everyone not just devs Built on top of the caniuse's dataset
  33. 33. Matrix Builder was built by Benson Wong and Aaron Morris Benson was a student at the time - Aaron is a technical director and uses it often
  34. 34. JAM3 LESSONS https://github.com/Jam3/jam3-lesson All original concepts, designs and copy the exclusive property of Jam3
  35. 35. All original concepts, designs and copy the exclusive property of Jam3
  36. 36. All original concepts, designs and copy the exclusive property of Jam3
  37. 37. LICENSE SERVER https://github.com/Jam3/license-server All original concepts, designs and copy the exclusive property of Jam3
  38. 38. Clients and Open Source sometimes is a bit weird...
  39. 39. Clients want to know up front what open source "libraries" we will be using on projects.
  40. 40. ~20-80 modules on each project
  41. 41. How we handle this + Tell them up front ~5-10 modules we'll be using + Update them as the projects progresses
  42. 42. Before we had a vicious email / legal loop
  43. 43. Now we use License Server
  44. 44. License server + Lists all modules used on a project, what version, and license + Updates from pull requests and pushes to server + Highlights which modules are our own + One button deploy to Heroku
  45. 45. DEVTOOL https://github.com/Jam3/devtool All original concepts, designs and copy the exclusive property of Jam3
  46. 46. Run Node.js programs through Chrome DevTools
  47. 47. REACTION All original concepts, designs and copy the exclusive property of Jam3
  48. 48. 2500+ stars 280+ likes
  49. 49. Debugging in the wild Remy Sharp
  50. 50. Profiling Paul Irish
  51. 51. Mixing Node.js and Browser APIs
  52. 52. Stream <canvas> to high resolution PNG files
  53. 53. OTHER GEMS All original concepts, designs and copy the exclusive property of Jam3
  54. 54. web-audio-player Cross-platform, low level, modular, WebAudio-focused
  55. 55. F1 A stateful ui library that uses path finding
  56. 56. three-bmfont-text High quality and scalable WebGL text rendering
  57. 57. bigwheel A minimal framework for animation heavy sites
  58. 58. glsl-fast-gaussian-blur Shader components on npm
  59. 59. orbit-controls Generic 3D camera and orbit controls
  60. 60. All original concepts, designs and copy the exclusive property of Jam3 - https://github.com/jam3/ae-to-json - https://github.com/jam3/ae-to-json-cli - https://github.com/Jam3/math-as-code - http://matrixbuilder.jam3.net - https://github.com/Jam3/MatrixBuilder - http://jam3.school - https://github.com/Jam3/license-server - https://github.com/Jam3/devtool - https://github.com/Jam3/web-audio-player - https://github.com/jam3/f1 - https://github.com/jam3/react-f1 - https://github.com/Jam3/three-bmfont-text - https://github.com/bigwheel-framework/bigwheel - https://github.com/Jam3/glsl-fast-gaussian-blur - https://github.com/Jam3/orbit-controls - https://github.com/fyrd/caniuse

×