HCI Redesign Task

This project was completed as part of CPSC 4140 - Human-Computer Interaction in a group of five members. The project focused on redesigning a live bus tracking app to improve usability and accessibility for students and commuters.

Project Goals

• Improve real-time bus tracking and scheduling features.
• Enhance the user interface for first-time users.
• Address commuter frustrations like inaccurate updates and unclear notifications.

A0: Project Proposal

App Goal: Enhance Clemson commuter convenience by integrating multiple services related to bus usage.

Key Features:

• Accurate real-time bus information.
• Stress-free user experience through notifications and updates.
• Details on bus timing, capacity, and availability.

Current Solutions (Transloc): Existing apps like Transloc are usable but not user-friendly. Key issues include unreliable tracking, poor navigation, and limited notification functionality.

A1: Contextual Design

We analyzed user frustrations with the existing wireframe and conducted contextual research to identify specific areas of improvement. Through surveys and interviews, the following issues were identified:

• Navigation Complexity: Users struggled to find relevant information quickly.
• Inconsistent Real-Time Updates: Delays in live bus tracking led to user confusion.
• Notification Overload: Notifications were frequent but lacked clarity and actionable insights.
• Overcrowded Visuals: Excessive information cluttered the interface, overwhelming users.

From these findings, we created improved wireframes and designs with a focus on clear, concise information presentation and usability improvements.

Phase 2: Interaction Analysis & Design

Generalized Transition Network (GTN)

We developed a flowchart of user interactions to ensure seamless navigation through the app:

Key pages include Home, Routes, Notifications, and Settings.

Phase 3: Think-Aloud Testing

We conducted think-aloud usability testing to identify areas for improvement. Key feedback:

• Improved navigation clarity with bottom bar icons.
• Added legend and labels for better route visuals.

Working Prototype

We developed a clickable prototype in Figma, which was used during our think-aloud testing phase. Explore the prototype using the link below:

Final Reflection

Our redesign prioritized intuitive navigation, accurate updates, and improved accessibility to create a seamless commuter experience.

Final Report