How do you Make A Skill Map for Tutorials

Hi there,

I created some resources a while back to make a platformer based around the ideas of starting with a basic template and offering learners the choice of what they want to add next.

Now that we’re out of lockdowns I’m working with learners again.
I’d love to make a skills map like the ones on the front page. The only difference would be that there would be no need to lock different paths. But I would love learners to keep a record of what they have completed.

Is there any help for how to do this available?

Many thanks

1 Like

So I’ve found this -

I will try to see if it fits what I want to use it for. But will come back and ask questions here.

1 Like

Hi! Yes, the skillmap docs are the right place to look for this. Unfortunately we do by default lock activities in a path until the previous one is completed. But if you have many disconnected activities, they will all be unlocked!

I recommend basing your skillmap off of the repository, but definitely let us know if anything doesn’t work or if there’s an effect you want that you don’t know how to achieve.

hi shakao - thanks for getting back to me. I’ve downloaded that skillmap and I’m poking around.

I just want to say to start that I think these skill maps are a great development. I think it really helps with learner navigation and motivation.

I wrote a bit about this in a book chapter about game making I’ve just finished.

Physical Maps of Missions: To support younger coders unsure what to do next or who struggle to stay on task, I sought to create another kind of map to help them navigate their game making journey. I printed out a large-scale colour map of a coastal landscape stylised in a way that mirrored a map used for navigation in an quest-themed computer game. The game pattern missions where represented as different islands . Learners took time to create and personalise a movable marker representing themselves. When learners selected their next mission, they moved their counter to the relevant island. Thus learners had to be intentional about their next goal and were implicitly encouraged to stick to it. They also kept a track of the missions that they had completed by tracing a trail as they progressed. In addition the colourful, physical and visual representation served to encourage a sense of community and peer learning. When moving the counter on the map I prompted them to reflect on the coding concepts or other learning dimensions that they have been working with. As learners traced a trail between the different island/missions they had visited, the map provoked learners to reflect on their journey and progress. This approach may be too labour and time intensive for many class environments. I am currently investigating replicating this process using online tools to reduce complexity and preparation time.

So you can see how this online way of recording progress would be great. I may well struggle to fit all of the patterns / features into one skill map. I’m working with about 25 -

So any advice is welcome.

One question - I noticed the following

alternatesources : combine progress info from the skillmap URL linked here into the progress stats for this skillmap

Could this help me break up the achievement map? Are there any docs on this? How would users navigate between skillmaps?

Also another question / possible feature request that would help fit in more to a skill map. It is possible to arrange more that one path / standalone activity on each line?

Forgive the primitive mock up.

Many thanks!

Oh wow yeah, 25 activities is definitely going to be one of the biggest (if not THE biggest!) skillmaps we’ve seen yet haha.

Unfortunately alternatesources is for moving progress from a renamed map, eg if we split microsoft/big-space-map into microsoft/space-part-1, we use that field to port the user progress from “Big Space Map” to “Space Part 1” and it only carries progress between activities that are identically named, if that makes sense.

I think the features you might find useful (neither of these are currently documented but I’m writing something up after this post!) are:

actions: You can include a list of “actions” in a completion node (example here under the space-cert-1 node), these actions are formatted like Markdown links and they pop up in the trophy modal (you can see it in the trophy node here)–let me know if you want more detailed formatting information!

layout: manual: In the same space map above you can see the * layout: manual bullet which specifies that the entire layout is manual instead of computed by us. Then in each activity node you can see a position bullet which is just (x y) position treating the map as a grid with (0 0) in the top left.

Hope that helps! Definitely let me know if you have any questions about any of this!

Great - with the layout manual I do think I’ll be able to fit them all in.

Also there are some of the 25 activities that are grouped, ie adding an enemy, before adding a moving enemy. So not all will be disconnected.
I think this will be a fun resource and reflects the non-linear approach of teaching that I love that is good for promoting learner choice and agecy.

I remember from doing tutorials before that the process takes a certain amount of faith, as even with doing github releases and using incognito browser sessions, there does seem to be quite a delay in updating the user facing skillmap at

I don’t suppose you have any other tips to reduce that delay?

1 Like

Hmm, are you doing the releases from the Github website or from the MakeCode “Github view” page? I believe doing a release from the MakeCode end should make the update almost instantaneous (or just a few minutes), but definitely let me know if that’s not the case, we don’t test this very often and it may have regressed.

From my tests - the following puts path 2 and activity 2a on a new line for example.
Is there anyway it could be place on the same line?

extra lines omitted.

## Path one
* layout: manual

### Activity 1a
* position: 0 0

### Activity 1b
* position: 1 0

## Path two
* layout: manual

### Activity 2a
* position: 2 0

Thanks for the tip. I’ve swapped over to editing online instead of locally. On the github view page I can’t see how to make a release there. I don’t see a release zone like the one in this video.

just history and extension zome

I’ve investigated the layout manual option.
In the example that option is placed in the ## level which starts a new path.
Am I able to use it to place different paths on the same row? as in the first line of the mock up image above?
If so would I place the layout manual option higher up?


Hi there,

I just wanted to check back on the main question above which is about how layout manual works.

I can go ahead and work with the limitation of each path being on a new rom if there is that limitation.