A few days ago, I got an email stating that I was accepted for this year’s Summer of Haskell! My project is on CodeWorld, a variation of Haskell which makes it easy to teach functional programming to kids. This proposal aims to incorporate an easy way for them to share their projects and even turn them into working android apps. I am delighted to be participating this year and hope to make a significant contribution to the Haskell community.
Here is my proposal -
This project aims to implement several changes in the CodeWorld web
interface that make sharing projects and interacting with the student
community easier. This includes project exporting options, and a gallery
to share completed projects.
Students at CodeWorld build a wide variety of projects, ranging from
constructing simple pictures and animations, to running simulations and
interactive games. Being able to export projects will allow students to
go from making a small coding project to building a tangible result.
After these exporting a sharing features are implemented, students will
be able to seamlessly showcase and display their work, be it by
uploading a video of their creation to YouTube or putting it on the Play
store for their friends to download and enjoy. They will also be able to
upload it to the project gallery and share it with the other CodeWorld
community members. That is the ultimate goal of this proposal - to bring
in an easy, integrated and safe system to share and display the work
that students do.
Several of these changes are mainly based off of the interface and
collaboration related improvements in the ideas list and also the
current open issues.
One necessary component for the rest of the features to play along
nicely is a way for students to login and interact, without exposing any
details like their name email. This is described below.
Tackling the problem of safe authentication seems to be a central issue when dealing with student communities and interactions, and this new unified login system can be built on top of the existing Google account based login. After logging in with a Google account, students will be able to choose a unique nickname for themselves. We can have some friendly auto-generated names, like how it’s done in the game Kerbal Space Program. This will be the username with which they are identified in the gallery.
Other aspects of implementing login are described under the respective
Animation and Simulation Exports
Currently, there is no way to export a CodeWorld animation or a
simulation to a video and download it (Issue
CCaptureJS library seems to be
capable of solving this problem, and exports to WebM and GIF formats,
using the Whammy.js and
gif.js libraries respectively.
I’ve tested the export and download features
here. There don’t seem to
be any issues exporting a fast canvas animation to video.
The only hiccup with this is library is that it does not have cross
platform support. GIF is supported on all platforms but WebM currently
works only on
Chrome. Due to the
wide Google Chrome adoption, WebM export can be implemented alongside
GIF with a browser detect first. WebRTC is another option for video
but Safari doesn’t currently support it. We could however experiment
with it as a means of exporting video outside Chrome.
My opinion is that this feature would add quite a bit of value, as it
would give students a more tangible product at the end of their coding.
This was discussed in detail in the context of Android/iOS exports over
at Issue #22, but I
feel that a video export will also serve a similar and instant purpose.
This lets students share their work very easily.
Going along with the theme of exports, mobile exports using Cordova are
also possible. iOS exports can’t be directly distributed, and would have
compiled by the student locally with XCode, but Android apps can be made
into APKs. I have tested this with a simple canvas already, and pointer
and touch events work fine when porting to Android. We could also use a
WebView if we need to, so I think exporting to mobile is going to be
Sharing of Projects - A Gallery
Another way of improving interactivity and giving students access to a
richer set of examples would be to have a common sharing platform. This
could be a gallery of projects, accessible from the landing page with
code linking, just like the existing guide. The purpose of this is to
offer a very quick dive into CodeWorld for the first time user, and also
present an attractive way for people to browse through projects and
code. We can implement this as a pop-out menu from bottom pane, with
thumbnails, and also as it’s own page. A very basic gallery is already
in place in CodeWorld here, but this gallery
needs to be built manually and does not link to code.
Through this new implementation, students can add their own projects to
the gallery and browse through other people’s projects as well. I
imagine the UI will be something similar to browsing through video
thumbnails on YouTube.
A few features of the sharing system could be :
Students will be able to click a single button and have their project
and code shared. Optionally, they can add a description and tags.
If CCapture ends up being used for exports, we can also generate a
thumbnail for the project with it. This would make for a nice looking
Star other projects to add them to your saved list, for easy reference.
Students might find this useful for working on projects similar to
another one they’ve found.
Track how many times a project has been viewed and have sorting options
based on popularity. Whether or not the no. of views needs to be
revealed is up for debate!
Generation of thumbnails would again be facilitated by the export
feature. If CCaptureJS is going to be used, it already supports an
export to image feature on all platforms. Members can star other
projects, and we can hence list them by popularity, rating, etc. The end
objective would be to create a cohesive and interacting CodeWorld
Interacting with my mentor and the larger community. Getting familiar
with the codebase and charting out a plan for how to best execute the
points of the proposal.
Exporting projects - Video and hopefully also Mobile, ready and running
Gallery feature, and integrating all the components - sharing from the
editor, collaboration, gallery, and login - together.
Export to Android feature, Polishing up, finishing any left over work,
and cleaning up the codebase (documentation, etc.)
The CodeWorld project is a way to help beginners learn Haskell and FP
concepts, and hence improving the interface and usability of the website
is a way to develop the community and cultivate greater adoption of the
language. One of the goals of this project is to give students a better
incentive for writing code.
I have been watching the CodeWorld repo over the past few weeks and
understanding the codebase. I closed a small issue as well.
I have completed my sophomore year in Computer Science and Engineering.
I have been learning programming for about 4 years, with a 2 year C++
course in school. I’ve done a lot of web development, and have also
Haskell for about a year now, and find the functional paradigm
interesting and intriguing. I have implemented some simple esoteric
languages in Haskell and made small webapps in the Happstack framework.
As a growing developer and a novice in Haskell, this project will be an
excellent opportunity to learn a lot and also get to work with some
incredible people. I have always been fascinated and inspired by Open
Source Software, and this could be my first major contribution.
I’ve been a lot more active on the #haskell IRC while researching both
for this proposal and my other small Haskell projects, and have learnt a
lot from the community. Since the CodeWorld project is based on GHCJS
(which I haven’t used all that much), I hope to participate in the GHCJS
community as well.
I also hope to blog about my progress. I have had a Hakyll blog set up at venkatraman.me/blog for a while now, and if accepted (Which I am), I’ll update progress regularly. (Which is here :) )