DrawTogether Project Overview & Case Study

Back in July I made a quick little tutorial about Sketch.js where I showed you how to create a basic web app that lets you draw on the HTML5 canvas in a similar fashion to Microsoft’s Paint (app source/demo). The demo was pretty cool and I got some positive feedback, most notably via Twitter and Codepen. As you can guess by now, the project didn’t end here and I’ve expanded it quite a bit.

Collaborative Drawing Board

I chose to expand this concept for a school project and I’m quite satisfied with the results. The basic idea of the project is to allow user to draw together (hence the name) via a collaborative drawing board. Project admins can give and revoke privileges to other users and privacy settings are available. There is also a fun gameification system which allows users to earn achievements when they complete certain tasks. Admin staff can also give people special awards (for example, community awards). Continue…

R Programming on Coursera, Review (Part of Johns Hopkins Data Science Specialization)

I heard about the R programming language a long time ago, but never really bothered learning about it until recently when I saw a very interesting course on Coursera called R Programming. It was offered by the prestigious Johns Hopkins University which certainly gave me additional incentive to sign up. Now that I’ve passed the course I am happy to give everyone my opinion about it, or rather, a full review of the course material, structure and what you can learn. Continue…

How to Make an HTML5 Drawing Board with Sketch.js and HTML5 Canvas (with Source Code)

While doing a project for class I’ve stumbled upon a very nice javascript library caled Sketch.js which was created by Michael Bleigh of Intridea, Inc. It is a small, yet powerful jQuery plugin and I’ve created a very nice drawing board application with it. I highly recommend you check out the demo and download the source code for reference before we start with the tutorial.

 View demo | Download Source

 

Sketch-JS-Tutorial

Continue…

Sieve of Eratosthenes Algorithm Explained and Optimized

An algorithm is a finite set of instructions which can be executed step-by-step to calculate and solve a problem and today we will be looking at the Sieve of Eratosthenes. This is a very old algorithm which can be used to find the set of all prime numbers between the (non-negative) integers [2] and [n] (rather, the set of primes in A=[2,n]).

The method explained here is obviously not the most efficient way to solve this problem, but it is a good explanation of how the Sieve of Eratosthenes “works”. I would also argue that it is essential to learn about this algorithm first – before you expand on to something more advanced. Also, you will notice that we can’t search for all of the prime numbers between any interval, but rather, an interval that starts at [2] and expands to [n]. However, we will expand the problem later in another post.

So, shall we get started? Continue…

CodePen Snippet #2: Timeline (Flat Design)

I’ve been messing around with LESS lately and CodePen has been a great place to work on little experiments and ideas. My latest little 10-minute CodePen Snippet is a flat-style timeline template and I have to say that I am rather satisfied with the outcome.

See the Pen Flat Timeline by Filip Danic (@FilipDanic) on CodePen.

If you need help understanding some of the code, feel free to reach out to me – I’d be glad to help you out!