Redesigned the IRCTC e-catering order status screen for Weekend Hackathon #120.
The Challenge: IRCTC passengers need confidence that their food will arrive hot and on time, even during a moving train journey. The original status screen was dense, had poor text contrast, and didn't communicate the delivery timeline clearly.
The Solution: I focused on three things:
Narrative First: Used a real photograph of a train winding through misty mountains at dawn as the hero. Two gradient scrims (top and bottom) ensure the header and caption remain readable without competing with the image. The photo sets the mood: you're on a journey, and your food understands that.
Journey Clarity: A horizontal progress timeline shows exactly where your order is (placed, confirmed, preparing, on the way, delivered). No confusion about next steps.
Accessibility & Polish: Proper contrast ratios (5.7:1 minimum on the header, 11:1 on the caption), tabular numerals for the delivery code and times so they don't shift, 44px touch targets with visible press and focus states, and full support for reduced-motion preferences.
The design fits the first fold only. No annotations. Clean, human, ready to use.
Hackathon:
uxhack.co
#UXDesign #ProductDesign #IRCTC #MobileFirst #AccessibilityMatters #Hackathon #uxhack