Strange Loop Conference | "Diagrammar: Simply Make Interactive Diagrams" by Pontus Granström (Strange Loop 2022) @StrangeLoopConf | Uploaded 1 year ago | Updated 2 days ago
Diagrams are crucial for communication and learning in STEM fields. Creating them involves repeated patterns, consistent components, exact positioning, and, ideally, user interaction. A programming language has right the tools to do all of the above, but much of its power is only available to career programmers, gated behind the complexity of things like SVG, CSS, JS, and handling user input.
Diagrammar is a tool for creating interactive diagrams, that aims to be much simpler, while retaining the power of a full programming language (Elm). It was designed for making online STEM courses at Brilliant, and we make full use of this power: parametric reusable diagrams, authors sharing toolkits and styles, precise positioning -- and any diagram can be interactive!
In this talk, I will give you a quick tour of Diagrammar and its primitives, share ideas for designing simple, learnable tools, and tell you what we've learned from authors creating thousands of diagrams across dozens of courses.
Pontus Granström
Namna, Brilliant
@pnutus
I direct and design interactive courses and tools for STEM at Brilliant. I previously studied music composition and physics, taught university math, and worked on tools and visual effects at Ubisoft. I love learning and teaching, I still dabble in music, and I have a deep interest in thoughtful and unique game design.
-------- Sponsored by: --------
Stream is the # 1 Chat API for custom messaging apps. Activate your free 30-day trial to explore Stream Chat. https://gstrm.io/tsl
Diagrams are crucial for communication and learning in STEM fields. Creating them involves repeated patterns, consistent components, exact positioning, and, ideally, user interaction. A programming language has right the tools to do all of the above, but much of its power is only available to career programmers, gated behind the complexity of things like SVG, CSS, JS, and handling user input.
Diagrammar is a tool for creating interactive diagrams, that aims to be much simpler, while retaining the power of a full programming language (Elm). It was designed for making online STEM courses at Brilliant, and we make full use of this power: parametric reusable diagrams, authors sharing toolkits and styles, precise positioning -- and any diagram can be interactive!
In this talk, I will give you a quick tour of Diagrammar and its primitives, share ideas for designing simple, learnable tools, and tell you what we've learned from authors creating thousands of diagrams across dozens of courses.
Pontus Granström
Namna, Brilliant
@pnutus
I direct and design interactive courses and tools for STEM at Brilliant. I previously studied music composition and physics, taught university math, and worked on tools and visual effects at Ubisoft. I love learning and teaching, I still dabble in music, and I have a deep interest in thoughtful and unique game design.
-------- Sponsored by: --------
Stream is the # 1 Chat API for custom messaging apps. Activate your free 30-day trial to explore Stream Chat. https://gstrm.io/tsl
