
A mobile app for travelers to plan and organize their itineraries
I enjoy travelling - it means adventures and opportunities to see and learn things. Whenever I travel to a destination, especially when it’s a short trip, I want to be able to make the most out of it. I want to have ideas ahead of time of where to go and what to do - this is when I find myself investing a lot time sitting in front of the computer prior to the trip: doing research and planning an itinerary.
In my opinion, trip planning is a lengthy and time-consuming process. It involves the work of reading countless reviews from fellow travelers and searching for information from numerous travel sites. It also involves using multiple tools to figure out the best travel routes and most importantly, (for someone who is unspontaneous like myself) putting a schedule together into some type of document.
But what if there’s an app that could make this whole process easier?
As a project for my UI course at CareerFoundry, I decided to use my own experience to design a native app that streamlines and simplifies the process of planning.
TOOLS
Adobe XD
Adobe Photoshop
Google Sheets
ROLE
UI Designer (Research, Interaction Design, User Testing, Visual Design)
RESEARCH
COMPETITOR ANALYSIS
It’s important to find inspiration and to check out what other designers are up to. Through their work, others might offer interesting concepts and ideas that I can learn from and apply to my work. To understand better what’s already available in the market, I downloaded 2 apps from Apple App Store and Google Play Store, Traveler Buddy and TripIt.
After inputting some information and testing out their features, I have conducted an analysis.
GOALS
Design responsive user interface mobile app for both Android and iOS. (As a learning goal of this project, the app design will be built on both platforms, using standard guidelines such as typography, iconograph, etc.)
Update screen size and adjust elements for Android screens. (this project was made at the beginning of 2020. Since then, few more models have come out with bigger size).
KEY FEATURES
Allow users to:
Input and save flight and hotel information.
Search for things to do, food & drinks, and landmarks for individual destination.
Sync their photos to this app and share together along with their destination.
Write their own reviews as a way to continue building up content and value for the app.
Itinerary to work online and offline with GPS navigation ability.
DESIGN & TEST
STYLE GUIDE
SIZE
Since Android and iOS systems each has their own design guideline (spacing, font size, typography, logos, etc.), it was a little challenging to adapt during the design process.
I’ve composed together some basic font size guidelines for each platform. More details can be view on Material Design.
USER FLOW
LOW FIDELITY WIREFRAME
MOCKUPS
Below is mockup screens of Samsung Android in dark theme, and iOS iPhone. More screens are shown in final prototype.
RESPONSIVE UI DESIGN
Responsive UIs are created by applying established styles. It further helps to examine the overall aesthetic feelings and visual balance on different devices’ screen size.
FINAL PROTOTYPE
With all of mockups and high-fidelity built, a final prototype is put together using Adobe XD.
OTHER PROJECTS