Introducing “XPLORE” — AN LOCAL CONNECTION AND CULTURAL EXPERIENCE APP.
“Xplore” — An app offering authentic cultural experiences and local connections. It goes beyond typical tourist perspectives, providing users with a genuine way to engage with the local way of life.
This approach aims to significantly boost user conversion rates by offering more than just tours, creating a lasting impact on travel enthusiasts who seek exploration in terms of culture and geography.
Now, let’s delve into the journey of building the “Xplore” app.
THE FINAL SOLUTION
Let us take a look through how Users can do multiple actions in the app
WHAT ALL CAN YOU DO HERE?
MULTIPLE FLOWS WHICH THE USERS CAN TAKE
SCREEN EXPLANATION
Top bar consist of Edit option in the location section and also filter option for the users to choose what they really want
I had added a Plus icon and given two paths there, the User can either choose to book a guide or a trip.
This makes the app structure easier, fulfilling the users need quickly and even Increase the rate of Conversion due to easy accessibility.
Users can add new locations from recommendations to their list by clicking on the Plus icon, and create a trip itinerary with them
The auto-fill feature provides users with a rough agenda outlining their activities throughout the trip.
Tabs provide a user-friendly representation of content for easy navigation.
The user will be easily able to switch from different tabs.
In the “My Bookings” section, users have the option to share their experiences.
Within the “Cancelled” tab, there are selectable chips allowing users to indicate reasons for canceling their trip.
LET US LOOK AT SOME OF THE MAJOR CRITICAL DECISIONS I TOOK DURING THE PROCESS
Why Is this Important?
During user interviews, I observed that individuals take trips seeking peace of mind and prefer a hassle-free process when selecting and booking a guide.
To enhance convenience, a default guide has been set, allowing users to change to another preferred guide under valid circumstances at any time.
Some more options that I had which did not work out were,
Initially, I considered providing users with the option to manually select a guide.
However, I realized this could be time-consuming and might cause users stress in choosing the right guide for their trip.
To alleviate this burden, I opted for the automatic assignment of guides.
2. THERE ARE NO ACTIVITY CARDS IN THE “PLAN A TRIP” SECTION.
I assumed that the user might not be familiar with every place in the destination. Therefore, the guide will curate a list of local places based on the user’s preferences.
Additionally, users have the option to manually add places to the list. An auto-fill option was incorporated to automatically plan a day in the trip.
HOW UTILIZING COMPONENTS AND A COMPONENT LIBRARY CONTRIBUTED TO THE EFFICIENT SIMPLICITY OF MY DESIGN.
I implemented a range of component properties for the top bar, featuring numerous icons and different texts.
This approach simplified the design process as I didn’t have to create a new top bar for each screen instead, I could just add the necessary properties.
I also employed components and variant properties in the “Places to Visit” card on the “Plan an Itinerary” page.
Components and variant properties were applied in guide profiles for seamless selection between different options.
I incorporated Boolean layer properties in the upcoming, completed, and cancelled sections to simplify indicating the active state.
I utilized components and variant properties across various types of activities on the activity page.
UI Components and Library
TAKE A LOOK AT THE CHANGES THE I MADE AFTER TESTING MY INITIAL PROTOTYPE WITH USERS
Your Bookings:
The user faced difficulty distinguishing between upcoming and completed tasks with a quick glance, especially in situations with numerous cards, which could potentially lead to chaos.
Bottom Bar:
The user faced difficulty navigating to the provided options and proceeding when given a task.
Search Page :
When assigned the task to book an activity of choice, the user actively sought a specific type of activity to select and proceed with.
Hire a guide page:
A user, when prompted to book a guide, navigated all the way to the guide description page. At that point, she inquired about the location of the filter option for selecting a female guide, expressing a preference for her convenience during the activity.
Cancelled Bookings:
In the “Share Experience” box within the “Cancel Bookings” section, users might skip providing the reason for canceling their bookings. To address this, relevant chips containing possible reasons have been added for users to choose from.
NOW, LET ME WALK YOU THROUGH THE DESIGN PROCESS THAT LED TO THE FINAL SOLUTION.
✅MILESTONE 1
UNDERSTANDING PROJECT BRIEF AND INITIALIZING HYPOTHESIS
I began by analyzing the project brief provided to me, creating a rough outline of the potential features for the application. Some of these initial ideas include:
I drafted the user flow, mapping out how a user progresses through the app, anticipating their next steps and identifying what they are likely to search for.
IDENTIFYING PAIN POINTS AND OPPORTUNITIES
- Discussing pain points is where the “HOW MIGHT WE” questions proved to be immensely helpful, allowing me to delve deeper into the user experience and anticipate the user’s expectations from the application.
- While crafting “How might we” statements, I noticed various potential answers, prompting the creation of multiple user stories for a single question.
Following the identification of pain points and opportunities for improvement, I translated them into sketches outlining my ideas.
A clear-cut paper wireframe, derived from a collective set of wireframes and multiple iterations, facilitates an easy transformation into UI screens.
✅MILESTONE 2️⃣
HOW DESK RESEARCH HELPED ME REFINE MY HYPOTHESIS?
After drafting wireframes, I sought validation for my assumptions. To gain deeper insights, I initiated desk research, exploring competitor apps (both direct and indirect).
This opened up numerous possibilities for presenting information effectively.
I initially overlooked considering the user’s perspective, and I only realized this gap during my user interviews, which was a valuable insight.
HOW I GOT VALIDATIONS THROUGH INTERVIEWS?
Talking to users was fun, but getting the clarity of what they really want was a bit challenging.
✅MILESTONE3️⃣
TRANSFORMATION INTO UI SCREENS
After gathering insights from user interviews and desk research, I made adjustments to the paper wireframes and eventually transformed them into UI screens.
The transition from planning in the sketch to actual UI implementation brought its own set of challenges.
I noticed some inconsistencies, and it was only during the initial UI draft that I realized the potential for enhancements in certain screens. I made note of these observations and later worked to align and refine them.
After multiple iterations, I ultimately arrived at the final design and seamlessly integrated them into my ultimate solution.
And Oh!! here is a glimpse of my connections of screens in prototype!!
I seem to like it!! pretty right?
✅MILESTONE 4️⃣
TESTING MY FINAL SOLUTION WITH USERS
Once my prototype was ready, I approached users and conducted testing to gauge if they were having a seamless experience with the application.
Here are some insights that I obtained after testing the prototype with users:
I then made further iterations on the screens after careful consideration of the obtained insights.
FUTURE ENHANCEMENTS
- I believe that further analysis of the user testing report will enable me to make additional changes aimed at enhancing accessibility for users.
- I would like to make some additional micro-level additions to the “Plan a Trip” flow.
- I wanted to delve into Micro changes in the “Reservations and attachment” section.
- It’s noteworthy that this project was completed in less than three weeks (19 days). It was quite challenging to incorporate all the initially planned features as TIME emerged as the most significant constraint.
KEY LEARNINGS
- Working within the set timelines greatly helped me recognize the importance of prioritizing decisions.
- I learned to make compromises and incorporate them into future improvements for the project.
- The entire process was non-linear as I frequently moved back and forth between different design stages throughout the project.
- It’s okay to have ambiguity because with continuous work progress, the level of ambiguity will decrease, and clarity will increase.
- Regular brainstorming — jotting down all thoughts in one place — truly aided in taking care of the main journey.
That brings you to the End!!
Heartfelt thanks to my mentor, UX Anudeep , for his invaluable guidance and motivation throughout this journey.
I also extend my gratitude to all the members of the UXM community who provided assistance and encouragement throughout my journey.
I’d like to know if the case study is self-explanatory. Additionally, I’d appreciate your insights on the pivotal decisions I made that influenced the final product.
Thank you for reading 🤝. If you liked my case study, then you can let me know by giving some claps 👏 or by commenting 💬
Also do let me know if you didn’t like anything or if anything could be improved, or just any general feedback for me is very much welcomed 📭
Connect with me
You can connect with me on Linkedin
My portfolio is on bento
mail me @samanyuwidha@gmail.com
Thank you :)
