Bryan Ollendyke presented on the past, present, and future of several open source projects including ELMS:LN, Web Components, HAXeditor, HAXcms, and HAXiam. ELMS:LN started as an experimentation platform to envision a next generation digital learning environment. It is now used by two colleges and a medical training vendor but requires too many resources. Web Components allow reusable elements to be shared across platforms. HAXeditor is a headless authoring experience using web components to create a platform-agnostic content authoring tool. HAXcms is a static site generator and content management system built with HAXeditor. HAXiam will be a SaaS version of HAX

1. Presented at
APEREO 2019
Bryan
Ollendyke
[at]btopro
BTO108@psu.edu

2. Agenda
1. Prequel - ELMS:LN
2. Act I - Web components
3. Act II – HAXeditor
4. Act III - HAXcms
5. Coming up – HAXiam
6. Maps ahead

3. 2012 - 2017

4. Create a Next Generation Digital Learning
Environment. Build an experimentation
platform that could allow us to envision
and communicate what a NGDLE could look
like.
The most successful applications from
ELMS:LN are a course content management
system and a studio instruction management
system.
90% of our traffic / community use-cases
call for a CMS, our studio is sugar (usage
wise).
ELMS:LN
History

10. Two colleges @ Penn state and a medical
training vendor in the UK use ELMS:LN.
- It requires a lot of resources
- Too different from stock Drupal
- Too Drupal for EDU to grep
- Powerful architecture / idea
- Drupal will never get easier
- Drupal UX is a dead end
- Web components liberate us of Drupal-isms
ELMS:LN
Reality

11. So ELMS:LN gives me a
context

12. You’ll probably never
adopt ELMS:LN
But

13. ELMS:LN is a “suite”
of technologies
on the web

14. And we all use the web
to ship our
experiences..

15. And we all use the web
to ship our
experiences..
So if we enhance that..

16. We can all be BFFs and leverage each
other’s efforts without adopting every
aspect of each other’s work.
Welcome, to Web components.

17. ACT I
Web
Components

18. 2017 – 20xx

19. My interface designer makes a
simple “button” for us to use

20. My interface designer makes a
simple “button” for us to use
My team has to integrate my
designer’s “button” X number of
buttons X number of projects

21. My interface designer makes a
simple “button” for us to use
My team has to integrate my
designer’s “button” X number of
buttons X number of projects
...My “team” will screw this up

27. Github.com
elmsln/WCFactory

28. We have produced over 384 reusable web
components.
Of these, 331 are general purpose.
They are used by ELMS:LN
They have nothing requiring ELMS:LN
We have more available elements than anyone
I can find record of, including Google.
Web
components
By
numbers

30. <vaadin-upload>

31. <grid-plate>

32. <eco-json-schema>

33. <code-editor>

34. <video-player>

35. <lrn-table>

36. <multiple-choice>

37. <iron-ajax>
<paper-button>
<simple-modal>
<self-check>
<wikipedia-query>
<lrn-math>
<user-action>
<simple-colors>
<q-r>
<license-element>

38. <h-a-x>

39. Disney / Marvel

40. ACT II
HAXeditor

41. “See, I'm a man of simple tastes. I
like gunpowder [CSS] ...and dynamite
[JS]...and ...gasoline [Web
components]!
Do you know what all of these things
have in common? They’re cheap [W3C
standards]!”
Warner Bros

42. Headless Authoring eXperience
Goal: Create the best possible authoring
experience in a platform (CMS/LMS/Desktop)
and JS library agnostic way.
Why:
- Authoring in CMS / LMS space, Suck.
- Fragmented authoring UX hurts faculty
- Needs to KNOW HTML to publish is terrible
However:
- HTML is really important
- Our platforms aren’t going away
H.A.X.

43. - 1 line to integrate <h-a-x>
+ 1 line reference <script type=“module”>
- Wire design assets direct to editor
- No platform specific housing (cough Gburg)
- HAXschema is abstraction of JSON Schema
- HAXappstore spec supplies powers run-time
- JSON that sets the rules for the env
- Block editor in context
- Search remote sources in place
- HAX produced content will work without HAX
- Can edit legacy HTML
- A11y baked into platform and elements
- We eliminate many a11y issue in web dev
H.A.X.
Features

44. - Drupal 7 / 8 module
- WordPress plugin
- GravCMS plugin
- BackdropCMS module
- Beaker Browser (Dweb browser)
- Anything that saves body blobs of HTML
And of course...
- HAXcms
In the future (and past)
- HAXcms for Desktop
H.A.X.
Integrations

45. ”People are only as good [at presenting
online course materials] as the [edtech]
world allows them to be”
The EdTech Joker
H.A.X.
Chaotic
Good
Warner Bros

46. H.A.X.
Demo
HAXTheWeb.org
Warner Bros

47. ACT III
HAXcms

48. It’s not about money.HAXcms
Warner Bros

49. - UI to build and manage micro-sites
- Flat file HTML
- git / version control
- copy & paste sharing / remix
- Headless / decoupled
- 0 Config, 100% offline capable PWA
- Stupid fast
- Theme-able
- HAXeditor as core editor
- Content outlining tool
- Drag and drop upload
- Freedom.
- huh?
HAXcms
Features

51. Stupid
Fast

52. - No vendor lock in
– Format migratable by normal people
- Static native DOM code is permanent
- CDN can host JS assets (or local)
- High scale, no power broker
- If I become a broker, can replace
- Contents do not require HAX to use
- flat HTML pages + JSON file
- Seeks 0 maintenance publishing
HAXcms
Political
Features

53. HAXcms
Freedom
U
Sez?

54. <haxcms-site-builder>

55. Github.com
elmsln/HAXcms

56. A new
challenger
approaches
HAXiam

57. The two most powerful words: I am.
Self expression.
Self identity.
The Self.
- SaaS HAXcms
- Z3R0 config HAXcms install
- Enterprise login brokering
- Lightning fast Lighthouse scores
- User flow:
- logs in, backend makes HAXcms per user
- User can publish microsites at will
- “publish” = OER, Sites, Courses (closed)
HAXiam
Ctrl+alt+del
publishing
industry

58. I generated 50,000 copies of HAXcms in 80
seconds.
- That’s not micro-sites, that’s platforms
for microsites
- like 50k users logged in
I cloned 80 micro-sites in 10 seconds
We destroy connotations of scalable FOSS
Assets come off CDN
- Ultra low cost to support
- Low resource requirements
HAXiam
Ctrl+alt+del
publishing
industry

59. HAXiam
Demo
Warner Bros

60. The
future
ELMS:LN
All The Things

61. - Learner centric learning analytics
- PWA = Offline + personal data local
- Personal web site builder / manager
- OER hub / Publishing replacement
- Course content manager
- Personal blog / portfolio replacement
We
Are
The
Future
of

62. - Minor bug fixes
- Support “app” development
- Release 1.0
github.com
elmsln/WCFactory
WCFactory
Roadmap

63. - Implement V1 spec elements
- Integrate HAXcms into content system
- Bug fixes
THAT’S IT AND YET ISN’T BECAUSE EVERYTHING
AFTER THIS ENHANCES ELMS:LN!
github.com
elmsln/elmsln
ELMS:LN
Roadmap

64. - Finish a11y audit
- Clean up bugs
- xAPI / user tracking elements
- expand image gallery capabilities
- release a “WYSIWYG” replacement component
- This drops into h-a-x
github.com
elmsln/lrnwebcomponents
LRN
Web components
Roadmap

65. - Improve grid-plate methods
- Perform a UX audit (help needed!)
- Simplify integrations / documentation
- Enable Drag and drop everywhere
- Create more pedagogical elements
yarn add
@lrnwebcomponents/h-a-x
HAXeditor
Roadmap

66. - Create an import UI
- In browser theme / css editor
- UI base fieldable content and themes
- Desktop app
- Enhance Publishing capabilities
- Improve theme documentation
- Improve themes that exist currently
- Keep producing additional themes
- Launch ODL in HAXcms w/ custom theme
- Import of many formats
- Publishing flexibility / many formats
github.com
elmsln/haxcms
HAXcms
Roadmap

67. - Create a stable release
- Support for Organizations / groups
- Documentation
- Dashboards to visualize published sites
- PSU deploying multiple courses Fall 2019
github.com
elmsln/HAXiam
HAXiam
Roadmap

68. From Many, Many.
Bryan
Ollendyke
[at]btopro
BTO108@psu.edu