iteration-4.png

Udacity

Udacity

About

In Fall 2016, I took a course called Interfaces to Information Systems. As a part of this course, I was required to analyze and redesign a popular website in order to make it more usable. I chose Udacity . 

Udacity is a website that offers online courses to students all over the world. Redesigning this website proved to be challenging as on the surface it looked like a perfect website but digging deeper into it revealed some vital usability problems. 

Detailed description of this project can be found at the Udacity Redesign Website

Softwares: Balasmiq, Sketch, UXpin, Invision, Axure. 

My Process

I follow the Design Thinking process suggested by IDEO. I divide my work into three stages:

 

Inspiration

Udacity is a very well designed website. I was impressed with how systematically the information was arranged and presented. Another striking feature of the website was that all the courses had a dedicated video shot for it. This made understanding the course much easier. 

The Udacity home page 

However, some oversights in the design appeared after I performed Cognitive Walkthrough(CW) and Nielsen's Heuristic Evaluation. Along with that I performed User Study based on the methodology suggested by Krugg which highlighted more errors in the design of the interface. This was extremely interesting to me. After a cursory glance of the website initially I had deemed this website "perfect" but a systematic analysis of the website revealed some crucial errors. I identified the following errors in the website based on those studies. 

1. Payment information: I believe that this is a pretty big problem with this site. Not knowing what you are paying for could be a deal breaker for a lot of people (especially students).

2. Search Box: The catalog button contrary to my beliefs turned out to be easily discernible. But the users did point out the need to have a search button on the website. 

3. Scrolling: I like the fact that they have all of their information on the home page. But what it is doing is introducing a lot of scrolling to the home page. I believe that this is a very heavy trade off for a website which has a lot of interesting links in the footer section. Nielsen talks about an “aesthetic and minimalist” design. I believe that should be followed in this case.

4. Sign up/Sign in: Udacity has the sign up/sign in option in the my classroom area of the website. I think it is a pretty standard practice to introduce those options on the home page.

Ideation

Iteration 1 

Iteration 1 

I started with creating prototypes that addressed the problems I had identified in CW and Heuristic Evaluation. The first Iteration that I created could be seen in the above figure. The problem with the original home page is that there are some really ambiguous terms on there. For example, I have no idea what business means. Also, there is video on nanodegree but the user study pointed out that none of the users I conducted testing on watched the video. Also, there is no search option for the catalog. Except for the video problem, I took care of other problems in Iteration 1. I suggested an alternate Iteration 1 which can be seen below.

Alternate Iteration 1 

Alternate Iteration 1 

And then I commenced on a vigorous journey of creating more Iterations or Ideas that solved some problems but compromised on others. This was fairly interesting because small changes made a lot of difference to how I viewed the interface and how a potential user could view it. Some of the ideas that I came up with could be seen below

Iteration 2 

Iteration 2 

Iteration 3

Iteration 3

The Design Rationale behind these Iterations could be found at this link

Implementation

After a lot of deliberation and redesigns, I came up with the final prototype that can be seen in the below images. I believe that it addresses a lot of problems that  I identified with the original website. Also, the fixes suggested should be fairly easy to implement. 

Final Design of the Home Page

Final Design of the Home Page

Final Design of the course Page

Final Design of the course Page

A working prototype of my redesign could be found here.

Interesting experiences

While working with the Udacity website, I encountered a very interesting problem. The design of the site kept on changing every time I opened it. I later found out that they were performing an A/B testing with the layout of the site. But it was pretty challenging to work with the continuously changing design.   

Smit Desai