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

Facade.js

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Scott Doxey Scott Doxey
September 16, 2015
Programming
0
210

 Facade.js

Slides from my talk at the Boston HTML5 Game Development meetup.

Avatar for Scott Doxey

Scott Doxey

September 16, 2015
Tweet

More Decks by Scott Doxey

See All by Scott Doxey
GodotCon Boston 2025 - Building a Godot Plugin with GDExtension
Avatar for Scott Doxey neogeek
0
36
📦 Your package is out for delivery
Avatar for Scott Doxey neogeek
0
29
Purple Monkey Game Jam VIII - April 2017
Avatar for Scott Doxey neogeek
0
32
Intro to Firebase 2.0
Avatar for Scott Doxey neogeek
0
69
Intro to ES2015
Avatar for Scott Doxey neogeek
0
180
Intro to Firebase
Avatar for Scott Doxey neogeek
0
590
Intro to Facade.js
Avatar for Scott Doxey neogeek
2
320

Other Decks in Programming

See All in Programming
Rで始めるML・LLM活用入門
Avatar for wakama1994 wakamatsu_takumu
0
160
CSC307 Lecture 12
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
460
CSC307 Lecture 15
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
220
TROCCOで実現するkintone+BigQueryによるオペレーション改善
Avatar for shota sato ssxota
0
130
Python’s True Superpower
Avatar for Hynek Schlawack hynek
0
200
今更考える「単一責任原則」 / Thinking about the Single Responsibility Principle
Avatar for philomagi tooppoo
3
1.4k
AI主導でFastAPIのWebサービスを作るときに 人間が構造化すべき境界線
Avatar for Jun okazaki okajun35
0
540
AI活用のコスパを最大化する方法
Avatar for Ochtum ochtum
0
120
API Platformを活用したPHPによる本格的なWeb API開発 / api-platform-book-intro
Avatar for Takashi Kanemoto ttskch
1
120
PostgreSQL を使った快適な go test 環境を求めて
Avatar for Kotaro Otaka otakakot
0
400
nilとは何か 〜interfaceの構造とnil!=nilから理解する〜
Avatar for kuro kuro_kurorrr
3
1.6k
AHC061解説
Avatar for Shun_PI shun_pi
0
320

Featured

See All Featured
The Hidden Cost of Media on the Web [PixelPalooza 2025]
Avatar for Tammy Everts tammyeverts
2
240
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
31
10k
Lightning talk: Run Django tests with GitHub Actions
Avatar for Sarah Abderemane sabderemane
0
140
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
Avatar for Szymon Słowik szymonslowik
1
950
Done Done
Avatar for chrislema chrislema
186
16k
SEO Brein meetup: CTRL+C is not how to scale international SEO
Avatar for Linda Hogenes lindahogenes
0
2.4k
Everyday Curiosity
Avatar for Cassini Nazir cassininazir
0
150
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
9.7k
<Decoding/> the Language of Devs - We Love SEO 2024
Avatar for Nikki Halliwell nikkihalliwell
1
150
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
PRO
55
12k
Navigating Weather and Climate Data
Avatar for Ryan Abernathey rabernat
0
130
Exploring the relationship between traditional SERPs and Gen AI search
Avatar for Ray Grieselhuber raygrieselhuber
PRO
2
3.7k

Transcript

  1. Facade.js Drawing shapes, images and text in HTML5 canvas made

    easy.
  2. None

  3. Scott Doxey twitter.com/@neogeek github.com/neogeek dribbble.com/neogeek Full stack developer

  4. Why build a canvas drawing library when so many already

    exist?
  5. None

  6. The experience of building a library from scratch in a

    technology one is not proficient with is invaluable.

  7. Vision for Facade.js • Easy to use • Familiar syntax

    • Fast rendering • Small file size • Extensible via plugins

  8. Getting Started With Facade.js

  9. $ bower install Facade.js or use the CDN at http://cdn.facadejs.com/0.3.0-beta/facade.min.js

  10. Facade.js Examples

  11. None
  12. None

  13. So what is everything Facade.js can do?

  14. Core Features of Facade.js • Draw custom polygons, circles, lines,

    rectangles • Render images • Animate images via sprites • Draw Text • Group Facade.js objects • Handle the animation loop

  15. Does Facade.js do anything else?

  16. Nope.

  17. Facade.js is a finely tuned wrapper for the HTML5 canvas

    renderer.

  18. Facade.js Plugins

  19. Gamepad.js Simple customizable event binding for the HTML Gamepad API.

    https://github.com/neogeek/gamepad.js

  20. facadejs-Box2D-plugin An API wrapper for the Box2D JavaScript library. https://github.com/neogeek/facadejs-Box2D-plugin

  21. facadejs-SATjs-plugin An API wrapper for the SAT-js library, a simple

    JavaScript library for performing 2D collision detection. https://github.com/neogeek/facadejs-SATjs-plugin

  22. plastick.js A lightweight game loop framework utilizing Facade.js. https://github.com/syntaxtsb/plastick.js

  23. Demos of games built with Facade.js and Plugins

  24. None
  25. None

  26. Links • https://facadejs.com/ - Main Project Page • https://play.facadejs.com/ -

    Interactive Demos • https://plugins.facadejs.com/ - Plugin Registry • https://doxdox.org/facadejs/Facade.js - Documentation • https://github.com/facadejs - GitHub Organization • https://github.com/facadejs/facadejs-sample - Sample Project

  27. Facade.js Playground Interactive demos in an editor similar to CodePen,

    JSFiddle and JS Bin.
  28. None

  29. Questions?

  30. Thanks!