Feel free to pop into the Figma file, take a look at my workflow.
How I redesigned the Penn App’s booking management feature to allow users to alter or edit their bookings, reducing user complaints and decreasing the frequency of customer calls and front desk visits.
I took on the role of UI/UX Designer and Interaction Designer for this feature enhancement.
Feb - May 2024
(12 weeks)
Audit of Current System
Competitive Analysis
Wireframes
Interactive Prototype
Figma, Notion, Google Docs, Miro, Maze
The Hilton System offers:
The ability to select a specific room or alter your room choice with the following available information:
• Photos
• Room Descriptions
• Amenities
The Reservation Details Page offers:
The user the option to review their room selection while still being able to edit their choice with the following available information:
• Room and Plan Selection
• Total for Stay
• Guest Information
• Payment Information
Static Information:
• Room Photo
• Room Type
• Room Rate
CTA’s:
• Deposit and Cancellation Policy
• Room Rate Breakdown
• Booking Button
Users cannot select or alter the room in their reservations. This yields a higher number of complaints from users and a high instance of calls and visits to the front desks.
Allowing user to select a room during check-in improves not only the users experience but reduces friction for the hotels as well.
The plan for my first iteration included in-page links and collapsible cards, the main priorities here was to mimic key funcitonalities within the Hilton booking system, merge this feature into the Penn Play app while staying consistent with our I.A and design style, and doing both of these without creating too much friction for the user while accessing this new functionality.
• Efficiency: Booking a hotel room involves a lot of information, in-page links reduce the screen space taken up by extraneous content.
• Improves Mental Load: This layout highlights content users prefer i.e. their room type, it's cost and so on, putting the heavy content on its own pages allows users to scan the page for relevant content and actions more easily.
• Improves Mental Load : Selecting a room requires users to have a lot of information for each option, condensing that information into cards allows users to scroll through room quickly.
• Intuitive Infrastructure : Drop-down collapsible cards are frequently used in other mainstream booking apps but primarily are frequently used within Penn Play's design style.
I tested a group of 15 randomized users to stay mindful of my assumptions regarding the Penn Play app, it's functionality, and it's design style
The majority of participants found the in-app room change feature easy to use and navigate.
Room photos were generally considered helpful, though some participants desired more detailed views.
Room cost information was clear, but there were suggestions for additional breakdowns.
User were able to easily and quickly navigate flows but found themselves wanting more information regarding the rooms appearance and all additional costs that come with switching rooms.
After testing and interviewing users and discussing my findings with my Product Owner and another Designer on my team, I quickly jotted down changes and acquired consensus on all the changes I intended to make to the app.
The hotel flows required adapting some of our pre-existing components, I was responsible for updating the design system with these new components and the new buttons.
• Style Consistency: In-page links did the job but they weren't consistent with the style throughout the flow and app.
• Improves Scanability: I added cards with icons, instead of needing to scan text for each option on the page, the icons provide context as to the cards value.
• Speeds up Flow : Removing a whole screen that provided no new information allowed users to successfully complete their flow quicker and with less friction.
• Intuitive Infrastructure : Drop-down collapsible cards are frequently used in other mainstream booking apps but primarily are frequently used within Penn Play's design style.