Website: https://www.codecademy.com

codecademy-dashboard

 

What I Like:

– Slick onboarding: once you enter into code editor,  you will be led by 3 tooltips (popover) showing you where to learn, type and submit, then you are ready to go. You wasted no time in video or step-by-step tutorial and can start coding as soon as possible.

– Positive copywriting: You are constantly praised by completing a course “Congratulations, you’ve finished this course!”. Sometimes you are even asked to type something like “I feel awesome!” and see it being confirmed (printed out) by computer. By setting up a supportive (sometimes with a little humor) tone, Codecademy celebrates each victory and motivates user keeping learning.

– Gamification implementation: badges and progress bar are motivating. I find myself visiting my profile page all the time, just to look at my badges and % of skill completion.

codecademy-badge

 

My Suggestions:

– Landing Page: The blinking cursor on the illustrated monitor is misleading – I thought I was able to type/code on it… It would be cool to let user type on the monitor and see results directly (see Swifty App’s website for example: http://swifty-app.com) – If used correctly, it will boost user’s confidence in coding and thus increase signup rate.

codecademy-landing

– Course/Skill Overview Page: The labels are confusing, I looked at the “Beginner required technical level” and couldn’t figure out if I was eligible to enroll. Simply reorder the text into “Required technical level: Beginner” will help a lot. (Also apply to the other two labels.)

codecademy courseoverview0

– Code Editor: The “Save & Submit Code” button is located at the bottom of the panel. Every time I finish typing on the keyboard, I have to reach to my mouse in order to click on the button. This “keyboard-mouse switching” action breaks the coding flow. After completing a dozen of courses, I found the time spent on “switching between keyboard and mouse” (and getting distracted since you can navigate to other tabs since you are using mouse) is almost the same on actual coding/typing. A shortcut on “Save & Submit Code” would be much appreciated.

codecademy coding

– Social Share: I really want to share my achievements on social media. It would be great to share a level completion (or to be more selective, share only badges) with my peers – You build a great product, let users share it!

– Social Influence: After two dozens of courses, I started feeling less-motivated and lonely. I looked at the number of enrolled students and wondered “who else are working on this course with me?” – It would be great to add more people elements such as “34 students are coding right now” or simply display a list of user (avatars) who recently completed this level/course. The goal is to provide user a sense of social relatedness so he/she is more willing to hold on to completing the course.

 

I started learning JavaScript using Codecademy a week ago. It has the best interactive learning experience I have ever seen. Wish they could provide more courses and projects in the future.