The Web Dev app is the third project in the Google UX Design course. I felt very passionate about it. I have also studied web development and currently have a job where I use those skills frequently. I chose this project to design a specific app that will give users a valuable skill, whether in a traditional job or a freelance position.
Web Development is a valuable skill to learn and could lead to a fantastic career. Currently, there are not enough developers to go around. The team at South Jersey Coding Camp wants to create a solution that will be able to reach more users regardless of the technology they use.
The goal is to build an app that will teach users web development and offer interactive assignments and quizzes in the app to challenge users.
The first idea was what kind of videos we should make to help people learn about coding for websites. Users have stated they know more with hands-on experience than just watching a video. However, our research discovered something different. Our personas did not want to watch videos but wanted an interactive learning platform—something that would give them a quiz after reading a lesson and typing the code in themselves.
My research for the web development app led me to create a persona that most people can associate with every day. A person using a mobile phone app to learn web development is generally someone who leads a busy life. This persona reflects such a person.
The main goal of the wireframes for the web development app was to ensure that users would understand what was on screen. Since quizzes and interactive code inputs needed to be implemented, I wanted to make sure these elements made sense to the user.
1: Some users did not want to scroll when reading information. Wanted different screens to consume the different learning.
2: Input and output screen on the same page was confusing.
3: Some users wanted a progress bar to track how far along in the lesson they are in.
The web development app went in a different direction in terms of its design and color. I wanted to use a lighter cream color for the overall design. The buttons also stood out more, giving them a more computer feel while still drawing attention to them for the users. The code input screen was unique, as I used a darker color. I also used a more creative font called Robot Mono, which gave the design a distinctive look.
User Research is essential. My testing reflected this statement when I had users try out the app's wireframes. Most didn't have anything negative to say about the flow itself, which made me very happy and confident. My biggest struggle was finding a good design language for the web development app. One feature that I should have added was gamification. When updating the app in the future, I intend to add gamification so users feel a greater need to return to the app to learn and compete with their friends or other users.
The Web Development app had an apparent goal that I could associate with. I have done web development over the years, so I wanted to create something to help others learn a valuable skill. There are some features I would like to ask users what they like to be added to the app, like gamification features or a scoreboard. These features are prevalent on other apps like Duolingo.
