Orientation big project image

Orientation and Transition

Website for Purdue University undergraduate students orientation

The Problem

Student Success Programs, which is a department at Purdue University, wanted to redesign website for one of their programs: Orientation and Transition. Orientation and Transition conducts orientation events and provides resources for incoming freshman students at Purdue University. They were not satisfied with their current website, which was heavy on text and used an outdated template. Below are some screenshots from the old website:

Old website first image Old website second image Old website third image

My role

I worked as a sole designer and developer on this project. My responsibilities included conducting initial user interviews, interacting with the supervisor and stakeholders, designing a new look for the website, developing it using university CMS and having it ready to go live by mid-January 2017.

The Problem Approach

I started the project by having a detailed conversation with stakeholders, trying to understand what are they expecting out of this project, which parts they want to change and why. My supervisor, one of the stakeholders and I had meetings on a regular basis, to make sure I was on the right track and to get constant feedback from them. Then, I interviewed several potential users and ran a short usability session with them, using current version of the website for that. After that rough sketches and wireframes were created, which then were turned into rough prototypes built with HTML and CSS.

User Interviews and Usability Testing

In total, I have interviewed and conducted a short usability session with 1 parent and 4 students. I have used the current version of the website, to find out what areas did users have the most difficulty with. Usability Testing revealed that users were frequently confused by the vocabulary used on the current version of the website. Some users also had difficulty stating what was the main purpose of the website.

Design Process

Sketches

Initial rough sketches were created to explore different layouts:

Sketches image
Wireframes

After refining sketches, a set of rough wireframes were created:

Wireframes first image Wireframes second image
Prototype

Prototype created with HTML/CSS and Bootstrap:

Final Design

Final version of the website is currently live. Link:

Orientation and Transition

Challenges and Skills gained

Challenges

Major challenge of this project was time frame. Student Success Programs wanted the new version of the website to be live by December 12th 2016, however issues with the university CMS pushed that deadline to January 11th 2017.

Personal challenge for me was working with the university CMS, which was completely new to me.

Skills Gained

Some skills gained and things learnt:

  • Better web development and prototyping skills.
  • Got more practice in interviewing.