Elm Playground
Evan Czaplicki
- Usage examples - There should be tons of tiny examples to help kids learn by example. If someone is thinking wondering how to make a diamond, they should be able to ctrl-f for spin, rotate, diamond, etc. and find an example.
- Saving - I'm not sure how classes save work. I think some just email things to themselves. So it'd be cool to have VERSIONED saving. Save with info about which compiler version, package versions, etc. so that the student's code keeps working. Or at least we'll know it can't work with the current server if we have that information.
- Student examples - Showcasing peoples' work can be really inspiring, so maybe do some curation to showcase cool examples sent in by instructors or students.
Janis Voigtländer
--
You received this message because you are subscribed to the Google Groups "elm-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elm-dev+unsubscribe@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/elm-dev/CAF7GuPHXugYfyK6D2Qy1sdjNZ3j30GhLLW4idC0h6_LjKhCXAA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
Peter Damoc
https://github.com/mukeshsoni/frolic
Frolic was created extremely fast, people on Slack could see it progress live over a few days.
With a little bit of help and guidance, it could end up catering to a lot of experimental/playground scenarios.
--
You received this message because you are subscribed to the Google Groups "elm-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elm-dev+unsubscribe@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/elm-dev/CAF7GuPHXugYfyK6D2Qy1sdjNZ3j30GhLLW4idC0h6_LjKhCXAA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
Evan Czaplicki
To view this discussion on the web visit https://groups.google.com/d/msgid/elm-dev/CAGkFuyA%3DO_zZWH3Pca-rjjKW4jjSwc8u_SD0wdoquMAHH6U_NA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
--
Sent from Gmail Mobile
Fernando Alegre
In the high school curriculum I am working on, I use Collage.path extensively for teaching students how to create graphs from scratch.
Please see an example here: http://magnet.phys.lsu.edu/code/PhysSci/2d/model01.html
My target population is 9th through 12th graders in math and science courses. I am using CodeWorld in the implementation currently being tested at a local STEM school, but I am considering Elm for future implementations. The scheduler bug, now solved (thanks so much!,) and the lack of support for Collage/Element in try-elm forced me to put Elm on hold.
I am glad to read about this new project. It is very complicated to have schools install software, so try-elm or the new elm-playground are the only options. When I was testing Elm, I still had to install and run try-elm locally, so that Collage/Element could be used. SVG is way too complicated for students. Running a local copy of try-elm would be even better if it had the ability to save student files on the server, so that teachers could view and download them, and students could collaborate by exporting and importing pieces of code for a single project. That is the feature I miss the most.
I am glad to read about this new project. I do not have much time to dedicate to programming libraries or designing APIs, but I could help testing things with high school students. But. please, include polygonal paths in your design, as they are essential for graphs (as seen in the example above.)
Janis Voigtländer
To view this discussion on the web visit https://groups.google.com/d/msgid/elm-dev/CAF7GuPGCvHKNTUaGQzFOt7%2BbMtac-DKmAYMbiA9MoTanvDDyyQ%40mail.gmail.com.
Janis Voigtländer
So now a few comments on elm-playground.
Concerning geometry, I was surprised by the absence of lines/path you already mentioned. Specifically surprised and interested by the given explanation, namely that kids seem not to have used them in the past. Maybe that has to do with the age group. For older kids, that wouldn’t anymore let themselves be called “kids”, my experience has been that they take to explicit paths quickly. Even using them when they could instead use some pre-packaged geometric form primitive like a rectangle or such. Maybe it has to do with what they have encountered in their math lessons by that age. Some already know vector notation etc.
I have been using my own picture abstraction on top of Graphics.Form, much as in elm-playground, simplifying by taking some options like filled vs. outlined away. What I found students had problems to come to grips with, and which is inherited from the Form library, is the interplay of move, rotate and group.
Something about the current elm-playground design I would be wary of is how time is treated. One natural step after shapes/images is time-dependent animation. For this, it is most natural to be able to have access to “current time”. In the elm-playground setup, this is not available. Instead, the student would have to manage time in the memory model, storing the last current time there, and using whenTimePasses to explicitly update it. Only then they will have access to the current time when rendering a view. Likewise, if they want to do an update depending on the total current time, they have to access the memory to get the time, and this so to speak “concurrently” to also updating that time in the memory with the latest time diff. I’d be worried about this as a hurdle in students’ progress toward something that is conceptually quite simple: “animation = function from time to picture”. What I have arrived at in my setup for the school projects (essentially my own playground-like setup) is to manage times in the background and provide it to the student functions. Much like you do with mouse positions, where in elm-playground you also don’t expect students to store the latest position in their part of the model and to update it themselves on some mouse move action. Instead, your framework does it for them and just gives them the ready made value when they want to have access to it.
In fact, the ultimate displayWithState function in my playground (the analogue of your play function), has taken these arguments:
(Int,Int)left bottom corner and …(Int,Int)right upper corner of the part of infinite plane to render((Float,Float) -> Float -> state -> Picture)view functionstateinitial state(Event -> (Float,Float) -> Float -> state -> state)update functionMaybe Timingchoice of things likeEvery 0.2orAnimationFrame(orNothingto not have a timer running)
The (Float,Float) in both view and update function is the current mouse position, the Float in both view and update function is the current time. There is some redundancy there, in that one could argue one does not need the current time in both places, because it’s enough to have it in update, since if one wants it in view one could first store it in the state in update, then access it from there in view. But in practice, I have found it worth having that redundancy, since it simplifies things for students. Sometimes they really want time specifically in update, sometimes really only in view. Actually, you have the same redundancy with Mouse in elm-playground. It both being an argument to view and also (through Computer) to the update functions.
Having three update functions is an interesting choice. I instead had a single Event type, whose constructors are Space, Left, Right etc. and A … Z for keys, and Click for mouse click. I can’t tell which is better, not having used or even considered something like in your design.
As a note not on the library but on the environment in which kids work with it: What I have found was very useful to them was having live info about coordinates in their plane. That is, while the code they have written is running, they always get displayed the mouse position. That helps them position new elements, adjust values in formulas they use for animation, etc. Also, they can turn a coordinate grid on to further help them. An example can be seen in this example output of a task set them. Note the display below the canvas, and what clicking the checkbox does. They always have this on while they develop. But the library also exports a function that lets them run their project without these visual aids. For example for when they have finished a piece and want to show it off at home without those helpers being visible.
As a last remark about what you asked about in your original email, concerning the ability to save/share work. YES, that would be great in any /try-like setup. I like how share-elm allowed to do it, by generating a URL that one could save and give to someone. But really anything that enables saving and retrieving in whatever way without having kids copy and paste code to text files or email would be great.
Oh, and finally let me say that working with schools is something I do purely on the hobby side. So a lot of this from my side is anecdotal, as it hasn’t been accompanied by educational-scientific evaluation as some of the more professional outreach programs like at McMaster maybe (?) have been. They probably have more solid insights with evidence rather than just felt experience.
John Kelly
- Drawing: draw elements
- Animation: draw with time (influenced and in direct response to a comment by janis)
- Simulation: draw with time and mode
- Interaction: draw with time and msgs
To unsubscribe from this group and stop receiving emails from it, send an email to elm-dev+u...@googlegroups.com.
John Kelly
Evan Czaplicki
To view this discussion on the web visit https://groups.google.com/d/msgid/elm-dev/07a62fde-a0d7-4327-95b3-a780ad668b19%40googlegroups.com.