Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Facade.js
Search
Scott Doxey
September 16, 2015
Programming
0
190
Facade.js
Slides from my talk at the Boston HTML5 Game Development meetup.
Scott Doxey
September 16, 2015
Tweet
Share
More Decks by Scott Doxey
See All by Scott Doxey
GodotCon Boston 2025 - Building a Godot Plugin with GDExtension
neogeek
0
1
📦 Your package is out for delivery
neogeek
0
18
Purple Monkey Game Jam VIII - April 2017
neogeek
0
27
Intro to Firebase 2.0
neogeek
0
58
Intro to ES2015
neogeek
0
170
Intro to Firebase
neogeek
0
580
Intro to Facade.js
neogeek
2
320
Other Decks in Programming
See All in Programming
GitHub Copilot and GitHub Codespaces Hands-on
ymd65536
2
150
Goで作る、開発・CI環境
sin392
0
260
NPOでのDevinの活用
codeforeveryone
0
870
AI Agent 時代のソフトウェア開発を支える AWS Cloud Development Kit (CDK)
konokenj
5
650
AI駆動のマルチエージェントによる業務フロー自動化の設計と実践
h_okkah
0
210
「テストは愚直&&網羅的に書くほどよい」という誤解 / Test Smarter, Not Harder
munetoshi
0
190
Rubyでやりたい駆動開発 / Ruby driven development
chobishiba
1
750
Quand Symfony, ApiPlatform, OpenAI et LangChain s'allient pour exploiter vos PDF : de la théorie à la production…
ahmedbhs123
0
210
なぜ適用するか、移行して理解するClean Architecture 〜構造を超えて設計を継承する〜 / Why Apply, Migrate and Understand Clean Architecture - Inherit Design Beyond Structure
seike460
PRO
3
790
MCPを使ってイベントソーシングのAIコーディングを効率化する / Streamlining Event Sourcing AI Coding with MCP
tomohisa
0
160
オンコール⼊⾨〜ページャーが鳴る前に、あなたが備えられること〜 / Before The Pager Rings
yktakaha4
1
770
PHP 8.4の新機能「プロパティフック」から学ぶオブジェクト指向設計とリスコフの置換原則
kentaroutakeda
2
1k
Featured
See All Featured
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Designing for humans not robots
tammielis
253
25k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
50
5.5k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
21k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Optimizing for Happiness
mojombo
379
70k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.6k
Designing for Performance
lara
610
69k
Statistics for Hackers
jakevdp
799
220k
Transcript
Facade.js Drawing shapes, images and text in HTML5 canvas made
easy.
None
Scott Doxey twitter.com/@neogeek github.com/neogeek dribbble.com/neogeek Full stack developer
Why build a canvas drawing library when so many already
exist?
None
The experience of building a library from scratch in a
technology one is not proficient with is invaluable.
Vision for Facade.js • Easy to use • Familiar syntax
• Fast rendering • Small file size • Extensible via plugins
Getting Started With Facade.js
$ bower install Facade.js or use the CDN at http://cdn.facadejs.com/0.3.0-beta/facade.min.js
Facade.js Examples
None
None
So what is everything Facade.js can do?
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
Does Facade.js do anything else?
Nope.
Facade.js is a finely tuned wrapper for the HTML5 canvas
renderer.
Facade.js Plugins
Gamepad.js Simple customizable event binding for the HTML Gamepad API.
https://github.com/neogeek/gamepad.js
facadejs-Box2D-plugin An API wrapper for the Box2D JavaScript library. https://github.com/neogeek/facadejs-Box2D-plugin
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
plastick.js A lightweight game loop framework utilizing Facade.js. https://github.com/syntaxtsb/plastick.js
Demos of games built with Facade.js and Plugins
None
None
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
Facade.js Playground Interactive demos in an editor similar to CodePen,
JSFiddle and JS Bin.
None
Questions?
Thanks!