myTrip
Interaction Design concepts for travel website
As a team in Interaction Design & Prototyping (HCDE 536) class, we had 10 weeks to design creative and engaging solutions for a specific persona in given constraints. Eventually we created a movie that displays different interactions possible using the modern day technology in a travel context.
Type
Group project with Ankur Agrawal, Riyaz Javanmardi and Siddhartha Gudipati
Project Aspects
Interaction Design, Storyboard Video Production
My Role
Carved scenarios, sketched wireframes, designed prototypes, script writing
Contributed to research, video production and presentation
Timeline
May - June 2015 (10 weeks)
The Goal
For a specific persona, designing a solution can both be easy and difficult at the same time. We were asked to create a website for supporting the travel needs of our persona. Later, we had to develop a mobile solution and envision interaction types that this solution can support in future. We sketched 40+ scenarios and fleshed out 10 of them to prepare our storyboard. We scripted the story and produced a video depicting immersive experience of our user story.
The Process
Problem 1: Xiaoyu wants to spend less when she travels but has no time to find deals.
Solution: Website to check for tailored travel deals.
Note: Website content changes when user logs in to provide personalized content
This website prototype is available below. Also available at here
Problem 2: Xiaoyu wants to spend less time planning and can benefit from mobile app that she can also use while traveling.
Solution: Mobile app to assist for planning and during-trip support
Note: Used the same process, Scenario - User Flow - Wireframing - Prototyping
User Onboarding and planning interactions
Trip planning and during-trip customization feature interactions
More screenshots of the mobile app
Key use cases for this prototype:
Change your itinerary and get suggested for more options right through a single click.
Explore more detailed information about your upcoming events in the itinerary.
The mobile app's high fidelity prototype is available below. Also available here
The above prototype also contains Information Architecture showcased in the sitemap available on left corner.
Problem 3: Storytelling for validating the interactions.
Solution: Prepared a video prototype available below.
Storyboarded multiple interactions and scenarios by sketching out ideas. Collected all 40+ ideas and picked the top 10 to implement into a scripted video prototype. Prepared script by re-arranging the scenarios in order of impact/needs of the user.
Final Thoughts
This project allowed us to work with our imaginations and design real life interactive solutions that may not be too far fetched. By the end of this project, I was able to understand a specific persona problem and create a behavior driven solution. The interactions were targeted to entice the user and provide feedback as well as call to action for user's flow. I also gained experience in scripting a video presentation and producing video demos.