UX/UI
Research
Figma
Sept - Dec 2021
Course planning and registration shouldn’t have to be daunting experiences for Penn's students. The poor information architecture of Penn InTouch, coupled with the outdated look and feel of its user interface, makes surfing the site generally a painful experience.
I sketched out a couple ideas that display the information on the home page and course search page in a more organized and concise matter. I then translated these sketches into wireframes which eventually developed into high fidelity screens that incorporated Penn's branding and styles.
A student's current schedule should hold the highest priority on the Penn InTouch homepage. Given the lack of visual hierarchy in the current homepage design, it fails to accomplish this. Students must select the semester they are attempting to view, and click "Show schedule" to expand the schedule. In my redesign, I plan to displays the student's current schedule upon landing of the home page.
When asking users how often they read the important dates and deadlines listed on the homepage, all replied very rarely or never. The lack of attention given to this section seems to stem from both, the very confined card that the dates are placed in, as well as the absence of a visualization tool, like a calendar. In fact, two users explicitly stated the desire for a calendar which would help students remember future events, breaks, schedule changes, and other deadlines.
Based on the user research, there are several frustrations that arise when searching and registering for courses. Some users expressed the need for a faster, and more skimmable, browsing experience. Other users complained about the lack of useful search filters and actions for courses that are closed (maximum capacity reached). In my redesign, I plan to eliminate the frustrating course detail pop-ups, and create new action buttons that provide value to students who are registering for courses. Initial ideas for helpful course search functions included an automatic feature (I'm Feeling Lucky) that instantly displays relevant courses to each student, as well as a notification system for closed courses that become open.
There is currently no mobile responsive Penn InTouch platform. I want my redesign to be accessible to all users, whether it's accessed from a computer in the library or a phone during a commute. I knew that I needed to balance the amount of information available on mobile compared to desktop if I wanted the website to be legible and easily interactive, given the screen size difference. This meant being conscious of sizing UI elements to yield high touch accuracy, along with evaluating which information is of utmost value to users on each screen. For instance, in the above mobile course search wireframe, I decided to only display meeting date and availability status upon first glance of search results– they were the most valuable to my interviewees.
The following redesign addresses the lack of visual hierarchy, modernizes the current version, eliminates unnecessary steps within the user flow, and implements helpful features that bring value to Penn students.
Offering an updated UI that enhances usability & balances information density. Students can preview mock schedules, contact professors, set alert notifications, & filter efficiently.
Continue testing new design & conduct user research for the rest of the Penn InTouch platform.
The journey that this redesign ushered me through has been very formative to my personal design process. I knew that I needed to satisfy a broad set of needs that users, like Lola, Michael, Jordan, & Sammy, expressed, but also understood that those solutions had to be translated across devices to accommodate for different interactions and experiences with the platform.
While my redesign was focused on updating the course search flow, the primary use of the Penn InTouch, there are still other components of the platform that need to be enhanced to match the new UI and flow of the redesign. I plan to continue gathering user research pertaining to other pages, such as Academic Planning Worksheet and Course Registration, and translate those needs to design solutions.
