SuperHi is a coding school that teaches people how to code websites – both via online and in person classes in NYC and London. The lessons are taught using SuperHi’s own code editor.
This case study shows the process of how I helped improve the interface of the code editor and designed features that made it a tool that aids and encourages autonomous learning.
When I started working on SuperHi I was attending the classes myself. That way I could work closely with Rik Lomas, the founder, brain and developer of SuperHi as well as other students on the course. Attending the lessons myself gave me in-depth insight into the struggles of someone who is new to learning how to code and also allowed me to observe what other students on the course were struggling with.
At the time the code editor was still in closed beta and I was supposed to help get it ready for launch in early 2016.
We looked at plenty of other direct competitors. From Atom, a well known code editor to Macaw, a web app that translates website designs directly into code. We tried, tested and analysed their features, interfaces and how they onboarded new users. The advantage of SuperHi was that you only had access to the code editor when you were a student. That meant that we could skip a complicated and lengthy onboarding process and could focus on the features that encouraged autonomous learning and support when students were writing code outside of the classes.
In order to attend the coding classes every student had to apply online and provide both a basic profile as well as their motivations why they want to learn how to code their own websites. This gave us a great understanding of our personas and their goals. To stay in touch with the students we used a Slack channel. This proved to be the best way to provide support, respond to feature requests or introduce and test new features.